Consistency In Web Design

October 20, 2008 at 4:12 pm · Filed under Web_Design

The human mind constantly searches for patterns in everything that it sees everyday, striving to find the unified picture as a whole. If the mind cannot find pattern in what it is seeking, it has a high tendency to look elsewhere.

When doing web design, it is important to design the website in such a way that makes it easier, not harder for the mind to see the pattern. It must be clear to a visitor he is still at the same site.

If objects with similiar functions are grouped together, its function will be easily understood and remembered. When designing an interface, it is important that all similiar tools used for navigation and accessing information should stay consistent. The webpage font, style, colour, layout, mouse over effects should also stay consistent. When the user clicks a link, he must recognize the connecting page is similar to the previous one, failing to do so will make the user confused and will prompt him to visit other websites.

If there are sound or animation used in navigation, the sound and animated effect should stay the same in all pages. For example, if an animation is turned on by clicking a flash button, it should be done the same way in the rest of the webpages.

One method of ensuring consistency is to use Cascading Style Sheets (CSS). By defining standard style properties in another document, it is possible to achieve the same look and feel to all your webpages that use the same style sheet. A style sheet, for example, can be used to make the text on every page 12 pt Verdana, all headings (h1) orange..etc. If the style of the site needs to be changed for any reason, only one document needs to be updated. Without style sheets, doing manual adjustments on every page is tedious and often result in errors and inconsistency.

Another way to promote site consistency is to use templates. A website template is a document that defines the structure of muliple pages in your site. For example, if the header and footer are standard across all pages in your site, they can be attached to the body of your document via an automated process, saving you time and typing errors. Many web editing softwares such as Dreamweaver offer templating function. Server-side technologies can also do the same job easily.

Consistency is very important in website design because it makes the reader do less thinking. Time is money. Your reader wants to find the information he needs quickly. Inconsistency design only slows down their surfing speed and make them lose interest in your site easily.

Sitecritic.net is formed by a group of web addicts, mainly volunteers from all over the world. Our goal is to create a community of web designers and developers who share the common interest in bringing out the best in creatiing effective web sites.

Share This

Comments

Web Design and Development The Right Tools for the Right Job

October 11, 2008 at 10:11 am · Filed under Web_Design

As any webmaster knows, designing and developing a website can be a daunting proposition. There are millions of websites out there to compete with, and whether your site’s purpose is to promote your business, inform, or entertain; web design is an important consideration if you want traffic. It’s tough to attract visitors and even tougher to keep them on your website once they arrive.

Fortunately, there are many tools out there for webmasters to make the tasks of design and development easier. Wading through the sea of web tools can also be a time-consuming process. In designing your website, you should be aware of all the components that go into successful development and how to use them to your best advantage.

The first step, other than developing great informative content for your visitors, is to put everything together in an attractive, user-friendly format. If you need a little help in manipulating HTML coding or CSS (cascade styling sheets), you might visit www.xhtmlandcss.com for advice and tutorials regarding these components. CSS in particular is an invaluable tool for webmasters; these are the programs that control the set of styles for your fonts, tables and many other attributes of your website. The ability to manipulate CSS allows you to customize sites such as web forums and blogs and create a website that stands out and gets noticed. You can also amplify the attractiveness and user-friendly attributes of your websites with e-mail and forum signature generation tools from www.needasig.com and brighten your format with free smilies from www.thesmilies.com. Internet users love extras, and adding customizable interactions such as signatures and smilies will help keep visitors coming back.

Once your site is developed, you must then undertake the task of optimizing your website for search engines. There are many ways to do this. One is to use relevant keywords throughout your content and page tags–without overusing them–that will help visitors find your website when they’re looking for information. Using a keyword generator such as the free tool at www.keywordmine.com is an easy way to find plenty of relevant keywords and phrases. When incorporating keywords into your content, you should make sure the text reads well. The practice of keyword stuffing to boost search engine ranks not only endangers your listings with search engines, it also turns visitors off to your website and will keep them from coming back.

Another component of website optimization is getting your website listed with search engines. If search engines can’t find your website, neither can visitors! After you have created great content with relevant keywords and lots of user-friendly extras, you should then begin the process of getting your website out there for people to find. You can submit your website URL and descriptions manually. Major search engines such as Google, MSN and Yahoo include links to their submission process for manual submission. However, these links can be difficult to find. You may want to consider using a search engine submission service to submit to several search engines at once; there are many good, free submission services that cover multiple search engines. It is important to remember that submitting your website once is not enough to get it noticed on the Internet radar. You should carry out the submission process on a regular basis. However, you also must realize that submitting your website too often can get your URL banned from some search engines. It is a good practice to submit to search engines every 30 days.

