Introduction to Web Design
3 likes1,205 views
The document discusses the evolving nature of web design, emphasizing the integration of various design elements like typography and usability to create effective digital environments. It highlights challenges such as cross-browser compatibility and the shift towards mobile design, alongside a glimpse into the roles and statistics related to web production. Additionally, it touches on the significance of prototyping and user experience in the web design process.
Introduction to Web Design
- 3. Book design Poster design Print design Illustration Video/Game design
- 4. “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
- 5. Employs graphic design elements More like a typeface Rosewood vs. Helvetica Architecturally speaking
- 7. 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
- 8. 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
- 9. a never ending changing landscape before internet explore and firefox still not done evolving text, graphics, animation, video
- 10. as the web evolves, so too has design CNN.com Nike.com
- 18. 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
- 19. 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
- 20. the red headed step child of web design often the last thing to be taken into consideration impacts everything embrace it
- 22. designing for the experience understanding the user(s) user personas, user paths wireframes, sitemaps, prototypes
- 23. remember our friend content? site mapping gives you the big picture wireframing helps you organize site prototyping allows you to walk through interactive elements
- 24. 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
- 25. the browser wars W3C HTML, XML, XHTML, CSS, DOM closer, but still not there transcending web design
- 26. ie6 - the browser from hell ie, ff, safari, chrome, mozilla, opera... websites do NOT have to look the same for everyone graceful degradation
- 27. graphic design!
- 28. a video from web designer Mike Kus showcasing his graphic design process
- 29. Do you go for the 500m or team relay? web designer, authors, producers, etc... front-end, middle-end, back-end
- 30. 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
- 31. 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
- 32. 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
- 33. you can never get comfortable books, online sites, classes, etc. twitter lists, rss feeds design trends shift quickly w/tech
- 34. typography challenges cross-browser compatibility multiple personalities download speeds resolution/monitor sizes
- 35. build your design map out your coding technique slice and dice
- 36. Photoshop Transmit Fireworks CSS Edit Illustrator Firebug Dreamweaver Web Inspector Coda And many more Espresso
- 37. photoshop first, building second? designing as you code? somewhere in between
- 38. 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
- 39. Q&A