Rent 9780596101978 | Head First HTML with CSS and XHTML

Summary Table of Contents Author Biography

Tired of reading HTML books that only make sense after you're an expert? Then it's about time you picked up "Head First HTML with CSS & XHTML" and really learned HTML. You want to learn HTML so you can finally create those web pages you've always wanted, so you can communicate more effectively with friends, family, fans, and fanatic customers. You also want to do it right so you can actually maintain and expand your Web pages over time, and so your web pages work in all the browsers and mobile devices out there. Oh, and if you've never heard of... MORE CSS, that's okay - we won't tell anyone you're still partying like it's 1999 - but if you're going to create Web pages in the 21st century then you'll want to know and understand CSS. Learn the real secrets of creating Web pages, and why everything your boss told you about HTML tables is probably wrong (and what to do instead). Most importantly, hold your own with your co-worker (and impress cocktail party guests) when he casually mentions how his HTML is now strict, and his CSS is in an external style sheet. With "Head First HTML with CSS & XHTML," you'll avoid the embarrassment of thinking web-safe colors still matter, and the foolishness of slipping a font tag into your pages. Best of all, you'll learn HTML and CSS in a way that won't put you to sleep. If you've read a Head First book, you know what to expect: a visually-rich format designed for the way your brain works. Using the latest research in neurobiology, cognitive science, and learning theory, this book will load HTML, CSS, and XHTML into your brain in a way that sticks. So what are you waiting for? Leave those other dusty books behind and come join us in Webville. Yourtour is about to begin. "Elegant design is at the core of every chapter here, each concept conveyed with equal doses of pragmatism and wit." --Ken Goldstein, Executive Vice President, Disney Online "This book is a thoroughly modern introduction to forward-looking practices in web page markup and presentation." --Danny Goodman, author of "Dynamic HTML: The Definitive Guide" "What used to be a long trial and error learning process has now been reduced neatly into an engaging paperback." --Mike Davidson, CEO, Newsvine, Inc. "I love "Head First HTML with CSS & XHTML"--it teaches you everything you need to learn in a 'fun coated' format!" --Sally Applin, UI Designer and Artist "I haven't had as much fun reading a book (other than Harry Potter) in years. And your book finally helped me break out of my hapless so-last-century way of creating web pages." --Professor David M. Arnow, Department of Computer and Information Science, Brooklyn College "If you've ever had a family member who wanted you to design a website for them, buy them Head First HTML with CSS and XHTML. If you've ever asked a family member to design you a web site, buy this book. If you've ever bought an HTML book and ended up using it to level your desk, or for kindling on a cold winter day, buy this book. This is the book you've been waiting for. This is the learning system you've been waiting for." --Warren Kelly, Blogcritics.org

"A complete learning experience for creating industry standard Web pages - but you won't be just reading: you'll be playing games, solving puzzles, pondering mysteries and creating Web pages like you never imagined. You'll be also learning how HTML works with CSS . . . if you're going to create Web pages in the 21st century, then you want to know and to understand CSS, too."

With Head First HTML & CSS, you'll avoid the embarrassment of thinking Web-safe colours still matter, and the foolishness of slipping a font tag into your pages. Best of all, you'll learn HTML and CSS in a way that won't put you to sleep. If you've read a Head First book, you know what to expect: a visually rich format designed for the way your brain works. Using the latest research in neurobiology, cognitive science, and learning theory, this book will load HTML and CSS into your brain in a way that sticks. So what are you waiting for? Leave those other dusty books behind and come join us in Webville. Your tour is about to begin.

This unique guide fills a need for an entry-level book on Web programming with HTML and CSS. It uses the engaging, multi-sensory "Head First" learning approach to deliver insights into cutting-edge Web design and development.

... MORE

Intro

Who is this book for?

xxvi

We know what your brain is thinking

xxvii

Metacognition

xxix

Bend your brain into submission

xxxi

Technical reviewers

xxxiv

Acknowledgments

xxxv

The Language of the Web

The Web killed the video star

(1)

What does the Web server do?

(1)

What you write (the HTML)...

(1)

What the browser creates...

(4)

Your big break at Starbuzz Coffee

(2)

Creating the Starbuzz Web page

(1)

Creating an HTML file (Mac)

