The Truth About HTML5 (eBook)

RJ Owen, Luke Stevens (Autoren)

eBook Download: PDF

2014 | 1st ed.
XVIII, 200 Seiten
Apress (Verlag)
978-1-4302-6416-3 (ISBN)

Infos

The Truth About HTML5 is for web designers, web developers, and front-end coders who want to get up to speed with HTML5. The book isn't afraid to point out what everyone gets wrong about HTML5's new markup, so you don't make the same mistakes. It will show you what rocks in HTML5 today and what the future holds.

Marking up a basic web page shouldn't be a quasi-religious exercise where the high priests of HTML5 must be consulted for their interpretation of the holy texts (the HTML5 spec). Don't waste hours trawling through confusing, poorly researched, and often flat-out wrong information on the Internet. Get the truth on HTML5's markup here. You'll also find out about HTML5's new microdata standard that's being used on major websites, such as eBay and IMDB, right now, and get the low-down on the Canvas object and what it can and can't do for you. The book also covers how HTML5 affects CMSs and web apps, what HTML5 means for mobile, and what the future holds.

HTML5 isn't one big blob of technology that will be 'finished' at some point in the future. It's a grab bag of cool stuff, much of which has been around for years. Learn what's well supported and ready to go today. Now that the initial wave of hype is over, it's time to learn the truth about HTML5.

A bio is not available for this author.

---

The Truth About HTML5 is for web designers, web developers, and front-end coders who want to get up to speed with HTML5. The book isn't afraid to point out what everyone gets wrong about HTML5's new markup, so you don't make the same mistakes. It will show you what rocks in HTML5 today and what the future holds. Marking up a basic web page shouldn't be a quasi-religious exercise where the high priests of HTML5 must be consulted for their interpretation of the holy texts (the HTML5 spec). Don't waste hours trawling through confusing, poorly researched, and often flat-out wrong information on the Internet. Get the truth on HTML5's markup here. You'll also find out about HTML5's new microdata standard that's being used on major websites, such as eBay and IMDB, right now, and get the low-down on the Canvas object and what it can and can't do for you. The book also covers how HTML5 affects CMSs and web apps, what HTML5 means for mobile, and what the future holds. HTML5 isn't one big blob of technology that will be "e;finished"e; at some point in the future. It's a grab bag of cool stuff, much of which has been around for years. Learn what's well supported and ready to go today. Now that the initial wave of hype is over, it's time to learn the truth about HTML5.

Inhalt

