1 / 26

One Site Fits All: Making Your Library’s Web Site Ready for Wireless

One Site Fits All: Making Your Library’s Web Site Ready for Wireless. Why Do We Need Standards?. “Browser War”: Microsoft and Netscape Proprietary HTML code leading to pages that say “best viewed with…” or “optimized for…” Wireless portals, “printer friendly” pages. What Are Web Standards?.

tsandra
Download Presentation

One Site Fits All: Making Your Library’s Web Site Ready for Wireless

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. One Site Fits All:Making Your Library’s Web Site Ready for Wireless

  2. Why Do We Need Standards? • “Browser War”: Microsoft and Netscape • Proprietary HTML code leading to pages that say “best viewed with…” or “optimized for…” • Wireless portals, “printer friendly” pages

  3. What Are Web Standards? • Web Content Accessibility Guidelines • HTML 4.01, XHTML 1.1 • CSS1, CSS2 • Any other W3C technologies

  4. HTML versus XHTML What does XHTML look like? First a non-standards-based HTML page, then a standards-based XHTML page.

  5. Sample HTML:

  6. HTML The HTML page: -- is overly complicated and messy -- where is the page’s content?

  7. Sample XHTML:

  8. XHTML The standards-based page: -- has a clear, logical structure.-- has readable content in code layout. -- has semantic markup and enhanced content. -- is friendly to assistive software.

  9. Logical Structure • <div id=“sitemast”> • <div id=“content”> • <div id=“navigation”> • <div id=“footer”>

  10. Semantic Markup – Enhanced Content • Headlines • Block quotes • Paragraphs • Lists • Citations • Acronyms • Abbreviations • Title attributes

  11. Design Philosophy: • User centered, not designer centered. • Transformable pages optimize for users and user agents. • HTML code is minimal and semantic. • Documents are structured and ordered logically. • Layout (CSS) is contained in a separate file.

  12. Transformability with PC Browsers W. Frank Steely Library <library.nku.edu> • First the “Default” layout; • Then the “ADA” layout; • Finally, the “Print Preview.”

  13. Home Page

  14. Second Level Page

  15. “View”  “Use Style”

  16. Same Page, New Layout

  17. Scroll Down

  18. Print Preview

  19. We Have Seen: • Multiple style sheets for ADA purposes. • Access keys defined. • Text not represented by graphics. • Logical document structure. • Printer friendly pages.

  20. Transformability for Wireless Media type = “handheld” • Personal Digital Assistants (PDAs) • Cell Phones

  21. PDA:about a year old

  22. PDA:about six months old

  23. PDA:about six months old

  24. Cell Phones Year old 3 months old

  25. Getting Started Use better browsers: • Mozilla 1.3+ <www.mozilla.org> • Opera 7+ <www.opera.com> • Safari 1.2+ (Mac) <www.apple.com/safari/>

  26. Bibliography Before you build, read: • Bickner: Web Design on a Shoestring • Clark: Designing Accessible Websites • Meyer: Eric Meyer on CSS • Pilgrim: www.diveintoaccessibility.org • Zeldman: Designing with Web Standards

More Related