- Един CSS за еднаквите елементи във всяка страница на сайта. Отделни CSS файлове за специфичните страници.
От известно време насам, вместо да пиша един огромен CSS, започнах да го дробя на парчета, което не само улеснява редактирането му, но и оптимизира значително скоростта на зареждане на отделните страници. Също, вместо да си губя времето с разни хакове за IE5, по примера на Microsoft, правя отделен CSS за него, където донаписвам съответните безумни поправки.
– Евгени Динев - Нулиране на margin и padding
Global White Space Reset - Указване на правилен DOCTYPE
Правилният DOCTYPE (Джефри Зелдман)
Декларацията за Вида на Документа или DOCTYPE казва на браузъра по какъв начин да покаже вашата страница. Когато този DOCTYPE e неверен или просто липсва, браузърът не показва страницата по начина, по който бихте искали. Ето един полезен списък с правилните DOCTYPEs, съставен от Джефри Зелдман.
- Валидирай – един незатворен таг ти разказва играта
Когато се съмнявате, валидирайте Когато дебъгвате (дебъгване – процес по откриване на грешки в програмен код), можете да си спестите много главоболия като от начало просто валидирате своя код. Неправилно форматираният XHTML /CSS е причина за много проблеми с лейаута.
– Дейв Шеа - За да няма проблеми с box model в IE – margin вместо padding
Опитвайте се да избягвате задаването на padding/border и едновременно с това фиксиран размер на елемента. IE5 разбира box model (блоковия модел) по погрешен начин, което наистина обърква нещата. Има начини за справяне с проблема , но винаги е по-добре проблемът да бъде заобиколен като padding.ът се прилага на родителски елемент вместо на наследяващ елемент, който е с фиксиран размер.
– Дейв ШеаКазано иначе, никога не указвайте padding или border за елемент с фиксирана широчина. Можете да укажете margin на елемента, което ще го отдалечи от рамката на родителския му елемент и същевременно няма да проимени фиксирания размер.
- Използвайте възможно най-малко несемантичен код – излишните div и span не носят особен смисъл и замърсяват кода. Използвайте малко-познатите тагове на HTML като fieldset, legend, cite, label и т.н..
- Комбиниране на селектори – когато задавате стил за даден елемент на страницата използвайте HTML структурата на документа, за да го адресирате, вместо да задавате отделен клас.
Комбинирайте селектори. За да оптимизирате времето за зареждане, трябва да се стремите към малки CSS файлове; опитвайте се колкото се може повече да групирате селектори, разчитайте на наследяването и намалявайте излишните повторения като използвате съкратен ( shorthand ) запис.
– Дейв Шеа - Филтри за различните браузъри – само в краен случай, защото има достатъчно начини да напишем ист CSS, който няма нужда от хакове и не се разпада в различните браузъри.
Разчитайте на филтрите на CSS само в краен случай. CSS хакове и филтри могат да ви помогнат избирателно да прилагате CSS (или да не прилагате – в зависимост от случая) към различни елементи. Вместо да ги използвате всеки път, когато ударите на камък, опитайте се да намерите по-стандартен и работещ в различни браузъри начин да постигнете желания ефект. Когато се съмнявате, това може да ви спаси живота. Ето един огромен списък с CSS филтри .
– Дейв Шеа - Смислени и уеднаквени имена на класове и ID
Именувайте класовете / ID-тата според тяхната функция, а не според външния им вид. Ако създадете клас .smallblue и по-късно получите молба да промените размера на шрифта в по-голям или цвета – на червен, този клас престава да носи всякакъв смисъл. Вместо това използвайте описателни класове като .copyright и .pullquote.
– Дейв Шеа
Leave a Reply