(2)

Creating an HTML file (Windows)

(3)

Meanwhile, back at Starbuzz Coffee...

(2)

Opening your Web page in a browser

(1)

Taking your page for a test drive...

(5)

Tags dissected...

(4)

Meet the style element

(1)

Giving Starbuzz some style...

(2)

Who does what?

(2)

Fireside Chat

(2)

Bullet Points

(2)

Exercise Solutions

(6)

Meeting the 'HT' in HTML

Head First Lounge, New and Improved

(2)

Creating the new lounge

(2)

What did we do?

(1)

What does the browser do?

(2)

Understanding attributes

(7)

Technical difficulties

(2)

Planning your paths...

(6)

Fixing those broken images...

(7)

Exercise Solutions

(6)

Web Page Construction

From Journal to Web site, at 12mph

(1)

The rough design sketch

(1)

From a sketch to an outline

(1)

From the outline to a Web page

(2)

Test driving Tony's Web page

(2)

Meet the <q> element

(4)

Looooong Quotes

(1)

Adding a <blockquote>

(3)

The real truth behind the <q> and <blockquote> mystery

(9)

Use the <p> element to make a list...

103

(1)

Constructing HTML lists in two easy steps

104

(5)

Putting one element inside another is called ``nesting''

109

(1)

To understand the nesting relationships, draw a picture

110

(1)

Using nesting to make sure your tags match

111

(2)

Inline or block?

113

(6)

Exercise Solutions

119

(7)

A Trip to Webville

Getting Starbuzz (or yourself) onto the Web

126

(1)

Finding a hosting company

127

(1)

How can you get a domain name?

128

(2)

Moving in

130

(1)

Getting your files to the root folder

131

(1)

As much FTP as you can possibly fit in two pages

132

(3)

Back to business...

135

(1)

Mainstreet, URL

136

(1)

What is the HTTP Protocol?

137

(1)

What's an absolute path?

138

(3)

How default pages work

141

(3)

How do we link to other Web sites?

144

(1)

Linking to Caffeine Buzz

145

(4)

Web page fit and finish

149

(2)

Linking into a page

151

(1)

Using the <a> element to create a destination

152

(1)

How to link to destination anchors

153

(4)

Linking to a new window

157

(1)

Opening a new window using target

158

(4)

Exercise Solutions

162

(4)

Meeting the Media

How the browser works, with images

166

(3)

How images work

169

(4)

And now for the formal introduction: meet the <img> element

173

(3)

Always provide an alternative

176

(2)

Creating the ultimate fan site: myPod

178

(3)

Whoa! The image is way too large

181

(10)

Fixing up the myPod HTML

191

(4)

Reworking the site to use thumbnails

195

(4)

Turning the thumbnails into links

199

(2)

So, how do I make links out of images?

201

(5)

What format should we use?

206

(1)

To be transparent, or not to be transparent? That is the question...

207

(2)

Wait, what is the color of the Web page background?

209

(1)

Check out the logo with a matte

210

(1)

Add the logo to the myPod Web page

211

(5)

Exercise Solutions

216

(8)

Serious HTML

Cubicle Conversation

224

(2)

A brief history of HTML

226

(3)

We can't have your pages putting the browser into quirks mode

229

(2)

Adding the document type definition

231

(3)

Meet the W3C validator

234

(1)

Validating the Head First Lounge

235

(1)

Houston, we have a problem...

236

(4)

Adding a <meta> tag to specify the content type

240

(1)

Making the validator happy with a <meta> content tag...

241

(1)

Third time's the charm?

242

(4)

Changing the doctype to strict

246

(1)

Do we have validation?

247

(2)

Fixing the nesting problem

249

(1)

One more chance to be strict...

250

(2)

Strict HTML 4.01, grab the handbook

252

(4)

Fireside Chat

256

(3)

HTML Archeology

259

(4)

Exercise Solutions

263

(4)

Putting the 'X' into HTML

What is XML?

267

(1)

What does this have to do with HTML?

268

(2)

So why would you want to use XHTML?

270

(2)

The XHTML 1.0 checklist

272

(2)

Going from strict HTML to XHTML 1.0

274

(1)

Old school HTML 4.01 Strict

275

(1)

New and improved XHTML 1.0

