HTML and CSS Reference
In-Depth Information
page plus all its associated images and media. If the total file size for a single page and
its associated files is over 60KB and it is likely that your target audience may not be
using broadband access, take a closer look at your design. Consider if you really need
to use all the images to convey your message. Perhaps the images can be better opti-
mized for the Web or the content of the page should be divided into multiple pages.
This is a time for some decision making!
Popular Web authoring tools such as Microsoft Expression Web and Adobe
Dreamweaver will calculate load time at various transmission speeds.
Perceived load time
is the amount of time a Web page visitor is aware of waiting while
your page is loading. Since visitors often leave a Web site if a page takes too long to load,
it is important to shorten their perception of waiting. A common technique is to shorten
the perceived loading time by breaking the long page into multiple smaller pages using the
methods described earlier. This might even aid in the organization of your Web site.
Web pages containing large graphics may appear to load very slowly. Image slicing—
dividing or slicing large images into multiple smaller images (see Chapter 4), divides
large images into several smaller graphics. Since each graphic displays as it loads, the
perceived load time is shorter than it is for a single large graphic. Even though the total
download time is about the same, the visitor sees the browser window changing and
perceives the wait as being shorter.
Placing important information
above the fold
is a technique borrowed from the news-
paper industry. When newspapers are placed on counters and in vending machines wait-
ing to be sold, the portion above the fold in the page is viewable. Publishers noticed
that more papers were sold when the most important, attention-getting information was
placed in this location. You may use this technique to attract and keep visitors on your
Web pages. Arrange interesting content above the fold—the area the visitor sees before
scrolling down the page. At a screen resolution of 800 pixels wide by 600 pixels high,
the amount of screen viewable above the fold (after accounting for Web browser menus
and controls) is about 410 pixels. At 1024
768 resolution, you can expect there to be
close to 600 pixels above the fold—but keep in mind that the amount of browser
chrome (the browser menus, address bar, and scroll bar) varies and that not everyone
will be visiting your Web site with a maximized browser viewport.
×
There is a saying in the real estate field that the three most important factors about a
property are location, location, and location. The Web page location you choose for
high-profile components such as logo banners, page headings, and navigation is also
important. Web page visitor eye tracking studies reported by The Poynter Institute
(
http://www.poynterextra.org/eyetrack2004/main.htm)
indicate that “eyes most often
fixated first in the upper-left of the page, then hovered in that area before going left to
right.” This makes the most valuable Web page “real estate” the upper-left side and top
center of the page. Avoid placing important information and navigation on the far right
side—this area may not be initially displayed by browsers at some screen resolutions.
Search WWH ::
Custom Search