book

Beginning HTML, XHTML, CSS, and JavaScript®

Name: Beginning HTML, XHTML, CSS, and JavaScript®
Author: Jon Duckett
ISBN: 9780470540701

by Jon Duckett

December 2009

Beginner

860 pages

19h 42m

English

Wrox

Read now

Unlock full access

Copyright
About the Author
About the Tech Editor
Credits
Introduction
About the BookAbout the BookWhom This Book Is ForWhat This Book CoversWhat You Need to Use This BookHow This Book Is OrganizedConventionsSource CodeErratap2p.wrox.com
1. Structuring Documents for the Web
1.1. A Web of Structured Documents1.2. Introducing HTML and XHTML1.2.1. Tags and Elements1.2.2. Separating Heads from Bodies1.2.3. Attributes Tell Us About Elements1.2.4. Learning from Others by Viewing Their Source Code1.2.5. Elements for Marking Up Text1.3. Basic Text Formatting1.3.1. White Space and Flow1.3.2. Creating Headings Using hn Elements1.3.3. The align Attribute (Deprecated)1.3.4. Creating Paragraphs Using the <p> Element1.3.5. Creating Line Breaks Using the <br /> Element1.3.6. Creating Preformatted Text Using the <pre> Element1.4. Presentational Elements1.4.1. The <b> Element1.4.2. The <i> Element1.4.3. The <u> Element (Deprecated)1.4.4. The <s> and <strike> Elements (Deprecated)1.4.5. The <tt> Element1.4.6. The <sup> Element1.4.7. The <sub> Element1.4.8. The <big> Element1.4.9. The <small> Element1.4.10. The <hr /> Element1.5. Phrase Elements1.5.1. The <em> Element Adds Emphasis1.5.2. The <strong> Element Adds Strong Emphasis1.5.3. The <address> Element Is for Addresses1.5.4. The <abbr> Element Is for Abbreviations1.5.5. The <acronym> Element Is for Acronym Use1.5.6. The <dfn> Element Is for Special Terms1.5.7. The <blockquote> Element Is for Quoting Text1.5.8. Using the cite Attribute with the <blockquote> Element1.5.9. The <q> Element Is for Short Quotations1.5.10. The <cite> Element Is for Citations1.5.11. The <code> Element Is for Code1.5.12. The <kbd> Element Is for Text Typed on a Keyboard1.5.13. The <var> Element Is for Programming Variables1.5.14. The <samp> Element Is for a Program Output1.6. Lists1.6.1. Using the <ul> Element to Create Unordered Lists1.6.2. Ordered Lists1.6.2.1. Using the type Attribute to Select Numbers, Letters, or Roman Numerals in Ordered Lists (Deprecated)1.6.2.2. Using the start Attribute to Change the Starting Number in Ordered Lists (Deprecated)1.6.3. Definition Lists1.6.4. Nesting Lists1.7. Editing Text1.8. Using Character Entities for Special Characters1.9. Comments1.10. The <font> Element (Deprecated)1.11. Understanding Block and Inline Elements1.12. Grouping Elements with <div> and <span>1.12.1. The XML Declaration1.12.2. Document Type Declaration1.13. Core Elements and Attributes1.13.1. The <html> Element1.13.2. The <head> Element1.13.3. The <title> Element1.13.4. The <body> Element1.14. Attribute Groups1.14.1. Core Attributes1.14.1.1. The id Attribute1.14.1.2. The class Attribute1.14.1.3. The title Attribute1.14.1.4. The style Attribute (Deprecated)1.14.2. Internationalization1.14.2.1. The dir Attribute1.14.2.2. The lang Attribute1.14.2.3. The xml:lang Attribute1.14.3. UI Events1.15. Summary1.16. Exercises
2. Links and Navigation
2.1. Basic Links2.1.1. Linking to Other Web Pages2.1.2. Linking to E-mail Addresses2.2. Understanding Directories and Directory Structures2.3. Understanding URLs2.3.1. Absolute and Relative URLs2.3.1.1. Same Directory2.3.1.2. Subdirectory2.3.1.3. Parent Directory2.3.1.4. From the Root2.3.2. The <base> Element2.4. Creating Links with the <a> Element2.4.1. Creating a Source Anchor with the href Attribute2.4.2. Creating a Destination Anchor Using the name and id Attributes (Linking to a Specific Part of a Page)2.4.3. The <a> Element's Other Attributes2.4.3.1. The accesskey Attribute2.4.3.2. The charset Attribute2.4.3.3. The coords Attribute2.4.3.4. The hreflang Attribute2.4.3.5. The rel Attribute2.4.3.6. The rev Attribute2.4.3.7. The shape Attribute2.4.3.8. The tabindex Attribute2.4.3.9. The target Attribute2.4.3.10. The title Attribute2.4.3.11. The type Attribute2.5. Advanced E-mail Links2.6. Summary2.7. Exercises
3. Images, Audio, and Video
3.1. Adding Images Using the <img> Element3.1.1. The src Attribute3.1.2. The alt Attribute3.1.3. The height and width Attributes3.1.4. The align Attribute (Deprecated)3.1.5. The border Attribute (Deprecated)3.1.6. The hspace and vspace Attributes (Deprecated)3.1.7. The ismap and usemap Attributes3.1.8. The longdesc Attribute3.1.9. The name Attribute (Deprecated)3.2. Using Images as Links3.3. Image Maps3.3.1. Client-Side Image Maps3.3.1.1. Client-Side Image Maps Using <map> and <area>3.3.1.1.1. The shape Attribute3.3.1.1.2. The coords Attribute3.3.1.1.3. The href and nohref Attributes3.3.1.1.4. The alt Attribute3.3.1.1.5. The target Attribute3.3.1.1.6. The tabindex Attribute3.3.1.2. Client-Side Image Maps Using the <object> Element3.3.2. Server-Side Image Maps3.4. Choosing the Right Image Format3.4.1. GIF Images3.4.2. Animated GIFs3.4.3. JPEG Images3.4.4. PNG Images3.4.5. Keeping File Sizes Small3.5. Adding Flash, Video, and Audio to Your Web Pages3.5.1. Adding Flash Movies to Your Site3.5.1.1. Adding the YouTube Flash Video Player to a Page3.5.1.2. Adding Flash to a Page Using <object> and <embed> Elements3.5.1.3. Adding Flash to a Page Using SWFObject3.5.2. Adding Videos to Your Site3.5.3. Adding Videos Using Flash Video3.5.4. Video Size3.5.5. Adding Audio to Your Site3.5.5.1. Adding Audio Using Default Media Players3.5.5.2. Adding MP3s to Your Pages Using Flash3.5.6. Automatically Playing Audio and Video When a Page Loads3.5.7. A Closer Look at the <object> and <param> Elements3.5.7.1. The archive Attribute3.5.7.2. The border Attribute (Deprecated)3.5.7.3. The classid Attribute3.5.7.4. The codebase Attribute3.5.7.5. The codetype Attribute3.5.7.6. The declare Attribute3.5.7.7. The data Attribute3.5.7.8. The height and width Attributes3.5.7.9. The hspace and vspace attributes (Deprecated)3.5.7.10. The name Attribute (Deprecated)3.5.7.11. The standby Attribute3.5.7.12. The tabindex Attribute3.5.7.13. The usemap Attribute3.5.8. The <param> Element3.5.8.1. The name and value Attributes3.5.8.2. The valuetype Attribute3.5.8.3. The type Attribute3.6. Summary3.7. Exercises
4. Tables
4.1. Introducing Tables4.2. Basic Table Elements and Attributes4.2.1. The <table> Element Creates a Table4.2.1.1. The align Attribute (Deprecated)4.2.1.2. The bgcolor Attribute (Deprecated)4.2.1.3. The border Attribute (Deprecated)4.2.2. The cellpadding Attribute (Deprecated)4.2.2.1. The cellspacing Attribute (Deprecated)4.2.2.2. The dir Attribute4.2.2.3. The frame Attribute (Deprecated)4.2.2.4. The rules Attribute (Deprecated)4.2.2.5. The summary Attribute4.2.2.6. The width Attribute (Deprecated)4.2.3. The <tr> Element Contains Table Rows4.2.3.1. The align Attribute (Deprecated)4.2.3.2. The bgcolor Attribute (Deprecated)4.2.3.3. The char Attribute4.2.3.4. The charoff Attribute4.2.3.5. The valign Attribute (Deprecated)4.2.4. The <td> and <th> Elements Represent Table Cells4.2.4.1. The abbr Attribute4.2.4.2. The align Attribute (Deprecated)4.2.4.3. The axis Attribute4.2.4.4. The bgcolor Attribute (Deprecated)4.2.4.5. The char Attribute4.2.4.6. The charoff Attribute4.2.4.7. The colspan Attribute4.2.4.8. The headers Attribute4.2.4.9. The height Attribute (Deprecated)4.2.4.10. The nowrap Attribute (Deprecated)4.2.4.11. The rowspan Attribute4.2.4.12. The scope Attribute4.2.4.13. The valign Attribute (Deprecated)4.2.4.14. The width Attribute (Deprecated)4.3. Adding a <caption> to a Table4.4. Grouping Sections of a Table4.4.1. Spanning Columns Using the colspan Attribute4.4.2. Spanning Rows Using the rowspan Attribute4.4.3. Splitting Up Tables Using a Head, Body, and Foot4.4.4. Grouping Columns Using the <colgroup> Element4.4.5. Columns Sharing Styles Using the <col> Element4.5. Nested Tables4.6. Accessible Tables4.6.1. How to Linearize Tables4.6.2. Using the id, scope, and headers Attributes4.7. Summary4.8. Exercises
5. Forms
5.1. Introducing Forms5.2. Creating a Form with the <form> Element5.2.1. The action Attribute5.2.2. The method Attribute5.2.3. The id Attribute5.2.4. The name Attribute (Deprecated)5.2.5. The onsubmit Attribute5.2.6. The onreset Attribute5.2.7. The enctype Attribute5.2.8. The accept-charset Attribute5.2.9. The accept Attribute5.2.10. The target Attribute5.2.11. White Space and the <form> Element5.3. Form Controls5.3.1. Text Inputs5.3.1.1. Single-Line Text Input Controls5.3.1.2. Password Input Controls5.3.1.3. Multiple-Line Text Input Controls5.3.2. Buttons5.3.2.1. Creating Buttons Using the <input> Element5.3.2.2. Using Images for Buttons5.3.2.3. Creating Buttons Using the <button> Element5.3.3. Checkboxes5.3.4. Radio Buttons5.3.5. Select Boxes5.3.5.1. The <select> Element5.3.5.2. The <option> Element5.3.5.3. Creating Scrolling Select Boxes5.3.5.4. Selecting Multiple Options with the multiple Attribute5.3.5.5. Grouping Options with the <optgroup> Element5.3.5.6. Attributes for Select Boxes5.3.6. File Select Boxes5.3.7. Hidden Controls5.3.8. Object Controls5.4. Creating Labels for Controls and the <label> Element5.5. Structuring Your Forms with <fieldset> and <legend> Elements5.6. Focus5.6.1. Tabbing Order5.6.2. Access Keys5.7. Disabled and Read-Only Controls5.8. Sending Form Data to the Server5.8.1. HTTP get5.8.2. HTTP post5.9. Summary5.10. Exercises

