2,001 Tips
The Web
Authoring

HTML Authoring

Index URLy

All popular search engines offer simple forms to submit your site for indexing. The engine sends spiders to your site that "crawl" your pages. The spiders then add the pages to its index. But most spiders search only a few levels below your home page. To force a complete survey, submit multiple URLs, one for each major section of your Web site. By registering multiple URLs, you increase your chances of having all of your pages included in the index.

Index Often

Expect to wait two to four weeks before your site shows up on major search engines, and even longer for updates to be recognized. If you've overhauled your site or changed links substantially, don't wait for the search engine to find it-resubmit the URL.

Image Maps Are a No-No

Avoid starting pages with image maps. Spiders that abstract your site by pulling together significant phrases, titles and headers may be unable to negotiate an image map.

Search Yourself

Often, the quickest way to gauge the success of your site's index is to search for it. If you turn up results that place your site far down in the relevancy rankings, examine the sites that beat you to find out why. WebCrawler offers a URL status form that makes it easy to check your site's last update.

Better Yet, Sell Yourself

Persuade others to link to your site. Some engines search a site more frequently if lots of other sites link to it. To get an idea of how popular you are, click on WebCrawler's Special button. This guides you through a "backward surf" of every site that links to yours. If the ride is short, you've got work to do.

META Mettle

Advanced queries often hit META tags first, so add site-descriptor META tags to move your site up in the relevancy rankings. The keyword tag, for example, lets you add relevant search terms: <META NAME="keywords" CONTENT="windows magazine, win95, Windows 3.1, NT, winmag, reviews">. The description tag includes a sentence that describes your site, which can be both searched and automatically added to the results lists of many engines:<META NAME="description" CONTENT="WINDOWS MAGAZINE contains reviews, tutorials and buying advice for Windows 3.1, Windows 95 and Windows NT users.">.

Be Moderate with META Tags

Don't go overboard with META tags. Many engines check for duplicate META tag entries and penalize sites when the same keywords appear too many times.

Wherefore Art Thou, Hyperlink?

Check the integrity of your links regularly. Recursive links-links on a page that call that same page-may cause a confused spider to produce strange results.

Uncommonly Good

Don't use common search operators in your site title or URL. The symbols =, $ and ? can give search engines, especially those with advanced capabilities, headaches.

Every Link Counts

To test whether your Web-marketing efforts are paying off, visit the Alta Vista search engine site, and check the number of links to your own Web pages using the "link:" prefix. For example, typing link: http://www.winmag.com will return the number of links Alta Vista has found to the WINDOWS Magazine home page.

Control Wide-Open Spaces

HTML demands precise spacing on Web pages, so indents, fancy kerning or extra spaces around graphics can look pretty funky. To control spacing, create a 1-by-1-pixel blank GIF file, make it transparent and insert as many copies of that image as you need to create spacing. Place this file within an IMG SRC tag and you can adjust its HSPACE and VSPACE attributes as needed.

Scale the Heights ... And Widths

Specifying the height and width of the graphic space causes your browser to automatically resize the graphic to fit the defined space.

Call Ahead to Reserve a Space

Always specify a height and a width for any graphic. This way, a placeholder is created for your graphic while the browser loads your page, and the browser won't need to resize the page when the graphic is finally loaded. The result? Faster pages and no confusing jumps.

Figuring the Percentages

Specify a percentage for height or width parameters within an IMG SRC tag and your graphic will automatically scale itself according to the size of the window. For example, <IMG SRC="MYPIC.GIF" WIDTH="75%"> ensures the graphic MYPIC.GIF takes up 75 percent of your browser window. Specify only one parameter (height or width) and the graphic will scale proportionally, maintaining its aspect ratio. You can also combine parameters for interesting stretched effects.

Make a Case for Windows HTML

In UNIX, case sensitivity can be a problem-especially for Web authors who want to build pages in Windows. Some applications add an uppercase extension to lowercase filenames. If your Web authoring tool doesn't allow you to specify case for all links and filenames, you'll have to check each filename manually. Save time by keeping all links in lowercase, then use a utility such as the freeware DOS program lcase to automatically convert all files in a folder or directory to lowercase.

Spacing Out

Remember the old typing standard of two spaces at the end of a sentence? Viewed on the Web, the extra space stops the natural flow of your words-a single space is all you need. On the Web, it's more common to use large blank spaces to separate concepts.

And Speaking of HSPACE ...

If you add an HSPACE or VSPACE to your tag, remember to specify some value for its counterpart, whether you use it or not. Suppose you need to add only vertical space around a graphic. If you specify only VSPACE=X, some browsers will assume a default value of 1 for HSPACE. Add HSPACE=0 to your tag to bring images right in line.

