1. Exploring Web Design Chapter 1

2. 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

3. Perspective WWW is full of poorly designed webs Our pages can be well designed

4. Critiquing Websites (1) You are a web user Watch for other people’s mistakes Pay attention to what you like/dislike

5. Critiquing Websites (2) Questions to ask: 1.Do I like the way this site looks? 2.Can I tell what the site is about? 3.Does the design seem appropriate to what the site is about? 4.Can I find what I’m looking for easily?

6. Critiquing Websites (3) Don’t limit yourself to websites. Look at the layout and design of: 1.Newspapers 2.Magazines 3.Textbooks

7. Consider Your Audience

8. What is your message? The WWW is a communication tool Ask: 1.What message are you sending? 2.Will they understand the message? 3.How am I expressing the message?

9. About Colors When viewing or creating websites ask: 1.How do the colors make me feel? 2.Can I read the text? 3.Are the colors loud or dull? (eye candy vs. bland corporate) 4.Do the colors look good together?

10. 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!

11. Getting Technical

12. 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

13. 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

14. Raster Images (2)

15. Vector Images (1) WMF, EWMF, SWF, PDF Composed of dots and vectors They scale well (enlarge) Have independent resolution

16. Dithering

17. Common Web File Formats JPEG GIF PNG SWF PDF

18. JPEG Joint Picture Experts Group Lossy Highly compressed No transparency channel 16.7 million colors Used for photos and gradients

19. 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

20. PNG Portable Network Graphics Lossless Highly compressed Tranparency channel Create raster and vector images Still not used as widely and JPEG/GIF

21. 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