Tryangled Solutions web designing tips tricks

If you are building only a one or two or even three page (or personal) website, you do not really need to plan(though it would not harm to plan). But if your website contains ten plus pages, it would probably be to your advantage to plan.

What Your Visitors Want

When you visit a Web Site, you usually have a reason for going there. Even if you stumble upon that website accidentally, there is something there that grasps your attention and interests you.

Therefore, through out the whole planning process, you should consider what your visitors expect to see on your site. You should have a clear idea of which type your visitors are. For example, will they be old or young. If they are old, then you should make the design really simple and without the flashy flashy. If your target audience are kids, you could then include all the flashy flashy, without which they would not be attracted!.

So, you see, it is imperative that you have an idea of the type of your audience.

Site Organization

The most important thing in your website could be your site structure. May be, because of your clumsy structure, visitors leave your site. Therefore, it is necessary to have a structure that suits your site and is friendly for the visitors. Aww… why care about the visitors??? Because you have to! Otherwise you’ll be outta business!

There are two main types of organizational techniques, namely hierarchical and linear. Let us have a look at them now:

Hierarchical Organization

In this type of organization,all the pages (except for your home page), are grouped and are connected to the home page. The pages in the groups are connected to each other and they may be connected to the home page also, but the main page(or the home page) of that group should always be connected to the home page.

The home page is also connected to the main pages of each group and all the pages of each group are connected to the main page of that group This type of organization is suitable for websites which have a huge amount of content which can be divided into groups. The reader knows at every point his position on the website. However, it is not suitable to have too many groups as the reader may get confused.

Linear Organization

In this type of page organization, all the pages(including the homepage), are connected like the pages of a book - one page comes after another. This type of organization may be good for Do-It-Yourself type of websites, as steps often have to be followed in order. All the pages are connected in a “Back” and “Next” order. This type of page organization is good for several types of websites, but it limits the reader’s freedom of roaming around the site as he pleases. You could also add a “Home” link on every page to take the reader to the home page directly from each page.

A Mixture of Both

You could also use a mixture of both hierarchical and linear organization for your website.For example, the contents of your website could be divided into groups and the pages in each group could be connected to each other. This way, the reader would have more freedom to roam around your site.

Webbed Organization

This is another type of organization. In this type, several pages are connected to each other like a web. But too much use of this and your visitors could easily become disoriented and lost.

Navigation Tips

Navigation always will be a very important part of a website. Navigation can make or break the possibility of having more readers.

Unfortunately, navigation is the least of the worries of many webmasters. Bad navigation is also one of the main causes for declining or few visitors. Make sure you don’t fall in the trap! Do not confuse the reader with navigation

You cannot afford to lose your users in this way. You should, at every page of your website, let the user know where he or she is. One way of doing this is to use meaningful URLs. For example the URL to this tutorial is:

htmltheeasyway.com/basics/planning_and_design.shtml.

Anybody who sees this URL can tell that this page has to do something with planning and design of something. So it does not confuse the user. Now compare the above URL with this:

htmltheeasyway.com/b/122.aspx

Can you work out what the page is about?? Neither can I. Therefore, it pays to have meaningful URLs.

Another good way is to have a breadcrumb trail on the top of your pages.It is a textual representation of the site or directory structure, showing where the user currently is, so the user is not confused. We also have one on our site.

Keep it Simple

Yeah, you must keep it simple. Fancy JavaScript mouse-overs and mammoth size images only worsen the miseries of the reader! In addition, they also slow down the speed of loading, further disillusioning the user with your site.

Try to use text-links instead of images and use CSS mouseovers. CSS mouse-overs are a lot speedier than Javascript mouse-overs. Also, as much as possible, use simple text in place of images. For example, as I have done, you could use some clever bits of HTML and CSS to make simple text look like images. Look at the htmltheeasyway.com logo, for example, Using CSS, I have made it look like an image, but in reality, it is not!

Website Design

Believe me, website design can make or break a website. Too much of flash and mammoth sized images resulting in long load times and your users would rather sleep than wait for your site to load. Keep it simple and easy on the users. Here are some tips..

Page Design

When designing your pages, you should always try to make the user experience similar to the real world. For example, most languages like English are read in a left-to-right manner. So if your target audience is an English one, you should position your elements in such a way that your users do not feel much different. For example you could place the navigational menu to the top or the left of your page, etcetera.

