1 / 8

Maximizing User Experience Through Web Standards and Typography

This comprehensive guide explores the intricate world of web design standards, highlighting the significance of typography and CSS in creating visually appealing and user-friendly websites. From understanding the box model to implementing proper DOCTYPE declarations, this resource covers essential topics for designers and developers alike. Dive into best practices, case examples, and expert insights to elevate your web projects to the next level.

mayda
Download Presentation

Maximizing User Experience Through Web Standards and Typography

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. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Interfaces, Browsers & Browsing • Primary Readings • Designing With Web Standards: Chapters 11-14 • Class Work • Big IA vs. little (design) IA • Blog work problem & design • Consulting • Deliverables • Design Critiques due now • Research Topics discussion & selection

  2. Thinking about DOCTYPEs • How does DOCTYPE relate to validation? • What do browsers do differently depending on the DOCTYPE? • Robots? • RSS feed readers? • Other tools? (mashup scrapers) • Is it all about working with IE?

  3. DOCTYPES that work • HTML 4.01 Strict, Transitional, Frameset <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> • XHTML 1.0 Strict, Transitional, Frameset <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd"> • XHTML 1.1 DTD <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

  4. The Box Model • CSS controls a set of rules that control an object on a Web page that inhabits a box, with properties

  5. Box Model Properties • Content • Padding • Borders • Margins • Zeldman’s Box Model Blues • Tantek’s Box Model Hack

  6. Typography on the Web • Why is typography important? • Some examples: • http://www.evilnation.be/ • http://www.3point7designs.com/advanced_type.html • http://www.modernlifeisrubbish.co.uk/article/8-web-cliches-of-2006 • Good design, over design & user control?

  7. Where’s IA in Spec Topics in IA? • Too much time on design, not enough on architecture • CSS next week only (readings) • Zeldman, J. (2003). Designing With Web Standards • Chapter 9: CSS Basics • Chapter 10: A Hybrid Layout (Part II) • Chapter 10: A CSS Redesign • Schmitt, C. (2002).Designing CSS Web Pages: Chapters 1-7 • Review & discussion, bring your reading summaries with questions

  8. Research Topic Presentations • Topics • Scheduling • What’s in a good presentation? • Overview • Short history • Examples • Guildelines • How to use for IA projects • Walk through, check for ideas, look for complimentary sources

More Related