Предполагам, че вече сте се запознали с HTML и неговите възможности (ако не сте - първо прочетете някои от ръководствата, които се предлагат в книжарниците и интернет, защото ще ви е необходимо в тези уроци). Казано съвсем накратко, това е език, създаден от физици, които имали нужда да обменят информация чрез интернет. Той предоставя отлични възможности за структуриране на текстов материал, подреждане на таблична информация, съдаване на хипер-текст и вмъкване на картинки. Да, това не е малко, но изглежда постно на цветните ни 17" монитори, за които сме давали толкова много пари.
Едва през 1996 година няколко човека в законодателния орган на мрежата - World Wide Web Consortium -решават, че и обикновените интернет сърфисти заслужават малко красота на по-ниска цена. Така се появява един нов стандарт - този за Cascading Style Sheets (или за по-кратко CSS). По този начин станаха възможни неща, които преди бяха немислими или осъществими единствено с цената на безкрайни (по брой и големина) GIF файлове. Вече са възможни всякакви ефекти с текста - големина на буквите, разстояние между редовете; цветове и фонове; прецизно разполагане на елементите на страницата и т.н. и т.н., както ще видим в следващите уроци.
Тук е мястото да изясним нещо основно. HTML = структура, CSS = външен вид! Запомнете това и никога не го забравяйте. Какво означава това ли? Чрез HTML казвате кое е заглавието, кое е цитатът, кое е основният текст, кое е таблицата с цифрите от годишния отчет, т.е. подреждате своите страници. Чрез CSS казвате какъв и колко ще е голям шрифтът на заглавието, какви ще са полетата около текста, колко високо трябва да говори браузерът, когато чете текста за слепия потребител, т.е. оформяте начина, по който се показват страниците (на екрана, на хартия или през слушалките).
CSS е наистина мощно средство за оформяне на външния вид на страниците. Не можеш да кажеш на добрия, стар HTML : "Искам параграфът ми да е изравнен и от двете страни, да е с шрифт Times New Roman, височина на буквите 24px, разстоянието между редовете два пъти, колкото височната на буквите и след него да има 100px празно място." Единственото, което беше възможно, бе да се постигне известно сходство (винаги далечно) с описаното и то чрез огромни количества тагове, трикове и в краен случай GIF файлове.
Е, вече няма нужда да си трошите китките, клавиатурите и мишките в безкрайни часове на борба с кода на страниците, за да постигнете и най-простите ефекти. Cascading style sheets ви предлагат бърз, лесен и ефективен начин да постигате този външен вид, от който се нуждаете (купете сега и ще ги получите в комплект с резачка за нокти:)) Просто останете на същата честота, за да научите как става всичко - в следващите уроци.
CSS е лесен език. Той е направен, за да може спокойно да бъде четен и писан от обикновени хора, които не са завършили висше техническо образование. В него няма графики, няма plug-in, няма формули, няма отделни програми.
Когато създавате CSS вие просто казвате как искате да изглеждат елементите на страниците ви. При това няма нужда да оформяте всеки отделен елемент. Благодарение на тях вече нямате нужда от GIF-ове и километри код. Това прави страниците ви по-малки като обем, а това значи, че ще се свалят и обработват далеч по-бързо.
Но удобствата не свършват тук. Какво ще стане ако искам да променя растоянието между редовете на параграфите във всичките страници на сайта ми? Нима трябва да пренапиша всички тези тагове, във всички тези файлове? Съвсем не. Просто ще променя това, което ми трябва в CSS и това ще даде отражение върху всички файлове, които съм обвързал с style sheets. Ето как си спестявате достатъчно време, за да отидете на Витоша (ако сайтът ви е по-голям, разбира се), а потребителите ви зареждат само един CSS файл, който се грижи външния вид на всичките ви страници, вместо огромни количества код във всяка отделна страница.
Замисляли ли сте се как звучат вашите страници в ушите на един сляп посетител, който използва текстови браузъри и генератори на глас. По-вероятно не. Сега е моментът да отбележим, че като използвате CSS давате възможност и на хората с физически недостатъци да разберат това, което се опитвате да им кажете. А правейки сайтовете си по-достъпни за тях, вие ги правите и още по-достъпни и лесни за употреба от обикновенните сърфисти в мрежата. Как става това ли?
На първо място, както вече споменах, се отделят структурата от оформлението. Това означава, че за да накарате един абзац от текста да е подравнен по-надясно, не трябва да го оградите с таговете за цитат (blockquote) и по този начин да объркате генератора на реч, а просто използвате CSS. Освен това няма да ви се налага да използвате картинки, които също влошават достъпността. Ще можете да указвате на страниците си как да иглеждат в зависимост от това как се раглеждат - отпечатани на хартия, на екран, изговорени през слушалките, в брайлово писмо и т.н. и т.н..
За този първи урок стига толкова. Ако съм ви убедил, че трябва да ползвате CSS, продължавайте да четете и нататък. Ако ли пък не - оставям ви тук да се гърчите в адските огньове на безкрайните <font color/size> тагове.
Искам да ви напомня или ако все още не знаете да ви съобщя, че идеите и методите залегнали в CSS са в основата на най-новите стандарти в мрежата, които имат все по-голямо приложение и значение. Това са XHTML, XML, XSL и т.н. Помислете добре преди да им обърете гръб. Очаквам ви и в следващите уроци.