Oh, yes, if your target audience’s language is one which is read right-to-left, such as Urdu, you could position your elements in a different manner, such as the navigation on the right, etcetera. So forget all those weird designs you have in mind and design for your target audience to make it easier for them.

One thing to remember, your visitors want to the see content that you have on offer, not to see how much you have decorated your website through flash and mouseovers and all that. Now by this I do not mean that you should not do any thing to make your site attractive, but you should try to remain in between the two extremes.

Now on to the actual design of your website’s pages. First make a vague(or as elaborate as you want) sketch on paper about what a page will basically look like. Then on a graphics program like Serif PhotoPlus, on a canvas of about 783 x 398 pixels(this is the minimum amount of free space on a 800 x 600 screen), draw the layout of your pages, with colour and all(What looks good on paper, will not necessarily look good on a computer screen, so it is best to design your site on the computer only). And then, through the help of this basic layout, begin to code your webpages.

Site Structure

The next important thing that you have to look into while designing your site is your site structure. You must decide which kind of organization to use on your site: hierarchical, linear or a mixture of both. I have explained all of these above. Before you begin on your site, you should have a clear idea on the type of structure to use. You can get a laydown on these three types above.

These twenty mistakes are the difference between a very poor website and a very good website. You may know some of these mistakes already, but if you have avoided or corrected all of them you are almost certain to keep visitors coming in and coming back.

This list is especially important for new designers, amateurs or the experienced but sloppy who need a list to work from for a website spot check.

1. Bad Layout and Design - Yes, there are some ugly, unbalanced or overloaded webpages out there. Make your page a pleasant viewing experience. If you are not sure about the looks of you design, then let some people see a screenshot of your webpage.

2. Non-Standard Links - Why confuse your visitors with links that are different colors or fonts that vary from page to page. Don’t frustrate your visitors, it shouldn’t be a guessing game.

3. Iffy Navigation - Take it easy on the moving objects, trailing images and other stuff you see on kids websites. It’s just not that entertaining and it can get in the way and distract your visitors. Keep it stable easy to find and read.

4. Slow Pages - Who wants to watch your dumb load meter rack up the percents of loaded kilobytes or megabytes? Keep your pages lean and fast, under 50k if possible. Do not bore your visitors.

5. Wild and Crazy Color Schemes - Some pages look idiotic with overly bright colors, maybe even revolting. Your texts must be easy to read, not a sensational nightmare.

6. Spelling and Grammar - Errors in spelling and grammar make your page look amateurish or childish - always spell check.

7. Page Text - Keep your pages easy to read. Break texts into paragraphs or blocks. People scan pages more than they read them, make it easy on them.

8. Font Style and Size - Choose easy to read fonts and use the right size - not micro reading or headlines on every line.

9. Dumb, Out of Control Music - select background music that fits the subject matter and make sure it can be turned off easily.

10. Under Construction - Avoid having a visitor coming to you closed or not yet opened website. What’s the point? Give them a single page of content with a notice as to when the whole site will be available.

11. Untested Web Site - Always look at your website in multiple browsers and make changes accordingly before uploading your site to the web.

12. Sloppy Texts - Make sure all the right words are in all the right places - “Content is King” for readers and search engines.

13. Old Content - Updating your website is important, visitors need to see something new once in a while.

14. Too Many Clicks - Why should a visitor have to jump through page after page to find anything on your website. Make sure everything is only 3 clicks or less from the homepage.

15. No Contact Information - Keep your contact information easy to find and easy to read.

16. Free Hosting Service - When you see a webpage that has a name so long that it has at least one period in the middle of it you know it’s a free hosting situation. Everyone knows the limitations of free hosts and the limitations that they place on a webpage. Don’t use a free web host if you want to be taken seriously.

17. Advertising - Do not overload you page with ads, especially the big grotesque banners. Well placed, well designed ads are okay if you don’t overload the page.

18. Bad Images - Don’t make a visitor suffer missing graphics file or badly shaped or cropped images. Optimize your images and use the best heights and widths, and keep your files in the best formats - jpeg for Photographs and gif for artwork.

19. Website Best Viewed - Don’t say this on your website, it looks like a beginner’s website.

