Css Over Load

January 24, 2008

Without css file you can see a web page/site, if css file is huge it makes web site load slow, so what to do?

how to Optimize your css code?

There are various way to Optimize your code, firstly you can do it manually using short hand css properties how every i am not explaining about it because you can get info from this links

http://brightscape.net/2007/10/04/squeeze-your-css-files-into-shape

http://www.pat-burt.com/web-development/10-tips-for-a-smaller-css-file

if you don’t want to waste your time in modifying your old style sheets you can simply use online css compress tools, it make your work in seconds
check this online css compress tools

http://www.cssoptimiser.com

http://www.cleancss.com

http://www.cssdrive.com/index.php/main/csscompressor

http://www.cssdrive.com/index.php/main/csscompressoradvanced

http://zamez.org/factorcss

Using Css Sprites

CSS sprites allow you to create a single image file that contains all the images laid out in a grid, requiring only a single image and you can show respective image using backgroung-postion property…

For more info

http://www.alistapart.com/articles/sprites

Online Css Sprites Creator

http://www.csssprites.com

It also displays code for background postion for image for each image.

Will this tips reduce css file size, yes no doubt in it

Note: Don’t forget to validate your style sheet


Basic Seo Tips for Web Designer

December 25, 2007

After designing a layout for a web site, we obviously start converting it into HTML during this session as a web designer we mainly concentrate on cross browser compatibility but we also need to concentrate on some basic seo things like…

1. Using Correct Doctype.

2. Using Meta Content and Meta Keywords.

3. Using Alt tags for Images.

4. Using Valid HTML and CSS code.

5. Make your web site load fast.

1. Why to Use Doctype and what does correct doctype means?

Document type defination(DTD) is also know as Doctype, doctype informs the browser how to interpret the content of the page. If the the doctype is not declared, the browser assumes you don’t know how to code, and goes into quirks mode. If you know what you are doing and include a correct HTML doctype, your page will be rendered in standards mode.

Some Recommended DTDs to use in your Web document.

Use correct doctype, for example your using strict doctype and you use used align in in div tag or in p tag then doctype you used is not correct because align attribute is deprecated in strict doctype.

2. Using Meta Content and Meta Keywords.

Use proper keywords and content relate to your web site, that helps search engine to crawl your web site.

3. Using Alt tags for Images.

Specify alt tag for image and that alt tag should be a keyword related to web site, because images you have placed on site can be seen by visitors but not by search engines, so alt tag help search engines to read, with the help of alt tags search engines display the image results.

4. Using Valid HTML and CSS code.

Validate your html and css code and make your code w3c standard.

validate your html code here

http://validator.w3.org

validate your css code here

http://jigsaw.w3.org/css-validator

5. Make your web site load fast.

Don’t mess up your site with heavy images that makes your site heavy and slow, try to optimize images that reduces weight and helps to load fast.

Online Image Optimizer

Free online tool- optimize your gifs, jpg, and png images


Free Css Web Template Download

November 11, 2007

Download css valid liquid web template for free and customize it as per as your requirement, click here for demo or download .

free css web template

No copyrights, if u link me back it will appreciated.

For these css template psd file and if you find any bugs please mail me.


Web Site Design Process

September 30, 2007

Web Site Designing if you start in a proper way its an easy task to get exact result if not it end’s up with lot of nonsense’s and waste of time.

Process:

1. Understanding Client’s Requirement
2. Plan
3. Implementation
4. Analyze

1. Understanding Client’s Requirement: It’s most important to know what client wants so that you can give him 100%.

What to Know From Client:

a. Color Specification (if he can give).
b. Reference (Any Web Site that made him to make his own site or his business rivalry site).
c. Visitors (try to know what type of visitors he targeted or to whom he is approaching).

2. Plan: The most and main part in this process.

a. Layout: Before you start, first prepare a sketch on paper so that it makes you clear what your going to do for layout ideas you can visit

templatemonster.com

icetemplates.com

templateworld.com

dreamtemplates.com.


b. Color Selection: Select Color Schemes that make web site more attractive.
C. Concept: Plan your concept that makes more attractive and effective.
d. Image Selection: Select images according to your concept not unwanted and try to use royalty free images or buy but never violate copyrights.
e. Inspiration: It’s nothing wrong to inspire by other design but make your self clear between inspiration and copying.

3. Implementation: Implement your idea (your paper sketch) neatly and perfectly so that you can get 100% output, some times it may be difficult to impletement your idea exactly what you want or you may be getting nice output more than you expect.

4. Analyze: Before showing to client analyze the site is this the thing you planed, implemented and designed or any thing went wrong in the final result. You can also
take suggestions from other web designer or post to any web design forum to review your design.