Easily, one of the biggest mistakes webmasters make when first starting out on the web is in the design of their site. This is extremely understandable, considering that, in the brick and mortar world, a business’s success is often dependent on it’s appearance. The more money put into the look and design of a business, the better it often does.

Unfortunately, this doesn’t completely transfer over into the world of the web. In the world of the web, there is a huge difference between creating an aesthetically pleasing site, and creating a site that is going to be functional and have the best possibility for success.

All too often, when people first begin on the web, they design their site as if to be a work of art. Making sure it has lots of beautiful graphics, fancy javascript, flash, etc. While all of these things can definitely create a beautiful site, they are also some of the biggest hindrances to a business’s success.

On the net, there are two key things a webmaster must always keep in mind when designing a site; the visitor and the search engines. If a visitor has to wait to long for a page to download or a search engine can’t properly index a site, it doesn’t matter how beautiful and informative the site is, it will not generate the business needed to survive, much less excel.

Let’s look at a few of the most common things you should be aware of.

*Page Size*

While broadband access is gaining ground, at least half of all internet users still use dial up connections. This means that the majority of a sites visitors will be downloading the pages at about 3-4 kilobytes per second.

It is estimated that if a page doesn’t load within 8-10 seconds you will lose 1/3 of your visitors. That means that a page should not be any more than 30 kilobytes total including text, graphics, html, javascript, etc.

Logo’s, backgrounds, and other images, are great, but if they are causing your pages to load too slowly, they are doing you more harm than good. Quite honestly, your visitors do not care about your logo, graphics, backgrounds etc. They are there for one reason and one reason only….to see what you can offer them.

If you must use graphics keep their file size as small as possible by optimizing the graphics to the utmost extent possible and keeping the image size small.

*Splash Pages/Flash Intros*

These are the bane of the internet. If you have a splash page whether its made up of a large graphic or a pretty flash intro, you are crippling your chances. Design firms often love to talk their clients into these pages because they get to be creative (oh..and charge more).

The truth is, creating one of these pages as the entrance way to your site is one of the single worst things you can do. Visitors hate splash pages, because they often take too long to download and they don’t provide with the visitor with anything. Remember, the visitor is there for one reason, to see what you have to offer them and get the information they are seeking. A huge graphic doesn’t answer any of their questions, it only delays their search.

A Flash into is much the same, while it will generally download very quickly, it still delays the visitor in finding what he or she is looking for.

One of the biggest rules you should remember is to keep the amount of clicks a visitor must make to get to quality information down to a bare minimum. With every successive click a visitor must make, there is more of a chance he/she will give up and go somewhere else.

I’ve seen many reports from different sites that used (notice the past tense) Flash Intro pages. Hardly surprising is the fact that on average, a whopping 20%-30% of the visitors left the site after accessing ONLY the homepage (where the splash page or flash intro was).

The second reason to stay away from these is that it has a huge affect on search engines. Search engines can only index text, a huge graphic or flash intro doesn’t give the engines anything to index. As a result the homepage, which is often the highest ranking page on a site, has almost no chance of ranking well at all. In addition, depending on how the links from the graphic or flash to internal pages are coded, the engines may not be able to follow the links to the rest of the pages on the site which means your site will not get spidered properly.

To summarize, stay away from splash pages and flash intro’s. Give the visitor some actual text to read and the engines something to index. Your visitor retention will go up, and so will your search engine traffic.

*Hyperlinks*

Hyperlinks are your bread and butter when dealing with the search engines. They are the way in which search engines find all of the pages on your site and index them. If a search engine can’t follow a hyperlink, it won’t be able to index the destination page, meaning parts of your site may become invisible to the engines.

Be sure to use only true hyperlinks in your site. I’ve seen many sites that use some javascript links instead of actual hyperlinks. While these will work for most browsers (about 90%), they don’t give the engines anything to follow.

A true hyperlink should say:

href=”URL of page here.html”

Any other type of link is most likely not going to be followed properly.

*Body Text*

As I mentioned before, engines can only index text. Too often I see sites that use graphic representations of text or a large graphic that has some of their most important text within it. Do whatever you can to stay away from this. If your most important words are in graphic format, you have taken away the thing that the engines need most to properly index and rank your site.

Engines also want to see continuity in the structure of a page. When a webmaster uses lots of tables, frames, and other design elements, it breaks up the flow of the text on the page, and can have a negative effect on your rankings.

Whenever possible, use as few tables as possible. When you do use tables, do your best to not break up a paragraph or sentence into separate cells in a table, this destroys the flow of the text and causes the words to be seen as unrelated fragments instead of part of the same continuous sentence/paragraph.

It is important to realize that engines do not see the pages the same way a visitor does. While the visitor sees the page displayed properly with all of the next flowing nicely, an engine sees only the HTML code behind the page that breaks up the flow of the text.

In general, the simpler the page and the HTML behind it, the better the ranking will be.

*Summary*

Always be sure to be aware of the impact that a particular design element will have on both your visitors and the ability of the engines to properly index your site.

By understanding how the engines work, what they look for, what they can and can’t do, you will vastly increase your chances of successfully achieving the rankings needed to make your business a success.