Decrease Your Demands

The HTML command LOWSRC lets you display high-resolution, bandwidth-hogging graphics for visitors with fast connections and more compact, less detailed versions for slow surfers. The LOWSRC command lets you place a second, low-resolution copy of a graphics file in the same position as the high-resolution version, using the syntax: <IMG SRC="SLOWPIC. GIF" LOWSRC="FASTPIC.JPG">. Browsers that support LOWSRC will first load the smaller file, then gradually replace it with the more detailed version as the visitor remains on the page.

Come Back, Little Searcher

If you provide a link to a search engine, visitors may not return to your site when they're done searching. Use a search engine (such as Lycos, http://www.lycos.com) that provides free code to attach your logo to the search results page. Clicking on the logo will return users to your site.

Search and Deploy

Get help from search engines to set up your own local search facility. In many cases, you can visit the search site and copy code that will build the search engine you want directly into your own page. Developers that don't provide code samples for you to paste into your site's HTML code often document the steps in their help pages.

Show Me the Way to Go Home

Be kind to surfers with slow connections-make sure the text-only versions of your Web pages are complete. Don't design a page with graphics-only navigation tools. Text-only users will wind up dead-ending on every page.

Conquering Browser Offset

A Web page starts at the top of the browser window, right? Nope-most browsers actually add a predetermined margin at the beginning of a page. That makes it almost impossible to align images and backgrounds exactly. Internet Explorer is one exception, although most browser developers are slowly overcoming this problem.

Readability Is Fundamental

When creating Web graphics with text for headers and menus, keep your backgrounds light or nonexistent, with minimal texturing. If your design calls for standout backgrounds, add drop shadows and glows to your text, in sharply contrasting colors, to make it stand out.

Get Animated

The LOWSRC tag can be used for more than saving bandwidth-you can also use it for simple, one-time animation. Use two different graphics-the LOWSRC graphics will appear first, then will be gradually replaced by the SRC image. For example, place two images of a traffic light, one with a green light and the other with a red: <IMG SRC="GREEN.JPG"LOWSRC="RED.JPG">, and visitors will see a red traffic light that gradually turns green.

Don't Play Guessing Games

Six months down the road, are you going to understand a lengthy batch of HTML code? Probably not, unless you add comments. HTML will ignore any text within comment tags. Use <!-- to begin the note, and --> to end it. For example: <!--This is a comment about comment tags. -->.

Color Me Hexed!

Want to know if your hexadecimal color values work together? Visit http://www.stardot.com/~lukeseem/hexed.html and sample Get Hexed 1.1. This online utility accepts Navigator-compatible hex numbers for the RGB values of background, text, link and visited link colors, combines them and displays the results in a table you can copy to your own page.

Deconstruct Construction Signs

Any Web site that isn't under construction is a dead Web site. People expect your pages to change, so don't waste their bandwidth with "Under Construction" graphics.

To GIF or Not to GIF

Is GIF or JPEG better for your Web images? That depends. Use JPEG for subtle color gradations and shadings, as in photographs. Gray-scale pictures, line art, drawings with very sharp edges and artwork that's mostly solid blocks of color look best as GIF files. Also use GIF if you intend to make the background of your graphic transparent.

Keep Backgrounds in the Background

Your Web page won't begin loading until the background has arrived. If you use a hefty graphics file for a background, 14.4Kbps modem users will be staring at dead space for a long time. Keep your background files as small as possible.

Get the Drop on Text

Want to add a drop capital to your Web page? Use any graphics program to create a big, fancy letter, then place it as an inline image using HTML's ALIGN=LEFT command. Text will automatically flow around the letter.

Netscape Color: A Hexing Problem

To optimize your pages for display on Netscape Navigator, be sure to use its 256-color hexadecimal palette. You'll find instructions at Netscape's Web site, http://home.netscape.com.

Attention Photoshop Users!

If you use Photoshop to build Web images, be sure to add Adobe's free GIF89A export/conversion filter to your graphics arsenal. Adobe offers it on its Web site, http://www.adobe.com.

Get Good Press

Want to attract visitors to your Web site effectively and inexpensively? Make sure your site is properly listed in search engine indexes. Services like Post Master (http://www.netcreations.com/postmaster) and Submit It!
(http://www.submit-it.com) will automate the process by sending your URL to multiple indexes and search engines.

Send Your Pages For a Checkup

Doctor HTML at http://www2.imagiware.com/RxHTML/ will fetch your Web page and test it for everything from correct spelling to valid links-at no charge.

[ Go to 2,001 Tips Table of Contents ]