20. No Prices - If you sell something don’t waste your time hoping you will get email inquiries on your prices - just include a price with the item description.

That should do it. Follow these directions to correct the 20 most common mistakes in website design to make sure your webpage is in good shape.

1 — Fast Loading Pages

Pages should load fast. Most people will leave your site if it’s not done loading in ten or 15 seconds. And even if you have a fast internet connection, not everyone does and 56k modems still exist.

2 — Easy to Read Text

Text should be easy to read. The text size should be big enough, and the background should not obscure your text. If you want to be safe, use black text on a white background. If you want more color, choose very carefully to make sure it’s still easy to read.

3 — Intuitive and Easy to Navigate

Your website should be easy to navigate. Each link should be clearly identified as such and graphic navigation elements like buttons and tabs should be easy to read and use. You do not want people leaving because they could not figure out how your Flash menu works.

4 — Consistent Layout

Your layout and design should be consistent. If you switch between styles too much, you will confuse your visitors. If the design is too different, people will believe that they are now on a different website since the layout changed.

5 — Less is More - Sometimes…

Avoid music and sounds. Very few people like to have music forced on them while they navigate, especially if they are already listening to music or surfing at their job! If you really cannot do without music, turn it off by default and ask visitors to start it themselves.

6 — Pay Attention to Browser Compatability

Design for browser compatibility. Many people do not use Internet Explorer on Windows. Make sure your site is at least viewable in Mozilla Firefox and Opera (if possible, you could even try testing on a Mac). Sites that target markets like technology should be more careful, since readers are more likely to use the newest browsers and gadgets like PDAs.

7 — Screen Resolution - Still Matters

Design for all screen resolutions. You may like to surf in 1240×1080 with your new screen, but some people still use 800×600, or even 640×768! A site that looks perfect in high resolution may turn out to be impossible to view correctly in 800×600.

This is just a begining to what I hope will be a growing list of web design tips (please submit tips through comments) and one that evolves into more advanced design tips. Please provide some feedback and tips of your own so I can get a better sense of the level of our readership.

The Most Useful Design Tips of the Year

The Internet is changing with the development of Web 2.0, and the changing marketplace reflects a need for increased usability, easier functionality and design that is visually appealing but that still lends to an easy to maneuver, content-rich website. The following is a list of ten top website design tips that made a difference in 2008.

1. Know the audience: The design of your website should cater specifically to your target market both in the visual sense, and in usability. It is critical that the design of your website reflect the values that your potential customers will hold.

2. Personalize: Even if your website is designed by the greatest professionals in the business, if you do not allow your customers to get to know you, or to believe in you, you will have difficulty selling your ideas.

3. No uncertain terms: Clearly identify what the purpose is for your website, and ensure that every facet of your website focuses on this goal. Are you conveying a message, selling a product or offering a service? Make this obvious from the beginning, and keep your focus until the end.

4. Keep it quick: You have between ten and thirty seconds to capture the attention of your customer, so keep graphics small in order to minimize the time it takes to load your website. Compress images when possible, so that your loading times stay low.

5. Design is important, content is more so: Good content is what sells your ideas and products. Is your copy delivering the message you intended for it to? Grammar and spelling ARE important; so proofread everything you write before it goes live.

6. Map your Site: You can make your website’s navigation much more easy and intuitive simply by creating a site map, or a directory web page. If your customer cannot navigate your website quickly or easily enough to find what they came for, they will go elsewhere for solutions.

7. Strive for consistency: Your website should be consistent in the design, the look and the feeling. Colors, themes and ideas should stay constant throughout every page on the website to make the best impression on your visitors.

8. Keep track of links: You should make sure that your site is fully functional at all times, which means checking out your website links on a fairly regular basis. If you have dead links on your site, there is no telling how much of a negative impact will transfer to your search engine page ranking, or the opinion your visitors have of your website.

9. Make a simple start: When you begin your site, take everything one page at a time, and optimize each page for the best results before moving on to the next. This means that you should make sure that every page is perfect before leaving it for the next one.

10. Optimize: The top search engines are responsible for helping more than 85-percent of all web users to find exactly what they are looking for. If you want to be one of the websites that is considered when users look for similar products or information, you must make sure that your pages are designed to maximize your search engine placement.