Best of Tokyo's Tips: Lay-out
| Layout |
This includes menu positioning, use of frames or noframes.
|
Tip: Plan your lay-out on paper first.
Where to position the menu, the links, the text, the forms, etc. Break the pages, especially those that contain three pictures into parts, such that it could be seen within at least two browser's screens per page. Example, you place the first picture on the top of the page and the other at the bottom before the links. This way, the user will only have to click the down arrow once to view the full page.
|
Tip: No text should "run-over" images.
When necessary, enclose the text on imaginary tables. Use percentages for column widths instead of pixels such that when a user [as some are wont to do] re-sizes the viewed page, the text will not run over the images making it obscure.
|
Tip: Use framesets consistently, if unavoidable.
If it is a noframes version, there shouldn't be a framed page hidden within. Use the same format for all pages. If you opted for a frameless index, then use a non-framed format for all others. If you opt putting frames, at least be consistent on its use, like noframes for major entry points and framed pages succeeding.
|
Tip: Maximize usage of color attributes in tags.
Give due attention especially to the links, <link>, <alink>, <vlink>. Make the visited link tags a different color than the available link tag. This way, the user would know which links have not been viewed and which links were viewed. Be consistent on the use of colored fonts. Use one font color type or a combination of them throughout your page. Say, gray for the text, orange for the unvisited links, yellow for visited links for all pages.
|
Tip: Never forget to close what you open.
Be mindful of your nested tags. Close them appropriately when you open them, especially with <table> attributes. Internet Explorer is much a good debugger in terms of closing tags than Netscape Navigator. Improperly nested tags in table usually would not look the same when seen on these two more popular browsers.
|
Tip: Preview your pages offline.
Make it a point to view your pages on different browsers prior to publishing them online. Some browers have differences in displaying text, tables, images and the like. Each browser has its own unique codes that might not work on all other browsers. A typical example of this is the centering attribute. For Netscape you use <center> but it will not work with Internet Explorer which uses <p align="center">. Better be safe, use them both!
|
|
