Each page should be well laid out (i.e., good use of white space and dividers, straight forward navigation links). By Gail J Berg ©2009
Each page should be well laid out (i.e., good use of white space and dividers, straight forward navigation links).
When laying out the page, having a blank line, AKA vertical white space, between lines of text (or paragraphs) helps with being able to see where things stop. Using ruler lines (e.g., html <hr size="5"> gives you a full width line five pixels high) also provides the eye with a stopping point.
Also including white space horizontally between items is helpful. This page utilizes two tables to space out the information as well as spaces and “|” to separate the between links (see the alphabetic links at the bottom).
Another area that is worth some time to edit is the header section for “keywords”. This is ‘bot related in that those phrases are the ones that the search engine (think Google) utilizes for folks looking for information. Examples of keywords that might be used include:
If the subject is a famous horse, including the name in the keywords might be helpful as well.
And don’t forget to edit the title of the page to be more specific as to where you are. There have been times when I’ve gotten so involved in what is on a web page that the only way I know where I am (to figure out where I want to go from there) is by looking at the title. Other times the title helps me determine if I want to bookmark the page for future reference.
The one thing to keep in mind is that you need to clearly present pictures and text together to showcase an item for sale. It should be straight-forward as to what the item is, how much it is, shipping costs, etc.
Another subtopic of page layout is the positioning of images in a page. This page shows a number of different orientations. The Model Horse Gallery nominally uses 5 pixel spacing, with left alignment for “halter” shots and right alignment for “performance” shots. And to avoid images “running together,” <br clear=”all”> is used after images.
You may note that it can be hard to read text that is immediately adjacent an image with no spacing (e.g., hspace="0" vspace="0" in <img> tag). While even a mere five pixels help greatly with readability (e.g., hspace="5" vspace="5").
Figuring out what works for your site, may take some effort, but once you know where and how you want to position images, it’s just a matter of consistency to implement.
There is an entire branch of study on HMI (human machine interfaces) that help understand where and how items can be highlighted or laid out on a page. For further information on this, consider some study on page layout, such as this article.
Back up to Library
Return to the Model Horse Gallery Home Page
This page maintained by the Model Horse Gallery Curator ©1996-2020