Do You Understand CSS Colour Modes - April 16th, 2008

Colours are an important factor in any website design but do you know the differences between the different css colour modes? Apparently many people do not so in this article I will outline the 3 main colour modes. It’s important to remember that these colour modes are the ones used in CSS2 and CSS3 and are supported by most browsers.

RGB Mode

RGB mode has been in use in css for some time and a typical rgb colour would look something like this, (255, 0, 0). This mode uses 256 steps for each of the primary colours and users can also include percentages to set the levels of colours. I find that this method is rather long winded compared to the two other colour modes. The other colour modes essentially simplify the colour picking process.

Hexidecimal Mode

This is probably the colour mode of choice for designers as it is easy to use. The colour black for example in hexadecimal mode would look like this #000000. The hexadecimal mode works by assigning two digits or letters for each colour (red, green and blue). The higher the digits then the brighter the colour will be. Many colour picking tools such as the one in Photoshop will give you colours in this mode as well as RGB.

HTML Keyword Colour Mode

This mode uses keywords. Designers can enter certain colours into the html code in order to assign a colour to an item. This mode is limited as HTML4 only include 16 colours. These include black, white, navy, maroon, teal, white, yellow etc. Most people don’t use this mode as it limits the colours and styles they can use. The design of a page is essentially limited.

These are the standard colour modes that you will find in use today but in the future we may see the introduction of new colour modes. Maybe pre-defined gradients will come in to play.

Posted in CSS | No Comments »

Website Navigation - April 11th, 2008

Website navigation is the single most important factor when it comes to website design, many people request and have a fascination for image based and flashy navigation menus, however these are not suitable of SEO purposes, as the search engine cannot distinguish text in images or flash applications.

CSS techniques can now easily be used to replicate complicated website navigation menus, using a CSS based menu can also bring additional benefits, as in most cases it:

  • Replaces the amount of on page Javascript code, increasing your content to code ratio.
  • Reduces browser compatibility issues.
  • Increases usability of your site, displays navigation even if Javascript is disabled.
  • Increases ROI as site is more user friendly, improving your click through rate.

Vipul
Web Developer

Posted in CSS, Web Design | No Comments »

« Previous Next »