6. Frames
6.1. Introducing the Frameset6.2. When To Use Frames6.3. The <frameset> Element6.3.1. The cols Attribute6.3.1.1. Absolute Values in Pixels6.3.1.2. A Percentage of the Browser Window or Parent Frame6.3.1.3. Relative Widths Between Columns6.3.1.4. The Wildcard Symbol6.3.1.5. Mixing Measurements and Resizing Windows6.3.2. The rows Attribute6.3.3. Browser-Specific Extensions to the <frameset> Element6.3.3.1. The border Attribute6.3.3.2. The frameborder Attribute6.3.3.3. The framespacing Attribute6.4. The <frame> Element6.4.1. The src Attribute6.4.2. The name Attribute6.4.3. The frameborder Attribute6.4.4. The marginwidth and marginheight Attributes6.4.5. The noresize Attribute6.4.6. The scrolling Attribute6.4.7. The longdesc Attribute6.5. The <noframes> Element6.6. Creating Links Between Frames6.7. Setting a Default Target Frame Using the <base> Element6.8. Nested Framesets6.9. Inline or Floating Frames with <iframe>6.9.1. The <iframe> Element6.9.1.1. The src Attribute6.9.1.2. The align Attribute (Deprecated)6.9.1.3. The height and width Attributes6.9.1.4. The frameborder Attribute6.9.1.5. The longdesc Attribute6.9.1.6. The marginheight and marginwidth Attributes6.9.1.7. The scrolling Attribute6.10. Summary6.11. Exercises
7. Cascading Style Sheets
7.1. Introducing CSS7.1.1. A Basic Example7.1.2. Inheritance7.2. Where You Can Add CSS Rules7.2.1. The <link> Element7.2.1.1. The rel Attribute7.2.1.2. The type Attribute7.2.1.3. The href Attribute7.2.1.4. The hreflang Attribute7.2.1.5. The media Attribute7.2.2. The <style> Element7.2.3. Advantages of External CSS Style Sheets7.3. CSS Properties7.4. Controlling Text7.4.1. The font-family Property7.4.2. The font-size Property7.4.3. The font-weight Property7.4.4. The font-style Property7.4.5. The font-variant Property7.4.6. The font-stretch Property7.4.7. The font-size-adjust Property7.5. Text Formatting7.5.1. The color Property7.5.2. The text-align Property7.5.3. The vertical-align Property7.5.4. The text-decoration Property7.5.5. The text-indent Property7.5.6. The text-shadow Property7.5.7. The text-transform Property7.5.8. The letter-spacing Property7.5.9. The word-spacing Property7.5.10. The white-space Property7.5.11. The direction Property7.6. Text Pseudo-Classes7.6.1. The first-letter Pseudo-Class7.6.2. The first-line Pseudo-Class7.7. Selectors7.7.1. Universal Selector7.7.2. The Type Selector7.7.3. The Class Selector7.7.4. The ID Selector7.7.5. The Child Selector7.7.6. The Descendant Selector7.7.7. The Adjacent Sibling Selector7.7.8. The General Sibling Selector7.7.9. Using Child and Sibling Selectors To Reduce Dependence on Classes in Markup7.7.10. Attribute Selectors7.8. Lengths7.8.1. Relative Units7.8.1.1. px7.8.1.2. em7.8.1.3. ex7.8.2. Absolute Units7.8.3. Percentages7.9. Introducing the Box Model7.9.1. An Example Illustrating the Box Model7.9.2. The Border Properties7.9.2.1. The border-color Property7.9.2.2. The border-style Property7.9.2.3. The border-width Property7.9.2.4. Expressing Border Properties Using Shorthand7.9.3. The padding Property7.9.4. The margin Property7.9.5. Dimensions of a Box7.9.5.1. The height and width Properties7.9.5.2. The line-height Property7.9.5.3. The max-width and min-width Properties7.9.5.4. The min-height and max-height Properties7.9.5.5. The overflow Property7.9.6. Internet Explorer Box Model Bug7.10. Summary7.11. Exercises
8. More Cascading Style Sheets
8.1. Links8.2. Backgrounds8.2.1. The background-color Property8.2.2. The background-image Property8.2.3. The background-repeat Property8.2.4. The background-position Property (for Fixing Position of Backgrounds)8.2.5. The background-attachment Property (for Watermarks)8.2.6. The background Property (the Shorthand)8.3. Lists8.3.1. The list-style-type Property8.3.2. The list-style-position Property8.3.3. The list-style-image Property8.3.4. The list-style Property (the Shorthand)8.4. Tables8.4.1. Table-Specific Properties8.4.2. The border-collapse Property8.4.3. The border-spacing Property8.4.4. The empty-cells Property8.4.5. The caption-side Property8.4.6. The table-layout Property8.5. Outlines8.5.1. The outline-width Property8.5.2. The outline-style Property8.5.3. The outline-color Property8.5.4. The outline Property (the Shorthand)8.6. The :focus and :active Pseudo-Classes8.7. Generated Content8.7.1. The :before and :after Pseudo-Elements8.7.2. The content Property8.7.2.1. Counters8.7.2.2. Quotation Marks8.8. Miscellaneous Properties8.8.1. The cursor Property8.8.2. The display Property8.8.3. The visibility Property8.9. Additional Rules8.9.1. The @import Rule: Modularized Style Sheets8.9.2. The !important Rule8.9.3. The @charset Rule8.10. Positioning and Layout with CSS8.10.1. Normal Flow8.10.2. The position Property8.10.3. Box Offset Properties8.10.4. Relative Positioning8.10.5. Absolute Positioning8.10.6. Fixed Positioning8.10.7. The z-index Property8.10.8. Floating Using the float Property8.10.9. The clear Property8.11. Summary8.12. Exercises
9. Page Layout
9.1. Understanding the Site's Audience9.1.1. Who Will Visit the Site?9.1.2. Why Have They Visited Your Site?9.1.3. What Does a Visitor Need to Achieve a Goal?9.1.4. How Often Will People Want to Visit?9.1.5. Things You Want the Site to Do9.1.6. Prioritizing Information9.1.7. Grouping and Categorization9.1.8. Creating a Site Map9.1.9. Identifying Key Elements for Each Page9.2. Page Size (and Screen Resolution)9.2.1. Understanding Screen Sizes9.2.1.1. Deciding the Width of Your Page9.2.1.2. Deciding the Height of Your Page9.2.2. Fixed-Width vs. Liquid Designs9.2.2.1. Liquid (Stretchy) Page9.2.2.2. Fixed-Width Page9.3. Designing Pages9.3.1. Composition and Grids9.3.2. Sketching the Placement of Elements9.3.2.1. Common Page Elements and Templates9.3.2.2. Grouping Elements9.3.2.3. Creating a Visual Hierarchy and Prioritizing Information on a Page9.3.3. How Visitors Look at a Page9.3.3.1. Homepages9.3.3.2. Content Pages9.3.3.3. Section Homepages9.3.3.4. Selecting Images9.3.3.5. Things You May Need from a Client9.4. Coding Your Design9.4.1. The IE Box Model Bug9.4.2. Working with a Grid9.4.3. Multi-Column Layouts9.4.3.1. Three-Column Layout9.4.3.2. Two-Column Layouts9.4.3.3. Four-Column Layouts9.4.3.4. Six-Column Layouts9.4.3.5. Liquid Layouts9.4.3.6. Backgrounds That Reach the Bottom of the Page9.5. Developing for Mobile Devices9.5.1. Understanding the Medium and How It Is Used9.5.1.1. Context: What Is the Mobile User Doing?9.5.1.2. Relationship: How Do Users Treat Their Mobile Phones?9.5.1.3. Capabilities: How Do Features of Mobiles Compare with Desktop PCs?9.5.2. How to Approach Mobile Development9.5.2.1. Do Not Develop a Mobile Site9.5.2.2. Provide an Alternative View of Your Site9.5.2.3. Create a Separate Mobile-Optimized with Its Own Content9.5.3. Building a Mobile Site9.5.3.1. Domain Name9.5.3.2. Device Detection9.5.3.3. Languages for Creating Mobile Web Sites9.5.3.4. Design Tips9.5.3.4.1. Content9.5.3.4.2. Color9.5.3.4.3. Navigation9.5.3.4.4. Links9.5.3.4.5. Forms9.5.3.5. Testing9.6. Summary9.7. Exercises
10. Design Issues
10.1. Typography10.1.1. Line Length — A Measure10.1.2. Font Sizes10.1.3. Choosing Fonts10.1.4. Line Height — Leading10.1.5. CSS Resets10.1.6. Line Height — Baseline Grids10.1.6.1. Setting Headings on the Grid10.1.6.2. Aligning Other Items to the Grid10.1.7. Space Between Letters — Tracking10.1.8. White Space10.1.9. Chunking10.1.10. Contrast10.2. Navigation10.2.1. Menus10.2.1.1. Menus Should Be Concise10.2.1.2. Menus Should Have Clear Labels10.2.1.3. Menus Should Focus on What Visitors Want to Achieve10.2.1.4. Menus Do Not Need to Contain Every Link10.2.1.5. Menus Should Provide Context10.2.1.6. Menu Items Should Be Interactive10.2.1.7. Menus Should Be Consistent Across All Pages10.2.1.8. If You Use Icons, Provide a Text Equivalent, Too10.2.1.9. Coding for Menus10.2.2. Links10.2.2.1. Text Links10.2.2.2. Images as Links10.2.2.3. CSS Sprites10.2.3. Site Search Features10.2.3.1. Search Features Make Sites More Usable10.2.3.2. Adding a Google Search to Your Site10.3. Tables10.3.1. Padding10.3.2. Headings10.3.3. Shading Alternate Rows10.4. Forms10.4.1. Before Designing the Form10.4.1.1. Listing Required Information First10.4.1.2. Group Related Information10.4.1.3. Model Forms Users Are Familiar With10.4.1.4. Are Users Going to Provide the Same Information Each Time?10.4.1.5. What Else Needs to Appear on the Form?10.4.2. Designing the Form10.4.2.1. Selecting the Right Type of Form Control10.4.2.1.1. Text Boxes10.4.2.1.2. Radio Buttons and Checkboxes or Select Boxes10.4.2.1.3. Select Boxes10.4.2.2. Grouping Controls10.4.2.2.1. Using <fieldset> Elements10.4.2.2.2. Splitting a Form into Separate Pages10.4.2.2.3. Number Questions10.4.3. Layout of Forms10.4.3.1. Labeling Controls10.4.3.2. Keeping Relevant Information Next to or Above Form Controls10.4.3.3. Required Information10.4.3.4. Careful Placement of Buttons10.4.3.5. Using the title Attribute on Form Controls10.4.3.6. Tab Index10.4.3.7. Don't Rely on Color to Convey Information10.4.3.8. Using CSS with Form Elements10.4.3.9. Large Form Inputs10.4.3.10. Testing the Form10.4.3.11. Lazy Registration10.5. Summary10.6. Exercises
11. Learning JavaScript
11.1. What Is Programming About?11.2. How to Add a Script to Your Pages11.2.1. Comments in JavaScript11.2.2. The <noscript> Element11.3. The Document Object Model11.3.1. Accessing Values Using Dot Notation11.3.2. The Document Object11.3.2.1. Properties of the Document Object11.3.2.2. Methods of the Document Object11.3.3. The Forms Collection11.3.3.1. Properties of the Form Objects11.3.3.2. Methods of the Form Objects11.3.4. Form Elements11.3.4.1. Properties of Form Elements11.3.4.2. Methods of Form Elements11.3.5. Images Collection11.3.5.1. Properties of the Image Object11.3.6. Different Types of Objects11.4. Starting to Program with JavaScript11.5. Variables11.5.1. Assigning a Value to a Variable11.5.2. Lifetime of a Variable11.6. Operators11.6.1. Arithmetic Operators11.6.2. Assignment Operators11.6.3. Comparison Operators11.6.4. Logical or Boolean Operators11.6.5. String Operator (Using + with Strings)11.7. Functions11.7.1. How to Define a Function11.7.2. How To Call a Function11.7.3. The Return Statement11.8. Conditional Statements11.8.1. if Statements11.8.2. if . . . else Statements11.8.3. switch Statements11.9. Looping11.9.1. while11.9.2. do . . . while11.9.3. for11.9.4. Infinite Loops and the break Statement11.10. Events11.11. Built-in Objects11.11.1. String11.11.1.1. Properties11.11.1.2. Methods11.11.2. Date11.11.3. Math11.11.3.1. Properties11.11.3.2. Methods11.11.4. Array11.11.4.1. Methods11.11.5. Window11.11.5.1. Properties11.11.5.2. Methods11.12. Writing JavaScript11.12.1. A Word About Data Types11.12.2. Keywords11.13. Summary11.14. Exercises
12. Working with JavaScript
12.1. Practical Tips for Writing Scripts12.1.1. Has Someone Already Written This Script?12.1.2. Reusable Functions12.1.3. Using External JavaScript Files12.1.4. Place Scripts in a Scripts Folder12.2. Form Validation12.2.1. When to Validate12.2.2. What You Can Check For12.2.3. How to Check a Form12.2.4. Checking Text Fields12.2.4.1. Single Function Approach12.2.4.2. Re-Usable Functions Approach12.2.4.3. The replace() Method12.2.4.4. Regular Expressions12.2.4.5. Testing Characters Using test() and Regular Expressions12.2.5. Select Box Options12.2.6. Radio Buttons12.2.7. Checkboxes12.2.7.1. Preventing a Form Submission Until a Checkbox Has Been Selected12.3. Form Enhancements12.3.1. Focus on First Form Item12.3.2. Auto-Tabbing Between Fields12.3.3. Disabling a Text Input12.3.4. Case Conversion12.3.5. Trimming Spaces from Beginning and End of Fields12.3.6. Selecting All the Content of a Text Area12.3.7. Check and Uncheck All Checkboxes12.4. JavaScript Libraries12.4.1. Animated Effects Using Scriptaculous12.4.2. Drag-and-Drop Sortable Lists Using Scriptaculous12.4.3. Creating a Lightbox12.4.4. Creating a Modal Window12.4.5. Sortable Tables with MochiKit12.4.6. Creating Calendars with YUI12.4.7. Auto-Completing Text Inputs with YUI12.5. Summary12.6. Exercises
13. Putting Your Site on the Web
13.1. Meta Tags13.1.1. name and content Attributes13.1.1.1. Using name with a Value of description13.1.1.2. Using name with a Value of keywords13.1.1.3. Using name with a Value of robots13.1.2. http-equiv and content13.1.2.1. Expiring Pages13.1.2.2. Preventing a Browser from Caching a Page13.1.2.3. Refreshing and Redirecting Pages13.1.2.4. Specifying the Author Name13.1.2.5. Setting the Character Encoding13.1.3. The scheme Attribute13.2. Testing Your Site13.2.1. Validating HTML, XHTML, and CSS13.2.2. Link Checking13.2.3. Checking Color Depths13.2.4. Accessibility Checkers13.2.5. Checking in Different Versions of Browsers13.2.6. Pilot Testing13.2.7. Proofreading13.3. Taking the Leap to Live13.3.1. Getting a Domain Name13.3.2. Hosting13.3.3. Key Considerations for Choosing a Host13.3.4. Putting Your Site on a Server Using FTP13.3.5. The Importance of Directory Structure and Relative URLs13.4. Telling the World about Your Site13.4.1. Always Mention Your URL13.4.2. Content Is King13.4.3. Forums, Communities, and Social Networks13.4.4. Check for Trade Sites and Directories13.4.5. Reciprocal Links13.4.6. Look at Your Competition13.4.7. Make It Easy for People to Link to You13.4.8. Pay-per-click Advertising13.4.9. Display Advertising13.4.10. Create an E-mail Newsletter13.5. Understanding Your Visitors13.5.1. Ten Things to Check in Google Analytics13.5.2. Measuring Everything13.6. What Next?13.6.1. Tools13.6.1.1. Blogs13.6.1.2. Discussion Boards or Forums13.6.1.3. Adding a Search Utility13.6.1.4. Creating an E-mail Newsletter13.6.2. Introducing Other Technologies13.6.2.1. Server-Side Web Programming: ASP.NET and PHP13.6.2.1.1. Choosing a Server-Side Language13.6.2.1.2. Content Management13.6.2.2. Flash13.6.2.3. Learning Graphics Packages13.7. Summary
14. Checklists
14.1. Search Engine Optimization Checklist14.1.1. On-Page Techniques14.1.2. Identifying Keywords and Phrases14.1.2.1. Brainstorm for Words People Might Search On14.1.2.2. Select Five to Ten Major Keywords14.1.2.3. List Other Keywords and Phrases That Correspond to Your Major Keywords14.1.2.4. Look Up Related Words (Not Exact Matches)14.1.2.5. Determine the Popularity of Terms14.1.2.6. Prioritize the Core Terms14.1.2.7. Location14.1.2.8. Mapping Core Terms to Pages14.1.2.9. Homepages14.1.3. Off-Page Techniques14.2. Accessibility Checklist14.2.1. Setting Up Your Document14.2.2. Structural and Semantic Markup14.2.3. Links and Navigation14.2.4. Images and Multimedia14.2.5. Color14.2.6. Tables14.2.7. Forms14.2.8. Style Sheets14.2.9. JavaScript14.2.10. Skip Links14.3. Differences Between HTML and XHTML14.3.1. All Tag Names and Attribute Names Must Be Written in Lowercase14.3.2. All Attributes Must Have a Value Given in Double Quotation Marks14.3.3. Elements Must Nest; There Must Be No Overlapping14.3.4. Empty Elements Must Contain a Closing Slash14.3.5. Scripts Should Live in a CDATA Section14.4. HTML 514.4.1. Language Compatibility in HTML 514.4.2. Stylistic Markup Will Be Removed14.4.3. New Semantic Elements14.4.4. New Values for the <input> Element's type Attribute14.4.5. New Multimedia Elements14.4.6. New APIs
A. Answers to Exercises
A.1. Chapter 1A.1.1. Exercise 1A.1.1.1. AnswerA.1.2. Exercise 2A.1.2.1. AnswerA.2. Chapter 2A.2.1. Exercise 1A.2.1.1. AnswerA.2.2. Exercise 2A.2.2.1. AnswerA.3. Chapter 3A.3.1. Exercise 1A.3.1.1. AnswerA.3.2. Exercise 2A.3.2.1. AnswerA.3.3. Exercise 3A.3.3.1. AnswerA.4. Chapter 4A.4.1. Exercise 1A.4.1.1. AnswerA.4.2. Exercise 2A.4.2.1. AnswerA.4.3. Exercise 3A.4.3.1. AnswerA.5. Chapter 5A.5.1. Exercise 1A.5.1.1. AnswerA.5.2. Exercise 2A.5.2.1. AnswerA.6. Chapter 6A.6.1. Exercise 1A.6.1.1. AnswerA.6.2. Exercise 2A.6.2.1. AnswerA.7. Chapter 7A.7.1. Exercise 1A.7.1.1. AnswerA.7.2. Exercise 2A.7.2.1. AnswerA.7.3. Exercise 3A.7.3.1. AnswerA.7.4. Exercise 4A.7.4.1. AnswerA.7.5. Exercise 5A.7.5.1. AnswerA.8. Chapter 8A.8.1. Exercise 1A.8.1.1. AnswerA.8.2. Exercise 2A.8.2.1. AnswerA.9. Chapter 9A.9.1. Exercise 1A.9.1.1. AnswerA.9.2. Exercise 2A.9.2.1. AnswerA.10. Chapter 10A.10.1. Exercise 1A.10.1.1. AnswerA.11. Chapter 11A.11.1. Exercise 1A.11.1.1. AnswerA.11.2. Exercise 2A.11.2.1. AnswerA.12. Chapter 12A.12.1. Exercise 1A.12.1.1. Answer
B. XHTML Element Reference
B.1. Core AttributesB.1.1.B.1.1.1. Core AttributesB.1.1.2. <a>B.1.1.3. <abbr>B.1.1.4. <acronym>B.1.1.5. <address>B.1.1.6. <applet> (Deprecated)B.1.1.7. <area>B.1.1.8. <b>B.1.1.9. <base>B.1.1.10. <basefont> (Deprecated)B.1.1.11. <bdo>B.1.1.12. <big>B.1.1.13. <blockquote>B.1.1.14. <body>B.1.1.15. <br />B.1.1.16. <button>B.1.1.17. <caption>B.1.1.18. <center> (Deprecated)B.1.1.19. <cite>B.1.1.20. <code>B.1.1.21. <col>B.1.1.22. <colgroup>B.1.1.23. <dd>B.1.1.24. <del>B.1.1.25. <dfn>B.1.1.26. <dir> (Deprecated)B.1.1.27. <div>B.1.1.28. <dl>B.1.1.29. <dt>B.1.1.30. <em>B.1.1.31. <embed>B.1.1.32. <fieldset>B.1.1.33. <font> (Deprecated)B.1.1.34. <form>B.1.1.35. <frame>B.1.1.36. <noframes>B.1.1.37. <frameset>B.1.1.38. <head>B.1.1.39. <hn>B.1.1.40. <hr />B.1.1.41. <html>B.1.1.42. <i>B.1.1.43. <iframe>B.1.1.44. <img>B.1.1.45. <input type="button">B.1.1.46. <input type="checkbox">B.1.1.47. <input type="file">B.1.1.48. <input type="hidden">B.1.1.49. <input type="image">B.1.1.50. <input type="password">B.1.1.51. <input type="radio">B.1.1.52. <input type="reset">B.1.1.53. <input type="submit">B.1.1.54. <input type="text">B.1.1.55. <ins>B.1.1.56. <isindex> (Deprecated)B.1.1.57. <kbd>B.1.1.58. <label>B.1.1.59. <legend>B.1.1.60. <li>B.1.1.61. <link>B.1.1.62. <map>B.1.1.63. <menu> (Deprecated)B.1.1.64. <meta>B.1.1.65. <noframes>B.1.1.66. <noscript>B.1.1.67. <object>B.1.1.68. <ol>B.1.1.69. <optgroup>B.1.1.70. <option>B.1.1.71. <p>B.1.1.72. <param>B.1.1.73. <pre>B.1.1.74. <q>B.1.1.75. <s> (Deprecated)B.1.1.76. <samp>B.1.1.77. <script>B.1.1.78. <select>B.1.1.79. <small>B.1.1.80. <span>B.1.1.81. <strike> (Deprecated)B.1.1.82. <strong>B.1.1.83. <style>B.1.1.84. <sub>B.1.1.85. <sup>B.1.1.86. <table>B.1.1.87. <tbody>B.1.1.88. <td>B.1.1.89. <textarea>B.1.1.90. <tfoot>B.1.1.91. <thead>B.1.1.92. <th>B.1.1.93. <title>B.1.1.94. <tr>B.1.1.95. <tt>B.1.1.96. <u> (Deprecated)B.1.1.97. <ul>B.1.1.98. <var>
C. CSS Properties
C.1. Font PropertiesC.1.1. fontC.1.2. font-familyC.1.3. font-sizeC.1.4. font-size-adjustC.1.5. font-stretchC.1.6. font-styleC.1.7. font-variantC.1.8. font-weightC.2. Text PropertiesC.2.1. letter-spacingC.2.2. text-alignC.2.3. text-decorationC.2.4. text-indentC.2.5. text-shadowC.2.6. text-transformC.2.7. white-spaceC.2.8. word-spacingC.3. Color and Background PropertiesC.3.1. backgroundC.3.2. background-attachmentC.3.3. background-colorC.3.4. background-imageC.3.5. background-positionC.3.6. background-repeatC.3.7. background-positionXC.3.8. background-positionYC.4. Border propertiesC.4.1. border (border-bottom, border-left, border-top, border-right)C.4.2. border-style (border-bottom-style, border-left-style, border-top-style, border-right-style)C.4.3. border-width (border-bottom-width, border-left-width, border-top-width, border-right-width)C.4.4. border-color (border-bottom-color, border-left-color, border-top-color, border-right-color)C.5. DimensionsC.5.1. heightC.5.2. widthC.5.3. line-heightC.5.4. max-heightC.5.5. max-widthC.5.6. min-heightC.5.7. min-widthC.6. Margin PropertiesC.6.1. margin (margin-bottom, margin-left, margin-top, margin-right)C.7. Padding PropertiesC.7.1. padding (padding-bottom, padding-left, padding-right, padding-top)C.8. List PropertiesC.8.1. list-styleC.8.2. list-style-positionC.8.3. list-style-typeC.8.4. marker-offsetC.9. Positioning PropertiesC.9.1. positionC.9.2. topC.9.3. leftC.9.4. bottomC.9.5. rightC.9.6. vertical-alignC.9.7. z-indexC.9.8. clipC.9.9. overflowC.9.10. overflow-xC.9.11. overflow-yC.10. Outline PropertiesC.10.1. Outline (outline-color, outline-style, outline-width)C.11. Table PropertiesC.11.1. border-collapseC.11.2. border-spacingC.11.3. caption-sideC.11.4. empty-cellsC.11.5. table-layoutC.12. Classification PropertiesC.12.1. clearC.12.2. displayC.12.3. floatC.12.4. visibilityC.13. Internationalization PropertiesC.13.1. directionC.13.2. unicode-bidiC.14. LengthsC.14.1. Absolute LengthsC.14.2. Relative Lengths
D. Color Names and Values
D.1. Using Hex Codes to Specify ColorsD.2. Understanding Hex CodesD.3. Using Color Names to Specify ColorsD.4. Color Name and Number Reference
E. Character Encodings
F. Special Characters
F.1. Character Entity References for Symbols, Mathematical Symbols, and Greek LettersF.2. Markup-Significant and Internationalization Characters
G. Language Codes
H. MIME Media Types
H.1. textH.2. imageH.3. multipartH.4. audioH.5. videoH.6. messageH.7. modelH.8. application
I. Deprecated and Browser-Specific Markup
I.1. Why Deprecated Markup ExistsI.2. Older Pages Break Many RulesI.3. FontsI.3.1. The <font> ElementI.3.2. The text AttributeI.3.3. The <basefont> ElementI.3.4. The <s> and <strike> ElementsI.3.5. The <u> ElementI.3.6. The <listing>, <plaintext>, and <xmp> ElementsI.4. BackgroundsI.4.1. The bgcolor AttributeI.4.2. The background AttributeI.5. FormattingI.5.1. The <center> ElementI.5.2. The align AttributeI.5.3. The width AttributeI.5.4. The height AttributeI.5.5. The vspace AttributeI.5.6. The hspace AttributeI.5.7. The clear Attribute (on <br /> element)I.6. LinksI.7. ListsI.7.1. The start AttributeI.7.2. The value AttributeI.7.3. The type AttributeI.7.4. The <dir> and <menu> ElementsI.8. TablesI.8.1. The nowrap AttributeI.9. Miscellaneous AttributesI.9.1. The border AttributeI.9.2. The compact AttributeI.9.3. The language AttributeI.9.4. The version AttributeI.9.5. The <applet> ElementI.9.6. The <embed> ElementI.9.7. The <isindex> ElementI.9.8. The <nobr> ElementI.10. IE-Specific ElementsI.10.1. IE-Specific AttributesI.10.2. IE-Specific CSS Styles

