Your SlideShare is downloading. ×
<ul><li>Less is More </li></ul><ul><li>Ludwig Mies Van der Rohe </li></ul>
Creating Your Own Web Page Graphics <ul><li>Sams Teach Yourself HTML and CSS in 24 Hours, 7th Edition </li></ul>
Objectives <ul><li>Choosing Graphics Software </li></ul><ul><li>The Least You Need To Know </li></ul><ul><li>Preparing Pho...
Objectives <ul><li>Reducing the Number of Colors </li></ul><ul><li>Interlaced GIFs and Progressive JPEGs </li></ul><ul><li...
Choosing Graphic Software <ul><li>Adobe Photoshop $$$ </li></ul><ul><li>Adobe Photoshop Elements $ </li></ul><ul><li>Paint...
The Least You Need To Know <ul><li>Eyes and Clocks </li></ul><ul><li>Resolution – dots or pixels </li></ul><ul><ul><li>Wid...
The Least You Need To Know <ul><li>Four Types of Graphics </li></ul><ul><ul><li>Photos of people, products, or places </li...
Preparing Photographic Images <ul><li>Camera, Scanner, Phone? </li></ul><ul><li>Cropping an Image </li></ul><ul><li>Resizi...
Creating Banners and Buttons <ul><li>How Big? – 800 x 600 window </li></ul><ul><ul><li>770 allows for scroll bar, toolbars...
Reducing the Number of Colors <ul><li>Less is More </li></ul><ul><li>Photos – probably not </li></ul><ul><li>Buttons and o...
Interlaced GIFs & Progressive JPEGS <ul><li>Interlace – rough draft to finish product </li></ul>
Creating Animated Web Graphics <ul><li>Flip Book? </li></ul><ul><li>GIF </li></ul><ul><li>Slides – Frames </li></ul><ul><l...
Summary <ul><li>Choosing Graphics Software </li></ul><ul><li>The Least You Need To Know </li></ul><ul><li>Preparing Photog...
Summary <ul><li>Reducing the Number of Colors </li></ul><ul><li>Interlaced GIFs and Progressive JPEGs </li></ul><ul><li>Cr...
Creativity <ul><li>Your equipment DOES NOT affect the quality of your image. The less time and effort you spend worrying a...
Upcoming SlideShare
Loading in...5
×

Hour 7

745

Published on

0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
745
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
0
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Transcript of "Hour 7"

  1. 1. <ul><li>Less is More </li></ul><ul><li>Ludwig Mies Van der Rohe </li></ul>
  2. 2. Creating Your Own Web Page Graphics <ul><li>Sams Teach Yourself HTML and CSS in 24 Hours, 7th Edition </li></ul>
  3. 3. Objectives <ul><li>Choosing Graphics Software </li></ul><ul><li>The Least You Need To Know </li></ul><ul><li>Preparing Photographic Images </li></ul><ul><li>Creating Banners and Buttons </li></ul>
  4. 4. Objectives <ul><li>Reducing the Number of Colors </li></ul><ul><li>Interlaced GIFs and Progressive JPEGs </li></ul><ul><li>Creating Animated Web Graphics </li></ul><ul><li>Assembling Images into an Animation </li></ul>
  5. 5. Choosing Graphic Software <ul><li>Adobe Photoshop $$$ </li></ul><ul><li>Adobe Photoshop Elements $ </li></ul><ul><li>Paint Shop Pro $ </li></ul><ul><li>GIMP – Free! </li></ul>
  6. 6. The Least You Need To Know <ul><li>Eyes and Clocks </li></ul><ul><li>Resolution – dots or pixels </li></ul><ul><ul><li>Width and Height </li></ul></ul><ul><li>Image Compression </li></ul><ul><ul><li>Mathematical manipulation </li></ul></ul><ul><ul><li>Patterns are repeated to save size </li></ul></ul><ul><ul><li>Smaller is faster </li></ul></ul>
  7. 7. The Least You Need To Know <ul><li>Four Types of Graphics </li></ul><ul><ul><li>Photos of people, products, or places </li></ul></ul><ul><ul><li>Graphical banners and logos </li></ul></ul><ul><ul><li>Snazzy-looking buttons or icons to link between pages </li></ul></ul><ul><ul><li>Background textures or wallpaper to go behind pages </li></ul></ul>
  8. 8. Preparing Photographic Images <ul><li>Camera, Scanner, Phone? </li></ul><ul><li>Cropping an Image </li></ul><ul><li>Resizing an Image </li></ul><ul><li>Tweaking Image Colors </li></ul><ul><li>Controlling JPEG Compression </li></ul><ul><ul><li>25% is good compromise </li></ul></ul>
  9. 9. Creating Banners and Buttons <ul><li>How Big? – 800 x 600 window </li></ul><ul><ul><li>770 allows for scroll bar, toolbars, etc </li></ul></ul><ul><li>Photos and artwork </li></ul><ul><ul><li>100 to 300 in each dimension </li></ul></ul><ul><li>RGB – 8 Bits/Channel </li></ul><ul><li>White Background? </li></ul><ul><li>Effects? </li></ul>
  10. 10. Reducing the Number of Colors <ul><li>Less is More </li></ul><ul><li>Photos – probably not </li></ul><ul><li>Buttons and other icons – Yes! </li></ul><ul><li>256 – 16 </li></ul><ul><li>Dithering </li></ul><ul><li>GIF </li></ul><ul><li>PNG </li></ul><ul><li>Transparency </li></ul>
  11. 11. Interlaced GIFs & Progressive JPEGS <ul><li>Interlace – rough draft to finish product </li></ul>
  12. 12. Creating Animated Web Graphics <ul><li>Flip Book? </li></ul><ul><li>GIF </li></ul><ul><li>Slides – Frames </li></ul><ul><li>Limit Color Depth to 256 or 16 </li></ul><ul><li>Insert Pictures in Order </li></ul><ul><li>Time per frame? </li></ul><ul><li>Loop or once? </li></ul>
  13. 13. Summary <ul><li>Choosing Graphics Software </li></ul><ul><li>The Least You Need To Know </li></ul><ul><li>Preparing Photographic Images </li></ul><ul><li>Creating Banners and Buttons </li></ul>
  14. 14. Summary <ul><li>Reducing the Number of Colors </li></ul><ul><li>Interlaced GIFs and Progressive JPEGs </li></ul><ul><li>Creating Animated Web Graphics </li></ul><ul><li>Assembling Images into an Animation </li></ul>
  15. 15. Creativity <ul><li>Your equipment DOES NOT affect the quality of your image. The less time and effort you spend worrying about your equipment the more time and effort you can spend creating great images. The right equipment just makes it easier, faster or more convenient for you to get the results you need. </li></ul><ul><li>Ken Rockwell </li></ul>

×