Designing Your Web Site For All Browsers
|
|
Let's face it. Building a web site that browses consistently on multiple platforms and multiple browsers is not always as easy as we would like.
It is safe to say that most designers spend most of their time building their sites on a given platform. Those with the highest standards should, upon completion, take a look at their creation in different browsers and different platforms.
Sure, you could see how it looks in Window 98 with Internet Explorer and let that be good enough, but do you really want to risk a bad web experience for millions and millions of potential visitors? Consider this....
A recent statistic I saw reported that 12% of internet users were Macintosh users. Ignoring this fact is like creating a catalog that can only be optimally viewed by one in eight of your customers.Furthermore, not all of the Windows users are using Windows 98. Windows 95 continues to be widely used, and Windows 2000 and NT represent a significant percentage of visitors.
It would be remiss to ignore the small, but growing contingency of Linux users. Though small in number at this time, the popularity of the OS grows daily.
Platform issues aside, Internet Explorer, despite Microsoft's inclusion of it with all Windows Installations, does not represent the only browser option. Netscape continues to enjoy a strong following of users numbering in the millions, and Lotus Notes is being used by numerous corporations as the "standard" browser and e-mail application.
Then, of course, there is AOL. Although basically an IE engine "under the hood" AOL continues to include certain differences. Considering the vast numbers of AOL users, this browser must not be overlooked. If your site does not look good in AOL, then you are risking turning away a huge percentage of potential visitors.
It should be clear that cross platform and multiple browser compatibility is a must. Therefore, understanding a few very basic and simple techniques to help keep your pages looking their best in the most places is also a must. Following, you will find a few tips and ideas to help you do just that.
#1 Paint the canvas your visitors will see
As a web site designer wanting to be as efficient in my work as possible, I have configured my Mac to use two monitors. As my mouse leaves the screen of one, it appears on the other. Thus, I have a canvas that, on most days, is 1856 pixels wide over 32 horizontal inches. If I want to, I can easily boost that to over 2000 pixels wide. But, my clients and the average visitor on the web do not have two monitors. In fact, most of them have the screen resolution set to 800 X 600 or 1024 X 768. What's more, every single time I have gone to a client who uses AOL, their browser window opens to what looks to be a 640 pixel wide default no mater how large the monitor or screen resolution.
On one of my first projects, I had designed a site to a modest 700 pixel wide format with a nice top navigation area. I went to my clients office to get some "point and discuss" feedback to find her new 21 inch monitor -- set at 640X480 resolution. My designs looked terrible!
If you intend your web site to appeal to the broadest range of visitors, you need to design in a way that will look good even at low resolutions. Check with some of your typical visitors and see what kind of resolutions they normally use.
#2 Use Tables to Control Width
Tables are great things when trying to control the way text and images go together. In order to achieve a nice looking design, using tables is the first technique to consider.
Tables can be assigned a fixed width in pixels or a fixed percentage of the window width. There are advantages to both approaches. If you are not concerned about the relative vertical arrangement of objects in a table cell, using the fixed percentage allows for more fluid layouts.
If, however, you want to keep text wrapped around an image with more consistency, using the percent approach could lead to major differences. Text will wrap quite differently in a cells of different pixel widths.
To have better control, consider using fixed pixel width. However, you must now start making some compromises. If you want to offer a site that looks good at 640X480, you will need to set your table width to 600 -- 620 MAX! You will want to center the table in the window to provide a nice look when wider windows are used. However, if your visitor has monitor resolutions set to 1600X800 and has the browser "maximized" your page will have 500 pixels of blank space on either side of your 600 pixel table.
Fortunately, few people will be browsing at this configuration. My experience visiting clients, friends, and family suggests that, even if monitor resolution is set at over 1000 pixels, the actual width of the browser window will be reduced to something less.
You must decide if you will risk an odd looking page for those few who have HUGE monitor resolution or risk the annoying scroll bar for those with the basic 640X480
#3 Compromise your Font Use.
Supposing you select a fixed width table and have a cell that is 300 pixels wide. You write a headline in this cell, pick a font, and size it to look just right. Good for you. Too bad that headline will come up different on different systems.
Even on the same computer, there are very slight differences between how Netscape and IE render fonts. Remember the 1 in 8 visitor using a Mac? For technical reason it is beyond the scope of this article to describe, fonts are significantly smaller on a Mac than on Windows. Don't forget that your visitors can also set the default size for font display in their browser, too. If they do that, you are really starting to lose control of how fonts are displayed!
One solution is to use cascading style sheets, but that technique goes beyond the casual designer's typical experiences. The other solution is to compromise. Make sure that it looks good on the predominant platform -- currently Windows -- but don't use the smallest font possible either or your Mac visitors won't be able to read it!
#4 Check Your Final on Multiple Platforms
I commit to my web design clients that their site will be look good to ALL visitors. To make sure this is the case, I have an Intel computer as well as my Macintosh. I have the Intel computer configured to boot into Windows 98, Windows 2000, and Linux. I test all the pages I design in these environments. I test in both Netscape and Internet Explorer on the Windows systems and the Mac. I enlist a partner to test with Lotus Notes and AOL.
This may seem excessive, but frequently there will be some little thing that shows up in one of the platform/browser configurations that requires some minor correction. Would it be good enough if I did not make the correction? Probably. However, it is always best to make a good first impression and on the web, where you have about 5 to 7 seconds to get visitors to commit to take an actual look, every little thing counts.
If you do not have access to multiple platforms, enlist your friends. Stop by a library or a Kinkos and use their computers (often these places may have Macintosh computers as well as Windows computers).
These four simple suggestions are the beginning of a journey toward the much larger goal of making the content of your web site universally available to your visitors. Ultimately, reaching this goal depends upon many factors. However, progress toward this goal must commence with awareness.
Understanding that your site will appear differently on different browsers and based on different user preference settings is an important first step toward awareness. Using tables and being conscientious with your use of fonts takes you one step further. Checking your work on various systems will begin to hint at how much further you have to go.
But, every journey must begin somewhere....
About The Author
David Bell
Advertising research and development center
|
|
|
Created & Maintained by Empower! CMS Web Sites
Host2Sell Web Hosting | Emarketing Workshops | Site SEO Review | FREE NewsletterAn Ideal Home Business Home Page
From my personal experience of around two year as home business website operator as well as owner, I have spent enough time learning and unlearning. Observing other sites and constantly reading and contributing in online forums about managing a website.Having a website is all about being able to draw targeted traffic to you site. The more the traffic- betters the sales- improved commissions. This is everyone's ultimate goal behind runnin...(related: Web Design)
The Technology May Change, But Human Nature Remains The Same
Let me repeat that.."The technology may change, but human nature remains the same!"In this wonderful Internet Age, we are all struggling, and succeeding to different degrees, to keep up with the technology. It's a never-ending battle. Web Technology! When it's good, it's often poorly executed, and when it's bad- it's fatal.Frankly, much of the time, the technology gets in the way of the sales and communication process. Unfortunately, it seems that many people responsible for website design understand the technology available and what they want, more than they understand their fellow man- their potential customers, and what THEY want.Whoever...?Whoever got the idea to ask for your name and email addresses before you can enter a site? Try that outside th...(related: Web Design)
Creating Quality Websites
Websites, there are literally billions of them out there in cyber-space. How many of them do you go to and just think this is boring, bland, or hard to use? It seems like too many to mention. So what makes a good website? I reckon it's about interaction. You've got to make the visitor interested. You've got to grab th...(related: Web Design)
7 Benefits Of Html Validation
You may not bother with html validation or writing simpleand clean code when designing your web site. Later you mayfind your site is slow loading, appears incorrectly in themain browsers and does not rank well for the major searchengines.Now there are sites that still do rank well even though thehtml code has many errors. This is because most of thecurrent major browsers are still very forgiving of htmlmistakes, however future browsers will become more htmlcompliant as the Internet ad...(related: Web Design)
Creating A Compelling Headline For Your Private Practice Website
Your home page is the most important page of your website. It is the one that will determine what your potential client or customer does after they arrive (i.e stays at or leaves your website).Research on web usability shows that you only have a few seconds to catch the attention of your website visitors. One of the most important ways to do this is through your opening headline.Your headline's main purpose is to attract attention and generate enough interest so that your visitors keep reading. It's a first step in a process where your goal is to eventually convince them to take action on your offer.Here are a few tips for crea...(related: Web Design)
Size Does Matter!
In this article we will be looking at why you should keep your web page size small.As any good webmaster knows you should keep the web page size small, but why? It's really simple, both spiders and visitors hate web pages that take forever to load because it's harder to spider the web page or for the visitor they just don't have time to wait for your web page to come up, after all most web sites are not that great, so why wait if your the visitor?You should keep images down in...(related: Web Design)
What Your Website Really Says About You And Why It Matters
Everything you say and do says something about you. This has never been more true than in a text based environment like the Internet. You only have one chance to put across what you want to say. Use it wisely.Getting a website right does take work and commitment. If you want it to succeed you must spend time to get it right and present the right impression to your potential customers.During any conversation you can pick up extra clues from tone of voice, the choice of words used, the way it is said, pauses, etc. They provide emotion and meaning over and above the actual words being spoken. The same is true of text and other website content. There are extra clues of emotion and meaning and what you choose to write and how you say it can say a l...(related: Web Design)
The Golden Rule Of Website Building
Copyright 2005 Robert EvansSetting yourself up to earn a steady monthly income has to be a pre-requisite to your success online. There is no doubt that large sums of money can be made (and indeed are being made) from s...(related: Web Design)
Why Content Is King Of Website Design
If there's one thing that most web site developers can agree on, it's this: content is king.That's not, of course, to say that good design doesn't matter. It does. A good, clean design, which is easy to navigate and optimised for search engines is absolutely essential if you want your online business to be a success. When you get right...(related: Web Design)
Becoming A Website Designer
The ability to create simple, attractive and functional webpages is a highly marketable skill. There is a huge and growing demand for websites and web content, especiallyfor smaller organizations who often can't afford to hirea fu...(related: Web Design)
Online Advertising: 10 Tricky Secrets To Keep Visitors Glued To Your Website And Increase Sales
It is common sense.The more time people spend at your web site, themore likely they will know more about your productsand services.The more time they know about your products and services, the more the chances of them buying from you will increase.Below are ten online advertising powerful ways tokeep visitors at your web site longer.1. Provide your web site visitors with content theycan't read anywhere else. People will stay longer atyour web site to read the original content.2. Remind your web site visitors they can print outyour content. They may browse around your onlinestore while it's printing....(related: Web Design)
site-map - Copyright © 2006 Empower! Web Design | All Rights Reserved. | Web Design