Start Here!™ Learn HTML5

Ready to learn HTML5 programming? Start Here! Learn the fundamentals of programming with HTML5—and begin building your first standards-based web pages from the ground up. If you have absolutely no previous experience, no problem—simply start here! This book introduces must-know concepts and getting-started techniques through easy-to-follow explanations, examples, and exercises. Here’s where you start learning HTML5 Create a web site using HTML5 tags in a simple text editor Use semantic tags to make your pages easier to layout and find Draw in HTML5 using the canvas element Embed audio and video in your web pages Get HTML5 to work in older browsers Develop your future skills in web design Introduction 17 Part I: Getting Started with HTML 23 Chapter 1: HTML Basics: The Least You Need to Know 25 Understanding HTML Tags 25 Opening a Webpage in Notepad 28 Other Ways of Opening Webpages in Notepad 31 Adding a Location to the Favorites List 33 Previewing HTML Files in a Web Browser 35 Making, Saving, and Viewing Changes 38 Key Points 39 Chapter 2: Setting Up the Document Structure 41 Specifying the Document Type 42 Creating the HTML, Head, and Body Sections 43 Creating Paragraphs and Line Breaks 45 Specifying a Page Title and Metatags 48 Key Points 50 Chapter 3: Formatting Text with Tags 51 Creating Headings 52 Applying Bold and Italic Formatting 55 Applying Superscript and Subscript Formatting 57 Using Monospace and Preformatted Text 58 Formatting a Block Quotation 64 Configuring View Settings in Internet Explorer 66 Key Points 70 Chapter 4: Using Lists and Backgrounds 71 Creating Bulleted and Numbered Lists 72 Nesting Lists 73 Changing the Bullet or Number Character 74 Specifying the Start of a Numbered List 75 Creating Definition Lists 78 Inserting Special Characters 80 Inserting Horizontal Lines 82 Choosing Background Colors and Foreground Colors 86 Understanding How Colors are Specified on Webpages 86 Applying a Background Color 87 Applying a Foreground Color 88 Specifying a Background Image File 89 Key Points 92 Chapter 5: Creating Hyperlinks and Anchors 93 Hyperlinking to a Webpage 94 Using Partial Paths and Filenames 94 Using Relative and Absolute Paths 95 Setting a Target Window 96 Hyperlinking to an Email Address 98 Creating and Hyperlinking to Anchors 101 Hyperlinking to Other Content 104 Key Points 106 Part II: Style Sheets and Graphics 107 Chapter 6: Introduction to Style Sheets 109 Understanding Styles 110 Constructing Style Rules 111 Creating Styles for Nested Tags 115 Creating Classes and IDs for Applying Styles 117 Applying Styles to Hyperlinks with Pseudo-Classes 120 Creating and Linking to External Style Sheets 122 Key Points 124 Chapter 7: Formatting Text with CSS 127 Specifying a Font Family 128 Specifying a Font Size and Color 131 Applying Bold and Italics 136 Applying Strikethrough and Underlining 138 Creating Inline Spans 140 Adjusting Spacing between Letters 142 Key Points 146 Chapter 8: Formatting Paragraphs with CSS 147 Indenting Paragraphs 148 Applying a Border to a Paragraph 151 Specifying a Border Style 151 Setting Border Padding 152 Specifying Border Width and Color 153 Formatting Border Sides Individually 153 Setting All Border Attributes at Once 154 Specifying the Horizontal Alignment of a Paragraph 156 Specifying Vertical Space within a Paragraph 159 Key Points 161 Chapter 9: Inserting Graphics 163 Understanding Graphic Size and Resolution 164 Inserting a Graphic 165 Clearing a Graphic 168 Controlling Image Size and Padding 170 Using a Graphic as a Hyperlink 173 Creating Thumbnails 175 Including Alternate Text for Graphics 177 Adding Figure Captions 178 Key Points 181 Part III: Page Layout and Navigation 183 Chapter 10: Creating Navigational Aids 185 Planning Your Site’s Organization 186 Creating a Text-Based Navigation Bar 188 Creating a Graphical Navigation Bar 191 Redirecting to Another URL 195 Creating Custom Error Pages 197 Key Points 200 Chapter 11: Creating Division-Based Layouts 201 Understanding HTML5 Semantic Tags 202 Beginning to Think in Divisions 203 Creating Divisions 204 Creating an HTML5 Semantic Layout 206 Positioning Divisions 209 Floating a Division to the Right or Left 209 Positioning a Division on the Page 210 Formatting Divisions 217 Key Points 220 Chapter 12: Creating Tables 221 Creating a Simple Table 222 Specifying the Size of a Table 226 Specifying the Width of a Column 231 Spanning (Merging) Table Cells 235 Using Tables for Page Layout 238 Key Points 243 Chapter 13: Formatting Tables 245 Applying Table Borders 246 Applying Borders by Using Attributes 246 Applying Borders by Using Styles 248 Applying Background and Foreground Fills 254 Changing Cell Padding, Spacing, and Alignment 257 Setting Cell Padding 259 Setting Cell Spacing 259 Setting Horizontal and Vertical Alignment 260 Key Points 262 Chapter 14: Creating User Forms 263 Creating a Basic Form 264 Creating a Text Box 265 Special Field Types for Email and Web Addresses 266 Creating a Text Area 266 Creating a Submit or Clear Button 266 Adding Default or Placeholder Text 267 Creating Check Boxes and Option Buttons 271 Creating Menu Lists 274 Additional Input Types in HTML5 278 Understanding CGI and Other Advanced Tools 279 Key Points 280 Chapter 15: Incorporating Sound and Video 283 Understanding Audio and Video in HTML5 284 HTML Multimedia Basics 284 Multimedia Formats and Containers 285 Codecs: Decoding the Video and Audio 285 Which Format to Choose? 286 Encoding Video 286 Embedding Video Clips 288 Introducing the Tag 288 The Tag: Your Fallback Plan 290 Place a Video Clip on a Webpage 291 Incorporating Audio on a Webpage 293 Playing Audio with the Tag 293 Playing Audio in Older Browsers 294 Key Points 296 Chapter 16: HTML and Microsoft Expression Web 297 Exploring the Expression Web Interface 298 Creating Websites and Webpages 303 Create a Page by Using a CSS Template 307 Insert Graphics 310 Import an Images Folder 310 Place Images on a Page 311 Add a Background Image to a Division 312 Formatting Text 314 Formatting a Division 319 Inserting Hyperlinks 321 Key Points 324 Part IV: Appendices 327 Appendix A: Designing for Usability 329 Understanding Usability 329 Planning for Usability 330 Sketching the Site Organization 331 Designing a Consistent Page Template 331 Designing the Content of Individual Pages 332 Performing Usability Testing 333 Appendix B: Designing for Accessibility 335 Guideline 1: Provide Equivalent Alternatives to Auditory and Visual Content 336 Guideline 2: Don’t Rely on Color Alone 336 Guideline 3: Use Markup and Style Sheets, and Do So Properly 337 Guideline 4: Clarify Natural Language Usage 338 Guideline 5: Create Tables that Transform Gracefully 338 Guideline 6: Ensure Pages that Feature New Technologies Transform Gracefully 339 Guideline 7: Ensure User Control of Time-Sensitive Content Changes 339 Guideline 8: Ensure Direct Accessibility of Embedded User Interfaces 340 Guideline 9: Design for Device Independence 340 Guideline 10: Use Interim Solutions 340 Guideline 11: Use W3C Technologies and Guidelines 341 Guideline 12: Provide Context and Orientation Information 341 Guideline 13: Provide Clear Navigation Mechanisms 342 Guideline 14: Ensure that Documents are Clear and Simple 342 Appendix C: Quick Reference 343 Tags Added in HTML 5 343 Tags Removed in HTML 5 344 Glossary 345 Index 349 Learn the fundamentals of programming with HTML5 - and begin building your first standards-based web pages from the ground up. If you have absolutely no previous experience, no problem - simply start here! This book introduces must-know concepts and getting-started techniques through easy-to-follow explanations, examples, and exercises. Learn the fundamentals of HTML5, and begin building your first standards-based web pages from the ground up. Wempen introduces must-know concepts and getting-started techniques through easy-to-follow explanations, examples, and exercises