Title: "Cutting Out the Noise" Author: Phil Ware Publication Date: February 19, 2001 Share with...

7
<table align="right"> <tbody> <tr> <td><font color="#999999" size="1" face="Verdana">Title: "Cutting Out the Noise"<br> Author: Phil Ware<br> Publication Date: February 19, 2001</font></td> </tr> </tbody> </table> <br clear="all"> <br> <div align="left"> <table border="0" cellspacing="3" width="100%"> <tr> <td bgcolor="#C0C0C0" width="50%" background="grey_line_background.gif"><font color="#000000" face="Verdana, Arial, Geneva, Helvetica" size="2"><b>&nbsp;Share with Others</b></font></td> <td bgcolor="#C0C0C0" width="50%" background="grey_line_background.gif"><font face="Verdana" size="2"><b>&nbsp;Related Heartlight Resources</b></font></td> </tr> <tr> <td width="50%"> <font color="#000000" face="Verdana, Arial, Geneva, Helvetica" size="3"> <div align="left"> <table border="0" cellspacing="1" width="150" bgcolor="#FFFFFF"> <tr> <td width="25"><p align="center"><a href="http://www.heartlight.org/cgi-shl/simplify.cgi? 20010312_grace.html"><img border="0" src="print.gif" alt="Print This Article" width="15" height="15"></a></td> Advanced Web Design <name> the Heartlight Team </name>

Transcript of Title: "Cutting Out the Noise" Author: Phil Ware Publication Date: February 19, 2001 Share with...

Page 1: Title: "Cutting Out the Noise" Author: Phil Ware Publication Date: February 19, 2001 Share with Others Related Heartlight Resources Advanced Web Design.

<table align="right">

<tbody>

<tr>

<td><font color="#999999" size="1" face="Verdana">Title:

"Cutting Out the Noise"<br>

Author: Phil Ware<br>

Publication Date: February 19, 2001</font></td>

</tr>

</tbody>

</table>

<br clear="all">

<br>

<div align="left">

<table border="0" cellspacing="3" width="100%">

<tr>

<td bgcolor="#C0C0C0" width="50%" background="grey_line_background.gif"><font color="#000000" face="Verdana, Arial, Geneva, Helvetica" size="2"><b>&nbsp;Share

with Others</b></font></td>

<td bgcolor="#C0C0C0" width="50%" background="grey_line_background.gif"><font face="Verdana" size="2"><b>&nbsp;Related

Heartlight Resources</b></font></td>

</tr>

<tr>

<td width="50%">

<font color="#000000" face="Verdana, Arial, Geneva, Helvetica" size="3">

<div align="left">

<table border="0" cellspacing="1" width="150" bgcolor="#FFFFFF">

<tr>

<td width="25"><p align="center"><a href="http://www.heartlight.org/cgi-shl/simplify.cgi?20010312_grace.html"><img border="0" src="print.gif" alt="Print This Article" width="15" height="15"></a></td>

Advanced Web Design

<name> the Heartlight Team </name>

Advanced Web Design

<name> the Heartlight Team </name>

Page 2: Title: "Cutting Out the Noise" Author: Phil Ware Publication Date: February 19, 2001 Share with Others Related Heartlight Resources Advanced Web Design.

Session OverviewSession Overview

• Lightning Loads & Lightning Downloads

• Content Insertion Techniques

• Site Searchability

• The LYSTI® Factor

• Lightning Loads & Lightning Downloads

• Content Insertion Techniques

• Site Searchability

• The LYSTI® Factor

<font olor= #000000" face="Verdana, Arial, Geneva, Helvetica" size="3"> <div align="left"> <table border="0" cellspacing="1" width="125“ bgcolor="#FFFFFF">

