![]() |
|||||
| Home : Troubleshooting : Web design : Symptoms and solutions : Layout and navigation | |||||
| Layout and navigation... or... where's that flipping map gone?!! | |||||
|
Layouts and navigation... aaaaaargh! Here are some answers to some problems! No-one can find their way around!! Help! I'm finding my own layout confusing - aaaargh! Full screen nightmares - navigational challenge gone mad Right, left or centred... which is easiest to read? I've used a table and it fits my screen - but not theirs, why? |
|||||
| Top | |||||
|
On the web design tips page, point 13 had this to say about navigation...
What might seem obvious to you on the page, using the browser's back button to navigate, scrolling to get to a point on the page etc will not necessarily be obvious to someone coming to your site for the first time. The careful use of menus and links to other pages in your site can really help the viewer. Use bookmarks (sometimes called "anchors") on your page - either by using the facility to insert 'em that your graphical package gives you, or by using the following bit of HTML at the very top of your page... <a name="top"></a> (where "top" is the name of the bookmark, this could actually be anything) Inserting a "top" bookmark is useful, because lower down the page you can put the word "Top" and turn it into a link back to the top of the page! The following bit of HTML would do just that: <a href="#top">Top</a> |
|||||
| Top | 2. Confusing layout? | ||||
|
Fingers crossed you've noticed that the pages on this site, whilst being a tad dull, are actually pretty consistent looking. That's done deliberately to help people find their way around. The web design tips page, on the other hand, changed colours every two secs, had no navigation facilities and even had a background that kept on altering! However you decide to lay out your web page or web report, try to keep the design consistent throughout. Using colour to help define sections is another good tip. Try to make sure that if you're using links to other pages - for example to the home page (always handy to give your audience a way of retracing their steps completely) - you put them in the same place all the time! And if you're using a menu - don't shove it halfway down the page! Put it where people will expect to find it! Hold your audience's hand and remember... Consistency is really really important!! |
|||||
| Top | 3. To full screen or to not to full screen... | ||||
|
Another point from the web design tips page...
First of all, this only works in Internet Explorer - and secondly, when it does work, it's an awful effect! Your audience is left wondering how on earth they are going to get out of the page. They can't press "Esc", they can't use their back button, there are no menu bars, nothing! You have to press Alt and F4 to get out of it. I can't personally see why you'd want to use this effect, but... it does demonstrate beautifully how important navigational tools are, and how frustrating it is when there aren't any! Don't use a link to a page that opens up in an absolutely full screen, and remember how it felt when you were abandoned onto the full screen page I set up! |
|||||
| Top | 4. Right aligned is okay... isn't it? | ||||
|
Take a look again at point 8...
Here's the same sentence... but this time, left aligned...
Better? Hopefully... the answer should be "yes"!!! Your eye naturally reads left to right... left aligning stuff allows people to read things in a natural way. Right aligning and centering is okay for short bits 'n' bobs... titles and the like... but for long passages of text? Left aligning gives your eye a nice easy point to return to each time it finishes a line of text.. anything else and it's a bit of a readability challenge!! Don't annoy the person marking your assignment by making it hard for them to negotiate your masterpiece! :o) |
|||||
| Top | 5 . Tables not fitting on the screen? | ||||
| Point 16 of the web design tips page looked something like this... | |||||
| 16. If you're going to use tables, use pixels to define the width - the more pixels the better. After all, horizontal scrolling is good for your health! Fabulous opportunity for exercise for your audience! |
|
Strange effect, right? The reason for this becomes apparent if you look at the HTML source behind the page - you should notice that the width of the table has been defined as 1500 pixels. Bearing in mind that the average screen resolution is either 800 or 1024 pixels wide, you can see why it doesn't fit on your screen. If you look at the rest of the page, the tables I've used have been defined as having a width of 100%. In other words, no matter what my audience's screen resolution, the table will size itself to be 100%. If your table is too wide for your audience's screen, you will force them to scroll horizontally. Try using percentages to define the widths rather than pixels - or think long and hard about the measurements you want!!! |
|||
| Site Map | |||
| Last
update 11 January, 2004 |
Phew!
Another long section... if you, please say you can't, can think of anything
to add, then, as usual... let me know!
|
||