275

(2)

Validation: it's not just for HTML

277

(3)

Fireside Chat

280

(2)

HTML or XHTML? The choice is yours...

282

(2)

Exercise Solutions

284

(2)

Adding a Little Style

You're not in Kansas anymore...

286

(2)

Overheard on Webville's ``Trading Spaces''

288

(1)

Using CSS with XHTML

289

(6)

Let's put a line under the welcome message, too

295

(1)

Specifying a second rule, just for the <h01>

296

(7)

Getting the Lounge style into the elixirs and directions pages

303

(2)

Linking to the external style sheet

305

(6)

It's time to talk about your inheritance...

311

(1)

What if we move the font up the family tree?

312

(2)

Overriding inheritance

314

(4)

Creating a selector for the class

318

(2)

Taking classes further...

320

(2)

The world's smallest and fastest guide to how styles are applied

322

(4)

Who gets the inheritance?

326

(3)

Making sure the Lounge CSS validates

329

(4)

Exercise Solutions

333

(9)

Expanding your Vocabulary

Text and fonts from 30,000 feet

342

(2)

What is a font family anyway?

344

(3)

Specifying font families using CSS

347

(1)

Dusting off Tony's Journal

348

(3)

How do I deal with everyone having different fonts?

351

(3)

So, how should I specify my font sizes?

354

(2)

Let's make these changes to the font sizes in Tony's Web page

356

(3)

Changing a font's weight

359

(2)

Adding style to your fonts

361

(1)

Styling Tony's quotes with a little italic

362

(2)

How do Web colors work?

364

(3)

How do I specify Web colors? Let me count the ways...

367

(3)

The two minute guide to hex codes

370

(2)

How to find Web colors

372

(3)

Back to Tony's page...

375

(2)

Everything you ever wanted to know about text-decorations

377

(1)

Removing the underline...

378

(3)

Exercise Solutions

381

(5)

Getting Intimate with Elements

The lounge gets an upgrade

386

(2)

Starting with a few simple upgrades

388

(2)

Checking out the new line height

390

(1)

Getting ready for some major renovations

391

(1)

A closer look at the box model...

392

(2)

What you can do to boxes...

394

(5)

Creating the guarantee style

399

(2)

Padding, border, and margins for the guarantee

401

(1)

Adding some padding

401

(1)

Now let's add some margin

402

(2)

Adding a background image

404

(3)

Fixing the background image

407

(1)

How do you add padding only on the left?

408

(1)

How do you increase the margin just on the right?

409

(1)

A two-minute guide to borders

410

(2)

Border fit and finish

412

(2)

Interview with an HTML class

414

(2)

The id attribute

416

(2)

Using an id in the lounge

418

(2)

Remixing style sheets

420

(1)

Using multiple style sheets

421

(5)

Exercise Solutions

426

(5)

Advanced Web Construction

A close look at the elixirs HTML

431

(2)

Let's explore how we can divide a page into logical sections

433

(7)

Adding a border

440

(1)

An over-the-border test drive

440

(1)

Adding some real style to the elixirs section

441

(1)

The game plan

442

(1)

Working on the elixir width

442

(5)

Adding the basic styles to the elixirs

447

(6)

What we need is a way to select descendants

453

(2)

Changing the color of the elixir headings

455

(1)

Fixing the line height

456

(2)

It's time to take a little shortcut...

458

(6)

Adding <span>s in three easy steps

464

(4)

The <a> element and its multiple personalities

468

(1)

How can you style elements based on their state?

469

(2)

Putting those pseudo-classes to work

471

(2)

Isn't it about time we talk about the ``cascade''?

473

(2)

The cascade

475

(1)

Welcome to the ``What's my specificity game''

476

(1)

Putting it all together

477

(6)

Exercise Solutions

483

(5)

Arranging Elements

Did you do the Super Brain Power?

488

(1)

Use the flow, Luke

489

(2)

What about inline elements?

491

(1)

How it all works together

492

(3)

How to float an element

495

(2)

Behind the scenes at the lounge

497

(2)

The new Starbuzz

499

(5)

Move the sidebar just below the header

504

(1)

Set the width of the sidebar and float it

504

(3)

Fixing the two-column problem

507

(1)