Contents at a Glance 3
Contents 172
About the Authors 182
About the Technical Reviewer 183
Foreword 184
Introduction 4
Chapter 1: A Somewhat Sensationalized History of HTML5 6
How Architecture Astronauts and the W3C Tried to Kill HTML 6
You Probably Use XML 6
XHTML Is Born, But What Does It Mean? 7
Draconian Error Handling (Or: Why Don’t I Just Punch You in the Face?) 7
OK, Not Really. But Your Browser Would Punch You in the Face 8
XHTML Still Meant Better HTML 8
But the Crazy Had Only Just Begun 8
XHTML 2.0: Unloved and Alone 9
HTML5: A New Hope?.?.?.?We Hope 9
The W3C Says Go to Hell 10
The WHATWG Is Born 10
It’s a Whole New World 11
To HTML5 and Beyond! 11
HTML5 Is the New Black or Hotness or Something 12
Is HTML5 Hype, Substance, or Both? 12
Hixie or Bust 12
XHTML 2.0 Is Dead and Everyone Is Happy 13
HTML5?.?.?.?er?.?.?.?HTML, wait?.?.?.?HTML.next? 13
Should We Just Kill Off the W3C Altogether or Embrace It? 14
Reform 14
Destroy 14
Embrace 15
How Does New Stuff Get Added to HTML5 Now? 15
WHATWG and W3C Diversions 16
TL DR
What We’ll Be Focusing On 17
Chapter 2: The Truth About a Basic HTML5 Web Page 18
Formatting Changes in HTML5 19
What About an HTML5 Shim and CSS for the New Elements? 19
What About the HTML5 Boilerplate and Modernizr ? 20
Chapter 3: The Truth About Structuring an HTML5 Page 21
A Little Taste of Pain: The Sectioning Elements 21
Where Did These Elements Come From? 22
Who Cares? 23
The Contradiction at the Heart of HTML5’s New Elements 23
Outline What? 24
What Is an Outline, and Why Should I Care? 24
How We Currently Create Outlines (Even Without Realizing It) 24
“Sectioning” Is an Old Problem 26
If We Care About Blind Users, We Should Care About Headings 27
HTML5’s “Improved” Outlining Was Dead Before It Ever Shipped 27
Sneaking in Big Ideas Leads to Dead Ideas 28
We Forked the Spec 28
The Exception Is < main>
How Should We Structure an HTML5 Page? 29
Styling Headings HTML5-Style Is Kind of Insane 30
This Is Not Inconsequential: People Have to Teach This Stuff 31
Where Does This Leave Us? 31
A Sane Approach to Structural Markup for Accessibility 31
ARIA Benefits 32
Layout Recommendations 33
Chapter 4: The Truth About HTML5’s Structural Elements 34
< header>
Really, It Doesn’t Do Anything 35
How Can Screen Readers Use < header>
ARIA Alternative: Banner 35
Recommendation 36
< nav>
Good Intentions Accessibility Disaster
ARIA Alternative: Navigation 36
Recommendation 37
< section>
< section>
Sections == Outlines 37
Russian Dolls 38
Recommendation 38
< article>
Specifications Should Specify 39
Nesting < article>
Search Engines Don’t Need < article>
< article>
Recommendation 40
So, What’s the Difference Between < article>
< aside>
An Aside Creates an Outline Section in Weird Places 41
ARIA Alternative: Complementary 41
Recommendation 41
< footer>
Footer Doesn’t Do Anything Either 42
Fat Footer? Good Luck! 42
Can I'ave a Footer, Guv’na? 42
ARIA Alternative: contentinfo 42
Recommendation 43
< main>
Mainly Useless Controversy 44
ARIA Alternative: main 44
Recommendation 44
Other ARIA Landmarks 44
A Funny Thing Happened…Graceful Degradation Died and JavaScript Became Mandatory 45
Yahoo’s JavaScript Research 45
Here’s What Happens… 46
What to Do? Oh, XP… 46
Uh…Web Design Community, What Happened? 47
Conclusion: R.I.P. HTML5 Structural Elements 47
Chapter 5: The Truth About HTML5 Micro-semantics and Schema.org 49
Semantics in a Nutshell 49
These Problems Have Been Solved 50
There’s No Such Thing As “More” Semantic 50
Big Ideas in Semantic Markup: The Semantic Web 51
Semantics: Not Dead Yet (Or: Google & Co Drop a Micro-Semantic Bombshell)
E-commerce with Real (Micro) Semantics 51
Can the Real Semantics Please Stand Up? 52
Why Should We Care About Micro-semantics? 53
Schema.org: The Future of Semantics? 54
Couldn’t We Do This Before? 54
The Semantic Web We’ve Been Waiting For? 54
Microformats 55
RDFa 55
Microdata 56
Microdata and Schema.org 56
How Not to Launch an Initiative 56
What Do the People Behind Schema.org Think? 57
Wrapping Up: Semantics and HTML 58
Chapter 6: The Truth About HTML5 and SEO 60
SEO in the Dark Ages 60
Stuff Your Keywords 60
HTML and SEO 60
But What If It Helped … Somehow? 61
Zombie Myths Must Die … Eventually 61
Chapter 7: The Truth About HTML5’s Other New Elements 62
Be Bold or Die Trying 62
Wrap Your Anchor Around This, and Other Bits and Pieces 63
Wrap Anchors Around Block-Level Elements 63
< mark>
< figure>
< time>
< details>
< small>
< address>
< cite>
Should We Even Use These Obscure Little Tags? 66
Chapter 8: The Truth About HTML5 Forms 68
Going Native Slowly 68
Forms Can Make or Break a Site 69
Good News, Bad News 69
HTML5 Forms Resources 69
HTML5 Forms: The No-Brainers 70
New Input Types: E-mail, URL, Telephone Number, and Search 70
Attributes: Autocomplete, Autofocus, Readonly, and Spellcheck 71
Autocomplete 72
Autofocus 72
Readonly 72
Spellcheck 72
HTML5 Forms: The Kinda Maybes 72
Attribute: Placeholder 72
< progress>
< meter>
HTML5 Forms: The “I Wouldn’t Yet But You Can If You Really Want” 75
Attribute: Required 75
Attribute: Pattern 75
Input Type: Number (Spinner) 76
Input Type: Range (Slider) 76
Input Type: Date (Time/Calendar Widgets) 77
Input Type: Color (Color Picker) 78
Input Type and Element: Datalist 79
You Hypocrite. I Thought Requiring JavaScript Was the Worst Thing Ever 79
What About Accessibility ? 80
Chapter 9: The Truth About HTML5’s Canvas, Gaming, and Flash 81
Flash Is Dying, and HTML5 Is All We’ve Got 81
Can Canvas and HTML5 Fill the Gap? 82
Flash Authoring for HTML5? 82
And Then Apps Happened 83
Let’s Bury Flash-isms with Flash 84
We’re Not in Canvas Anymore 84
Cool Things with Canvas 86
Tooltips 86
Tipped 86
Charts 86
RGraph 86
Visualize 87
HumbleFinance 88
Peity 88
Visualizations 89
Processing.js 89
“Evolution of Privacy on Facebook” 89
Canvas, Twitter, and Audio Mashup 90
Paper.js 91
Games 92
Google Chrome Racer 92
Biolab Disaster 93
Canvas Rider 94
Cut the Rope 95
Image Manipulation 96
PaintbrushJS 96
Canvas-Driven Web Apps 97
Sketchpad 97
Endless Mural 98
LucidChart 99
Drawing Interface Elements 99
Flash-Style Interface Effects 99
Background Animations 100
Interface Backgrounds with Liquid Canvas 101
The Sometimes Good and Sometimes Bad Canvas Emulation for IE6–8 102
The Haphazard World of Web Standards (Or: How Did We End Up with Canvas?) 103
The Canvas Element and Accessibility 104
The Current State of Canvas 104
Primitive Development Environment 104
Performance 105
Limited IE Compatibility 105
Again with the Glass Metaphor 105
HTML5 Gaming: Canvas or Not? 105
Is It Even Canvas? 106
Getting Started with Canvas Game Development 106
HTML Gaming: Beyond HTML5 106
Canvas: What’s in It for Me? 107
Canvas for Web Designers 107
Canvas for Students and Hobbyists 107
Canvas for Flash Designers 107
Suck It and See 107
2D Canvas’s 3D Future: WebGL 107
3D on the Web: WebGL Alternatives 108
Show Me the Demos! 108
HelloRun 109
Epic Citadel 109
Angry Birds 110
Rome “3 Dreams in Black” Interactive Music Video 111
glfx.js Image Manipulation 112
Quake II 112
GT Racing: Motor Academy 113
Skid Racer 114
More WebGL Demos 115
Still Early Days for WebGL 115
Chapter 10: The Truth About Audio and Video in HTML5 116
Native < video>
The < audio>
< audio>
The WebAudio API 118
The < video>
Video Accessibility 120
API and Resources 120
Codecs, You’re Killing Me 121
The Patent Problem 121
H.264 Is Baked In 122
Google Threatens to Take Chrome WebM Only…and Then Doesn’t 122
Codecs: What to Do? 123
Reality Bites 123
Video Types …Oh My 124
Querying Supported Video Types with JavaScript 124
Audio and Video Media Players to the Rescue 125
MediaElement (Video and Audio, Free) 125
VideoJS (Video, Free) 126
Flowplayer (Video, Free and Commercial) 127
More Media Players 128
Other Flies in the HTML5 Video Ointment: DRM, Streaming, and Full-Screen Video 129
DRM 129
Streaming 130
Fullscreen API 131
Is HTML5 < audio>
Wrapping Up 132
Chapter 11: The Truth About SVG: The Flash Challenger That Was, Wasn’t, and Now… 133
SVG, SVG… 133
SVG: Browser Support Arrives at Last 134
Yes, There Is Real-World SVG We Can Use Right Now 135
The Many Faces of SVG 135
SVG in the'00s: The Great Hope That Wasn’t 135
SVG Browser Support: Android, What the Hell? Oh, and IE… 136
SVG Demos: What Is It Good For? 136
SVG Girl 137
SVG Edit 137
Google Docs 138
SVG Games 139
D3.js 139
Charts with Highcharts 140
Snap.svg-Powered Demos 141
PBS Kids 141
Codrops Animated SVG Icons with Snap.svg 142
Snap.svg’s Demo Page 143
Raphael.js-Powered Demos 144
thirteen23 144
Markup.io 145
DrawAStickman.com 146
Working with SVG 147
Responsive Web Design and SVG 147
SVG Gotchas 148
SVG: Heir to Flash? 148
Chapter 12: The Truth About HTML5 Web Apps, Mobile, and What Comes Next 150
HTML5 Web App Browser Support 150
HTML5 on Mobile: WebKit and Beyond 151
Mobile Is a Moving Target: Microsoft’s Big Push 151
Firefox OS: Mozilla’s Ambitious Mobile Platform, and the WebAPI 152
HTML5 Mobile Compatibility 153
HTML5-Powered Content Management 153
The JavaScript Age 153
JavaScript Killed the HTML Star 154
Modernizr, When Can I Use?.?.?.?, and Polyfills 155
Modernizr 155
When Can I Use?.?.?. 155
Polyfills 156
HTML5 Web App APIs 156
History API (pushState) 156
HTML5 Web Storage (and JavaScript-Rendered CSS) 157
Database Storage 157
HTML5 Offline (Application Cache) 158
Geolocation API 158
Other APIs That May Be of Interest to You 159
What Comes Next: HTML 5.1 160
Wrapping Up 161
Chapter 13: The Truth About the Future of Web Design: Performance-Based Design 162
Operating in the Dark 162
Performance vs. Production 163
Measure When You Redesign 163
Let’s Get Objective 164
Index 165

Produkt-Details

• Erscheint lt. Verlag: 28.2.2014
• Zusatzinfo: XVIII, 200 p. 76 illus.
• Verlagsort: Berkeley
• Sprache: englisch
• Themenwelt: Mathematik / Informatik ► Informatik ► Software Entwicklung
• Themenwelt: Mathematik / Informatik ► Informatik ► Web / Internet
• ISBN-10: 1-4302-6416-0 / 1430264160
• ISBN-13: 978-1-4302-6416-3 / 9781430264163