1. Web Standards & Techniques Why Should I Care? I’m so sick of the attitude I run into “well, web standards inhibit innovation.” What a crock. What’s inhibiting innovation right now is lack of standards. That’s why it is religion to me, and will remain that way until I find a better one to serve - after all, this is not just about technical innovation, but human progress as well. - Molly E. Holzschlag (as posted at 456BereaSt.com)posted

2. What are Standards? Definition: An acknowledged measure of comparison for quantitative or qualitative value; a criterion. - Reference.com

3. Survey! How many in the room are using a ‘standard’ in designing web pages? What standards are you using? Do you have a ‘target’ browser? Do you have a campus standard browser?

4. (non-)Standards on the Web: a short history HTML & Mosaic – 1993 Netscape Navigator – 1996 Internet Explorer – 1995 CSS1 – 1996 HTML 3.2 & 4.0 – 1997 CSS2, XML, DOM Level 1 – 1998 Web Content Accessibility Guidelines (WCAG) -1999 HTML 4.01 – 1999 XHTML 1.0, DOM Level 2 Core - 2000

5. Current Standards XML-Signature, Platform for Privacy Preferences (P3P), XHTML 1.0 2nd Ed, XML-Signature XPath Filter 2.0, XML-Enc, User Agent Accessibility Guidelines 1.0 -2002 XML-SignaturePlatform for Privacy Preferences (P3P)XHTML 1.0 2nd EdXML-Signature XPath Filter 2.0XML-EncUser Agent Accessibility Guidelines 1.0 DOM Level 2 HTML, SVG 1.1 and Mobile SVG, SOAP Version 1.2, MathML 2.0 2nd Ed, PNG Second Edition – 2003 DOM Level 2 HTMLSOAP Version 1.2MathML 2.0 2nd EdPNG Second Edition RDF, OWL, XHTML Print, many XML advancements, CC/PP, DOM Level 3 (Proposed Recommendation) - 2004 Courtesy: Kevin W. Bishop, RPI

6. The Problems of non-Standards Need to use tricks to get multiple browser support, I.e., browser detection Can’t support All browsers without creating special versions for each Future versions usually require revisions Sometimes you can’t get a browser to do what it should at all!

7. CSS Compatibility Example Compatibility Chart from CoreCSS Compatibility Chart Test Suite from W3C Test Suite

8. What are the Benefits of Using Standards? Simpler development and maintenance Compatibility with future web browsers Faster download and rendering of web pages Better accessibility Better search engine rankings Simpler adaptation -456BereaStreet.com

9. Benefit: Simpler Using more semantic and structured HTML makes it easier and quicker to understand code created by somebody else.

10. Benefit: Future Compatibility When you use defined standards and valid code you future-proof your documents by reducing the risk of future web browsers not being able to understand the code you have used.

11. Benefit: Faster Download Less HTML results in smaller file sizes and quicker downloads. Modern web browsers render pages faster when they are in their standards mode than when they are in their backwards compatible mode.

12. Benefit: Accessible Semantic HTML, where structure is separated from presentation, makes it easier for screen readers and alternative browsing devices to interpret the content.

13. Benefit: Better Search Rankings The separation of content and presentation makes the content represent a larger part of the total file size. Combined with semantic markup this will improve search engine rankings.

14. Benefit: Simpler Adaptation A semantically marked up document can be easily adapted to print and alternative browsing devices, like handheld computers and cellular phones, just by linking to a different CSS file. You can also make site-wide changes to presentation by editing a single file.

15. 3 Drawbacks of using Web Standards 1. Pages will not Look the same in all browsers 2. Need to enforce Standards use – create a new habit 3. Ummm…. Can’t think of any more!

16. How to Implement Standards Start by specifying what standards you are going to design to satisfy: XHTML 1.0 or 1.1(transitional or strict mode), CSS1 or CSS2, XML… etc. Set the DTD in each document you produce for the appropriate standard to allow validation Validate, Validate, Validate… fix what doesn’t

17. That’s all? Well… learning what you can do to create valid code and adjusting old code is the hard part You will have to Know the rules, and follow them while creating designs Once they are learned, and you use tools that support your efforts, it will be automatic

18. What Makes a Valid Document? Requires the use of a Document Type Definition (DTD) in the document to declare what standard you are using Well-formed code Satisfies some Requirements such as alt text for tags Example

19. Known Problems in Validation Using Dreamweaver MX, you must have a live Internet connection to properly validate – MX 2004 seems OK. Browsers have a Quirks mode when pages don’t validate… Mozilla falls back to NN4 compatibility! Without a DTD, you are automatically put in Quirks mode for most browsers, even if code is Valid— Remember the DTD is part of the standard!

20. Suggestions Use W3C’s HTML Validator Use W3C’s CSS Validator If you use templates, validate the template! Modify the default code for a new blank page to include your chosen DTD, so it will be easy to validate Separate Content from Design with CSS Separate Data from Presentation with XML & XSLT

21. Inspiration Web Standards.org CSS Zen Garden Mezzo Blue A List Apart 456 Berea St