<tr><td width="15" align="center"><p align="center"><img border="0"src="top.gif“ width = "15“ height="15“ alt ="Top"></td> </font> <td idth="110"><font color="#000000" face="Verdana, Arial, Geneva, Helvetica" size="1">&nbsp;<a href="http://www.heartlight.org/cgi-shl/simplify.cgi?20010312_grace.html"><b>Top</b></a></font></td></table> </div><font olor= #000000" face="Verdana, Arial, Geneva, Helvetica" size="3"> <div align="left"> <table border="0" cellspacing="1" width="125“ bgcolor="#FFFFFF">

<tr><td width="15" align="center"><p align="center

Page 3: Title: "Cutting Out the Noise" Author: Phil Ware Publication Date: February 19, 2001 Share with Others Related Heartlight Resources Advanced Web Design.

Lightning-Fast Downloads

Lightning-Fast Downloads

• Faster access increases expectation of faster downloads– Ruthless K-targets 42-52k max

– Text vs. Graphical links text is faster

– Fight content below the fold 2 page downs and your dead

– Tables vs. Frames tables are generally quicker, don’t break as often and don’t run the backbutton & bookmarking

• Faster access increases expectation of faster downloads– Ruthless K-targets 42-52k max

– Text vs. Graphical links text is faster

– Fight content below the fold 2 page downs and your dead

– Tables vs. Frames tables are generally quicker, don’t break as often and don’t run the backbutton & bookmarking

<font olor= #000000" face="Verdana, Arial, Geneva, Helvetica" size="3"> <div align="left"> <table border="0" cellspacing="1" width="125“ bgcolor="#FFFFFF">

<tr><td width="15" align="center"><p align="center"><img border="0"src="top.gif“ width = "15“ height="15“ alt ="Top"></td> </font> <td idth="110"><font color="#000000" face="Verdana, Arial, Geneva, Helvetica" size="1">&nbsp;<a href="http://www.heartlight.org/cgi-shl/simplify.cgi?20010312_grace.html"><b>Top</b></a></font></td></table> </div><font olor= #000000" face="Verdana, Arial, Geneva, Helvetica" size="3"> <div align="left"> <table border="0" cellspacing="1" width="125“ bgcolor="#FFFFFF">

<tr><td width="15" align="center"><p align="center

Page 4: Title: "Cutting Out the Noise" Author: Phil Ware Publication Date: February 19, 2001 Share with Others Related Heartlight Resources Advanced Web Design.

Code & Image Optimization

Code & Image Optimization

• “Power” tools often means extra code

• Handcoding vs. Coders– Notepad, Wordpad, Text Editors

– Bbedit & Homesite

– Front Page, HoTMetal, GoLive, Dreamweaver

• Image Enhancers & Optimizers– Photoshop 5.5

– Paint Shop Pro

– Fireworks

– Freebies & others

• “Power” tools often means extra code

• Handcoding vs. Coders– Notepad, Wordpad, Text Editors

– Bbedit & Homesite

– Front Page, HoTMetal, GoLive, Dreamweaver

• Image Enhancers & Optimizers– Photoshop 5.5

– Paint Shop Pro

– Fireworks

– Freebies & others

<font olor= #000000" face="Verdana, Arial, Geneva, Helvetica" size="3"> <div align="left"> <table border="0" cellspacing="1" width="125“ bgcolor="#FFFFFF">

<tr><td width="15" align="center"><p align="center"><img border="0"src="top.gif“ width = "15“ height="15“ alt ="Top"></td> </font> <td idth="110"><font color="#000000" face="Verdana, Arial, Geneva, Helvetica" size="1">&nbsp;<a href="http://www.heartlight.org/cgi-shl/simplify.cgi?20010312_grace.html"><b>Top</b></a></font></td></table> </div><font olor= #000000" face="Verdana, Arial, Geneva, Helvetica" size="3"> <div align="left"> <table border="0" cellspacing="1" width="125“ bgcolor="#FFFFFF">

<tr><td width="15" align="center"><p align="center

Page 5: Title: "Cutting Out the Noise" Author: Phil Ware Publication Date: February 19, 2001 Share with Others Related Heartlight Resources Advanced Web Design.

