Floyd Cook's Personal Website
Kaw City, Oklahoma, USA
|| Home || Biography || Resumè || Web Design Guidelines ||

 

 

Website Design Guidelines
Guidelines in PDF format.

  Sunday, April 02, 2017    

The Webmaster
Font & Background Updated -?
Uniformity Guest Book
Page Layout Links
Graphics Quality Control
Contact Info Empathize

INTRODUCTION 

These guidelines outline basics for a website that will be viewed by rural users of the Internet. These website viewers are in remote, rural, modem dialup circumstances where telephone lines may be a ‘twisted pair’ as long as fifteen miles to the central office. A modern computer with a 56 K modem may ‘fold back’ to 28 K or less in an attempt to reduce data communication errors as a result of long, noisy analog telephone lines. This person is having to deal with very slow communications technology. (Understand that a very significant portion of your viewers may fall into this 'rural' category.)  

With this viewer in mind the following guidelines outline an attempt to allow the rural viewer to view the content that they are interested in, and in a fast-load and timely fashion. That means there will be a minimum of graphics, text is just that --- TEXT --- and not a graphic depiction of text. 
Of note here is the fact that with website pages designed for fast load times on slow internet connections, those using high speed internet will enjoy displays that present the pages in a blinding flash.

The basics of website design for this viewer follows ---


STATEMENT OF INTENT

Establish the reason this website exists. 

A.) Seek agreement with everyone concerned regarding the purpose of this site. 

B.) This includes everybody’s expectations of the results of the site.

C.) Define your target viewer and what you expect from them.

D.) Determine exactly what you think your viewer is looking for. This must be done first in order to create the website with the information that your viewer is looking for. 

THE WEBMASTER

We need to remind ourselves that a website is much like a newspaper. It is a mechanism for dispensing news of some kind. The owners of the site, those who want a website, and want a website to ‘do’ something, need to look at the resource as if it’s a newsprint-like media. Going one step further, they might look at the pages of the site as pages of a newspaper. The most important page obviously is the ‘Front Page’ or, on a website, the ‘Home Page’. 

The Home Page, like the paper’s front page is absolutely critical to the success of the media. This page has to give the reader/viewer the information they are looking for – fast! Certainly, the owners of a newspaper would take great interest in the Editor of their media. That’s the person who ‘lays out’ the appearance and organization of the first thing a reader/viewer sees; the Front Page / Home Page.

The Front Page / Home Page must have a nice balance of compelling headlines, pictures, and content that will create interest in reading further and instill satisfaction that they’ve found what they’re looking for. That’s the job of the Webmaster.

In considering a Webmaster to create and/or maintain the website, the owners need to determine just how much interest the candidate has in basic journalism. Does he/she know why newspapers and successful websites look the way they look? Can this person show any evidence of their journalistic skills, knowledge, and experience? Can he or she show examples of their track record? Skills in the field of journalism are a critical element in the selection of the person who is going to be able to deliver the final product to the owners, that is; viewers who do what the website owners want.

THE BASICS OF website PAGES

Both the FONT and the BACKGROUND must promote easy reading.

NEVER, ever, use a black or dark background!  Dark backgrounds impart an immediate foreboding, depressing / sinister atmosphere to your website before the viewer has read even the first word of your message.  Backgrounds should be light colored with a very fine texture. Backgrounds should never distract from the content or message of the text.

TEXT FONT should be large, easy to read font with a very high contrast with the background color. Choose a font that you're sure will be available on everybody's PC.
This is Courier. Or choose Times New Roman. Or Arial Bold, 12 point: like this entire web page. I have yet to see a computer that couldn't display these fonts. 

Uniformity of pages.

Each individual page of a website should have a uniform and consistent look. A simple, common banner across the top, uniform background, uniform text and font, and uniform navigation bars all  help to minimize any distraction from your basic intent: which is to provide content-of-value to the viewer and without any distraction.

Page layout.

The guys and gals who layout the front page of newspapers know what the term ‘above the fold’ means. Their question is: of all the news stories in the paper, where do we put what? And why? Let’s remind ourselves: the only reason they put anything on the front page is to sell newspapers! The only reason anyone will pay money to buy a newspaper is to get information. 

Aside from advertisements, subscriptions and the paperboy, a significant outlet for the paper is the news stand and dispensing machines. There is always one folded copy of the paper displayed through the glass door of the newspaper dispensing machine. What the layout people want us to see is the news that will prompt us to put money in the machine and buy a copy of the paper.

Hence:

The most compelling news information is placed on the top half of the front page --- ‘above the fold’. The same is true of a web page. Most web pages have content that is longer than the vertical display of the viewer’s computer. Consequently we want our most compelling information to be displayed when the page has loaded. If the viewer has to scroll down to read it all, so be it. But the captivating information should not be somewhere off the bottom of the displayed area. This above-the-fold strategy is critically important on the home page / opening page or the first page the viewer sees. If the intent is to draw the viewer into the website and encourage them to view all of the pages, this 'First Page Layout' is where that will happen. 

The ‘Home’ page must capture the viewer’s interest fast. The home page must tell the viewer what site they are looking at and what they can expect. The page must display this information without delay.

Always put some news of interest on this opening page. (And update this page very frequently!) And, a note here; if you edit or add some new or revised aspect on one or more of the website’s pages, display a note to that effect (above the fold) on the opening page. I see examples where important news of interest is added to a page somewhere on the website but the opening page never mentions the new information. That’s tragic! The casual viewer will never see the info unless he stumbles on it. If you add content of value to the site mention it on the opening page. 

Above all else: the opening page / Home page should never be a 'Boiler-Plate' page, only displaying Links to news that you placed somewhere else on the website. If the content you've added is extensive at least put a brief summary of the information on the 'above-the-fold' of the Home page, then a Link.

On the subject of page layout:

The viewer should never have to use the horizontal scroll tab to continue reading a line of text that goes somewhere off the right hand side of the display screen. Learn enough about your web page editor to set the text line length so this doesn't happen. This fault will irritate an otherwise enthusiastic viewer faster than anything. Viewer's have their display resolution set for high and low resolution. Don't make your message hard to read off to the right of the display.

Frames and why not!

Frames are those web pages that have a menu for instance on the left side of the screen. And, as each menu item is clicked the page itself is displayed on the right side of the screen. Usually the left ‘frame’ is ¼ to 1/3 of the total horizontal display space. Frames do two things; they take longer to load, and they are a very poor use of your viewers valuable display area real estate. Frames can include the left side, the top, and the bottom in addition to the remaining display area.

Obviously the remaining display area is a small fraction of the computer user’s display screen. I have seen sites where the menu is all graphics on the left (slow to load) and, an identical all-text menu in another frame across the top. Redundancy Redundancy, and a poor web page layout.

Over the past several years I’ve noticed that dozens of high profile websites have asked viewers to notice their new and improved pages. Although other things may also have changed, a frequent and familiar viewer will notice that the Frames are no longer! website owners who watch the results of their website, and listen to their viewers, are asking their designers to get rid of whatever is taking up a lot of viewing space and slowing the page load time. They are getting ‘Frames’ out of their websites.
Avoid the compelling urge to do cute things on your web page with Frames. Just don’t.

THE FINE-TUNED DETAILS AND EXTRAS

Of critical importance is the ability to easily navigate the site.  

A brief, simple navigation bar should be at the top and bottom of every page. This nav bar should include a few of the most important pages on the site and certainly allow quick return to the home page. (Never force the viewer to use their Back button!)
I've noticed recent pages with nav. bars, a mix of text and of icons as navigation buttons. Bad news! If you're trying to 'get somewhere' and see a nav. bar with text, you're going to be looking for your destination as text. You'll be ignoring the icons. That makes it harder to navigate your site. Don't mix icons and text in navigation bars!

Avoid graphics.

Now I have to grant you; some graphics are necessary and even desirable. An all-text page is pretty boring. But if we are to have a website where the individual pages load fast we have to avoid graphics like the plague! If there is one thing that will annoy a viewer severely, it is requiring the viewer to wait while a page full of graphics loads from their Internet server. We see many, many web pages consisting of mostly graphics on the pages. The ‘text’ that we eventually read is not text at all, but rather is a graphic.  For your dial-up viewer, trying to extract information from these sites is pure agony due to slow page load times - because of graphics. 

Graphics that annoy and distract.

If your viewer returns to your site often to reread information or to search for new info. they will ignore the cleaver graphics that they've seen before. Indeed, they may have to not only endure the delay caused by the graphic, we find that the graphic itself is an annoying distraction. We will have placed boulders in the path of the viewer trying to get to his/her destination of information. Cute, novel moving graphics are certainly eye catchers. But they become stumbling blocks for the return viewer. As tempting as they are we must be very critical of anything on the page that will 'get old' fast. The absolute value of the graphic or item we're considering must be weighed against the annoyance-factor that the viewer will soon assign to the item. Here again, this is a subjective issue. 

Do not create a static opening page. 

