• Save
Introduction to Web Design
Upcoming SlideShare
Loading in...5
×
 

Like this? Share it with your network

Share

Introduction to Web Design

on

  • 1,484 views

Presentation given at Montclair State University's Graphic Design II course on Introduction to Web Design. This presentation was geared towards year two graphic design students with little to no ...

Presentation given at Montclair State University's Graphic Design II course on Introduction to Web Design. This presentation was geared towards year two graphic design students with little to no exposure to web design and predominant print backgrounds.

Statistics

Views

Total Views
1,484
Views on SlideShare
1,480
Embed Views
4

Actions

Likes
1
Downloads
0
Comments
0

1 Embed 4

http://www.linkedin.com 4

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Introduction to Web Design Presentation Transcript

  • 1. Book design Poster design Print design Illustration Video/Game design
  • 2. “Web design is the creation of digital environments that facilitate and encourage human activity; reflect or adapt to individual voices and content; and change gracefully over time while always retaining their identity.” - Jeffrey Zeldman
  • 3. Employs graphic design elements More like a typeface Rosewood vs. Helvetica Architecturally speaking
  • 4. the world is your oyster pms, cmyk, print calibration a look you can put a guarantee on no waffling on the final dimensions conventional oven cook time: 40 min
  • 5. think twice about that font what you see is not what you get fun house mirror magic from 3 inches to 30 inches in 0.0 sec microwave cook time: 5 min
  • 6. a never ending changing landscape before internet explore and firefox still not done evolving text, graphics, animation, video
  • 7. as the web evolves, so too has design CNN.com Nike.com
  • 8. Developer (27.8%) Web Producer (1.8%) Web Designer (12.7%) Information Architect (1.6%) Designer (8.4%) Web Director (1.6%) Webmaster (4.4%) Writer, Editor (1.2%) Project Manager (3.7%) Usability Expert (1.0%) Interface/UI Designer (3.2%) Marketer (0.9%) Creative Director (3.0%) Educator (0.5%) Art Director (1.9%) Accessibility Expert (0.2%) Statistics from 2008 A List Apart : The Survey for People Who Make Websites
  • 9. corporate sites portfolio sites eCommerce sites musician/band sites movie promotion sites educational sites video game sites web applications car sites blogs auction sites mobile sites
  • 10. the red headed step child of web design often the last thing to be taken into consideration impacts everything embrace it
  • 11. navigation usability interaction design prototyping wireframing
  • 12. designing for the experience understanding the user(s) user personas, user paths wireframes, sitemaps, prototypes
  • 13. remember our friend content? site mapping gives you the big picture wireframing helps you organize site prototyping allows you to walk through interactive elements
  • 14. how do i get people to see what i see? can’t i just use images instead? fine, then I’ll just use flash accept and embrace the challenge introduction of @font-face with CSS3
  • 15. the browser wars W3C HTML, XML, XHTML, CSS, DOM closer, but still not there transcending web design
  • 16. ie6 - the browser from hell ie, ff, safari, chrome, mozilla, opera... websites do NOT have to look the same for everyone graceful degradation
  • 17. graphic design!
  • 18. a video from web designer Mike Kus showcasing his graphic design process
  • 19. Do you go for the 500m or team relay? web designer, authors, producers, etc... front-end, middle-end, back-end
  • 20. where does flash belong motion design eliminates many challenges of the web all in or just dip your toes in the water? and yes, you will still need to code
  • 21. flash has it’s own set of issues too doesn’t scale well to mobile (or at all) buggy, crashes often HTML5 is changing the landscape Star Wars Intro
  • 22. a whole new set of challenges designing for new mobile phones creating a mobile version of your site function, function, function! mobile banking, travel, hotel, shopping mobile web applications
  • 23. you can never get comfortable books, online sites, classes, etc. twitter lists, rss feeds design trends shift quickly w/tech
  • 24. typography challenges cross-browser compatibility multiple personalities download speeds resolution/monitor sizes
  • 25. build your design map out your coding technique slice and dice
  • 26. Photoshop Transmit Fireworks CSS Edit Illustrator Firebug Dreamweaver Web Inspector Coda And many more Espresso
  • 27. photoshop first, building second? designing as you code? somewhere in between
  • 28. Percent of respondants 0 7.5 15 22.5 30 < $10k $10-20k $20-40k $40-60k $60-80k $80-$100k $100-120k $120-150k $150 > Statistics from 2008 A List Apart : The Survey for People Who Make Websites
  • 29. Q&A