Archive for the ‘Design’ Category

CSS Web Design

In the current scenario, the websites are swiftly populating the web. The design of a website plays a crucial role in its popularity. Properly designed website with good design tactics definitely leads against its competitors.

There exist some simple and highly effective websites that use cascading style sheets (CSS). This functionality is implemented in the websites to improve the web design and to make the website perform better in major search engines.  It also helps in grabbing quality traffic for the websites.

Before going further with  CSS Web Design , it is important to understand the meaning and application of CSS.

What is CSS and how it is used?

CSS stands for ‘Cascading Style Sheets’ a new functionality widely used for layout and style of web pages. With the help of CSS the presentation and styling code is separated from the actual content in web design. CSS implementation consists of few rules which are stored in separate files with a .css file extension. Then CSS file is linked from the web page using HTML link tag.

In the past decade, tables were the only tool available with the web developers to design the layout of web pages of any website. But with CSS support, web developers now have a choice. There are lots of advantages in terms of web design to separate the presentation code into distinct CSS files. 

Here are some excellent web design modes through which the web site design could be made more search engine friendly. These are as follows:

Use CSS to Structure the Document

Content is very important part of any website. Search engine robots read the content of the website and indexed it. By removing the extraneous table tags and replacing them with smaller HTML (div) tags formatted with CSS rules makes it much easier for the robots to read and index the content. This makes the code search engine friendly.

Use CSS to Style the Header Tags

Search engines give importance to header tags. As header tags are used to define page structure and simplify page navigation. Using CSS here makes the header tags appear in nicely formatted and attractive text. This increases visibility of the website in the search engines.

Use CSS to Create Rollover Images

Traditionally, web developers create rollover images using 2D graphics with some complex JavaScript code. This JavaScript code can adversely affect the search rankings of the website. Instead of this creating a normal text link and using CSS to format its appearance is a much better way to create images.

There are number of benefits of CSS over the classic web design techniques.

Benefits of CSS Web Design:

1. Separation of Content from presentation: HTML mark-up, text, graphics and multimedia can be separated from presentation. 

2. Consistency: CSS provides a way to apply single style to various pages at a time. For example: to change the background color of all the pages of the site just make a change in CSS and it will be reflected in the entire website.

3. Maintenance: CSS makes the code clean & clear, and more understandable which can be easily edited and maintained. 

4. Search engine rankings: With the help of CSS, one can position the content at the top in the page code to make it SE friendly. 

5. Fast loading: Table-less design diminish the load time by 25 to 50 percent.

Article Source: http://www.articlesbase.com/web-design-articles/css-web-design-393160.html

About the Author:
The article is contributed by a professional content writer. For further information on  CSS Web Design  and  web design template  please visit at  http://www.synapseindia.com/

Posted by admin on April 25th, 2008 No Comments

Designing with CSS

Basically, there are 2 separate ways that you can use a cascading style sheet. The 1st way is by using the style sheet externally. Just upload the css file that you have downloaded or designed, and then reference that file in the HTML code for the web page you are designing by placing some code within the header tag of the web page. There are many different tutorial websites where you can learn how to make the code to reference an external style sheet.

 

Furthermore, you can make your style sheet internally by coding the style of certain kinds of tags within the head tag of the web page itself rather than saving the style sheet as an external file.

 

Additionally, you can use what is called inline styles, where you specify the style of a specific element inside the web page so that the style will apply to just that particular tag and not all of the tags on the web page.

 

Whatever you should decide to do, as a website designer make sure that you become familiar with cascading style sheets and use them, especially if you do a lot of web design projects. You should start a collection of your own library of style sheets, either by designing them on your own or by downloading them from a website that specializes in css templats.

 

With these style sheets in hand your job as a web designer will definitely be faster and more efficient. They will enable you to design web pages very fast without having to focus so much on the design.  You can then demonstrate to your customers the many different sample designs of the css web pages that you have created by just changing a single line of code and using a different .css file each time.

Posted by admin on April 17th, 2008 No Comments