Оптимизация на HTML и CSS

ystefanov

Registered
В какво се състои оптимизацията на HTML и CSS, можете ли да ми препоръчате някой сайт, който предлага добри инструменти за оптимизация и изобщо имали особенна полза от нея?
 
Има оптимизация на картинките, например във формат *.gif, за да са по-леки и да зарежда сайтът бързо - да не е тежък (за мен *.png е по-добър, но ако искаш анимирана картинка ти трябва *.gif, другият вариант е *.swf).

Относно HTML/CSS чрез валидатора на W3C, можеш да провериш дали кодът ти е написан правилно (за CSS до CSS2, за CSS3, засега няма).

За оптимизация на CSS, ето ти пример (погледни картинката по-надолу):
тук.

Става въпрос за подредба и стил на писане на кода, а не всичко да е мазало. Пример за оптимизация на HTML е да затваряш огледално таговете, например:

HTML:
<b><i><font color="blue">Button</font></i></b>
Това може да се напише само в тага font, с помощта на CSS, просто ти давам пример.

Мисля, че това го знаеш.

И да, има полза, защото така не се правят грешки, ако всичко е хаотично написана, шансът за грешка е много голям.

Успех! Надявам се да съм помогнал! Ако имаш проблеми пиши.
 
Ето ти една много добра статия за CSS оптимизацията.
http://fridaycode.net/css-optimization-tips-and-tricks/
 
за мен *.png е по-добър, но ако искаш анимирана картинка ти трябва *.gif, другият вариант е *.swf
PNG е по-добрият вариант, само ако картинката има повече от 256 цвята. В противен случай трябва да се използва GIF. Също така GIF е особено добър за картинки, които имат големи области, оцветени в един цвят.
 
Всъщност GIF ползвай, ако имаш анимации някакви.
За обикновенни картинки PNG, за снимки (и такива с много цветове) JPG.

А джава скрипта и ЦСС можеш да ги компресираш (ако това е точно дума), и така да заемат по-малко място, следователно да зареждат по-бързо. За което можеш да ползваш нещо като това :idea:
 
Чак до такива дребности не изпадай. Не е нещо фатално, чак YUI компрес...
Относно *.gif-а, ако правиш флагчета го използвай, ако не *.png.

Успех!
 
http://code.google.com/intl/bg-BG/closure/compiler/

Освен това комбинирай целия css в един файл, целия JS в един файл (ако е възможно, ако не гледай да са колкото се може по-малко). По-горе споменаха и YUI Compressor за css :)

Използвай sprites и основно е това.

Аз лично се водя по съобщенията на YSlow във Firefox :) Ако там успееш да постигнеш Score A всичко е наред :)
 
Е аз под оптимизация разбирам, особено за цсс и джаваскирпт да се направят така,че да има по-малко код, същото се отнася и за хтмл-а колкото се може по-малко код, защото има сайтове с наистина излишни и безсмислени елементи които затормозяват рендването ;)
 

Back
Горе