Introduction |
|
xv | |
|
|
xvi | |
|
|
xvii | |
|
Web Standards and Specifications |
|
|
xviii | |
|
Progressive Enhancement: A Best Practice |
|
|
xx | |
|
|
xxii | |
|
|
xxiv | |
|
|
xxvi | |
Chapter 1 Webpage Building Blocks |
|
1 | (26) |
|
|
3 | (1) |
|
|
4 | (4) |
|
Markup: Elements, Attributes, Values, and More |
|
|
8 | (4) |
|
|
12 | (1) |
|
Links, Images, and Other Non-Text Content |
|
|
13 | (1) |
|
|
14 | (1) |
|
|
15 | (5) |
|
HTML: Markup with Meaning |
|
|
20 | (4) |
|
A Browser's Default Display of Webpages |
|
|
24 | (2) |
|
|
26 | (1) |
Chapter 2 Working with Webpage Files |
|
27 | (16) |
|
|
28 | (2) |
|
|
30 | (2) |
|
|
32 | (3) |
|
Specifying a Default Page or Homepage |
|
|
35 | (1) |
|
|
36 | (1) |
|
|
37 | (1) |
|
Viewing Your Page in a Browser |
|
|
38 | (2) |
|
The Inspiration of Others |
|
|
40 | (3) |
Chapter 3 Basic HTML Structure |
|
43 | (44) |
|
|
44 | (4) |
|
|
48 | (2) |
|
|
50 | (3) |
|
|
53 | (1) |
|
|
54 | (2) |
|
|
56 | (3) |
|
Marking the Main Area of a Webpage |
|
|
59 | (1) |
|
|
60 | (3) |
|
|
63 | (2) |
|
|
65 | (5) |
|
|
70 | (3) |
|
Creating Generic Containers |
|
|
73 | (5) |
|
Improving Accessibility with ARIA |
|
|
78 | (4) |
|
Naming Elements with a Class or ID |
|
|
82 | (2) |
|
Adding the Title Attribute to Elements |
|
|
84 | (1) |
|
|
85 | (2) |
Chapter 4 Text |
|
87 | (46) |
|
|
88 | (1) |
|
|
89 | (1) |
|
Marking Important and Emphasized Text |
|
|
90 | (2) |
|
|
92 | (2) |
|
Indicating a Citation or Reference |
|
|
94 | (1) |
|
|
95 | (3) |
|
|
98 | (3) |
|
|
101 | (2) |
|
|
103 | (1) |
|
Creating Superscripts and Subscripts |
|
|
104 | (2) |
|
Adding Author Contact Information |
|
|
106 | (2) |
|
Noting Edits and Inaccurate Text |
|
|
108 | (4) |
|
|
112 | (2) |
|
|
114 | (2) |
|
|
116 | (2) |
|
|
118 | (2) |
|
|
120 | (2) |
|
|
122 | (11) |
Chapter 5 Images |
|
133 | (24) |
|
|
134 | (6) |
|
|
140 | (1) |
|
|
141 | (1) |
|
|
142 | (3) |
|
Inserting Images on a Page |
|
|
145 | (2) |
|
Offering Alternative Text |
|
|
147 | (2) |
|
|
149 | (3) |
|
Scaling Images with the Browser |
|
|
152 | (2) |
|
Scaling Images with an Image Editor |
|
|
154 | (1) |
|
Adding Icons for Your Website |
|
|
155 | (2) |
Chapter 6 Links |
|
157 | (12) |
|
Creating a Link to Another Webpage (and Other Link Basics) |
|
|
158 | (6) |
|
Creating and Linking to Anchors |
|
|
164 | (2) |
|
Creating Other Kinds of Links |
|
|
166 | (3) |
Chapter 7 CSS Building Blocks |
|
169 | (20) |
|
Constructing a Style Rule |
|
|
171 | (1) |
|
Adding Comments to Style Rules |
|
|
172 | (2) |
|
Understanding Inheritance |
|
|
174 | (3) |
|
The Cascade: When Rules Collide |
|
|
177 | (3) |
|
|
180 | (9) |
Chapter 8 Working with Style Sheets |
|
189 | (14) |
|
Creating an External Style Sheet |
|
|
190 | (2) |
|
Linking to External Style Sheets |
|
|
192 | (2) |
|
Creating an Embedded Style Sheet |
|
|
194 | (2) |
|
|
196 | (2) |
|
The Cascade and the Order of Styles |
|
|
198 | (2) |
|
Using Media-Specific Style Sheets |
|
|
200 | (2) |
|
The Inspiration of Others: CSS |
|
|
202 | (1) |
Chapter 9 Defining Selectors |
|
203 | (26) |
|
|
204 | (2) |
|
Selecting Elements by Name |
|
|
206 | (2) |
|
Selecting Elements by Class or ID |
|
|
208 | (4) |
|
Selecting Elements by Context |
|
|
212 | (4) |
|
Selecting an Element That Is the First or Last Child |
|
|
216 | (2) |
|
Selecting the First Letter or First Line of an Element |
|
|
218 | (2) |
|
Selecting Links Based on Their State |
|
|
220 | (2) |
|
Selecting Elements Based on Attributes |
|
|
222 | (4) |
|
Specifying Groups of Elements |
|
|
226 | (1) |
|
|
227 | (2) |
Chapter 10 Formatting Text with Styles |
|
229 | (36) |
|
|
230 | (2) |
|
|
232 | (1) |
|
Specifying Alternate Fonts |
|
|
233 | (3) |
|
|
236 | (2) |
|
|
238 | (2) |
|
|
240 | (5) |
|
|
245 | (1) |
|
Setting All Font Values at Once |
|
|
246 | (2) |
|
|
248 | (2) |
|
|
250 | (7) |
|
|
257 | (1) |
|
|
258 | (1) |
|
|
259 | (1) |
|
|
260 | (1) |
|
|
261 | (1) |
|
|
262 | (2) |
|
Setting Whitespace Properties |
|
|
264 | (1) |
Chapter 11 Layout with Styles |
|
265 | (44) |
|
Considerations When Beginning a Layout |
|
|
266 | (2) |
|
|
268 | (4) |
|
Styling HTML5 Elements in Older Browsers |
|
|
272 | (2) |
|
Resetting or Normalizing Default Styles |
|
|
274 | (2) |
|
|
276 | (2) |
|
Controlling the Display Type and Visibility of Elements |
|
|
278 | (4) |
|
Setting the Height or Width for an Element |
|
|
282 | (4) |
|
Adding Padding Around an Element |
|
|
286 | (2) |
|
|
288 | (4) |
|
Setting the Margins Around an Element |
|
|
292 | (3) |
|
|
295 | (2) |
|
Controlling Where Elements Float |
|
|
297 | (4) |
|
Positioning Elements Relatively |
|
|
301 | (1) |
|
Positioning Elements Absolutely |
|
|
302 | (2) |
|
Positioning Elements in a Stack |
|
|
304 | (1) |
|
Determining How to Treat Overflow |
|
|
305 | (1) |
|
Aligning Elements Vertically |
|
|
306 | (2) |
|
|
308 | (1) |
Chapter 12 Building Responsive Webpages |
|
309 | (26) |
|
Responsive Web Design: An Overview |
|
|
310 | (2) |
|
|
312 | (3) |
|
Creating a Flexible Layout Grid |
|
|
315 | (4) |
|
Understanding and Implementing Media Queries |
|
|
319 | (7) |
|
|
326 | (7) |
|
Accommodating Older Versions of Internet Explorer |
|
|
333 | (2) |
Chapter 13 Working with Web Fonts |
|
335 | (26) |
|
|
336 | (2) |
|
|
338 | (4) |
|
Downloading Your First Web Font |
|
|
342 | (3) |
|
Understanding the @font-face Rule |
|
|
345 | (1) |
|
Styling Text with a Web Font |
|
|
346 | (3) |
|
Applying Italics and Bold with a Web Font |
|
|
349 | (8) |
|
Using Web Fonts from Google Fonts |
|
|
357 | (4) |
Chapter 14 Enhancements and Effects with CSS |
|
361 | (28) |
|
Browser Compatibility, Progressive Enhancement, and Polyfills |
|
|
362 | (2) |
|
Understanding Vendor Prefixes |
|
|
364 | (1) |
|
Rounding the Corners of Elements |
|
|
365 | (3) |
|
Adding Drop Shadows to Text |
|
|
368 | (2) |
|
Adding Drop Shadows to Elements |
|
|
370 | (3) |
|
Applying Multiple Backgrounds |
|
|
373 | (3) |
|
Using Gradient Backgrounds |
|
|
376 | (6) |
|
Setting the Opacity of Elements |
|
|
382 | (2) |
|
Effects with Generated Content |
|
|
384 | (3) |
|
Combining Images with Sprites |
|
|
387 | (2) |
Chapter 15 Lists |
|
389 | (20) |
|
Creating Ordered and Unordered Lists |
|
|
390 | (3) |
|
|
393 | (1) |
|
|
394 | (3) |
|
Choosing Where to Start List Numbering |
|
|
397 | (1) |
|
Controlling Where Markers Hang |
|
|
398 | (1) |
|
Setting All List-Style Properties at Once |
|
|
399 | (1) |
|
|
400 | (4) |
|
Creating Description Lists |
|
|
404 | (5) |
Chapter 16 Forms |
|
409 | (40) |
|
Improvements to Forms in HTML5 |
|
|
410 | (3) |
|
|
413 | (3) |
|
|
416 | (2) |
|
Organizing the Form Elements |
|
|
418 | (4) |
|
|
422 | (3) |
|
|
425 | (2) |
|
|
427 | (1) |
|
Creating Email, Search, Telephone, and URL Boxes |
|
|
428 | (4) |
|
|
432 | (2) |
|
|
434 | (2) |
|
|
436 | (1) |
|
|
437 | (2) |
|
Allowing Visitors to Upload Files |
|
|
439 | (1) |
|
|
440 | (1) |
|
|
441 | (3) |
|
|
444 | (2) |
|
Styling Forms Based on Their State |
|
|
446 | (3) |
Chapter 17 Video, Audio, and Other Multimedia |
|
449 | (28) |
|
Third-Party Plugins and Going Native |
|
|
450 | (1) |
|
|
451 | (1) |
|
Adding a Video to Your Webpage |
|
|
452 | (2) |
|
Adding Controls and Autoplay to Your Video |
|
|
454 | (2) |
|
Looping a Video and Specifying a Poster Image |
|
|
456 | (1) |
|
Preventing a Video from Preloading |
|
|
457 | (2) |
|
Using Video with Multiple Sources and a Text Fallback |
|
|
459 | (3) |
|
|
462 | (1) |
|
|
463 | (1) |
|
Adding an Audio File with Controls to Your Webpage |
|
|
464 | (2) |
|
Autoplaying, Looping, and Preloading Audio |
|
|
466 | (2) |
|
Providing Multiple Audio Sources with a Fallback |
|
|
468 | (2) |
|
Adding Video and Audio with a Flash Fallback |
|
|
470 | (5) |
|
|
475 | (1) |
|
|
476 | (1) |
Chapter 18 Tables |
|
477 | (8) |
|
|
478 | (4) |
|
Spanning Columns and Rows |
|
|
482 | (3) |
Chapter 19 Adding JavaScript |
|
485 | (10) |
|
Loading an External Script |
|
|
487 | (5) |
|
Adding an Embedded Script |
|
|
492 | (1) |
|
|
493 | (2) |
Chapter 20 Testing & Debugging Webpages |
|
495 | (16) |
|
|
496 | (2) |
|
|
498 | (4) |
|
Trying Some Debugging Techniques |
|
|
502 | (2) |
|
Checking the Easy Stuff: General |
|
|
504 | (2) |
|
Checking the Easy Stuff: HTML |
|
|
506 | (2) |
|
Checking the Easy Stuff: CSS |
|
|
508 | (2) |
|
When Images Don't Display |
|
|
510 | (1) |
Chapter 21 Publishing Your Pages on the Web |
|
511 | (8) |
|
Getting Your Own Domain Name |
|
|
512 | (1) |
|
Finding a Host for Your Site |
|
|
513 | (2) |
|
Transferring Files to the Server |
|
|
515 | (4) |
Appendix HTML Reference |
|
519 | (14) |
Index |
|
533 | |