PPC> Web building> Design 

Making your Website visible

No, nothing to do with search engines, but a few pointers to making the text and pictures on your website easily readable and, therefore, more likely to be revisited.

Have you ever been to one of these websites that promise much in terms of content, but, when you get there, prove very difficult to read? There are some very simple rules of thumb that can help you, and a novice web author, avoid the problem of the illegible website.

Size is important

No matter what anyone else tells you, size is important – well, on the Web, at least. The page you’re reading now, for instance, is set in Verdana at 8 point. That means that, if you’re reading it in a browser other than the default AOL browser, you can resize the text to make it larger, although you shouldn’t need to, unless you’ve got vision problems.

There are three ways to specify the size of the text in your web pages, and each has its uses, depending on what you consider your audience is. They are: 

1.       HTML Text Size

2.       Point Size

3.       Pixel Size

HTML Text Size.

In Front Page (shown right), when you drop down the text size selector, you’ll see that each possible selection is numbered – from 1 to 7. They’re the first selections you’ll see – if you scroll down further, there are others, but it’s these six we’re concerned with for now. As the illustration shows, each numbered size has an associated point size, ranging from 8 point to 36 point, and beginning with “Normal”.

“Normal” is the default size for your template – in PPC’s case, we define it as 8 point, but the default size in Front Page is 2 (that’s ten point).

Don’t, though, be confused by the point sizes associated with the numbered sizes. They’re for guidance only.

You see, in your browser (I’ll take Internet Explorer as a reference here, but it applies equally to most other browsers, too), you can set the text size to suit yourself. It comes under the <view><text size> drop-down menu, and, as you can see, you’ve a choice of a number of empirical descriptions, ranging from smallest to largest.

By changing your selection, you can scale the text on an HTML page, so moving from “Medium” to “Larger” would take size 1 text to size 2, size 2 to size 3 and so forth. Going smaller doesn’t make size 1 text any smaller, however – that’s the minimum size.

When you create your web page, it’s worthwhile checking in your browser to see how it looks in each setting – you may discover that it’s fine at “medium”, but loses all its coherence at “Large”. The question is, if the layout of the page is that critical, is there any way to overcome this?

Well, yes, there is – the second way of specifying text size – Point Size

Point Size

In Point Size mode, you can’t use Front Page’s size picker – you need to use embedded Style Sheet stuff, and set an explicit point size. This time, it works pretty much the same way as setting the point size of text in, say, Word would – the text is set at 8 point, and cannot be resized. It will show at 8 point in your reader’s browser, no matter what. This might cause a problem on some browsers, especially with Macs, because they deal with point sizes somewhat differently from the way a PC handles things. 8 point on a Mac is barely legible in a word processor, never mind a web browser, and 8 point on a massive resolution on a smallish monitor might also prove difficult to read.

I’d better explain that a little. My own monitor is a 21 inch Taxan ValueVision 2175TCO, and I run Windows at 1600x1200. 8 point text is fine on that, but if I was running such a high resolution on a 17 inch monitor, 8 point text would be practically unreadable – and it may even be hard to see on a 19 inch monitor.

If you know your audience, and know what the majority of people are using in terms of browser and screen resolutions, you can better judge how to set the text on your page. Here at PPC Towers, we collect statistics on all the browsers and desktop resolutions that access us (it’s OK – they’re completely anonymous, we have no idea who you are!). We know, for instance, that the most popular screen resolution is 800x600, and only very few readers use a resolution higher than that, in percentage terms. We test each page at all resolutions up to 1600x1200, and we know that the way we set out the HTML is readable at all of those. We actually use the point size method of specifying text size, because the layout of the page can be critical to its legibility and meaning.

What we don’t to is use the pixel size method, and here’s why:

Pixel size

If you design a page that’s precisely measured in pixels, and is intended to be viewed at precisely that size – where layout is of vital importance, you can choose to specify your text size using a pixel count. I’m not going to tell you how to do this, since I rarely recommend that anyone uses it. The reason is that an 8 pixel font is precisely 8 pixels high, and it can be completely illegible on higher resolution desktops. The thing is, you can set any pixel size you like, from 1px to whatever. The potential for looking foul is amazing! Don’t go there.

Phew! I had intended to mention backgrounds and colours when I sat down to write this, but they’ll have to wait for another day. In the meantime, give your text sizing some thought when next you’re creating web pages, have a play, and see how they can affect how your readers see your pages. Remember, if they can’t read what you’ve got there, they won’t come back!