HTML глава
HTML глава (head) е частта от страницата, която съдържа информация за самия HTML документ и не се показва на екрана. Съдържащата се в HTML главата мета-информация (информация за информация) може да служи на браузъра с указания как да представи страницата - например включване на външни файлове - CSS, JavaScript, фавикон. В добавка, някои от включените в HTML главата мета думи имат сериозно значение за доброто класиране на страницата от интернет търсачки.
HTML глава се указва с тагове <head> и </head> - съответно за начало и край, и се разполага преди отварящия таг за тяло на HTML документа (<body>). Между началния и крайния таг за HTML главата се разполагат всички елементи, които ще бъдат включени в нея.
Нека разгледаме последователно какви елементи може да се включат в HTML главата.
Заглавие - title
Заглавието на страницата, зададено с тагове <title> и </title> не се извежда на екрана, но може да се види като надпис на самия прозорец, в който е отворена страницата. Това заглавие има важна роля в определянето значимостта на страницата от интернет търсачките и е добре да напишете смислен текст за него. Като пример за заглавие на страница ще използвам заглавието на настоящата страница:
<title> HTML глава (head) </title>
Можете да видите как ще изглежда една примерна страница със заглавие <title> и начално заглавие, зададено с <h1>: опитай сам.
Включване на външни файлове
Много често HTML страниците на един сайт ползват едни и същи файлове - напр. фавикон, CSS файлове, задаващи стила на страниците, JavaScript файлове, които добавят полезни функции и др. Вместо съдържанието на тези файлове да се включва във всяка една страница, общо използваните файлове може само да се укажат за ползване в главата на HTML.
Каква е ползата от това: спестява се работата по копиране на едно и също съдържание във всички страници и се улеснява промяната, когато такава се наложи. Понеже файлът, които ще се променя, не е директно включен в HTML страниците, достатъчно е да бъдe променен самo той. HTML страниците, които го ползват, ще бъдат автоматично подновени. Допълнително предимство е запазването на CSS и JavaScript файловете в кеш паметта на браузъра - така други страници, които ползват същите файлове, ще бъдат заредени по-бързо.
Ето и няколко примера за указване за ползване на външен файл:
- Фавикон: това е малката иконка, която се показва до адреса на страницата в адресното поле на браузъра. За да включите фавикон в страниците си, достатъчно е да напишете следния ред в главата на HTML:
<link rel="shortcut icon" href="/favicon.ico" />
Как да си направите фавикон е описано в статията Дизайн на страниците - CSS файл. Това е файл, съдържащ стилови указания за HTML страниците. Указва се за ползване със следната команда:
<link rel="stylesheet" type="text/css" href="/style.css" />
Както забелязвате, командата доста прилича на тази за фавикон. Започва с link, има атрибут rel, който указва каква е връзката на указания за използване файл спрямо настоящата HTML страница. Атрибут href задава името на файла и евентуално пътя до него - ако е разположен в друга папка. Допълнително за CSS файловете се указва и типа на файла: type="text/css", за да знае браузъра как да подходи към конкретния тип файл. Можете да видите как ще изглежда един и същи файл след смяна само на указания за ползване CSS файл: опитай сам. - JavaScript файл. Такива файлове може да се включат в интернет страницата със следната команда:
<script type="text/javascript" src="/superfish.js">
</script>
Аналогично на командата за CSS файла вида на JavaScript файла се указва с type="text/javascript", а адреса на самия файл - със src=, следвано от пътя до файла и самото му име (в случая - superfish.js, който се използва за създаване на специални ефекти за падащи менюта).
Мета думи
Мета думите задават допълнителна информация за HTML страницата. Ето и някои от най-често използваните мета думи:
- кодировка: указва какъв тип кодировка е използван на страницата. Внимавайте да зададете правилната кодировка, иначе рискувате посетителите на страницата да видят низ от неразбираеми символи вместо Вашето послание. Кодировката се задава със следната мета дума:
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
В конкретния пример е указана кодировка UTF-8, но страниците Ви биха могли да са с някаква друга - напр. Windows-1251. Повече за кодировката можете да прочетете в статията Какво е кодировка.
- съдържание - description: с мета дума description се указва на кратко на каква тема е страницата. Именно зададеният с description текст ще бъде представен от търсачките на страницата с резултати от търсене по ключови думи. Ако не попълните съдържание за мета дума description, търсачките автоматично ще генерират някакъв текст - обикновено първия срещнат на страницата (напр. менютата). Това далеч не е оптимален вариант и е по-добре да укажете сами за какво се отнася страницата Ви:
<meta name="description" content="съдържание на страницата"> - ключови думи: мета дума keywords: мета дума keywords отново има отношение към търсачките, макар че в днешно време като че ли има по-малко значение (поради злоупотреба от страна на уеб дизайнери, търсачките са започнали да обръщат по-малко внимание на мета дума keywords, или поне така се твърди). Подберете няколко думи, които отразяват най-добре темата на страницата Ви и ги декларирайте с разделяне със запетайки по следния начин:
<meta name="keywords" content="ключова дума1, ключова дума2,...">
Съдържанието на мета думите title, content и keywords има съществено значение за класирането на страниците от търсачките. Повече за оптимизирането на тези мета думи можете да научите от статията Популяризиране на сайт - SEO оптимизация - указание за роботите-търсачки: мета дума robots. Можете да контролирате поведението на програмите-роботи на търсачките - дали да индексират страницата, дали да следват хипервръзките на страницата, дали да запазят архивно копие на страницата и т.н. Прави се с мета дума robots:
<meta name="име_на_робот" content="команди" />
На мястото на "име_на_робот" използвайте "GOOGLEBOT" за Google, "SLURP" за Yahoo!, "MSNBOT" за търсачката на Microsoft BING или "robots", което се отнася за всички търсачки.Като "команди" можете да използвате:
- noindex - забранява индексирането на страницата
- nofollow - забранява следването на хипервръзките на страницата
- noarchive - забранява запазването на архивно копие на страницата
- noodp - забранява използването на DMOZ описанието на страницата
Ето и един конкретен пример за мета дума robots, който ще забрани на всички търсачки да запазват архивно копие на страницата, както и да използват описанието на страницата, което е зададено от директорията DMOZ:
<meta name="robots" content="noarchive, noodp" />Както забелязвате, командите за мета дума robots са предимно забранителни. Причината не е в липсата на разрешителни команди - можете да използвате напр. index, за да разрешите индексирането на страниците или follow - за да позволите следването на хипервръзки, но това не е необходимо. Търсачките по подразбиране индексират страниците и следват хипервръзките в търсене на нови страници - все пак това им е задачата. Така че ако искате страницата да бъде индексирана, а хипервръзките - следвани, можете просто да пропуснете писането на мета дума robots.
Указанията за роботите имат действие само за страницата, за която е написана мета дума robots. Ако имате много страници, за които искате да зададете еднакво поведение на роботите, по-добре е да използвате файла robots.txt. Какви са правилата за създаване на този файл можете да научите от статията robots.txt - забрани за роботи.
- автор на страницата. Можете да заявите авторството на интернет страниците си като укажете името си с мета дума author по следния начин:
<meta name="author" content="Вашето име" />
- пренасочване към друг адрес - refresh. Тази мета дума се използва, когато сте сменили адреса на сайта си, но не искате да загубите потребители, които следвайки стари хипервръзки попадат на стария адрес. Пренасочването става със следния ред:
<meta http-equiv="Refresh" content="5;url=http://www.нов адрес на страницата" />
числото 5 в случая означава, че пренасочването ще се осъществи след 5 секунди - обикновено достатъчо време потребителят да прочете съобщението Ви за преместването на сайта на нов адрес. След "url" е новия адрес на сайта. - Следва: HTML кодиране на специални знаци
Ако решите, че "как се прави сайт" ръководството може да бъде полезно и за други хора, моля гласувайте за сайта: