23,99 €
Mehr erfahren.
- Herausgeber: John Wiley & Sons
- Kategorie: Wissenschaft und neue Technologien
- Sprache: Englisch
The indispensable introductory reference guide to HTML, XHTML and CSS
Even though new technologies enable people to do much more with the Web, in the end HTML, XHTML and CSS are still at the root of any Web site. The newest edition of this bestselling guide is fully updated and revised for the latest technology changes to the field, including HTML5 and CSS3. Illustrated in full color, this book provides beginner and advanced coders the tools they need to be proficient at these programming languages.
- Shows you how to create a Web page and formulate XHTML document structure
- Addresses working with content management systems (WordPress, Drupal, and Joomla), and designing for mobile devices (iPhone, BlackBerry, and Android)
- Introduces HTML5 and CSS3, tools critical to mobile Web development
- Reviews working with text, lists, and images, and customizing links
- Demonstrates ways to employ cascading style sheets (CSS) and get creative with colors and fonts
- Details integrating scripts with XHTML and understanding deprecated HTML markup tags
Written by two veteran computer whizzes, HTML, XHTML and CSS For Dummies will help you get the design results you want!
Sie lesen das E-Book in den Legimi-Apps auf:
Seitenzahl: 487
Veröffentlichungsjahr: 2010
Ähnliche
HTML, XHTML & CSS For Dummies®, 7th Edition
Visit www.dummies.com/cheatsheet/htmlto view this book's cheat sheet.
Table of Contents
Introduction
About This Book
How to Use This Book
Three Presumptuous Assumptions
How This Book Is Organized
Part I: Getting to Know (X)HTML and CSS
Part II: Formatting Web Pages with (X)HTML
Part III: Taking Precise Control over Web Pages and Styles
Part IV: Scripting and (X)HTML
Part V: The Future of (X)HTML
Part VI: The Part of Tens
Icons Used in This Book
Where to Go from Here
Part I: Getting to Know (X)HTML and CSS
Chapter 1: The Least You Need to Know about HTML, CSS, and the Web
Web Pages in Their Natural Habitat
Hypertext
Browsers
Web servers
Anatomy of a URL
(X)HTML’s Component Parts
HTML and XHTML: What’s the difference?
Syntax and rules
Markup color-coding
Elements
Attributes
Entities
Parts Is Parts: What Web Pages Are Made Of
Organizing HTML text
Images in HTML Documents
Links and navigation tools
Listing 1-1: Meet an Author!
Chapter 2: Creating and Viewing a Web Page
Before You Get Started
Creating a Page from Scratch
Step 1: Planning a simple design
Step 2: Writing some HTML
Step 3: Saving your page
Step 4: Viewing your page
Editing an Existing Web Page
Posting Your Page Online
Chapter 3: Proper Planning Prevents Poor Page Performance
Planning Your Site
Design matters
Mapping your site
Building solid navigation
Planning outside links
Hosting Your Web Site
Hosting your own Web site
Using a hosting provider
Obtaining your own domain
Moving files to your Web server
Part II: Formatting Web Pages with (X)HTML
Chapter 4: 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 <html> element
Adding the XHTML namespace
Adding a Document Header
Giving your page a title
Defining metadata
Redirecting users to another page
Creating the (X)HTML Document Body
Chapter 5: Text and Lists
Formatting Text
Paragraphs
Headings
Controlling Text Blocks
Block quotes
Preformatted text
Horizontal rules
Organizing Information
Numbered lists
Bulleted lists
Definition lists
Nesting lists
Chapter 6: Linking to Online Resources
Basic Links
Link options
Common mistakes
Customizing Links
New windows
Locations in Web pages
Non-HTML resources
Chapter 7: Finding and Using Images
The Role of Images in a Web Page
Creating Web-Friendly Images
Adding an Image to a Web Page
Image location
Using the <img /> element
Adding alternative and title text
Specifying image size
Image borders and alignment
Images That Link
Triggering links
Building image maps
Part III: Taking Precise Control over Web Pages and Styles
Chapter 8: Deprecated (X)HTML Markup
And Now, A Word from Our Sponsor
Deprecated Elements
Deprecated Attributes
How to Handle Deprecated Markup
Chapter 9: Introducing Cascading Style Sheets
Advantages of Style Sheets
What CSS can do for a Web page
What you can do with CSS
Property measurement values
CSS Structure and Syntax
Selectors and declarations
Working with style classes
Working with style IDs
Inheriting styles
Using Different Kinds of Style Sheets
Internal style sheets
External style sheets
Understanding the Cascade
Chapter 10: Using Cascading Style Sheets
Managing Layout and Positioning
Visual layouts
Positioning
Changing Fonts for Visual Interest and Better Readability
Body text
Headings
Hyperlinks
Externalizing Style Sheets
Using CSS with Multimedia
Visual media styles
Paged media styles
Chapter 11: Getting Creative with Colors and Fonts
Color Values
Color names
Color numbers
Color Definitions
Text
Links
Backgrounds
Fonts
Font family
Sizing
Positioning Blocks of Text
Aligning text
Indenting text
Text Treatments
Embolden with bold
Emphasizing with italic
Changing capitalization
Getting fancy with the text-decoration property
The Catchall Font Property
Part IV: Scripting and (X)HTML
Chapter 12: Top 20 CSS Properties
Background Properties
background-color
background-image
Border and Outline Properties
border
Dimension
height and width
Fonts and Font Properties
font-family
font-weight
font-size
Spacing Properties: Margin and Padding
margin
padding
Positioning
float
z-index
clear
cursor
Text
color
line-height
Pseudo Classes
:hover, :link, and :visited
Best CSS Resources
W3Schools.com
Firebug
Eric Meyer’s Reset
Spoon Browser Sandbox
W3C CSS Validation Service
Web-Developer’s Handbook
YSlow
Chapter 13: Scripting Web Pages
Finding Out What JavaScript Can Do for Your Pages
Using JavaScript to Arrange Content Dynamically
Working with Browser Windows
Soliciting and Verifying User Input
But Wait . . . There’s More!
Chapter 14: Working with Forms
Uses for Forms
Search forms
Data collection forms
Creating Forms
Structure
Input tags
Input fields
Form validation
Processing Data
Processing forms on your pages
Sending form data by e-mail
Designing User-Friendly Forms
Other Noteworthy Forms-Related Markup
Form Frameworks
CAPTCHA This!
Chapter 15: Bring the Best of the Webto Your Web Site
What’s Up with Content Embedding?
Using a Twitter widget
Working with Flickr
Creating a map
Other embeddings to check out
Mashups: Two or More Sites
Creating a Yelp/Google Maps mashup
Crafting a Twitter/Google Maps mashup
Chapter 16: Fun with Client-Side Scripts
Adding Rollovers to Your Pages
Text rollovers with CSS
Image rollovers with CSS
Custom button rollovers with CSS
Working with Cookies
Working with jQuery and FancyBox Lightbox
Chapter 17: Content Management Systems
Comparing CMS Sites to HTML Sites
Popular CMS Sites and Programs
WordPress
Drupal
Joomla!
Customizing CSS on a CMS
WordPress and CSS
Drupal and CSS
Joomla and CSS
Pssst! Hey Buddy! Wanna See Some CMS?
Part V: The Future of (X)HTML
Chapter 18: Mobile Web Design
Understanding Different Mobile Devices
Optimizing Mobile Web Site Design
Designing for small screens
Optimizing for low bandwidth
Navigating on mobile devices
Designing for distracted surfers
Surfing the Web on many mobile devices
Best Practices for Mobile Web Sites
Set up mobile Web addresses
Create a virtual demo or showcase
Location, location, location
Don’t make users type or click too much
Mobile Frameworks
Sencha Touch
jQTouch
Additional Resources
Chapter 19: Party On with HTML5
HTML5 Highlights: Why It’s Important
HTML5 and Flash
Simplified and Enhanced HTML5 Markup
Simplified doctype
Simplified character encoding
What’s New and Improved in HTML5
Elements new in HTML5
Attributes new in HTML5
Deprecated elements gone from HTML5
Absent and removed HTML5 attributes
New Input Types in HTML5
HTML5 Web APIs
Limits to HTML5 Access and Use
Additional HTML5 Resources
Introducing HTML5
Chapter 20: CSS3
About the CSS3 “Standard”
CSS3 Highlights Hint at Riches Available
Fonts
Borders
Backgrounds
Shadows
CSS3 Transitions and Animations
Transitions
Animations
Transform Your Content
CSS3 Limitations
Finding More on CSS3
Part VI: The Part of Tens
Chapter 21: Ten HTML Do’s and Don’ts
Don’t Lose Sight of Your Content
Do Structure Your Documents and Your Site
Do Make the Most from the Least
Do Build Attractive Pages
Don’t Lose Track of Those Tags
Do Avoid Browser Dependencies
Don’t Make It Hard to Navigate Your Wild and Woolly Web
Don’t Think Revolution, Think Evolution
Don’t Get Stuck in the Two-Dimensional-Text Trap
Don’t Let Inertia Overcome You
Chapter 22: Ten Ways to Exterminate Web Bugs
Make a List and Check It — Twice
Master Text Mechanics
Lack of Live Links — A Loathsome Legacy
When Old Links Must Linger
Make Your Content Mirror Your World
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
Foster User Feedback
If You Give to Them, They’ll Give to You!
Chapter 23: Ten Cool HTML Tools and Technologies
WYSIWYG HTML Editors
Dreamweaver
Other WYSIWYG editors
Helper HTML Editors
Aptana Studio
Other helper editors
Inexpensive Graphics Editors
Professional Graphics Editors
Adobe Photoshop
Adobe Fireworks
W3C Link Checker
Other Link Checkers
HTML Validators
FTP Clients
Miscellaneous Helpful Web Tools
Appendix A: Twitter Supporters
Cheat Sheet
HTML, XHTML & CSS For Dummies®, 7th Edition
by Ed Tittel and Jeff Noble
Foreword by Eric A. Meyer
HTML, XHTML & CSS For Dummies®, 7th Edition
Published byWiley Publishing, Inc.111 River St.Hoboken, NJ 07030-5774www.wiley.com
Copyright © 2011 by Wiley Publishing, Inc., Indianapolis, Indiana
Published simultaneously in Canada
No part of this publication may be reproduced, stored in a retrieval system or transmitted in any form or by any means, electronic, mechanical, photocopying, recording, scanning or otherwise, except as permitted under Sections 107 or 108 of the 1976 United States Copyright Act, without either the prior written permission of the Publisher, or authorization through payment of the appropriate per-copy fee to the Copyright Clearance Center, 222 Rosewood Drive, Danvers, MA 01923, (978) 750-8400, fax (978) 646-8600. Requests to the Publisher for permission should be addressed to the Permissions Department, John Wiley & Sons, Inc., 111 River Street, Hoboken, NJ 07030, (201) 748-6011, fax (201) 748-6008, or online at http://www.wiley.com/go/permissions.
Trademarks: Wiley, the Wiley Publishing logo, For Dummies, the Dummies Man logo, A Reference for the Rest of Us!, The Dummies Way, Dummies Daily, The Fun and Easy Way, Dummies.com, Making Everything Easier, and related trade dress are trademarks or registered trademarks of John Wiley & Sons, Inc. and/or its affiliates in the United States and other countries, and may not be used without written permission. All other trademarks are the property of their respective owners. Wiley Publishing, Inc., is not associated with any product or vendor mentioned in this book.
Limit of Liability/Disclaimer of Warranty: The publisher and the author make no representations or warranties with respect to the accuracy or completeness of the contents of this work and specifically disclaim all warranties, including without limitation warranties of fitness for a particular purpose. No warranty may be created or extended by sales or promotional materials. The advice and strategies contained herein may not be suitable for every situation. This work is sold with the understanding that the publisher is not engaged in rendering legal, accounting, or other professional services. If professional assistance is required, the services of a competent professional person should be sought. Neither the publisher nor the author shall be liable for damages arising herefrom. The fact that an organization or Website is referred to in this work as a citation and/or a potential source of further information does not mean that the author or the publisher endorses the information the organization or Website may provide or recommendations it may make. Further, readers should be aware that Internet Websites listed in this work may have changed or disappeared between when this work was written and when it is read. FULFILLMENT OF EACH COUPON OFFER IS THE SOLE RESPONSIBILITY OF THE OFFEROR.
For general information on our other products and services, please contact our Customer Care Department within the U.S. at 877-762-2974, outside the U.S. at 317-572-3993, or fax 317-572-4002.
For technical support, please visit www.wiley.com/techsupport.
Wiley also publishes its books in a variety of electronic formats. Some content that appears in print may not be available in electronic books.
Library of Congress Control Number: 2010941511
ISBN: 978-0-470-91659-9
Manufactured in the United States of America
10 9 8 7 6 5 4 3 2 1
About the Authors
Ed Tittel is a freelance writer, consultant, and occasional expert legal witness on Web technologies who works at home near beautiful Austin, Texas. Ed has written for the trade press since 1986 and has worked on more than 140 books. Ed has worked on many other titles for Wiley, too, including Windows Server 2008 For Dummies, XML For Dummies, and Networking with NetWare For Dummies. Lately, he’s worked on various For Dummies custom titles, including booklets on clustered computing, mobile backhaul, XBRL Markup, and carrier Ethernet.
Ed blogs, provides expert Q&A, and writes for several TechTarget.com Web sites, such as SearchNetworking.com and SearchWindows.com. He also writes for ITExpertVoice, Tom’s Hardware, Tom’s Guide, and more. When he’s not busy working, Ed likes to travel, shoot pool, and spend time with his family. He also loves to spend time in the kitchen cooking like mad, or sous-cheffin’ for his cuisine-crazy wife, Dina. Contact Ed by e-mail at [email protected].
Jeff Noble somehow manages to juggle being a principal user designer at a global software company, CA Technologies, associate editor of UItrends.com (a blog about the good, the bad, and the ugly of user interface design), and owner of Conquest Media (www.conquestmedia.com), a small Web and application design company in Austin, Texas. Jeff has more than twelve years of design experience and specializes in all aspects of Web sites and enterprise software applications (designing, building, optimizing, explaining, and so on). In addition to this title, he’s handled technical editing on six other For Dummies Web design and programming titles for Wiley. In what little spare time he has away from the computer, Jeff enjoys childish activities like eating unhealthy amounts of candy and breaking things, as well as relaxing hobbies like hiking, traveling, and gardening. Jeff is available for Web site and enterprise application consulting. You can contact him by e-mail at [email protected].
Authors’ Acknowledgments
Wow! It’s hard to believe we’ve hit the “lucky 13th edition” for HTML For Dummies. Of all the books I’ve worked on, this one’s covered more time and versions than the rest. So thanks again readers, for keeping this book going strong. We’d also like to thank our readers and the Wiley editors for providing welcome feedback to drive continuing improvement of this book. Don’t stop now — keep telling us what you want. Especially, tell us what you liked and didn’t like about this second full-color edition.
Let me also thank some people from previous editions, including J. Michael Stewart, Natanya Anderson, Dori Smith, Tom Negrino, Mary Burmeister, Brock Kyle, Chelsea Valentine, Dawn Davidson, and Kim Lindros. And, for the second time, I’m indebted to my co-author and friend, Jeff Noble, for infusing insight and enthusiasm. I am grateful for your ideas, your hard work, and your experience in reaching budding Web experts. Thanks, too, to Mary Kyle Inks, who expertly project-managed this effort.
At Wiley, I must thank Bob Woerner and Jean Nelson for their outstanding efforts, and Brian Walls, Teresa Artman, and Christopher McGee for their efforts on design, layout, content, and coverage. A special shout-out to the friendly folks in Composition Services for artful page layouts, and for keeping all the color-coded elements straight.
Thanks to my lovely wife, Dina Kutueva-Tittel, and inquisitive son, Gregory, for putting up with my sometimes whacky and intense schedule. I’m not always as easy to live with as I could be, but hopefully, I’ll improve with time and effort. Also, thanks to my Dad, Al Tittel, for all he’s done for my family and me, and for dropping in more frequently. I hope you’re around to see our 14th edition come to print! Finally, profound thanks and remembrances to Cecilia Katherine Kociolek Tittel (4/3/1919–9/11/2009). Thanks, Mom, for encouraging my love of words and writing: I still miss you every day.
Ed Tittel
I’d like to thank my girlfriend, Dr. Alison Marr, for generally putting up with me and giving me time and space to work on titles like this. I’d like note that according to my calculations, Alison is approximately 15 times smarter than I am but somehow still allows me to pretend that I’m right all the time. I know she has tried to explain magic graphs at least a dozen times to me but I still don’t get it — evidently it’s not about warlocks and magical fairies. Special thanks to Ida F. Orengo, M.D. and the rest of the staff from the Baylor College of Medicine in Houston, Texas. Without all of you, there is a decent chance I wouldn’t even be alive now.
Thanks to Ed Tittel for allowing me to sit in again and handle even more responsibility with this latest edition. This title has been one of the biggest accomplishments in my life and has opened up incredible opportunities to me and I thank you sincerely. To Slade Deliberto, it seems like only yesterday you taught me how to design my first Web site. Technology and software changes over time, but a lot of what I’ve accomplished so far professionally goes all the way back to your initial design and Photoshop lessons more than twelve years ago.
Big thanks to my boss and mentor Russell Wilson, you’ve always supported and believed in me and without a doubt have made me a better designer and a better person. I don’t say it as much as I should, I owe you big time and I appreciate everything you have done for me — there, you have it in writing.
To CSS master Eric Meyer, thanks for agreeing to write the Foreword to this book. I’ve learned a lot from your volume of work over the years and having my name noted on a book with yours is a huge honor. I’d also like to dedicate this book in memory of my friend Zach Beatty who was tragically killed by a drunk driver in 1997. Please don’t drink and drive, you might kill someone a lot cooler than you.
Jeff Noble
Publisher’s Acknowledgments
We’re proud of this book; please send us your comments through our online registration form located at www.dummies.com/register/.
Some of the people who helped bring this book to market include the following:
Acquisitions, Editorial, and Media Development
Project Editor: Jean Nelson
Executive Editor: Bob Woerner
Copy Editor: Brian Walls
Technical Editor: Christopher McGee
Editorial Manager: Kevin Kirschner
Media Development Project Manager: Laura Moss-Hollister
Media Development Assistant Project Manager: Jenny Swisher
Media Development Associate Producers: Josh Frank, Marilyn Hummel, Douglas Kuhn, and Shawn Patrick
Editorial Assistant: Amanda Graham
Sr. Editorial Assistant: Cherie Case
Cartoons: Rich Tennant (www.the5thwave.com)
Composition Services
Project Coordinator: Kristie Rees
Layout and Graphics: Samantha K. Cherolis, Joyce Haughey, Lavonne Roberts
Proofreader: Laura Bowman, Lindsay Littrell
Indexer: BIM Indexing & Proofreading Services
Special Help: Teresa Artman
Publishing and Editorial for Technology Dummies
Richard Swadley, Vice President and Executive Group Publisher
Andy Cummings, Vice President and Publisher
Mary Bednarek, Executive Acquisitions Director
Mary C. Corder, Editorial Director
Publishing for Consumer Dummies
Diane Graves Steele, Vice President and Publisher
Composition Services
Debbie Stailey, Director of Composition Services
Foreword
What you hold in your hands is the first step into a larger world.
How so? It’s an introduction to the fundamental underpinnings of the Web. With the knowledge gained from this book, you can start building your own Web pages — and what’s more, look at Web pages that already exist and understand how they were assembled. It’s like having a second sight, a magic crystal ball, or X-ray vision. What’s more, it’s all a lot easier than you think.
That may sound crazy, but it really isn’t. The entire list of HTML elements can be written on a piece of paper, and the 80% of elements you need to work with on a daily basis are easy to understand. You can pick them up in well under an hour. CSS is a bit more complicated than that — writing all its properties on one piece of paper might require legal-disclaimer-sized type — but the basics are very straightforward and the rest of it comes with experience.
Why, you may wonder, do you need to learn all this stuff when there are programs like Dreamweaver that will do it for you? For the same reason a sculptor needs to know how to chisel rock or an auto mechanic needs to understand how engines and transmissions work. When something goes wrong, you need to have the skills to get in there and fix it. And eventually, with practice, you’ll get to the point where you can build pages from scratch much more efficiently and elegantly than any point-and-click tool can manage.
And that’s why, even if you’re not usually comfortable with code listings and other monospaced-font text, you should relax. (Come on, deep breath. Hold it — and release. Good.) Think of the things you learn about in this book as Lego pieces. Each piece on its own is very simple, but you can put them together in all kinds of interesting and sometimes astonishing ways. That’s the fun of it!
Every epic journey starts with a single step. Your first steps await in the pages that follow. Savor them. You’ll never look at the Web in the same way again.
Eric A. Meyer
Introduction
Welcome to the wild, wacky, and wonderfulpossibilities of the World Wide Web, or more simply, the Web. In this book, we reveal the ins and outs of the markup languages that are the Web’s lifeblood — the Hypertext Markup Language (HTML) and its cousin, XHTML, along with the Cascading Style Sheet (CSS) language used to make other stuff look good. Because HTML and XHTML (we use (X)HTML in this book to refer to both) and CSS are used to build Web pages, learning to use them brings you into the fold of Web authors and content developers.
If you’ve tried to build your own Web pages but found it too forbidding, now you can relax. If you can dial a telephone or find your keys in the morning, you too can become an (X)HTML author. No kidding!
This book keeps the technobabble to a minimum and sticks with plain English whenever possible. Besides plain talk about hypertext, (X)HTML, and the Web, we include lots of examples, plus tag-by-tag instructions to help you build Web pages with minimum of fuss. We also provide examples about what to do with your Web pages after they’re created so you can publish them. We explain the differences between HTML4, HTML5, and XHTML as well, so you can decide whether you want to stick with the best-known and longest-lived Web markup language (HTML) or its later and greater successor (XHTML).
This book has a companion Web site that contains (X)HTML and CSS examples from its chapters in usable form — plus pointers to cool widgets you can use to embellish your own documents and amaze your friends. Visit www.dummieshtml.com and start browsing from there.
About This Book
Think of this book as a friendly, approachable guide to taking up (X)HTML and CSS and building readable, attractive Web pages. These things aren’t hard to learn, but they pack lots of details that you must handle as you build your own Web pages. Topics in this book include:
Designing and building Web pages
Uploading and publishing Web pages for the world to see
Testing and debugging your Web pages
Introducing HTML5 and Cascading Style Sheets 3
You can build Web pages without years of arduous training, advanced aesthetic talents, or ritual ablutions in ice-cold streams. If you can tell someone how to drive to your house, you can build a useful Web document. The purpose of this book isn’t to turn you into a rocket scientist (or, for that matter, rocket science into (X)HTML). The purpose is to show you the design and technical elements needed for a good-looking, readable Web page and to give you the confidence to build one!
How to Use This Book
This book tells you how to use (X)HTML and CSS to get your Web pages up and running on the World Wide Web. We tell you what’s involved in designing and building effective Web documents that can bring your ideas and information to the online world — if that’s what you want to do — and maybe have some high-tech fun communicating them.
To make this book easier to read, we use some conventions with the text. For example, all (X)HTML and CSS code appears in monospaced type like this:
<head><title>What’s in a Title?</title></head>...
When you type (X)HTML code, CSS, or other related stuff, be sure to copy the information exactly as you see it, including the angle brackets (< and >), because that’s part of the magic that makes (X)HTML and CSS work. Other-wise, you learn how to marshal and manage the content that makes your pages special, and we tell you exactly what to do to mix elements of (X)HTML and CSS with your own work.
The margins on a book page don’t have the same room as the vast reaches of cyberspace. Therefore, long lines of (X)HTML and CSS markup, or designations for Web sites (called URLs, for Uniform Resource Locators), may wrap across two or more lines. Remember, your computer shows such lines as a single line of (X)HTML or CSS, or as a single URL — so if you type that hunk of code, do it on one line. Don’t insert any hard returns if you see the line wrap. We clue you in that the markup is supposed to be all one line by breaking the line at a punctuation character and by indenting the overage, like this:
http://www.infocadabra.transylvania.com/nexus/plexus/lexus/praxis/okay/this/
is/a/make-believe/URL/but/some/real/ones/are/SERIOUSLY/long-too.html
HTML4 doesn’t care if you type tag text in uppercase, lowercase, or both (except for character entities, also known as character codes). HTML5, XHTML, and CSS, however, want tag text in lowercase only. Thus, to make your work look like ours as much as possible, enter all (X)HTML and CSS tag text, and all other code, in lowercase only.
If you have an older edition of this book, this reverses earlier instructions. The keepers of the eternal and ever-awesome HTML standard, the World Wide Web Consortium (W3C), have changed the rules, so we follow their lead. We don’t make the rules, but we do know how to play the game!
Our code listings are color-coded where specific colors signify different types of markup. We explain this in Chapter 1 in the section about color-coding markup. (Notice all the illustrations use pretty colors, too!)
Three Presumptuous Assumptions
They say that making assumptions makes a fool out of the person who makes them and the person who is subject to those assumptions. (And just who are they, anyway? We assume we know, but . . . never mind.)
You don’t need to be a wizard in the arcane arts of programming, nor do you need a PhD in computer science. You don’t even need a detailed sense of what’s going on in the innards of your computer to deal with the material in this book.
Even so, practicality demands us to make a few assumptions about you, gentle reader: You can turn your computer on and off; you do know how to use a mouse and a keyboard; and you want to build your own Web pages for fun, profit, or some esoteric reason entirely of your own. We also assume you have a working Internet connection and a Web browser.
If you can write a sentence and know the difference between a heading and a paragraph, you can build and publish your own documents on the Web. The rest consists of details — and we help you with those!
How This Book Is Organized
This book contains six major parts, arranged like Russian Matrioshki (nesting dolls). Parts contain at least three chapters, and each chapter contains several modular sections. This way, you can use this book to jump around, find topics or keywords in the index or table of contents, or read the whole book from cover to cover.
Part I: Getting to Know (X)HTML and CSS
This part sets the stage for, overviews, and introduces the Web and the software that people use to mine its treasures. It also explains how the Web works, including the (X)HTML and CSS that this book covers, and the server-side software and services that deliver these goods to end users (when we aren’t preoccupied with the innards of our systems).
(X)HTML documents, also called Web pages, are the fundamental units of information, organization, and delivery on the Web. Here, you also discover what HTML is about, how hypertext can enrich ordinary text, and what CSS does to modify and manage how that text looks on display. Next you take a walk on the Web side and build your very first (X)HTML document.
Part II: Formatting Web Pages with (X)HTML
HTML mixes ordinary text with special characters called markup, used to instruct browsers how to display (X)HTML documents. In this part, you find out about markup in general and (X)HTML in particular. We start with a fascinating discussion of (X)HTML document organization and structure. (Well . . . we think it’s fascinating, and we hope you do, too.) Next we explain how text can be organized into blocks and lists. Then we tackle how the hyperlinks that put the H into (X)HTML work. After that, we discuss how you can find and use graphical images in your Web pages and make some fancy formatting maneuvers to spruce up those pages.
Throughout this part, we include discussion of (X)HTML markup elements (tags) and how they work. By the time you finish Part II, expect to have a good overall idea of what HTML is and how to use it. Heck, we even include a chapter at the end of Part II that steers you clear of obsolete or no-longer-recommended markup so you’ll know it when you see it (and avoid using that stale dross yourself).
Part III: Taking Precise Control over Web Pages and Styles
Part III starts with a discussion of Cascading Style Sheets (CSS) — another form of markup language that lets (X)HTML deal purely with content while it deals with how Web pages look when they’re displayed in a Web browser or as rendered on other devices (PDAs, mobile phones, and special assistive devices for visually impaired users). After exploring CSS syntax and structures and discovering how to use them, you find out how to manipulate color and typefaces for text, backgrounds, and more on your Web pages. We give you lots of examples to help you design and build commercial-grade (X)HTML documents. You can get started working with related (X)HTML tag syntax and structures that you need to know so you can build complex Web pages.
Part IV: Scripting and (X)HTML
(X)HTML isn’t good at snazzing up text and graphics when they’re on display (that’s where CSS excels). And (X)HTML really can’t do much by itself. Web designers often build interactive, dynamic Web pages using scripting tools to add interactivity to an (X)HTML framework.
In this part, you find out about scripting languages that enable Web pages to interact with users and that also provide ways to respond to user input or actions and to grab and massage data along the way. You’re introduced to general scripting languages, and we jump directly into the most popular such language — JavaScript. You discover the basic elements of this scripting language and how to add interactivity to Web pages. You also explore typical uses for scripting that you can extend and add to your own Web site. We go on to explore how you can embed content from third parties into your Web pages, leverage other people’s dynamic content, spruce up your site with very little effort, and get lots of nice returns from services like Flickr, Twitter, YouTube, and Google Maps.
Throughout this part, examples, advice, and details show you how scripting and embedded components can enhance your Web site’s capabilities — and your users’ experiences when visiting your pages.
Part V: The Future of (X)HTML
Big things are happening in the (X)HTML world, with lots of changes on the way. In this part, we lay the new stuff on you, show you how it looks and what it can do (when browsers cooperate, that is), and tell you what to soon expect.
You find a chapter on (X)HTML for mobile devices, such as smartphones, iPads, and other portable electronic doo-dads with Web access. You also find a chapter on a new and improved version of HTML — namely, HTML5 — coming soon to a browser near you and maybe to your Web site. Plus, there’s another chapter on an upcoming version of CSS — namely, CSS3. We provide cool examples, all of which you can view on our companion Web site at www.dummieshtml.com (or not, as your Web browser permits).
Part VI: The Part of Tens
In this part, we sum up and distill the very essence of the mystic secrets of (X)HTML. Here you can read further about cool Web tools, review top do’s and don’ts for HTML markup, and review how to catch and kill potential bugs and errors in your pages before anybody else sees them.
Icons Used in This Book
This icon signals technical details that are informative and interesting but aren’t absolutely critical to writing HTML.
This icon flags useful information that makes HTML markup or other important stuff even less complicated than you feared it might be.
This icon calls out stuff you shouldn’t pass by — don’t overlook these gentle reminders (the life, sanity, or page you save could be your own).
Watch out when you see this icon. It warns you of things you shouldn’t do; consequences can be severe if you ignore accompanying bits of wisdom.
Information highlighted with this icon gives best practices — advice we wish we’d had when we first started out! These techniques can save you time and money on migraine medication.
Where to Go from Here
This is where you pick a direction and hit the road! Where you start out doesn’t matter. Don’t worry. You can handle it. We know you’re getting ready to have the time of your life. Enjoy!
Please note that some special symbols used in this eBook may not display properly on all eReader devices. If you have trouble determining any symbol, please call Wiley Product Technical Support at 800-762-2974. Outside of the United States, please call 317-572-3993. You can also contact Wiley Product Technical Support at www.wiley.com/techsupport.
Part I
Getting to Know (X)HTML and CSS
In this part . . .
Here, we explore and explain basic HTML document links and structures. We also explain the role that Web browsers play in delivering all this stuff to people’s desktops. We even explain where the (X) comes from — namely, a reworking of the original description of HTML markup using XML syntax to create (X)HTML — and go on to help you understand what makes (X)HTML different (and possibly better, according to some) than plain old HTML. We also look at general Web page anatomy, the various pieces and parts that make a Web page, and how CSS helps manage their presentation, placement, and even color when they appear on somebody’s display.
Next, we take you through the exercise of creating and viewing a simple Web page so you can understand what’s involved. We also explain making changes to an existing Web page and how to post your changes (or a new page) online.
This part concludes with a rousing exhortation to figure out what you’re doing before making too much markup happen. A well built house starts with a set of blueprints and architectural drawings, and a Web page (and site) should start with a plan or a map, too, with some idea of where your pages will reside in cyberspace and how hordes of users can find their way to them.
Chapter 1
The Least You Need to Know about HTML, CSS, and the Web
In This Chapter
Creating HTML in text files
Serving and browsing Web pages
Understanding links and URLs
Understanding basic HTML syntax
Understanding basic CSS
Welcome to the wonderful world of the Web, (X)HTML, and CSS. With just a little knowledge, some practice, and something to say, you can build your own little piece of cyberspace or improve on existing work.
You’ll notice we use (X)HTML throughout this book. This is an acronym we made up to stand for “either HTML or XHTML,” where HTML is Hypertext Markup Language, and XHTML is Extensible Hypertext Markup Language. Although HTML and XHTML aren’t exactly identical, they’re enough like each other for this reference to make sense.
This book is your down-and-dirty guide to understanding Web documents, sprucing up an existing page, or creating complex and exciting pages that integrate intricate designs, multimedia, and scripting.
The best way to start working with HTML is to jump right in, so that’s what this chapter does: It brings you up to speed on the basics of how (X)HTML and CSS work behind the scenes inside Web pages, introducing you to their underlying building blocks. When you’re done with this chapter, you’ll know how (X)HTML and CSS work so you can start creating or editing Web pages right away.
Web Pages in Their Natural Habitat
Web pages can accommodate many kinds of content, such as text, graphics, forms, audio and video files, and even interactive games.
Browse the Web for only a moment, and you see a buffet of information and content displayed in many ways. Every Web site is different, but most have one thing in common: the Hypertext Markup Language (also known as HTML). You’ll also run into Extensible Hypertext Markup Language (XHTML) and Cascading Style Sheets (CSS) pretty regularly, too.
Whatever information a Web page contains, every Web page is created using HTML (or some reasonable facsimile). HTML is the mortar that holds Web pages together; graphics, content, and other information are the bricks; CSS tells Web pages how they should look when on display.
HTML files that produce Web pages are just text documents, as are XHTML and CSS files. This use of text documents is why the Web works as well as it does. Text is a universal language for computers. Any text file you create on a Windows computer — including any HTML, XHTML, or CSS file — works equally well on a Mac or any other operating system.
But Web pages aren’t merely text documents. Web pages are made with special, attention-deprived, sugar-loaded text called HTML, XHTML, or CSS. Each uses its own specific set of instructions that you include (along with your content) inside text files to specify how a page should look and behave.
Stick with us to discover everything you need to know about (X)HTML and CSS!
Hypertext
Special instructions in HTML permit lines of text to point (that is, link) to something else in cyberspace. Such pointers are called hyperlinks. Hyperlinks are the glue that holds the World Wide Web together. In your Web browser, hyperlinks usually appear in blue and are underlined. When you click a hyperlink, it takes you somewhere else.
Hypertext or not, a Web page is a text file, which means you can create and edit a Web page in any application that creates plain text (such as Notepad or TextEdit). Some software tools offer fancy options and applications (covered in Chapter 23) to help you create Web pages, but they generate the same text files that you create with plain-text editors. We’re of the opinion, though, that those just getting started with HTML are best served by a simple text editor. Just break out Notepad on the PC (or TextEdit on the Mac), and you’re ready to go.
Steer clear of word processors like WordPad or Microsoft Word when creating HTML. They introduce all kinds of extra code to Web pages that you may neither want nor need.
The World Wide Web comes by its name honestly. It’s quite literally a web of online pages hosted on Web servers around the world, connected in trillions of ways by hyperlinks that tie pages together. Without such links, the Web would be just a bunch of standalone pages.
Much of the Web’s value comes from its ability to link to pages and other resources (such as images, downloadable files, and media presentations) on either the same Web site or at another site. For example, USA.gov (www.usa.gov) is a gateway Web site — its sole function is to provide access to other Web sites. If you aren’t sure which government agency handles first-time loans for homebuyers, or you want to arrange a tour of the Capitol, visit the site shown in Figure 1-1 to find out.
Figure 1-1:USA.gov uses hyperlinks to help visitors find government information.
Web browsers were created specifically for the purpose of reading HTML instructions (known as markup)and displaying the resulting Web page. Markup lives in a text file (with your content) to give orders to a browser. For example, look at the page shown in Figure 1-2. You can see how the page is made up and how it is formatted by examining its underlying HTML.
Figure 1-2: To achieve its present good looks, this Web page incorporates multiple parts and numerous bits of HTML and CSS markup.
This page includes an image, a heading that describes the page, several paragraphs of text about one of your authors, and an address block with links to a résumé and a list of publications.
However, different components of the page use different formatting:
The heading at the top of the page is larger than text in the paragraphs.
Blocks of text are separated by more blank space than between contiguous lines of text within blocks.
Some text is in white, some orange, and some light blue.
The browser knows to display these components of the page in specific ways thanks to the HTML markup, shown in Listing 1-1. (You’ll see Listing 1-1 in all its glory at the end of the chapter.)
Any text enclosed between angle brackets (less-than and greater-than signs: <>) is an HTML tag (often called the markup). For example, a p within brackets (<p>…</p> tags) identifies text inside paragraphs. The markup between <style> and </style> tags at the head of the file uses CSS to define the look and feel for various HTML elements used on this page. That’s really all there is to it. You embed the markup in a text file, along with text for readers to view, to tell the browser how to display your Web page.
Tags and the content between (and within) the tags are collectively called elements. Angle brackets <> enclose HTML and XHTML markup, curly braces {} enclose CSS markup.
Browsers
The user’s piece in the Web puzzle is a Web browser. Web browsers read instructions written in HTML, XHTML, and CSS, and use those instructions to display Web page content on your screen.
You should always write your HTML with the idea that people will view the content using a Web browser. Just remember that there’s more than one kind of browser out there, and each one comes in several versions.
Usually, Web browsers request and display Web pages available via the Internet from a Web server. You can also display HTML pages you’ve saved on your own computer before making them available on a Web server on the Internet. When you’re developing your own HTML pages, you view these pages (called local pages) in your browser. You can use local pages to get a good idea of what people see after the page goes live on the Internet.
Each Web browser interprets HTML in its own way. The same HTML may not look exactly alike from one browser to the next. When you work with basic HTML, variations will be minor, but as you add other elements (such as scripting and multimedia), rendering markup gets hairy.
Chapter 2 shows how to use a Web browser to view a local copy of your first Web page.
Some people use text-only Web browsers, such as Lynx, because either
They’re visually impaired and can’t use a graphical display.
They like a lean, fast Web browser that displays only text.
A bevy of browsers
The Web world is full of browsers of many shapes and sizes — or rather versions and feature sets. Some popular browsers are Microsoft Internet Explorer, Mozilla Firefox, Apple Safari, and Google Chrome. Other browsers, such as Opera and Lynx, are also widely used. As an HTML developer, you must think beyond your own browser experience and preferences. Every user has his or her personal browser preferences and settings.
Each browser renders HTML a bit differently. Every browser handles JavaScript, multimedia, style sheets, and other HTML add-ins differently too. Throw different operating systems into the mix, and things get really fun.
Usually differences between browsers are minor. But sometimes a combination of HTML, text, and media brings a specific browser to its knees. When you work with HTML, test your pages on as many different browsers as you can. Install at least three different browsers on your own system for testing. We recommend the latest versions of Internet Explorer, Firefox, and Chrome.
Yahoo! has a fairly complete list of browsers at
http://dir.yahoo.com/Computers_and_Internet/Software/Internet/World_Wide_Web/Browsers
Web servers
Your HTML pages aren’t much good if you can’t share them with the world. Web servers make that possible. A Web server is a computer that
Connects to the Internet
Runs Web-server software
Responds to requests from Web browsers for Web pages
Almost any computer can be a Web server, including your home computer. But Web servers generally are computers dedicated to the task. You don’t need to be an Internet or computer guru to publish your Web pages, but you must find a Web server to serve your pages:
If you’re building pages for a company Web site, your IT department may have a Web server. (Ask your IT guru for the information.)
If you’re starting a new site, you need a host for your Web pages.
Finding an inexpensive host is easy — all it takes is a simple Google search. One inexpensive host is GoDaddy (www.godaddy.com), with current monthly fees as low as $1.99 a month. You can even find free hosts for your Web site with a little effort. Free Web Hosts maintains a list of free host providers. Check them out at www.free-webhosts.com. Chapter 3 shows how to determine your hosting needs and find the perfect provider.
Anatomy of a URL
The Web is made up of billions of resources, each of them linkable. A resource’s exact location is the key to linking to it. Without an exact address (a Uniform Resource Locator, or URL), you can’t use the Address bar in a Web browser to visit a Web page directly.
URLs are the standard addressing system for Web resources. Each resource (Web page, site, or individual file) has a unique URL. URLs work a lot like your postal address. Figure 1-3 identifies the components of a URL.
Figure 1-3: The components of a URL help it define an exact location for a file on the Web.
Introducing Internet protocols
Interactions between browsers and servers are made possible by a set of computer-communication instructions: Hypertext Transfer Protocol (HTTP). This protocol defines how browsers should request Web pages and how Web servers should respond to those requests.
HTTP isn’t the only protocol at work on the Internet. The Simple Mail Transfer Protocol (SMTP) and Post Office Protocol (POP) make e-mail exchange possible, and the File Transfer Protocol (FTP) allows you to upload, download, move, copy, and delete files and folders across the Internet. The good news is that Web browsers and servers do all the HTTP work for you, so you only have to put your pages on a server or type a Web address into a browser.
To see how HTTP works, check out David Gourley and Brian Totty’s chapter on HTTP Messages, available through Google book search with “understanding http transactions” as the search string. Start your search at http://books.google.com, then scroll down until you see the link to “HTTP: the definitive guide” and check out Page 80.
Each URL component helps define the location of a Web page or resource:
Protocol: Specifies the protocol the browser follows to request the file.
The Web page protocol is http:// (the usual start to most URLs).
Domain: Points to the general Web site (such as www.sun.com) where the file resides. A domain may host a few files (like a personal Web site) or millions of files (like a large corporate site, such as www.sun.com).
Path: Names the sequence of folders through which you must navigate to get to a specific file.
For example, to get to a file in the evangcentral folder that resides in the developers folder, you use the /developers/evangcentral/ path.
Filename: Specifies which file in a directory path the browser accesses.
Although the URL shown in Figure 1-3 is not publicly accessible, it points to the domain and offers a path that leads to a specific file named file.html:
http://www.domain.com/mainfolder/subfolder/file.html
Chapter 6 provides the complete details on how you use HTML and URLs to add hyperlinks to your Web pages, and Chapter 3 shows how to obtain a URL for your own Web site after you’re ready to move it to a Web server.
(X)HTML’s Component Parts
The following section removes the mystery from the X. This section shows
The differences between HTML and XHTML
How HTML is written (its syntax)
Rules that govern use of HTML (and XHTML)
Names for important pieces and parts of HTML (and XHTML) markup
How to make the best, most correct use of (X)HTML capabilities
HTML and XHTML: What’s the difference?
HTML is Hypertext Markup Language, markup developed in the late 1980s and early 1990s to describe Web pages. HTML is now enshrined in numerous standard descriptions (specifications) from the World Wide Web Consortium (W3C). The last HTML specification was done in 1999.
When you put an X in front of HTML to get XHTML, you get a new, improved version of HTML based on the eXtensible Markup Language (XML). XML is designed to work and behave well with computers, software, and the Internet.
The original formulation of HTML has some irregularities that can cause heartburn for software that reads HTML documents. XHTML, on the other hand, uses an extremely regular and predictable syntax that’s easier for software to handle. XHTML will replace HTML someday, but HTML keeps on ticking. This book covers both varieties and shows you the steps to put the X in front of your own HTML documents and turn them into XHTML.
Most HTML and XHTML markup is identical.
In a few cases, HTML and XHTML markup looks a little different.
In a few cases, HTML and XHTML markup must be used differently.
This book shows how to create code that works in both HTML and XHTML.
Syntax and rules
HTML is a straightforward language for describing Web page contents. XHTML is even less demanding. Their components are easy to use — when you know how to use a little bit of (X)HTML. Both HTML and XHTML markup have three types of components:
Elements: Identify different parts of an HTML page by using tags.
Attributes: Information about an instance of an element.
Entities: Non-ASCII text characters, such as copyright symbols (©) and accented letters (É). Entities originate from the Standard Generic Markup Language, or SGML.
Every bit of HTML and/or XHTML markup that describes a Web page’s content includes some combination of elements, attributes, and entities.
This chapter covers basic form and syntax for elements, attributes, and entities. Parts II and III of the book show how elements and attributes:
Describe kinds of text (such as paragraphs or tables)
Create an effect on the page (such as changing a font style)
Add images and links to a page
Markup color-coding
As we present HTML, XHTML, and CSS information in our code samples, we use color-coding to help you distinguish what’s what by way of markup. Here is a color key that you should keep in mind as you read all of our code listings:
Purple Indicates the DOCTYPE declaration used in (X)HTML documents. This is actually a totally different markup language known as the Standard Generalized Markup Language, or SGML. SGML is used to identify what specific set of rules that (X)HTML documents follow in their construction and content. It also applies to codes for character entities, such as the following:
&pos;
&123;
Light green Indicates ordinary garden variety XHTML and HTML markup
Dark green Indicates XML markup
Orange Indicates Cascading Style Sheet, or CSS, markup
Blue Indicates JavaScript
We only colorize markup in code listings and code blocks because it affects readability too much when code appears in body copy. In that case, we simply use a different, monospaced font — as you’ll see in the discussions of the <html>, <head>, and <title> elements in our first paragraph that discusses HTML markup here.
One more thing: If you use an HTML editor, such as HTML Kit, Dreamweaver, Kompozer, or whatever, you find these tools also use text color to help you identify different kinds of markup. The thing is that none of these tools do this the same way, and none of them match the way we do it here — we picked out colors that would be easy to see (and distinguish) when viewed on a four-color printed page; whereas others picked their colors to look good on LCD displays.
Elements
Elements are the building blocks of (X)HTML. You use them to describe every piece of text on your page. Elements are made up of tags and the content within those tags. There are two main types of elements:
Elements with content made up of a tag pair and whatever content sits between the opening and closing tags in the pair
Elements that insert something into the page, using a single tag
Tag pairs
Elements that describe content use a tag pair to mark the beginning and the end of the element. Start and end tag pairs look like this:
<tag>...</tag>
Content — such as paragraphs, headings, tables, and lists — always uses a tag pair:
The start tag (<tag>) tells the browser, “The element begins here.”
The end tag (</tag>) tells the browser, “The element ends here.”
Actual content is what occurs between a start tag and an end tag. For example, the Ed Tittel page in Listing 1-1 uses a paragraph element (<p>) to surround text for a paragraph (we omit CSS inline markup for clarity):
<p>Ed started writing about computing subjects in 1986 for a
Macintosh oriented monthly magazine. By 1989 he had contributed to such
publications as LAN Times, Network World, Mac World, and LAN Magazine. He worked
on his first book in 1991, and by 1994 had contributed to over a dozen different
titles.</p>
Single tags
Elements that insert something into the page are called empty elements (because they enclose no content) and use just a single tag, like this:
<tag />
Images and line breaks insert something into the HTML file, so they use one tag.
One key difference between XHTML and HTML is that, in XHTML, all empty elements must end with a slash before the closing greater-than symbol. This is because XHTML is based on XML, and the XML rule is that you close empty elements with a slash, like this:
<tag/>
However, to make this kind of markup readable inside older browsers, you should insert a space before the closing slash, like this:
<tag />
This space allows older browsers to ignore the closing slash (because they don’t know about XHTML). Newer browsers that understand XHTML ignore the space and interpret the tag exactly, which is <tag/> (as per the XML rules).
HTML doesn’t require a slash with empty elements, but this markup is deprecated (that is, identified as obsolete even though it still occurs in some markup). An HTML empty element looks like this:
<tag />
Listing 1-1 uses the image element (<img/>) to include an image on the page:
<img src=“images/header.gif” alt=“header graphic” width=“794” height=“160” />
The <img/> element references an image. When the browser displays the page, it replaces the <img/> element with the file that it points to (an attribute does the pointing, as shown in the next section). Following the XHTML rule introduced earlier, what appears in HTML as <img> appears in XHTML as <img/> (and this applies to all single tag elements).
You can’t make up HTML or XHTML elements. Legal elements for (X)HTML belong to a very specific set — if you use elements that aren’t part of that set, every browser ignores them. The elements you can use are defined in the HTML 4.01 or XHTML 1.0 specifications. (The specs for HTML 4.01 can be found at www.w3.org/TR/html4, while the specs for XHTML 1.0 can be found at www.w3.org/TR/xhtml1.)
Nesting
Many page structures combine nested elements. Think of your nested elements as suitcases that fit neatly inside one another.
For example, a bulleted list uses two kinds of elements:
The <ul> element specifies that the list is unordered (bulleted).
The <li> elements mark each item in the list.
When you combine elements by using this method, be sure you close the inside element completely before you close the outside element:
<ul>
<li>Item 1</li>
<li>Item 2</li>
</ul>
Attributes
Attributes allow variety in how an element describes content or works. Attributes let you use elements differently depending on circumstances. For example, the <img/> element uses the src attribute to specify the location of the image you want to include on your page:
<img src=“images/header.gif” alt=“header graphic” width=“794” height=“160” />
In this bit of HTML, the <img/> element itself is a general flag to the browser that you want to include an image; the src attribute provides the specifics on the image you want to include — header.gif in this instance. Other attributes (such as width and height) provide information about how to display that image, while the alt attribute provides a text alternative to the image that a text-only browser can display (or a text-to-speech reader can read aloud, for the visually impaired).
Chapter 7 describes the <img/> element and its attributes in detail.
You include attributes within the start tag of the element you want them with — after the element name but before the ending sign, like this:
<tag attribute=“value” attribute=“value”>
XML syntax rules decree that attribute values must always appear in quotation marks, but you can include the attributes and their values in any order within the start tagor within a single tag.
Every (X)HTML element has a collection of attributes that can be used with it, but you can’t mix and match attributes and elements however you please. Some attributes can take any text as a value because the value could be anything, like the location of an image or a page you want to link to. Others have a specific list of values the attribute can take, such as your options for aligning text in a table cell.
The HTML 4.01 and XHTML 1.0 specifications define exactly which attributes you can use with any given element and which values (if explicitly defined) each attribute can take.
Each chapter in Parts II and III covers which attributes you can use with each (X)HTML element. Also, see our online content for complete lists of deprecated (X)HTML tags and attributes.
Entities
Text makes the Web possible, but it has limitations. Entities are special characters that you can display on your Web page.
Non-ASCII characters
Basic American Standard Code for Information Interchange (ASCII) text defines a fairly small number of characters. It doesn’t include some special characters, such as trademark symbols, fractions, and accented characters.
For example, if we translate a paragraph of text from the page in Figure 1-2 into German, the result includes three u characters with umlauts (ü), as shown in Figure 1-4.
Figure 1-4: ASCII text can’t represent all text characters, so HTML entities do the job instead.
