Introduction
Anyone can create or edit web pages. Crafting such pages doesn’t require an especially high IQ or an advanced degree. Creating or editing web pages simply requires a desire to learn and enough gumption to see the process through to its natural end — a page visible on 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) used to capture text, graphics, and other content, and the Cascading Style Sheets (CSS) language used to make web pages look good wherever they appear. Because HTML and CSS are basic building blocks for creating web pages, knowing how to use them adds you to the fold of web authors and content developers.
If you’ve tried to build your own web pages but found it too daunting, it’s okay to relax now. If you can dial a telephone or find your keys in the morning, you too can create web pages. No kidding!
This book keeps the technobabble to a minimum and sticks with plain English whenever possible. Besides plain talk about hypertext, HTML, and the web, we include lots of examples, plus tag-by-tag instructions to help you build web pages with minimal fuss and bother. We also provide examples about what to do with your web pages after you’ve built them, so you can publish them online. We explain the differences between various flavors of HTML (HTML4, HTML5, and even something called XHTML) so you can pick the style that works best for you. Spoiler alert: We think you should choose HTML5, but that choice is entirely up to you.
This book has its own companion website with HTML and CSS examples from all of its chapters in usable form. In addition to the book content, we share web-only content and live pointers to all of the widgets, websites, and other cool stuff to which we refer, so you can use the techniques we show you to embellish your own web pages and amaze your friends. Please visit www.dummieshtml.com/html5cafe and start browsing from there. (Appendix B in this book covers all of that material in more detail.)
About this Book
Think of this book as a friendly, approachable guide to taking up HTML and CSS and building readable, attractive web pages. These things aren’t hard to pick up, but they pack lots of details. Topics covered in this book include the following:
Understanding web page structure and organization
Uploading and publishing web pages for the whole world to see
Checking and validating your web pages
Diving deep into markup with HTML5 and CSS3
You too can build web pages without years of arduous training, advanced aesthetic abilities, or ritual ablutions in ice-cold streams. If you can tell a friend how to prepare your favorite mac-’n’-cheese, 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, to turn rocket science into HTML). Its purpose is to show you the structural and technical elements needed for good-looking, readable web pages and to give you the confidence to build some!
This book explains how to use HTML and CSS to get your pages up and running on the World Wide Web. We tell you what’s involved in structuring 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 even have some high-tech fun communicating them to others.
To make this book easier to read, keep in mind the following things about working with the markup:
As a convention for this book, all HTML and CSS markup appears in monospaced type like this:
<head><title>What's in a Title?</title></head>
When you type HTML markup, CSS, or other related stuff, copy the information exactly as you see it, including the angle brackets (< and >) because they're part of the magic that makes HTML and CSS work.
The margins on a book page don’t have the same room as do the vast reaches of cyberspace. Therefore, long lines of HTML and CSS markup, or designations for web sites (called URLs, or Uniform Resource Locators), may break across multiple lines. Remember, your computer sees such lines as a single line of HTML or CSS, or as a single URL — so if you type all of that text, be sure to put it all on one line. Don’t insert any hard returns (or press the Enter key) if you see the line wrap. We show you that everything is supposed to be all on one line by breaking at a punctuation character or space and then indenting any overage, like so:
HTML4 doesn’t care whether you type tag text in uppercase, lowercase, or both (except for character entities, also known as character codes). HTML5 and CSS, however, want tag text in lowercase only. Thus, to make your work look as much like ours as possible, enter all HTML and CSS tag text, and all other markup, in lowercase only.
Our code listings may be color-coded, where specific colors signify different kinds of markup. We explain this in Chapter 2 in the section about color-coding. (Note: All illustrations use pretty colors, too!)
One more thing: Readers may notice that we refer to the web, websites, and so forth in this book, even though we also call it the World Wide Web. We’ve decided to follow common usage, which no longer treats “web” as a proper name. Finally, the wheels of progress have turned long enough to wear off the top of the initial capital “W” in web!
Foolish Assumptions
Some say that making assumptions makes a fool out of both the person who makes them and the person who falls subject to them. (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 require 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 that we make a few assumptions about you, our gentle reader: You can turn your computer on and off, you know how to use a mouse and a keyboard, and you want to build your own web pages for fun, profit, or some 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.
Icons Used in This Book
Here’s a list of the icons we use in this book to flag text and information that’s especially noteworthy.
This icon signals technical details that are informative or interesting but aren’t absolutely essential for writing or understanding HTML and CSS.
This icon flags useful information that makes HTML markup or other important stuff even less complicated than you feared it might be.
This icon points to stuff you shouldn’t skip — don’t overlook these reminders. (The sanity or web page you save could be your own.)
Watch out when you see this icon. It warns you against things you shouldn’t attempt. Consequences can be severe if you ignore these admonitions.
This icon points you to resources available online. Most notably, we steer you to www.dummieshtml.com/html5cafe when we discuss example files you can find there.
Beyond the Book
This section describes where readers can find the book's companion content. Some of it is available at www.dummies.com, and some of it — including all the markup examples in the book — is available at www.dummieshtml.com/html5cafe:
Cheat Sheet: Visit www.dummies.com/cheatsheet/beginninghtml5css3 to see a quick compendium of HTML and CSS markup, plus some handy-dandy color charts.
Extras: We've posted articles that extend the content covered in the book, with one extra short article for Parts II through IV of this book. Parts II and III deal with HTML, and Parts III and IV with CSS. The URL for this material is www.dummies.com/extras/beginninghtml5css3.
Updates: Each For Dummies technical book explains where readers can find updates in case the book changes substantially. This is where any updates or corrections that we make to the book's content and coverage will appear, along with any errata we find and fix. The URL for this stuff is also www.dummies.com/extras/beginninghtml5css3.
For example, our book is chock-full of HTML5 and CSS 3 markup, and the specifications for both HTML5 and CSS3 are still in development, so changes are bound to occur in the months and years ahead.
Companion files: Our book site offers per-chapter downloads with the source HTML and/or CSS files for each chapter, and a one-shot-gets-everything download for the whole book, all at www.dummieshtml/html5cafe. See Appendix B for details about the Dummies HTML website.
Where to Go from Here
This is where you hit the road. Where you start doesn’t matter. Don’t worry — you can handle it. We know you’re ready to have the time of your life. Enjoy!