| |
| |
| Introduction | |
| |
| |
| About This Book | |
| |
| |
| How to Use This Book | |
| |
| |
| Three Presumptuous Assumptions | |
| |
| |
| How This Book Is Organized | |
| |
| |
| Icons Used in This Book | |
| |
| |
| Where to Go from Here | |
| |
| |
| Getting To Know (X)HTML | |
| |
| |
| The Least You Need to Know about HTML and the Web | |
| |
| |
| Web Pages in Their Natural Habitat | |
| |
| |
| Hypertext | |
| |
| |
| Markup | |
| |
| |
| Browsers | |
| |
| |
| Web servers | |
| |
| |
| Anatomy of a URL | |
| |
| |
| (X)HTML's Component Parts | |
| |
| |
| HTML and XHTML: What's the difference? | |
| |
| |
| Syntax and rules | |
| |
| |
| Elements | |
| |
| |
| Attributes | |
| |
| |
| Entities | |
| |
| |
| Parts Is Parts: What Web Pages Are Made Of | |
| |
| |
| Organizing HTML text | |
| |
| |
| Images in HTML documents | |
| |
| |
| Links and navigation tools | |
| |
| |
| Creating and Viewing a Web Page | |
| |
| |
| Before You Get Started | |
| |
| |
| Creating a Page from Scratch | |
| |
| |
| Planning a simple design | |
| |
| |
| Writing some HTML | |
| |
| |
| Saving your page | |
| |
| |
| Viewing your page | |
| |
| |
| Editing an Existing Web Page | |
| |
| |
| Posting Your Page Online | |
| |
| |
| Proper Planning Prevents Poor Page Performance | |
| |
| |
| Planning Your Site | |
| |
| |
| Mapping your site | |
| |
| |
| Building solid navigation | |
| |
| |
| Planning outside links | |
| |
| |
| Hosting Your Web Site | |
| |
| |
| Hosting your own Web site | |
| |
| |
| Using a hosting provider | |
| |
| |
| Getting your own domain | |
| |
| |
| Moving files to your Web server | |
| |
| |
| Formatting Web Pages with (X)HTML | |
| |
| |
| Creating (X)HTML Document Structure | |
| |
| |
| Establishing a Document Structure | |
| |
| |
| Labeling Your (X)HTML Document | |
| |
| |
| Adding an HTML DOCTYPE declaration | |
| |
| |
| Adding an XHTML DOCTYPE declaration | |
| |
| |
| The [left angle bracket]html[right angle bracket] element | |
| |
| |
| Adding the XHTML namespace | |
| |
| |
| Adding a Document Header | |
| |
| |
| Giving your page a title | |
| |
| |
| Defining metadata | |
| |
| |
| Automatically redirecting users to another page | |
| |
| |
| Creating the (X)HTML Document Body | |
| |
| |
| Marvelous Miscellany | |
| |
| |
| Text and Lists | |
| |
| |
| Formatting Text | |
| |
| |
| Paragraphs | |
| |
| |
| Headings | |
| |
| |
| Controlling Text Blocks | |
| |
| |
| Block quotes | |
| |
| |
| Preformatted text | |
| |
| |
| Line breaks | |
| |
| |
| Horizontal rules | |
| |
| |
| Organizing Information | |
| |
| |
| Numbered lists | |
| |
| |
| Bulleted lists | |
| |
| |
| Definition lists | |
| |
| |
| Nesting lists | |
| |
| |
| Text Controls and Annotation | |
| |
| |
| Marvelous Miscellany | |
| |
| |
| Linking to Online Resources | |
| |
| |
| Basic Links | |
| |
| |
| Link options | |
| |
| |
| Common mistakes | |
| |
| |
| Customizing Links | |
| |
| |
| New windows | |
| |
| |
| Locations in Web pages | |
| |
| |
| Non-HTML resources | |
| |
| |
| Marvelous Miscellany | |
| |
| |
| Finding and Using Images | |
| |
| |
| The Role of Images in a Web Page | |
| |
| |
| Creating Web-Friendly Images | |
| |
| |
| Adding an Image to a Web Page | |
| |
| |
| Location of the image | |
| |
| |
| Using the [left angle bracket]img /[right angle bracket] element | |
| |
| |
| Adding alternative text | |
| |
| |
| Specifying image size | |
| |
| |
| Setting the image border | |
| |
| |
| Controlling image alignment | |
| |
| |
| Setting image spacing | |
| |
| |
| Images That Link | |
| |
| |
| Triggering links | |
| |
| |
| Building image maps | |
| |
| |
| Marvelous Miscellany | |
| |
| |
| Taking Precise Control Over Web Pages | |
| |
| |
| Introducing Cascading Style Sheets | |
| |
| |
| Advantages of Style Sheets | |
| |
| |
| What CSS can do for a Web page | |
| |
| |
| What you can do with CSS | |
| |
| |
| CSS Structure and Syntax | |
| |
| |
| Selectors and declarations | |
| |
| |
| Working with style classes | |
| |
| |
| Inheriting styles | |
| |
| |
| Using Different Kinds of Style Sheets | |
| |
| |
| Internal style sheets | |
| |
| |
| External style sheets | |
| |
| |
| Understanding the Cascade | |
| |
| |
| Using Cascading Style Sheets | |
| |
| |
| Managing Layout, Positioning, and Appearance | |
| |
| |
| Developing specific styles | |
| |
| |
| Externalizing style sheets | |
| |
| |
| Multimedia | |
| |
| |
| Visual media styles | |
| |
| |
| Paged media styles | |
| |
| |
| Marvelous Miscellany | |
| |
| |
| Getting Creative with Colors and Fonts | |
| |
| |
| Color Values | |
| |
| |
| Color names | |
| |
| |
| Color numbers | |
| |
| |
| Color Definitions | |
| |
| |
| Text | |
| |
| |
| Links | |
| |
| |
| Backgrounds | |
| |
| |
| Fonts | |
| |
| |
| Font family | |
| |
| |
| Sizing | |
| |
| |
| Positioning | |
| |
| |
| Text treatments | |
| |
| |
| The catchall font property | |
| |
| |
| Using Tables for Stunning Pages | |
| |
| |
| What Tables Can Do for You | |
| |
| |
| Table Basics | |
| |
| |
| Sketching Your Table | |
| |
| |
| Developing layout ideas | |
| |
| |
| Drafting the table | |
| |
| |
| Constructing Basic Tables | |
| |
| |
| Components | |
| |
| |
| Layout | |
| |
| |
| Adding borders | |
| |
| |
| Adjusting height and width | |
| |
| |
| Padding and spacing | |
| |
| |
| Shifting alignment | |
| |
| |
| Adding Spans | |
| |
| |
| Column spans | |
| |
| |
| Row spans | |
| |
| |
| Populating Table Cells | |
| |
| |
| Testing Your Table | |
| |
| |
| Table-Making Tips | |
| |
| |
| Following the standards | |
| |
| |
| Sanitizing markup | |
| |
| |
| Nesting tables within tables | |
| |
| |
| Avoiding dense tables | |
| |
| |
| Adding color to table cells | |
| |
| |
| Marvelous Miscellany | |
| |
| |
| Integrating Scripts with HTML | |
| |
| |
| Scripting Web Pages | |
| |
| |
| What JavaScript Can Do for Your Pages | |
| |
| |
| Arrange content dynamically | |
| |
| |
| Work with browser windows | |
| |
| |
| Solicit and verify user input | |
| |
| |
| But wait ... there's more! | |
| |
| |
| The Nuts and Bolts of JavaScript | |
| |
| |
| Including Scripts in Web Pages | |
| |
| |
| Using the Same Script on Multiple Pages | |
| |
| |
| Exploring the JavaScript Language | |
| |
| |
| Basic syntax rules | |
| |
| |
| Variables and data types | |
| |
| |
| Operating on expressions | |
| |
| |
| Working with statements | |
| |
| |
| Loops | |
| |
| |
| Functions | |
| |
| |
| Arrays | |
| |
| |
| Objects | |
| |
| |
| Events and Event Handling | |
| |
| |
| Document Object Model (DOM) | |
| |
| |
| Marvelous Miscellany | |
| |
| |
| References and Resources | |
| |
| |
| Working with Forms | |
| |
| |
| Uses for Forms | |
| |
| |
| Searches | |
| |
| |
| Data collection | |
| |
| |
| Creating Forms | |
| |
| |
| Structure | |
| |
| |
| Input tags | |
| |
| |
| Validation | |
| |
| |
| Processing Data | |
| |
| |
| Using CGI scripts and other programs | |
| |
| |
| Sending data by e-mail | |
| |
| |
| Designing User-Friendly Forms | |
| |
| |
| Marvelous Miscellany | |
| |
| |
| Fun with Client-Side Scripts | |
| |
| |
| Adding Rollovers to Your Pages | |
| |
| |
| Image rollovers with JavaScript | |
| |
| |
| Text rollovers with CSS | |
| |
| |
| Displaying Dynamic Content on Your Page | |
| |
| |
| HTML and JavaScript | |
| |
| |
| JavaScript and DOM | |
| |
| |
| Displaying Pop-up Windows | |
| |
| |
| Working with Cookies | |
| |
| |
| Marvelous Miscellany | |
| |
| |
| HTML Projects | |
| |
| |
| The About Me Page | |
| |
| |
| Overview and Design Considerations | |
| |
| |
| Audience analysis | |
| |
| |
| Component elements | |
| |
| |
| Page Markup | |
| |
| |
| Your home page | |
| |
| |
| Looking good | |
| |
| |
| The eBay Auction Page | |
| |
| |
| Designing Your Auction Page | |
| |
| |
| Presentation Issues to Consider | |
| |
| |
| Using a Template for Presenting Your Auction Item | |
| |
| |
| A Company Site | |
| |
| |
| Issues to Consider When Designing Your Site | |
| |
| |
| Basic Elements of a Company's Web Site | |
| |
| |
| The home page | |
| |
| |
| The products page | |
| |
| |
| The contact page | |
| |
| |
| The style sheet | |
| |
| |
| A Product Catalog | |
| |
| |
| Dissecting a Product Catalog | |
| |
| |
| Choosing a Shopping Cart | |
| |
| |
| PayPal | |
| |
| |
| Other e-commerce solutions | |
| |
| |
| Incorporating a PayPal shopping cart | |
| |
| |
| Page Markup | |
| |
| |
| The Part of Tens | |
| |
| |
| Ten Cool HTML Tools | |
| |
| |
| HTML Editors | |
| |
| |
| Helper editors | |
| |
| |
| WYSIWYG editors | |
| |
| |
| Graphics Tools | |
| |
| |
| Photoshop Elements: The amateur champ | |
| |
| |
| Professional contenders | |
| |
| |
| Link Checkers | |
| |
| |
| Web Link Validator: The champ | |
| |
| |
| Contenders | |
| |
| |
| HTML Validators | |
| |
| |
| W3C validator | |
| |
| |
| Built-in validators | |
| |
| |
| FTP Clients | |
| |
| |
| Swiss Army Knives | |
| |
| |
| Ten HTML Do's and Don'ts | |
| |
| |
| Concentrate on Content | |
| |
| |
| Never lose sight of your content | |
| |
| |
| Structure your documents and your site | |
| |
| |
| Go Easy on the Graphics, Bells, Whistles, and Hungry Dinosaurs | |
| |
| |
| Make the most from the least | |
| |
| |
| Build attractive pages | |
| |
| |
| Create Well-Formulated HTML and Test | |
| |
| |
| Keep track of those tags | |
| |
| |
| Avoid browser dependencies | |
| |
| |
| Navigating your wild and woolly Web | |
| |
| |
| Keep It Interesting After It's Built! | |
| |
| |
| Think evolution, not revolution | |
| |
| |
| Beating the two-dimensional text trap | |
| |
| |
| Overcome inertia through vigilance | |
| |
| |
| Ten Ways to Exterminate Web Bugs | |
| |
| |
| Avoid Dead Ends and Spelling Faux Pas | |
| |
| |
| Make a list and check it - twice | |
| |
| |
| Master text mechanics | |
| |
| |
| Keep Your Perishables Fresh! | |
| |
| |
| Lack of live links - a loathsome legacy | |
| |
| |
| When old links must linger | |
| |
| |
| Make your content mirror your world | |
| |
| |
| Check Your Site, and Then Check It Again! | |
| |
| |
| Look for trouble in all the right places | |
| |
| |
| Cover all the bases with peer reviews | |
| |
| |
| Use the best tools of the testing trade | |
| |
| |
| Schedule site reviews | |
| |
| |
| Let User Feedback Feed Your Site | |
| |
| |
| Foster feedback | |
| |
| |
| If you give to them, they'll give to you! | |
| |
| |
| Appendixes | |
| |
| |
| Deprecated (X)HTML Elements and Attributes | |
| |
| |
| Shorthand and Aural CSS Properties | |
| |
| |
| Glossary | |
| |
| |
| Index | |