Разделянето на съдържание от дизайна прави управлението на сайта по-лесно
CSS (Cascading Style Sheets) се превърна в де факто начин за стил и оформление на уеб сайтове. Дизайнерите използват стилови листове, за да разкажат на браузърите как да се показва уебсайт по отношение на външния вид, като обхваща фактори като цвят, разстояние, шрифтове и много други.
CSS стилове могат да бъдат разгърнати по два начина:
- Вградено - в рамките на кодирането на самата уеб страница, на индивидуална база данни
- В самостоятелен документ на CSS, към който е свързан уебсайтът
Най-добри практики за CSS
"Най-добри практики" са методите за проектиране и изграждане на уеб сайтове, които са се доказали като най-ефективни и дават най-голяма възвращаемост за съответната работа. Следването им в CSS в уеб дизайна помага на уебсайтовете да изглеждат и да функционират възможно най-добре. Те са се развили през годините, заедно с други уеб езици и технологии, а самостоятелният CSS стилов лист се е превърнал в предпочитан начин за използване.
Следвайки най-добрите практики за CSS, може да подобрите сайта си по следните начини:
- Отделя съдържанието от дизайна. Една от основните цели на CSS е да премахне дизайнерските елементи от HTML и да ги постави на друго място, което дизайнерът да поддържа. Това също така служи за отделяне на дизайнери от разработчиците, така че всеки да може да се съсредоточи върху своите области на компетентност. Дизайнерът не трябва да бъде разработчик, за да поддържа външния вид на уебсайт.
- Улеснява поддръжката. Един от най-пренебрегваните елементи на уеб дизайна е поддръжката. За разлика от печатни материали, уебсайтът никога не е "едно и е готово". Съдържанието, дизайна и функцията могат и трябва да се развиват с течение на времето. Поставянето на CSS на централно място, вместо да се поръсва през уебсайта, прави нещата много по-лесни за поддържане.
- Поддържа вашия сайт достъпен. Използването на стилове на CSS помага на търсещите машини и хората с увреждания да взаимодействат със сайта Ви.
- Поддържа сайта ви по-дълго. Чрез използването на най-добрите практики с CSS спазвате стандарти, които са доказали своята стабилност, но са достатъчно гъвкави, за да приспособят промените в средата на уеб дизайна.
Вътрешните стилове не са най-добри практики
Вградените стилове, макар че имат цел, обикновено не са най-добрият начин да поддържате уебсайта си. Те се противопоставят на всяка една от най-добрите практики:
- Вградените стилове не разделят съдържанието от дизайна. Вградените стилове са съвсем същите като вградения шрифт и други неприятни дизайнерски маркери, които съвременните разработчици се противопоставят. Стиловете засягат само отделните елементи, на които са приложени; докато това може да ви даде по-подробен контрол, това също прави други аспекти на дизайна и развитието - като например последователността - още по-трудни.
- Вградените стилове причиняват главоболие за поддръжка. Когато работите със стилове, това може да ви докаже трудно. Когато се занимавате със смес от инлайн, вградени и външни стилове , имате много места, които да проверите. Ако работите в екип от уеб дизайнери или трябва да реконструирате или поддържате сайт, създаден от някой друг, тогава ще имате още повече проблеми. След като намерите стила и го промените, ще трябва да го направите във всеки елемент на всяка страница, на която е бил поставен. Това увеличава времето и бюджетите за работа астрономически.
- Вградените стилове не са толкова достъпни. Докато съвременният екранен четец или друго помощно устройство може да е в състояние да обработва вградени атрибути и маркери ефективно, някои по-стари устройства не могат, което може да доведе до някои странно показвани уеб страници. Допълнителните знаци и текст могат да повлияят на начина, по който се разглежда страницата ви и от робота на търсачката, така че страницата ви не върши работа по отношение на оптимизирането на търсещите машини (SEO).
- Вградените стилове правят вашите страници по-големи. Ако искате всеки параграф на сайта Ви да се покаже по определен начин, можете да го направите веднъж с шест реда кода във външна стилова таблица. Ако го направите с вградени стилове, обаче, трябва да добавите тези стилове към всеки параграф на сайта си. Ако имате пет реда CSS, това е пет реда, умножени по всеки параграф на вашия сайт. Тази честотна лента и времето за зареждане могат да се добавят в бързаме.
Алтернативата на вградените стилове: Външни стилове
Вместо да използвате вградени стилове, използвайте външни стилове . Те ви дават всички предимства на най-добрите практики на CSS и са лесни за използване. Приети по този начин, всички стилове, използвани на сайта Ви, живеят в отделен документ, който след това е свързан с уеб документ с един ред от код. Външните шаблони за стилове засягат всеки документ, към който са прикрепени. Това означава, че ако имате уебсайт с 20 страници, в който всяка страница използва един и същ стилообразен лист - което обикновено е така - можете да направите промяна на всяка една от тези страници, просто като редактирате тези стилове веднъж на едно място. Промяната на стиловете на едно място е безкрайно по-удобна, отколкото търсенето на това кодиране на всяка страница на уебсайта Ви. Това прави дългосрочното управление на сайта много по-лесно.