This is a page with information that never changes but rather requires one to ‘Click HERE to Enter’, or has a frames menu on the left that requires one more click to get to the current information page. These static opening pages usually have elaborate graphics which require extended load times and aggravates an impatient viewer, then further compounds this aggravation by not providing the info the viewer wants, but rather requires the viewer to ‘jump through one more hoop’ to get to what he wants. 

Contact Information.

Included on all pages should be contact information. If the viewer wants to contact someone who owns or otherwise has information regarding the site’s content, that person’s E-mail address and/or phone number should be displayed. This issue of publishing one's E-mail address on a web page includes problems regarding junk mail. Hackers 'harvest' E-mail addresses from web pages, then sell these to people marketing products on the WWW. The amount of junk mail may skyrocket! Consequently, publish E-mail addresses with caution and don't display a 'clickable' E-mail address. 

Another viewer aid:

Viewers like to know how recent the information is. Imagine a newspaper that puts out a daily paper but never puts a day or date on the front page? The only reason to not put an ‘Updated’ date on the page is if you’re ashamed of the fact that the page never gets updated! Bad news. Viewers like to know that the stuff they’re reading is current information.  In FrontPage always use 'Insert', (Date and Time) somewhere on the page. 

THE EXTRAS

A quick and easy avenue of feedback is the ‘GuestBook’. Here is a free service at  http://www.e-guestbooks.com/.
This free service allows the Webmaster to maintain the look and feel of his website. The home site’s background is used in the GuestBook display. The key here is to scan the GuestBook’s entries often (weekly) to see what your viewers have said.

Another tool needed on the pages is a ‘hit counter’. If, indeed, anyone of the owners has any interest in the site’s value they need to know how often the site is being viewed. SiteMeter is a free service that provides a wealth of information regarding the viewers of the individual pages. http://www.sitemeter.com/ . This service can be configured to send a brief weekly E-mail summery report of the pages’ activity.

 Links.

One other thing. Don’t use links to send your viewers offsite. They’ll probably start surfing other areas of the WWW and never come back to your site! If you must reference an outside URL configure the link to open a new window. This will require them to eventually return to your site just to close the original window. With popup ads everywhere popup stoppers may kill your attempt to open a new browser on their machine. Some stoppers will allow it, some won't. It's a tough one. 

Quality control. Test, Test, Test.

Test individual pages on several PC’s, Mac’s, or whatever. We want the pages to load fast, to be easy to read, and to present a layout that displays like we want on all sorts of computers, browsers and displays.
"What you see is what you get" is just not true. The web page as displayed on your PC will probably look different on your viewer’s displays. Always check a new page on an old, slow microprocessor with very limited RAM and with a slow hard drive. And check the page on a slow modem dialup network. And see what the page looks like on various displays; small laptop LCD displays, etc. And notice the user's display resolution and assure yourself that they don't have to scroll off to the right to see what's there.

Test the new page with several browsers. I saw a page recently which was created with Microsoft’s FrontPage Editor. Elements of the page did not display properly on Microsoft’s Internet Explorer! (How could that happen if the webmaster tested his work?) Test new pages with IE (on a different PC) then with Netscape Communicator/Mozilla, Opera, Firefox, Chrome, and any other browser you can find.

Test the new page via 3rd party. Ask viewers to tell you what they see. (Your E-mail address IS at the bottom of each page isn’t it?) Find an editorial critic. Ask them to review the content for spelling errors, grammar, content of value, display appearance and so on. If you are lucky this critic will be a rural viewer using a totally different machine, a MAC for instance on a slow dialup modem. And, listen to what they tell you.

--- The Bottom Line ---

It is important to empathize with your viewer. Try to imagine the circumstances under which he or she is trying to view your web pages and extract information. Do at least the minimum 'market research' to determine just exactly WHAT your viewer is looking for and wants to see, and, determine the Internet access that they may be having to endure; dial up, etc. 

Create your web pages to assure an absolute minimum of distractions:
No distracting navigation graphics: no black backgrounds with low contrast text and use any graphic only if it adds to the value of the content. 

Your rural viewer will be very sensitive to ‘page load times’. Don’t insult your viewer with cute web page novelties that have nothing to do with the content of interest that your viewer is looking for.

                            Empathize ! 

© Floyd G. Cook 2001 ~ 2015. 

  April 02, 2017

Site Meter

|| Home || Biography || Resumè || Web Design Guidelines || 
The intent of this site is to provide content-of-value, fast load time with 
a minimum of graphics, and easy, flawless navigation