Beyond search engines, you should also list your website in as many relevant directories as you can find to increase your site’s exposure. Strive to find directories that don’t require linkbacks to your website for listings, because reciprocal links carry far less weight with search engines than strictly inbound links. One excellent directory service that doesn’t require linkbacks can be found at www.submiturlhere.com. You can find many directories for your website; just make sure they are relevant to your content.

If you have multiple websites or long website URLs, another great tool for you to use is URL redirection. You can get a short, easy to remember and easy to post URL for your website that will sit well with search engines and make it simpler for you to advertise your websites on forums and in e-mail messages and signatures. Free URL redirection tools are available at www.smoothredirect.com. Once you have more experience with URL direction, or if you are already an experienced webmaster looking for more ways to optimize your website, you should consider making use of tools like URL cloaking, path forwarding and frame killers. The website www.kingofurl.com offers free advanced redirection tools without those annoying, visitor-detracting banner ads you want to avoid.

Tracking visitors to your website is another important aspect of running a successful site. You should install a web counter that is invisible to visitors, but allows you to find out where your traffic is coming from so you can concentrate your promotion in effective areas. For example, a good web counter will not only tell you how many hits your website receives, but whether they are new or returning visitors and how they found your website, whether through a directory, a search engine, or an e-mail promotion. You can find free web counters with excellent tracking tools at www.webstatservice.com for your website.

There are many components that figure in to web design and development. Today’s webmaster is fortunate indeed to be able to find free tools for optimization and integration. Make your website interesting, interactive, and accessible to search engines through submissions and directories, and the visitors will come. While you’re designing and developing your site, be sure to bookmark comprehensive web tool repositories such as www.webmasters-cavern.com for easy access to great information. The more you know about web design and development, the easier you will be able to navigate the complexities of the Internet and find cyber-success for your business, informative or entertaining website. Making use of free web tools is a great way to get ahead of the competition!

Praveen owns a number of successful websites including Webmasters Cavern, The Smilies, Submit URL here, and many others.

Share This

Comments

Cascading Style Sheets for Better Web Design

October 9, 2008 at 1:14 am · Filed under Web_Design

In cascading style sheets you can specify how your web pages will be presented on the screen by simply predefining page elements such as fonts, headers and links.

You can add these predefined elements in the head-section of your pages, but more interesting is to use them in a single .css file and include that file in every page on your site.

All you have to do is include in your HTML header.
(the path in the href must point to the place where your .css file is stored)

There are two main benefits to using css sheets in a separate file:

1. more flexibility; only one (1) file to update

2. less HTML coding and easy replacement of deprecated HTML.
I’ll explain more of this below.

First, let me tell you I am NOT a cascading style sheet professional. I just use it.

If you want to become one, there are great css resources and tutorials out there.

Just go to

http://www.w3.org/Style/CSS/learning
http://www.htmlhelp.com/reference/css/

to mention a few, but there are many more.
Type ‘cascading style sheets’ in your favorite search engine and you get plenty of information.

But just being a layperson in css emphasizes the importance of this web design tool.
I started using cascading style sheets in its most elementary form. All you have to do is name the page element that you are going to specify and add its specifications in curly brackets.
Here’s my first css file:

body { font-family: Arial, Helvetica, sans-serif; font-size: 10pt; font-style: normal; line-height: normal; font-weight: normal; text-decoration: none; color: #000000 }

By simply saving this code in a style sheet file and including it in my webpages I suddenly didn’t have to define FONT statements in the body of my pages any more.
Wow, that saved me a lot of coding! Big advantage (no. 2).

AND …..

I had fewer errors in my HTML, because I didn’t have to close that awkward FONT tag (at the wrong place). Big advantage (no. 2).

When I discovered this, I immediately began adding definitions for other tags like H1, H2, linktext (not visited, visited and hover) and special colors in text.

If I want to change the look of my H1-header, all I have to do is change the specs in my style sheet and presto ….
the H1 is changed across my whole site. How’s that for flexibility? Big advantage (no. 1).

When I once redesigned my site I used HTML validators to see how I was doing. To my surprise I found that some HTML commands, the most important one being FONT, were deprecated in HTML 4.0. That means eventually these commands will not be used anymore.

So I had to do something. Again, style sheets came to the rescue.
All I had to do was define how my fonts would look like in my style sheet and I had the problem solved. Big advantage (no. 2).

Now I use css to define headers, footers, special text colors, special fonts and font sizes, special links etcetera. If I ever discover I need some extra lay-out or style, I just add one line to my .css file.
It’s so easy!

Try it.
Start using style sheets.
You’re more flexible and it will save you lots of time.

Wish you success.
Case Stevens

Case Stevens, owner of AnOwnSite Internet Marketing, is experimenting with different marketing techniques, websites, traffic and lead generation. He publishes his experiences in a newsletter featuring understandable, successful low cost Internet marketing techniques, ideas and strategies, articles, news, tips & tricks and interesting (free) downloads.

Subscribe at Affordable Online Strategies

Share This

Comments