John Buchanan is the author of the book “The Insider’s Guide to Dominating The Search Engines”, and publisher of “The Search Engine Bulletin”, a FREE monthly newsletter. Visit him at http://www.se-secrets.com for more information or to sign up for the newsletter.

DESIGNING WITH STYLERichard Igoe

One important aspect of good design is to give your site a theme and coherence. A great deal of this can be done using a stylesheet.

Using stylesheets is not difficult. In fact it makes the task of designing a website that much easier. However many new designers don’t use them.

But before dispelling some of the confusion, let us look at the advantages of using CSS - cascading style sheets.

ADVANTAGES

1) You can use an external stylesheet to control the look and appearance of your whole website, such as the font size, style, and color, the background image, the background color, etc… by changing a single file. You don’t need to edit every page.

2) Linking to a stylesheet reduces the size of your web pages and gives you much cleaner HTML code because you don’t need to specify the font, color, or “style” of every element on your page.

3) Web pages are displayed differently on different browsers and platforms. For example a 10pt font looks fine on a PC but becomes too small on a Mac. You can use a browser-detection script in the header of your pages which will link to a different stylesheet depending on which browser is being used.

The rest of this article assumes you have a basic understanding of HTML tags, the code behind your web pages. If not you can get our simple HTML tutorial at - http://www.thewebseye.com/HTML.htm.

Now using stylesheets is actually easier than HTML. The main cause of confusion is that you can either link your web pages to an external stylesheet, or you can include the style sheet in the header of individual web pages inside STYLE tags. Web design software does not always make this clear unless you read the HELP pages in detail. Forget your web design software for a moment, because it is easier to understand stylesheets if you take a look under the surface.

An external style sheet can be as simple and powerful as this:

BODY { background-image: url(images/mybackground.gif); background-color: #FFFFFF; }

P { FONT-FAMILY: Verdana, Helvetica, sans-serif; FONT-SIZE: 12pt; COLOR: navy }

You copy and paste the above in Notepad, Wordpad or other text or HTML editor, and save it as “mystyle.css”. Put this stylesheet in the same directory as your HTML files. Note the “.css” extension is important. Then you link your web pages to this stylesheet by putting the following code in the HEAD area of your pages.

< link rel="STYLESHEET" type="text/css" href="mystyle.css" >

It is now easy to change the background image or color of your site by simply changing the variables in the stylesheet. You can also change how the text in your in your website looks Anything in “P” tags on your web pages takes on the “P” attributes specified in the stylesheet. The above will make your pages display Verdana text (and you give the option of Helvetica and sans-serif in case your visitor’s computer does not support the first choice) which is 12 pt and navy.

The next source of confusion is the use of the CLASS attribute. But this is also real easy and very powerful. It is best explained by adding another style to our stylesheet explained above.

P.redtext { FONT-FAMILY: Verdana, Helvetica, sans-serif; FONT-SIZE: 12pt; COLOR: red }

Now what this allows you to do is make certain blocks of text red. In your web pages, instead of a simple “P” tag around your text, you would add class=”redtext” to the “P” tag and the text inside the tags would be red.

You can have any number of classes and assign classes not only to P tags, but also to your table data TD, your links “A” and any tag contained in the “BODY” of your web pages. And by simply changing the stylesheet you can change the look of your whole site. Are you beginning to see the power of using style?

It is however important to realize Netscape and Internet Explorer deal with stylesheets differently and Netscape does not support them as fully as IE. Netscape basically takes the inheritance a step too far. The only way to find out what goes and what doesn’t is by trial and error, however there are a couple of resources which will help you a long way with understanding more about stylesheets. We have listed links to these resources at http://www.thewebseye.com/stylesheets.htm.

With simple stylesheets you should have no problem and they will really help to make sure your site keeps a certain amount of uniformity and cohesion.

Richard Igoe - http://www.TheWebsEYE.com. Get his latest Free Website Success Course by sending a blank email to mailto:wsc@quicktell.net and find out whether you have the 6 essentials of a successful site!

-

What to look for when choosing a website designer to design your website

When you are needing a website design there is a lot of important factors in this process, and a lot of question you should ask before choosing a website designer, I have always heard a lot of clients didn’t quite get what they wanted, or had in mind. PortfolioAsk if designer has a portfolio, or has any current website to show, or just take a look at there current website, and see how it looks. I would always make sure you talk to the actual guy that is designing the website so the work is not out sourced inless its a well trusted company. Custom Programming and DevelopmentA lot of things that I have notice clients that have been getting website designed is that it didn’t look 100 percent the way the wanted or had the functionality in mind that they wanted. i would highly suggest talking this over with your website consulter, and more then anything I would recommended choosing a custom programming job if you think there will be complications to this.

Search Engine MarketingAlways make sure the individual, or person your dealing with know SEO / SEM which is search engine optimization cause keep in mind you want you site to be search engine friendly, this is another big problem there is a lot of design firms out there designing website, but not designing them for the search engines, and specially if you going to have a on line store you want to make sure its liable of this. I have went over a few things just to give you a few ideas of what you should look for, but keep in mind that there is many more important factors, and i would highly suggest checking out SEO / Website Design News for up to date question, and tips on seo, and website design.

Source: Free Articles from ArticlesFactory.com

ABOUT THE AUTHOR

Tags

Uncategorized