Web Standards Mastering HTML5, CSS3, and XML Leslie F. Sikos, Ph.D.
orders-ny@springer-sbm.com www.springeronline.com rights@apress.com www.apress.com www.apress.com/bulk-sales www.apress.com
Contents at a Glance About the Author... xvii About the Technical Reviewer... xviii Preface... xix Part 1: Web Standards...1 Chapter 1: Introduction to Web Standards...3 Chapter 2: Internationalization...39 Chapter 3: Markup Languages: More Than HTML5...55 Chapter 4: Serving and Configuration...139 Chapter 5: Style Sheets...161 Chapter 6: Scripting and Applications...213 Chapter 7: Metadata and the Semantic Web...245 Chapter 8: Web Syndication...307 Chapter 9: Optimized Appearance...335 Chapter 10: Accessibility...367 Part 2: Developing with Standards...401 Chapter 11: Development Tools...403 Chapter 12: Putting It All Together...419 Chapter 13: Best Practices...443 Chapter 14: Validation...455 Chapter 15: Most Common Errors...481 Index...491
Contents About the Author... xvii About the Technical Reviewer... xviii Preface... xix Part 1: Web Standards...1 Chapter 1: Introduction to Web Standards...3 The Basic Concepts...3 The Role of Standardization...4 The Cost of Nonstandardized Markup... 4 Benefits of Standard-Compliant Markup... 5 Development and Announcement of Standards...6 W3C... 7 WHATWG... 8 ERCIM... 8 IETF... 8 Ecma International... 8 Unicode Consortium... 8 DCMI... 9 IANA... 9 OASIS... 9 ISO... 9 Standards Promotion and Distribution...9
Groups and Associations... 10 Staying Informed: Events and Courses... 11 Resources... 12 Types, Stages, and Status of Standards...12 The Variety of Rendering Engines...13 Trident... 14 Gecko... 15 KHTML... 16 WebKit... 16 Presto... 16 Amaya... 17 Testing the Standard Support of Browsers...17 Standard Compliance Tests... 17 Comprehensive Tests... 19 Standards vs. Quirks Modes, DOCTYPE Switching...19 Problem Statement...20 Server-Side Technologies and Content Management... 21 Limited Standards Support in Development Tools... 22 Major Concerns...22 Bad Practices... 22 Lack of Support... 22 Unconcern... 23 Influential Sites... 23 The Popularity of Flash... 24 Well-formedness... 25 Interoperability... 26 Eliminated Version Targeting... 27 Backward Compatibility... 28
Forward Compatibility... 29 Functionality... 29 Device Independence... 29 Separating Content from Presentation... 30 Usability... 30 Reliable Layouts... 31 Code Optimality... 31 Summary...31 References...31 Chapter 2: Internationalization...39 The Importance of Character Encoding...39 Unicode...41 Characters That Should Be Avoided in Markup Contexts... 44 Formatting Characters Suitable Also for Markup... 46 Special Characters... 46 NFC Normalization Is Recommended... 47 Unicode Should Be Preferred... 48 Declaring Character Encoding for the Markup...48 Encoding Declaration in the HTTP Header... 49 In-Document Declarations... 49 Declaring Character Encoding for CSS...50 HTTP Header Declarations... 50 In-Document Declarations... 50 Escape Codes, Special Characters, and Symbols...51 Numeric References... 51 Entity References... 51 Checking In...52
Summary...52 References...53 Chapter 3: Markup Languages: More Than HTML5...55 SGML Languages...56 HTML... 56 XML Languages...57 XHTML... 57 Version Overview...57 HTML Versions and Variants... 58 XHTML Versions and Variants... 59 HTML5... 64 Markup Syntaxes...66 The HTML Syntax... 66 The XHTML Syntax and Restrictions... 67 Data Types...74 Markup Elements...77 Block vs. Inline Elements... 86 Attributes...87 HTML Document Structure...102 Document Type Declaration... 106 XHTML Document Structure... 112 Moving from HTML to XHTML...120 Specific Markup Languages...121 SVG... 121 MathML... 124 Combinations, Profiles, and Mixed-Namespace Documents...127 (X)HTML+RDFa... 127
XHTML-Print... 128 XHTML + MathML + SVG... 129 Choosing a Markup Language...131 The Benefits of XHTML 1.x over HTML 4.x... 131 The Benefits of HTML5 over HTML 4.x and XHTML... 132 Alternatives to Web Markup...132 Summary...133 References...133 Chapter 4: Serving and Configuration...139 The HTTP Header...139 Internet Media Types (MIME)...140 Common Media Types... 141 Serving XHTML...147 Serving XHTML as HTML... 147 Serving XHTML as XML... 147 URIs, URLs, and URNs...149 Persistent URIs... 150 Summary...155 References...155 Chapter 5: Style Sheets...161 Cascading Style Sheets...161 Levels, Profiles, and Modules... 162 Grammar and Conventions... 163 Implementation... 178 Display and Visibility... 181 Cascading... 181 Inheritance... 183
Scopes and Structure... 184 The Box Model... 185 Overview of CSS Properties... 187 Initial Property Values... 204 Default Styles of Rendering Engines... 204 XSL...206 XSLT Style Sheets... 206 Combining CSS and XSL...209 Summary...210 References...210 Chapter 6: Scripting and Applications...213 Client-Server Architectures...213 Scripting and Standards Implementation...214 Client-Side Development...215 Ajax... 215 Flex... 216 HTML5 APIs... 217 Java Applets... 229 ECMAScript and JavaScript... 230 Silverlight... 233 Server-Side Development...234 ColdFusion... 235 Java... 235 The.NET Framework... 235 Perl... 236 PHP... 236 Python... 238
Ruby... 238 SSJS... 238 Combinations of Client-Side and Server-Side Technologies...238 Database Technologies...239 Alternate Content and Fallback Mechanism for Scripts...239 Summary...240 References...240 Chapter 7: Metadata and the Semantic Web...245 The Semantic Web...245 Structured Data... 247 Linked Open Data... 248 Wide Variety of Annotations and Syntaxes...249 The meta Tags...250 Schemas, Vocabularies, and Ontologies...251 Microformats... 253 Microdata... 261 FOAF... 263 DOAC... 265 Dublin Core... 266 Resource Description Framework... 274 OWL... 283 Combining Metadata...287 Combining Vocabularies in RDF... 288 Microdata and Microformats... 289 Dublin Core and vcard in RDF... 290 Dublin Core, vcard, and Math-Net... 290 DC, IMS, and ODRL... 291
Special Applications...292 Image Metadata and XMP... 292 Metadata for YouTube Videos... 294 Metadata in SEO...295 Summary...296 References...297 Chapter 8: Web Syndication...307 News Feeds...307 Really Simple Syndication...307 Creating an RSS File... 308 Required Elements... 309 Optional Elements... 310 Subelements of the item Element... 319 Namespaces... 322 Styling RSS Feeds... 323 Atom...324 Creating an Atom File... 325 Containers... 326 Metadata and Content Elements... 328 RSS or Atom?...331 Summary...332 References...332 Chapter 9: Optimized Appearance...335 Layout...335 Positioning and Floating... 335 Tableless Web Layout... 336 Typography...342
Misused Characters... 342 Web Fonts... 343 Embedding External Content...347 Raster Graphics... 347 Vector Graphics... 355 Flash... 355 Audio... 357 Video... 358 Summary...363 References...363 Chapter 10: Accessibility...367 Defining Web Accessibility...367 WCAG 1.0... 369 WCAG 2.0... 370 Migrating from WCAG 1.0 to WCAG 2.0...392 U.S. Section 508... 393 Semantic (X)HTML5 Elements and WAI-ARIA...394 JavaScript Accessibility...394 PDF Accessibility...395 Flash Accessibility...397 Accessibility of Mathematical Notations...397 Summary...398 References...398 Part 2: Developing with Standards...401 Chapter 11: Development Tools...403 Feature Requirements...403
Text Editors...404 WYSIWYG Editors...406 Content Management Systems and Bloggers...408 Web Standards Support... 409 Specific Editors...410 Semantic Editors and Reasoners... 410 MathType... 411 Markup Correctors...412 HTML Tidy... 412 Tidy for PHP... 413 Log Validator... 413 Browsers as Development Tools...413 Debugging and Add-ons... 413 Testing Web Pages in Text Browsers... 414 View the Source Code... 415 Summary...415 References...416 Chapter 12: Putting It All Together...419 Choosing the Relevant Standards...419 Switching Between Standards... 419 Step-by-Step Development...420 Starting from Scratch... 420 Links... 427 Images... 428 Lists... 428 Tables... 432 Drop-Down Selection Lists... 436
Forms... 437 Flash Content... 439 RSS News Feeds... 440 Making Web Sites Valid Through Redesign...441 Summary...441 References...442 Chapter 13: Best Practices...443 Appropriately Used Elements...443 Content in Logical Order...443 Reliable Positioning...444 Sizes and Proportions...444 Lengths in Relative Units... 445 Combine Units Properly... 445 Embedding External Content Properly...446 Embedding YouTube Videos as Valid XHTML or HTML5... 447 Embedding Google Maps as Valid XHTML or HTML5... 448 Semantic Web Best Practices...450 WAI-ARIA Best Practices...450 Mobile Web Best Practices...450 Providing Robustness...451 Declaring Fallback Generic Fonts... 451 Declarations with Appropriate Specificity... 452 Testing...452 Rendering in Multiple Browsers... 452 Readability Without Styles... 452 Summary...453 References...453
Chapter 14: Validation...455 Concepts...455 Markup Validation...456 Validating XML...460 Validating RDF/XML... 460 Validating News Feeds... 462 Validating CSS...462 Validating I18N...463 Validating Hyperlinks...464 Validating Accessibility...464 Validating Mobile-Friendliness...467 Unified Validators...467 W3C Unicorn... 468 Total Validator... 469 SortSite... 470 Extracting Semantic Content...471 Expressing Validity...474 W3C Icons... 475 Representing Technologies...476 Summary...478 References...478 Chapter 15: Most Common Errors...481 Common Serving Errors...481 Common Markup Errors...481 Incorrectly Used Elements... 481 Incorrect Structure... 483
Misused Tables... 483 Nonoptimal Code Length... 484 Element and Attribute Errors... 484 End Tag Errors... 484 Identifiers... 485 Common Style Sheet Errors...485 Nonexisting Properties... 485 Nonexisting or Incorrectly Used Property Values... 485 Ignored Inheritance... 486 Color Errors... 487 Incorrect Locations... 488 Transparent Backgrounds... 488 Miscellaneous Errors... 488 Common News Feed Errors...489 Common Script Errors...489 Common Accessibility Errors...489 Summary...490 References...490 Index...491
About the Author Leslie F. Sikos, Ph.D.
About the Technical Reviewer Charles Brown
Preface