Content Insertion Techniques

Content Insertion Techniques

• Meta Tags– Timing & crude slide shows

– Searching Features

– Quick identification

• Comment Tags– Easier navigation <!-- Main Text -->

– SS Includes <#--include … -->

– JS Text Calls

• Framing vs. Pop Up Window Link (target=“new_window”)

• Meta Tags– Timing & crude slide shows

– Searching Features

– Quick identification

• Comment Tags– Easier navigation <!-- Main Text -->

– SS Includes <#--include … -->

– JS Text Calls

• Framing vs. Pop Up Window Link (target=“new_window”)

<font olor= #000000" face="Verdana, Arial, Geneva, Helvetica" size="3"> <div align="left"> <table border="0" cellspacing="1" width="125“ bgcolor="#FFFFFF">

<tr><td width="15" align="center"><p align="center"><img border="0"src="top.gif“ width = "15“ height="15“ alt ="Top"></td> </font> <td idth="110"><font color="#000000" face="Verdana, Arial, Geneva, Helvetica" size="1">&nbsp;<a href="http://www.heartlight.org/cgi-shl/simplify.cgi?20010312_grace.html"><b>Top</b></a></font></td></table> </div><font olor= #000000" face="Verdana, Arial, Geneva, Helvetica" size="3"> <div align="left"> <table border="0" cellspacing="1" width="125“ bgcolor="#FFFFFF">

<tr><td width="15" align="center"><p align="center

Page 6: Title: "Cutting Out the Noise" Author: Phil Ware Publication Date: February 19, 2001 Share with Others Related Heartlight Resources Advanced Web Design.

Site SearchThe Crucial Tool to Being Crucial

Site SearchThe Crucial Tool to Being Crucial

•Why?–Your usability (build internal

links)

–Your users control flow–Rescuing your archives

•Why?–Your usability (build internal

links)

–Your users control flow–Rescuing your archives

<font olor= #000000" face="Verdana, Arial, Geneva, Helvetica" size="3"> <div align="left"> <table border="0" cellspacing="1" width="125“ bgcolor="#FFFFFF">

<tr><td width="15" align="center"><p align="center"><img border="0"src="top.gif“ width = "15“ height="15“ alt ="Top"></td> </font> <td idth="110"><font color="#000000" face="Verdana, Arial, Geneva, Helvetica" size="1">&nbsp;<a href="http://www.heartlight.org/cgi-shl/simplify.cgi?20010312_grace.html"><b>Top</b></a></font></td></table> </div><font olor= #000000" face="Verdana, Arial, Geneva, Helvetica" size="3"> <div align="left"> <table border="0" cellspacing="1" width="125“ bgcolor="#FFFFFF">

<tr><td width="15" align="center"><p align="center

Page 7: Title: "Cutting Out the Noise" Author: Phil Ware Publication Date: February 19, 2001 Share with Others Related Heartlight Resources Advanced Web Design.

LYSTI®LYSTI®

<font olor= #000000" face="Verdana, Arial, Geneva, Helvetica" size="3"> <div align="left"> <table border="0" cellspacing="1" width="125“ bgcolor="#FFFFFF">

<tr><td width="15" align="center"><p align="center"><img border="0"src="top.gif“ width = "15“ height="15“ alt ="Top"></td> </font> <td idth="110"><font color="#000000" face="Verdana, Arial, Geneva, Helvetica" size="1">&nbsp;<a href="http://www.heartlight.org/cgi-shl/simplify.cgi?20010312_grace.html"><b>Top</b></a></font></td></table> </div><font olor= #000000" face="Verdana, Arial, Geneva, Helvetica" size="3"> <div align="left"> <table border="0" cellspacing="1" width="125“ bgcolor="#FFFFFF">

<tr><td width="15" align="center"><p align="center

The UltimateSite Usability Testing Agent!

The UltimateSite Usability Testing Agent!