Datasheet

Manuals Brands For Dummies Manuals Software 978-0-470-91659-9

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

elcome 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.

06_9780470916599-ch01.indd 906_9780470916599-ch01.indd 9 11/30/10 12:23 AM11/30/10 12:23 AM

COPYRIGHTED MATERIAL

Summary of content (22 pages)

PAGE 1

Chapter 1 RI AL The Least You Need to Know about HTML, CSS, and the Web TE In This Chapter ▶ Creating HTML in text files MA ▶ Serving and browsing Web pages ▶ Understanding links and URLs ▶ Understanding basic HTML syntax TE D ▶ Understanding basic CSS W GH elcome 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.
PAGE 2

10 Part I: Getting to Know (X)HTML and CSS 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).
PAGE 3

Chapter 1: The Least You Need to Know about HTML, CSS, and the Web 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.
PAGE 4

12 Part I: Getting to Know (X)HTML and CSS 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.
PAGE 5

Chapter 1: The Least You Need to Know about HTML, CSS, and the Web 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 (
…
tags) identifies text inside paragraphs.
PAGE 6

14 Part I: Getting to Know (X)HTML and CSS 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.
PAGE 7

Chapter 1: The Least You Need to Know about HTML, CSS, and the Web 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.
PAGE 8

16 Part I: Getting to Know (X)HTML and CSS 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).
PAGE 9

Chapter 1: The Least You Need to Know about HTML, CSS, and the Web 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.
PAGE 10

18 Part I: Getting to Know (X)HTML and CSS 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.
PAGE 11

Chapter 1: The Least You Need to Know about HTML, CSS, and the Web 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: ... Content — such as paragraphs, headings, tables, and lists — always uses a tag pair: ✓ The start tag () tells the browser, “The element begins here.” ✓ The end tag () tells the browser, “The element ends here.
PAGE 12

20 Part I: Getting to Know (X)HTML and CSS 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 (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).
PAGE 13

Chapter 1: The Least You Need to Know about HTML, CSS, and the Web Attributes Attributes allow variety in how an element describes content or works. Attributes let you use elements differently depending on circumstances. For example, the element uses the src attribute to specify the location of the image you want to include on your page:
PAGE 14

22 Part I: Getting to Know (X)HTML and CSS 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.
PAGE 15

Chapter 1: The Least You Need to Know about HTML, CSS, and the Web Ed auf Deutsch
Ed Tittel hat seinen technischen Schriften im Jahre 1986 angefangen, als er für einen Macintosh monatlichen Zeitschrift Artikeln schrieb. In drei mehr Jahren, hat er auch für anderen Journalen wie LAN Times, Network World, und LAN Magazine merhrere Artikeln beigetragen.
PAGE 16

24 Part I: Getting to Know (X)HTML and CSS The < and > signs are used in markup, but these symbols are instructions to the browser and won’t show up on the page. If you need these symbols on the Web page, include the entities for them in your markup, like this:
The paragraph element identifies some text as a paragraph:

<p>This is a paragraph.
PAGE 17

Chapter 1: The Least You Need to Know about HTML, CSS, and the Web Welcome to Ed Tittel.com
Contact:
- Email: etittel at yahoo dot com
- Address: 2443 Arbor Drive, Round Rock, TX 78681-2160
- Phone: 512-252-7497 (No solicitors, please)
- List of publications available in: MS Word
- Resume available in: