web page formatting

[areed3]

I have discovered that the web page I create doesn't always look the same on other computers. I was wondering what other people do to have some sort of universal look to their pages, so that on other computers, text is not set right or images move around depending on settings.

[Bekariso]

Hi areed3, welcome to the forums!

That's a tough question you ask, with a lot of answers, I think, since you can't make your page look *exactly* the same on every computer.

The two things beyond your control that affect how your page looks are 1) the monitor that the person viewing your page has and 2) the browser they're using.

For example, I have a monitor that displays things -- oh, I forget the exact numbers, but it's about 600 by 800 pixels. Older monitors show something like 480 by 600-something pixels. Newer monitors, such as the one my housemate just bought, show 768 by 1028 pixels. What this means is that if you have a image, say a background, that is 1028 pixels wide, I'm not going to see all of it on my monitor. (Pixels are the smallest dots of colour that your monitor can produce)

Browsers usually word-wrap automatically, so the number of words on a line will vary with different monitors, but if you put your text, images, and other content in tables, then you can size the table by pixel width (ie width=750), so that it is the same number of pixels across no matter what size monitor is being used. The problem with this is that if you size it for one of the higher-resolution monitors, the poor person using the older monitor is going to lose part of your page off the right of the screen, and will have to use the scroll bar on the bottom of their window (as well as the one on the right) to move around your page to see all of it. If you size it for those crappy older monitors, though, on new monitors your page is going to look like a column of content down the left, or down the center if you center your stuff, with empty space on the side(s).

Another option then, would be to put things in tables and use percentage-widths, for example, width=90%. That would leave a small neat margin down the side (or sides if you center) no matter what monitor they have. You'll just have fewer words per line on the older monitors. And some HTML-checker bots tell me that tables load a few milliseconds faster if you specify your width in pixels rather than by a percentage of the browser window.

While I'm on the subject of trying compensate for other people's monitors, I might also add that some monitors have trouble with some colours, for instance, this monitor doesn't like green. It will do brownish-yellowish green, or bluish-greyish green, but a true forest green is out. When I use greens on my pages (which I like to do, green is good), I have to use my housemate's puter, or the puters at school, to make sure the colours are what I want.

As for how things appear on other browsers, many browsers are freeware for personal use, or shareware, so if you've got the disk space, you could download a couple others and use them to see how your page looks. At http://www.websitegarage.com, you can do a free "browser check" which will show you a "snapshot" of what your page will look like in about 8 different browser programs. You can also put one of those little icons on your page saying "best viewed with Netscape 4.x" or "best viewed with M$IE 4" or whatever.

Also remember to code in your background and text colours, because with most browsers, they can set the default colours to whatever they want, which probably won't be your default colours.

You can also code-in your font face, because people can also change their defaults. I think the universal default is Times New Roman, but this page uses Verdana (I think -- or is it Arial?). A group of standard fonts, such as Times, Courier, Verdana, Comic, and Arial comes with MSIE, I think, and will be installed on your puter for all programs to use, but if you call for a font that the person does not have installed, then their default for that font type will show up. So . . you can put a link to where they can download zip files of the fonts you use on your page -- fortunately, these download much faster than a "best viewed with" browser that your visitor doesn't have!

I hope this helps, if you want me to clarify anything, or if you want to know more about tables, fonts, colour coding, or even why I spell colour with a "u" (A: I'm Canadian), feel free to write back.

Good luck!

Bekariso

[This message has been edited by Bekariso (edited 11-20-98).]