Working with CSS is sometimes tricky. As great as this language is, as easy it is to use it incorrectly. Below are 10 most common mistakes web developers make working with CSS. These mistakes are well-known but still many of web developers walk twice (or even thrice) into the same water.
1. Neglecting Browser Compatibility
No matter what browser your website visitor is using the layout has to look the same. There are differences in the way Firefox renders the page and the way Internet Explorer does the task.
There is a number of sure methods to indemnify your layouts for different browser rendering. There are online tools that make screenshots of what your website looks like in different browsers and platforms, so you can be sure nothing looks wrong in a browser.
2. Ignoring Smaller Browser Resolutions
Not all your website visitors have large computer monitors. There is a big difference in the way your design looks in a 800×600 resolution opposed to a 1024×768 resolution. Take that into consideration when developing a website and all your visitors will be happy.
3. Not Using Frameworks
Why loosing time to develop a CSS layout from the ground up when there are tonns of ready-to-use CSS templates that have cross-browser compatibility? They are created for you to make your life easier and your work faster.
4. Not Utilizing Generic Classes
Web developers often name CSS classes something different each time they develope a website. Isn’t it easier to make a simple CSS class that can be reused repetedly throughout your design? This will assure that your site design remains constant throughout the alterations of a design.
Here are the classes you might use:
1. .right{float:right}
2. .clear{clear:both}
3. .left{float:left}
5. Forgeting to Validate the HTML
Validating HTML can affect your CSS. First of all, CSS can’t be validated until the HTML is validated. Secondly, the problems we think are caused by CSS can actually be caused by awry HTML. So make sure your HTML is valid.
6. Invalid CSS
If your CSS is valid you are much likely to have no problems with breaking CSS and its compatibility across browsers. Learn to validate the CSS.
7. Using Gigantic Background Images
Using a huge backround image you make your visitor wait longer for it to load and it means you are using unnecessary bandwidth. It’s better to use repeating images or solid colors in the background.
8. Overusing CSS
It is sometimes much easier and faster to use different technologies for particular tasks. For instance, use a table to organize data than making complicated CSS-based layout with floating DIV’s.
9. Employing Inline CSS
CSS and HTML should be kept separate. Ensure you won’t have to search through the HTML for the CSS attached to an inline element when you decide to change the design.
10. Too Many Files used
A design with dozen CSS files attached is terribly hard to modify. Besides, it slows the time processing each file. Better use a simple CSS scheme. save your time and time of those who’ll have to make alterations to your layout.
