Web Design Before & After Makeovers

Description

• Through stunning four-color images that demonstrate how nondescript "before" situations gradually become astonishing "after" results, this book offers readers simple steps to achieve unique outcomes
• Readers learn how to incorporate the latest Web-building techniques on their sites, redesign a site for optimum usability, limit user bandwidth needs, keep user experience consistent with CSS, and manage content
• The medley of makeovers includes: full-site makeovers (user speed, color themes, improved accessibility), page makeovers (page sizing, working with tables), text makeovers (font selection, graphic alternatives), image makeovers (incorporating text with images, file sizing), navigation makeovers (improving navigation bars, menu additions), content makeovers (better Web writing, enhancing the home page message), and an extreme makeover (combining several smaller makeovers into a major site overhaul)

 

 

Table of Contents

Introduction.

1 MAKEOVER ESSENTIALS.

Macromedia Dreamweaver: Your Command and Control Design Center.

Adobe Photoshop: Your Visual Sidekick.

Web Browsers: Your Test Suite.

Web Developer Extension for Firefox: Your Interactive Debugging Environment.

2 PAGE LAYOUT MAKEOVERS.

Moving from Table Layout to DIVs.

Boxing in Your Page’s Content.

Adding a Page Heading.

Centering Your Pages.

Adding Curves to Your Edges.

3 NAVIGATION MAKEOVERS.

Reorganizing Your Site for Easier Navigation.

Creating a Top-Level Menu Bar.

Creating a Vertical Navigation List.

Adding a Pathway to Your Pages.

Adding a Quick Links Drop-Down Menu.

4 PAGE ELEMENT MAKEOVERS.

Enhancing the Look of Table Borders.

Offsetting Page Elements to Avoid Eye Competition.

Using iframes to Package Your Content.

Bringing iframes to Life.

5 TEXT MAKEOVERS.

Selecting Fonts that Complement Your Site.

Replacing Normal Text with Anti-Aliased Text.

Replacing Plain Bullets with Images.

6 IMAGE MAKEOVERS.

Creating an Image Rollover.

Cropping Images to Shed the Useless Stuff.

Thumbnailing Images.

Displaying Multiple Images with an Image Scroller.

Displaying a “Lightbox” Overlay Image.

7 IMAGE PERFORMANCE MAKEOVERS.

Resizing Images Yourself.

Reducing Your Image’s File Size, Not Its Quality.

Preloading Images.

8 HOME PAGE MAKEOVERS.

Messaging Your Home Page.

Making Your Home Page Feel Alive.

Adding a Splash Introduction.

9 CONTENT MAKEOVERS.

Writing Web-Savvy Text.

Creating Intuitive and Usable Links.

Adding an Alternate Print Version of Your Web Page.

Adding an Alternate Print Version of Your Web Page, Technique II.

Adding a Subject and Message to a mailto Link.

10 FORM MAKEOVERS.

Validating Your Forms.

Controlling Tab Order.

Using CSS to Transform the Look of Form Elements.

Creating Graphical Buttons.

11 ADD-ON MAKEOVERS.

Adding Maps and Directions.

Adding a Site Search.

Making Your Blog Part of Your Web Site.

12 SITE MAKEOVERS.

Linking to Other Sites without Losing Your Visitors.

Creating Your Own Favorites Icon.

Improving Your Search Engine Ranking.

Converting Your Web Page to XHTML.

13 EXTREME MAKEOVERS.

Allowing Visitors to Adjust the Font Size.

Scrambling Your E-mail Links to Avoid Spam.

Displaying Different Content Based on the Frequency of the Visitor.

Adding an RSS Feed to Your Web Site.

INDEX.