Exploring web design
This presentation is the property of its rightful owner.
Sponsored Links
1 / 21

Exploring Web Design PowerPoint PPT Presentation


  • 83 Views
  • Uploaded on
  • Presentation posted in: General

Exploring Web Design. Chapter 1. Objectives. Develop a new perspective of the WWW Learn what makes a website good or bad Discover how to apply objective rules to subjective matters Begin to deconstruct the elements of a web page. Perspective. WWW is full of poorly designed webs

Download Presentation

Exploring Web Design

An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -

Presentation Transcript


Exploring web design

Exploring Web Design

Chapter 1


Objectives

Objectives

  • Develop a new perspective of the WWW

  • Learn what makes a website good or bad

  • Discover how to apply objective rules to subjective matters

  • Begin to deconstruct the elements of a web page


Perspective

Perspective

WWW is full of poorly designed webs

Our pages can be well designed


Critiquing websites 1

Critiquing Websites (1)

  • You are a web user

  • Watch for other people’s mistakes

  • Pay attention to what you like/dislike


Critiquing websites 2

Critiquing Websites (2)

  • Questions to ask:

    • Do I like the way this site looks?

    • Can I tell what the site is about?

    • Does the design seem appropriate to what the site is about?

    • Can I find what I’m looking for easily?


Critiquing websites 3

Critiquing Websites (3)

  • Don’t limit yourself to websites. Look at the layout and design of:

    • Newspapers

    • Magazines

    • Textbooks


Consider your audience

Consider Your Audience


What is your message

What is your message?

  • The WWW is a communication tool

  • Ask:

    • What message are you sending?

    • Will they understand the message?

    • How am I expressing the message?


About colors

About Colors

When viewing or creating websites ask:

  • How do the colors make me feel?

  • Can I read the text?

  • Are the colors loud or dull? (eye candy vs. bland corporate)

  • Do the colors look good together?


Your opinion

Your Opinion

You may have an opinion about a website.

That’s great, but try to substantiate your

likes/dislikes objectively using your training.

Be specific!


Getting technical

Getting Technical


Web color limitations

Web Color Limitations

  • 3 colors: Red, Green & Blue (RGB)

  • These three colors, in various combinations, are capable of creating millions of colors.

  • 216 colors in common between Windows and Macs

  • No longer an issue


Raster images 1

Raster Images (1)

  • JPEG, BMP, GIF, TIFF, PNG

  • Also called bitmapped images

  • Composed of pixels

  • Windows displays 96 dpi pixel resolution

  • Do NOT scale well


Raster images 2

Raster Images (2)


Vector images 1

Vector Images (1)

  • WMF, EWMF, SWF, PDF

  • Composed of dots and vectors

  • They scale well (enlarge)

  • Have independent resolution


Dithering

Dithering


Common web file formats

Common Web File Formats

  • JPEG

  • GIF

  • PNG

  • SWF

  • PDF


Exploring web design

JPEG

  • Joint Picture Experts Group

  • Lossy

  • Highly compressed

  • No transparency channel

  • 16.7 million colors

  • Used for photos and gradients


Exploring web design

GIF

  • Graphics Interchange Format

  • Lossless

  • Highly compressed

  • Have a transparency channel

  • 2 to 256 colors

  • Can cause banding in flesh tones/gradients

  • Used for logos and images with few colors


Exploring web design

PNG

  • Portable Network Graphics

  • Lossless

  • Highly compressed

  • Tranparency channel

  • Create raster and vector images

  • Still not used as widely and JPEG/GIF


Animation

Animation

  • JPEG’s do not animate

  • GIF and PNG may be animated

  • Animation increases file size

  • Take longer to load

  • Use ONLY where appropriate to grab attention


  • Login