Content preview from Beginning HTML, XHTML, CSS, and JavaScript®

Credits

Executive Editor

Carol Long

Project Editor

William Bridges

Technical Editor

Chris Ullman

Production Editor

Daniel Scribner

Copy Editor

Nancy Rapoport

Editorial Director

Robyn B. Siesky

Editorial Manager

Mary Beth Wakefield

Marketing Manager

David Mayhew

Production Manager

Tim Tate

Vice President and Executive Group Publisher

Richard Swadley

Vice President and Executive Publisher

Barry Pruett

Associate Publisher

Jim Minatel

Project Coordinator, Cover

Lynsey Stanford

Proofreader

Nancy Hanger

Indexer

Robert Swanson

Cover Designer

Michael E. Trent

Cover Image

Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.

Read now

Unlock full access

More than 5,000 organizations count on O’Reilly

O’Reilly covers everything we've got, with content to help us build a world-class technology community, upgrade the capabilities and competencies of our teams, and improve overall team performance as well as their engagement.

Julian F.

Head of Cybersecurity

I wanted to learn C and C++, but it didn't click for me until I picked up an O'Reilly book. When I went on the O’Reilly platform, I was astonished to find all the books there, plus live events and sandboxes so you could play around with the technology.

Addison B.

Field Engineer

I’ve been on the O’Reilly platform for more than eight years. I use a couple of learning platforms, but I'm on O'Reilly more than anybody else. When you're there, you start learning. I'm never disappointed.

Amir M.

Data Platform Tech Lead

I'm always learning. So when I got on to O'Reilly, I was like a kid in a candy store. There are playlists. There are answers. There's on-demand training. It's worth its weight in gold, in terms of what it allows me to do.

Mark W.

Embedded Software Engineer

The Definitive Guide to HTML5

Adam Freeman

HTML5 and JavaScript Projects: Build on your Basic Knowledge of HTML5 and JavaScript to Create Substantial HTML5 Applications

Jeanine Meyer

Teach Yourself Visually™ HTML5

Mike Wooldridge

The Joy of JavaScript

Luis Atencio

Publisher Resources

ISBN: 9780470540701Purchase book

Cloud Computing

Data Engineering

Data Science

AI & ML

Programming Languages

Software Architecture

IT/Ops

Security

Design

Business

Soft Skills

Beginning HTML, XHTML, CSS, and JavaScript®

by Jon Duckett

Credits

Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.