Setting the margin on the main section

508

(3)

Back to clearing up the overlap problem

511

(3)

Righty tighty, lefty loosey

514

(3)

Liquid and frozen designs

517

(3)

How absolute positioning works

520

(3)

Changing the Starbuzz CSS

523

(4)

One tradeoff you can make to fix the footer

527

(2)

Positioning the award

529

(6)

How does fixed positioning work?

535

(2)

Using a negative left property value

537

(2)

Getting relative

539

(2)

To three-columns and beyond...

541

(3)

Exercise Solutions

544

(7)

Getting Tabular

How do we make tables with HTML?

551

(1)

How to create a table using HTML

552

(1)

What the browser creates

553

(1)

Tables dissected...

554

(3)

Adding a caption and a summary

557

(2)

Before we start styling, let's get the table back into Tony's page...

559

(5)

Getting those borders to collapse

564

(2)

How about some color?

566

(1)

Tony made an interesting discovery...

567

(1)

Another look at Tony's table

568

(1)

How to tell cells to span more than one row

569

(2)

The new and improved table

571

(1)

Trouble in paradise?

572

(4)

Overriding the CSS for the nested table headings

576

(1)

Giving Tony's site the final polish

577

(11)

Exercise Solutions

588

(4)

Getting Interactive

How forms work

592

(1)

How forms work in the browser

593

(1)

What the write in XHTML

594

(1)

What the browser creates

595

(1)

How the <form> element works

596

(8)

Getting ready to build the Bean Machine form

604

(1)

Adding the <form> element

605

(1)

How <form> element names work

606

(2)

Back to getting those <input> elements in your XHTML...

608

(1)

Adding some more input elements to your form

609

(1)

Adding the <select> element

610

(2)

Give the customer a choice of whole or ground beans

612

(1)

Punching the radio buttons

613

(1)

Completing the form

614

(1)

Adding the checkboxes and textarea

615

(6)

Watching GET in action

621

(5)

To Table or Not to Table? That's the question...

626

(1)

Getting the form elements into a table

627

(3)

Styling the form and the table with CSS

630

(5)

Exercise Solutions

635

(5)

The Top Ten Topics (we didn't cover)

More Selectors

640

(2)

Frames

642

(1)

Multimedia & Flash

643

(1)

Tools for Creating Web Pages

644

(1)

Client-side Scripting

645

(1)

Server-side Scripting

646

(1)

Tuning for Search Engines

647

(1)

More about Style Sheets for Printing

648

(1)

Pages for Mobile Devices

649

(1)

Blogs

650

(1)

Index

651

Elisabeth Robson
Elisabeth Robson (formerly Freeman) is coauthor of O'Reilly's Head First Design Patterns and Head First HTML with CSS & XHTML. She is currently Special Projects Director at O'Reilly where she is developing new brain-friendly learning ideas and products.
Eric T Freeman
Eric Freeman is a computer scientist with a passion for media and software architectures and coauthor of Head First Design Patterns. He just wrapped up four years at a dream job-- directing internet broadband and wireless efforts at Disney--and is now back to writing, creating cool software, and hacking Java and Macs. Eric spent a lot of the '90s working on alternatives to the desktop metaphor with David Gelernter (and they're both still asking the question, "Why do I have to give a file a name?"). Based on this work, Eric landed a Ph.D. at Yale University in 1997. He also co-founded Mirror Worlds Technologies (now acquired) to create a commercial version of his thesis work, Lifestreams.

In a previous life, Eric built software for networks and supercomputers. You might know him from such books as JavaSpaces Principles Patterns and Practice. Eric has fond memories of implementing tuple-space systems on Thinking Machine CM-5s and creating some of the first internet information systems for NASA in the late 1980s.

When he's not writing text or code you'll find him spending more time tweaking than watching his home theater and trying to restore a circa 1980s Dragon's Lair video game. He also wouldn't mind moonlighting as an electronica DJ.

Write to him at eric at wickedlysmart dot com or visit him at http://www.ericfreeman.com .

RENT TEXTBOOKS

Head First HTML with CSS and XHTML

Why Rent from Knetbooks?

Top 5 reasons to order all your textbooks from Knetbooks:

Elisabeth Robson

Eric T Freeman

Related Products