Move to Links

Web Designing Rules and Techniques

___________________________________________________________________________________________________
Photoshop Tricks | Flash Animations | Web Design

Below are some of the techniques I have used and am suggesting to web designers or those who wish to be one.

Web designing is just like any other things any person is doing. It requires attention. Of course, anybody can design any type of pages. They can even make linked pages with different colors, concepts, or design, but this will only be excusable if you are new or just trying to do something not really necessary for you. But If you are really focused on making your own (meaning, personal, as in, something that would reflect you, the owner of the page, or site), you will have a lot of considerations to do. It is because you will think of doing the best for your own satisfaction. Therefore, it is a necessity for you to look for resources on how to make what you formed in your mind, a reality. That is why you are here.

Most of the rules here are much the same as those of others, as they said, "great minds think alike…" (hehehe!). While that is true, there is still a chance that you will find something new in here.

Lastly, these tips are mostly generalized therefore actual applications require that you use your innovation and imagination, as well as conceptualization and analysis. Therefore, you can also create your own techniques. If that happens, email me and give me your techniques' page's URL so I can link to it.


My Rules and Techniques

1. Perfect Color Combination
2. Small over-all page size
3. Distinct elements
4. Consistent motif or design concept
5. Consistent link placements and design

 

1. Perfect Color Combination


Good web pages contain good color combinations. A site that has a lot of colors are either a site of an artist, or a web site of a teen trying to find his way in designing and putting in whatever idea comes into mind without much considerations.

The very basic and most effective way of knowing what colors are compatible is by looking through the surroundings. Most things consciously colored are based on the basic objects found around us. It is through these objects that the Primary, Secondary, and all other color levels are formulated.

Let us start with black and white. Black and white is the most compatible color combination. This has been proven over and over by different designers in different media developments. And as I have learned, and observed, red is the next best color to put side by side with black and white.

Move to Links | Go to top

Then comes the color wheel.

Actually, there are only three major classifications of colors in the color wheel. The primary colors, the secondary colors, and the tertiary colors. Primary colors are RED, BLUE, and YELLOW. Secondary colors are colors in between these three colors like when you combine RED and BLUE, you get VIOLET... when you combine BLUE and YELLOW, you get GREEN and so on. Tertiary colors are colors in between a Primary color and a secondary color. Example: Between YELLOW and GREEN is Yellow-Green and between GREEN and BLUE is Blue-Green. So basically that's it.
Aside from these, there are different combination theories. One is the complementary theory wherein the opposite colors in the color wheel are combined. Then there's the Split-complementary where the colors beside the direct opposite color of any color is combined with the main color. Next, there's Analogous where the four to five nearest colors are combined. Anyway, through all these, one thing that you have to understand is that not because these colors you choose are not based on color theories, they are not good or won't look good. It's still up to you.

So much for that…

Another great style in applying colors is through monotonic rendering. This will apply greatly with any colors. This will give your site the mood of the color you are using and will dictate what mood a viewer will be in once he is in your site.

In using monotonic colors, or any other, make sure that your text colors contrasts the color of the background. In putting other objects (texts, images), place them in such a way that they will all be distinctively seen by the viewer.

NOTE: Do not over-saturate with colors.

Aside from black and white, you should have at most, three more colors to use in your site. These five will be more than enough to put in one particular page or site. More than that, your page might still look fine but may look scattered. Splashes of paints on any canvas are never considered good works, rather, expressions. If that is the case then suit your expressionism and do as they did. But if not, select carefully which colors you will use and stick to them throughout the design process.

Placing more colors are only okay if you have already categorized parts of the page and consider them independent of each other. This is most advisable in commercial advertisement pages, but in a personal site with a certain theme, it is out of place. And if ever you plan to put more colors, or more categories, make sure that each category is properly dislocated. Meaning, each category has its own exclusive space a bit far from another category.

2. Small Over-all Page Size


Always take into consideration the type of people that will view your page, the operating system/s you expect your pages to be viewed on, the browsers they are to be viewed in, and the internet connection speed they are enjoying (meaning, if your local ISP supports only up to 14.4Kbps, then you have to take that into account) . Also, if possible, know what type of server your page will be posted on.

Faster loading pages catch more attention from users. Slow loading pages are targets of viewers' boredom and criticism.

NOTE: Do not over-use images in your pages.

Just as slow loading pages cause users to give up on them, a lot of images might also cause your site to load slow.

On the design level, every image should be extremely essential to the page it is to be seen. If you have 50 images that are essential, choose only the best few of them, unless you are setting up an image gallery page. If this is the case, make thumbnail versions of the images and link them to the main ones.

Lastly, If you think the over-all size of the page is bigger than what you planned, try to divide the contents of the page into more html pages. This way, your pages will load faster.

3. Make your page's elements or objects very distinct, yet merges with the whole picture/motif.


Of course, whatever you put on the page is important. That is why you have to make sure that every element in the page is in the right placement, with the right size, the right colors, and the right properties, so that in one point of the viewer's browsing, that certain object will be the center of attention.

Another trick is to make a motif that need little amount of images and texts, or any other objects. That will give the viewer better chance and more time to see each element very distinctively.

Move to Links | Go to top

4. Consistent motif or design concept


Before you start out your page, give yourself some time to think what concept your page will be having. Once you have found the proper concept, stick to it throughout your design process. While at work, always double-check the motif you are applying and see if the page you are engaged on is complying with your planned design concept.

If ever you want to divert from the motif you are using, make sure the transition from your concept to the other one will look and feel very subtle. Thus, even in diversion, you can have unity in the whole site.

5. Consistent link placements and design


Make sure that at the start of the viewer's navigation, the links are well defined but not very big. Set a certain place where you will place the links in all the pages you are to create.

The most ideal places to put links are on the sides of your page (top, bottom, left, right).

If ever you wish to divert from the typical placements (the standard uniformed-link style for all the pages), make sure that you will be able to make the links look very distinct and identifiable.

 

For any other questions about the actual HTML coding, please email me or fill-up the DESIGNERS Board.

 

For other related links, go to my Links Page.

 

 

Post a Message in My Message Board

CLICK THE BUTTON ABOVE TO VIEW MY MESSAGE BOARD FOR THIS SUBJECT

 

Go to top

For comments or suggestions please Email me at: ssendon@hotmail.com
___________________________________________________________________________________________________

Home
What's up? | Music?
Art? | Philosophy? | Me?
Start


Other Links

Gallery | Objectivism | Technology | Philippine Islands | Web Ring | HelpZone
___________________________________________________________________________________________________

© December 1999 by Samuel T. Sendon II ---- NETFUZE™ Hypermedia