[best practice] css techniques you should avoid
we will talk today about some css techniques you should completely avoid when you coding css , there is a lot of bad habits when coding css we will try to declare this techniques and why we should avoid it
and it will overwrite the previous css
you should completely avoid that however the result it will be good but :
- html code will be untidy and unreadable
- it will be very hard to track and edit code
but , the most important thing when you finish development and turn to production level that you combine css files into one single css file to reduce the dns lookup and that will make your website load faster but be careful when you combine the css files for css overwritten you don’t want to miss up with this
div{
width:expression(document.body.clientWidth > 800? “800px”: “auto” );
}
simple and effective ha
but now its a disaster for many reasons
first it makes css more and more complex (css is famous that its the samplest web language ever)
second it gets your website very slower because expression in css is slowest than regular javascript and that in modern concepts is very awful
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/iamtransparent.png, sizingMethod=’scale’);}
but it gives more and more pressure on the browser and make it slow specially if you assign alpha image loader to many images in the site
this is what was going in my head about css bad techniques if you have another this i would be happy to hear from you
best regards
1- inline-style:
one of the features that css and browser layout engine offer is inline style that you can add style to element in html like that<div style="background-color:#000000"> hi i am here </div>
and it will overwrite the previous css
you should completely avoid that however the result it will be good but :
- html code will be untidy and unreadable
- it will be very hard to track and edit code
2- multiple css files:-
its so recommended to divide your code in multiple files so you can track them easily and edit them will be peace of cake operationbut , the most important thing when you finish development and turn to production level that you combine css files into one single css file to reduce the dns lookup and that will make your website load faster but be careful when you combine the css files for css overwritten you don’t want to miss up with this
3- css expression:-
this was developed to help css coders to add more dynamic issue to css like thisdiv{
width:expression(document.body.clientWidth > 800? “800px”: “auto” );
}
simple and effective ha
but now its a disaster for many reasons
first it makes css more and more complex (css is famous that its the samplest web language ever)
second it gets your website very slower because expression in css is slowest than regular javascript and that in modern concepts is very awful
4- alpha image loader filter:-
because of internet explorer issue with png transparent we forced to use one of the bad tecniques by microsoft call alpha image loader alpha filter used for many purpose like opacity but the most famous use of it is to cure the png transparent like thatfilter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/iamtransparent.png, sizingMethod=’scale’);}
but it gives more and more pressure on the browser and make it slow specially if you assign alpha image loader to many images in the site
this is what was going in my head about css bad techniques if you have another this i would be happy to hear from you
best regards
0 Responses to "[best practice] css techniques you should avoid"
Post a Comment