There is one common mistake that Web Site Developers often make when designing web sites, and that is the lack of consideration to different monitor sizes in relation to the layout of pages. A large number of Web Page Designers still can’t see past the old favourite 14″ or 15″ monitor. Indeed more people (even though they are using smaller Palm Pilots and Internet connected phones etc.) still use a larger monitor as their main computer interface. Less people than ever before use a 14″ or 15″ screen with a screen resolution of the old favourite 800 x 600 pixels, yet we still get messages on Web Sites like “Best viewed at 800 x 600 screen resolution”. Most people even those still using 14″ or 15″ monitors are investing in display drivers that offer increased resolution and refresh rates.
In the course of my work (day job :-), I have to search (hard), for a monitor that is as small as 15″ to test layouts and designs on. Most people in the industry that I prepare students for could not complete their daily tasks with a monitor smaller than 17″ or 19″ with a resolution at a minimum of 1024 x 768 pixels (more commonly 1152 x 864 pixels or higher). These people are not going to go to the trouble of resetting their screen resolution just to view your site, they will just get frustrated trying to read your page when their view of your page layout is so bad. They will just give up and go elsewhere. Yet we still hear people discussing the merits of forgetting about layout altogether and concentrating on the content. My argument is – “if the content (because of lack of attention to layout), is not able to be clearly understood, and if the ‘feeling’ of the page is not clean and logical, visitors won’t stay long, and definitely won’t come back. This is a huge issue but it is an issue that is barely even recognised by those who don’t use anything but a conventional 15” screen set at 800 x 600 pixels, never the less the designer who didn’t take this factor into account just lost another of the visitors that now number approximately 30% of web surfers.
To complicate things even more. All browsers handle text and images differently. And it is a good idea to check your design in different browsers. I usually check most designs in about four browsers, Netscape, (an early and a later version), Microsoft Internet Explorer, Opera, and NeoPlanet, (gee they’re all free). I also try designs at different resolutions and on different size monitors. This way I can try and find the best compromise for layout and design to suit most situations and hopefully end up with a finished product that will at least not turn too many people away because the page was difficult to view on their system. Pictures (Graphics) are a such major part of layout and can make or break a design that I will not attempt to cover them here, they require a separate article. So let us look at layout generally and text in particular. We need to find some way of constraining the content of a page so that it looks equally well (and similar), in any browser etc.. There are several ways of doing this.
FRAMES: frames can help separate the content from the navigation bar or even different parts of the content within a page. Frames can even help download speed sometimes if there is a common panel/frame used for the likes of a title or a navigation panel, as this doesn’t generally have to download repeatedly, only new content is downloaded on each page that is viewed. Frames can help to organize the overall look of a page. However frames are dropping out of favour perhaps due to the slow initial load of the first page, and also the fact that there can be some slight problems when dealing with forms and some other features, if not used correctly. They also make submission of different doorway pages to search engines and directories a bit tricky.
TABLES: tables in my opinion are invaluable, they are so flexible in their use and can so easily organize data on a page, especially since it is so easy to constrain the width or height of table elements, have different background colours or images for entire tables or individual cells, borders maybe visible or otherwise, and tables can be nested within tables. Of course each table or even cell can be justified completely differently. Data or content can be manipulated, arranged or separated so easily, and given a little imagination tables can be used to form quasi graphics that look and feel like simple graphics but of course load so much faster than a similar element in a Gif or Jpeg format, this alone has to be a tremendous advantage. .. ‘Tables is real good!’
CASCADING STYLE SHEETS (CSS), are gaining in popularity, at this stage their benefits are not partiularly well known. There are some proponents who swear by CSS to organize and standardize web page design. (Find out more about cascading style sheets at: http://bytesandbites.is.dreaming.org/4free/page2.htm
With Cascading Style Sheets, you can decide how elements appear, and enter that information once. Every similar element in every page that is linked to that style sheet now has the same appearance. .. Want to make every main heading a fraction smaller? Edit the style sheet, and every such heading now has the altered appearance. .. Think how many hours’ work (and potential errors) have you just saved? Style sheets are definitely something that are well worth learning more about. There are some disadvantages using this form of data organization alone, however used in conjunction with some of the above features most of these can be overcome. They can be a very robust way of organising and designing page layout.
Owen Lamb – Lecturer, Computer Aided Design and Architectural
Technologies. Special interests; Internet and Web Site Design.
His
site is jam packed with TOTALLY FREE Advice, Tutorials, Tools
and Articles on Web Site Design and Deployment:
http://bytesandbites.is.dreaming.org email: bytes@ihug.co.nz
