HTML5 – какво ново?

Вече споменах в поста си за Google I/O 2010, Google влага много усилия от миналата година насам новият стандарт да бъде приет и имплементиран от всички браузъри. Както стана ясно от изявление на конференцията на Google тази година, голяма част от водещите браузъри в момента (Firefox, Chrome, Safari, Opera) бележат значителен напредък в това. До края на тази година тези браузъри ще имат пълна поддръжка на новите възможности на HTML5, само Internet Explorer остава назад, като има известна поддръжка, но както може да се очаква от Майкрософт не колкото техните конкуренти.

Ще се отклоня леко, като спомена, че в новата версия на Internet Explorer има значителни подобрения в бързината на обработка на JavaScript, също така се очаква пълна поддръжка на CSS3. Мога само да кажа, че това се очакваше от дълго време и вече няма да има нужда от специфични кодове и фиксове за IE.

Но нека не започвам нова тема, а да се върна на главната такава – HTML5.

Ако пишете на HTML, то най вероятно сте чували за различните стандарти. Тогава сигурно знаете, че има някои специфични неща за различните стандарти, като например затварянето на единичен таг т.е. HTML – <meta>, xHTML – <meta /> и други такива.

Но в HTML5 въпросът не е само в тези малки подробности. Тук се създават нови тагове и атрибути, които ще улеснят работата на програмиста, ще намалят количеството JavaScript и т.н.т.

Един от най-любимите ми нови тагове е видео тага (<video></video>). Вече никакъв товарещ flash и по-важно различни формати видео не само *.flv. Отново ще направя референция към Google I/O 2010, като кажа, че Google помогна изключително много на този таг да просъществува, защото пусна VP8 видео кодека като open source за свободно ползване. Макар че наскоро се чуха нови слухове, че пак ще ги съдят точно заради това, понеже нарушавали интелектуалната собственост на MPEG LA. Лично аз се съмнявам това да е истина и още по-малко вярвам, че това ще спре Google. Освен другите си предимства пред flash базираните плеъри, този ще може да бъде модифициран от към външен вид, както пожелаем.

Тук е мястото да спомена и още няколко тага, които мисля, че на всички ще се харесат. Това са <header>, <nav>, <footer> и други. Така кода ви ще стане по-семантичен. Няма да се впускам в обяснения за тях, така че ако искате да научите повече потърсете в Google.

Сега ще поговоря малко по въпроса за новите атрибути. Нека ви задам една задача. Ако сега ви кажа, че искам дадено input поле да съдържа определен формат дата и когато се кликне върху него да се показва календар за избор на датата, какво бихте направили вие за да го осъществите? Бихте използвали JavaScript, нали? Е ако имаше малко по-голяма поддръжка на HTML5 в момента аз бих използвал него. Вече има нови атрибути, които ще премахнат много JavaScript и ще олекотят много вашите проекти. За сега знам, че има следните атрибути: autofocus, list, multiple, placeholder, required, regex и други.

Нека кажа по няколко думи за някои от тези атрибути. Сигурно се досещате от името на autofocus, какво точно прави, но аз пак ще ви го кажа за всеки случай. Когато е зададен autofocus на дадено input поле, то веднага след зареждането на страницата курсора на мишката ще бъде поставен там. Друго, което много харесвам е placeholder. Нали знаете тези търсачки, в които преди да напишете нещо има някакъв текст, а като цъкнете върху полето изчезва? Това става с JavaScript, но ако използвате placeholder, JavaScript излиза от уравнението. Също така, когато трябва да валидирате форма със задължителни полета, ако искате да правите валидация в реално време трябва да ползвате JavaScript, но в този случай той може да бъде заменен просто от една допълнителна думичка – required. Също така сигурно искате да проверите дали въведеното в полето отговаря на някакви условия. Аз като PHP програмист бих използвал регулярни изрази за целта, но това ще стане чак след като потребителя изпрати формата. Вече не е задължително да използвам PHP просто добавям regex и за негова стойност посочвам модела, който трябва да съдържа съответното поле.

Сигурно вече съм ви отегчил с всички тези приказки, но просто искам да подчертая, че е хубаво да използвате новия стандарт. Тъй като голяма част от него вече се поддържа ви препоръчвам да пишете на HTML5, може не всичко да е на разположение за ползване, но скоро ще бъде, използвайте това, което имате сега.

И преди да приключа с този пост искам само да изтъкна още две хубави неща за HTML5. Неговият doctype не е два реда, а по-малко от един.

Ето един пример:

Doctype на xHTML 1.0 transitional е

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

, а на HTML5 –

<!DOCTYPE html>

. Сами можете да прецените.

И още нещо, преди при задаване на script тага, трябваше да се посочи задължително атрибута type. Сега е нужно само да напишете <script></script>, като това се отнася и до <style>. И вече за последно, можете да задавате чарсета без дългия content/type мета таг, а само

<meta charset=”utf-8” />

.

Ако сте стигнали до тук значи сте успели да прочетете целия пост, за което съм ви благодарен. Това е от мен.

Вашият коментар

Time limit is exhausted. Please reload CAPTCHA.