Стандартът HTML5 беше финализиран и пуснат на пазара през 2014 г. и това е какъв би трябвало да бъде HTML, когато първата версия беше пусната преди всички тези години. HTML 2.0 беше първият истински „стандарт“, публикуван чак през 1995 г. Две години по-късно HTML 3 беше публикуван. Още две години по-късно беше въведен HTML 4.01 и оттогава той е работният кон на интернет.
Първият „работен проект“ на HTML5 беше представен още през 2008 г., като тогава беше изненадващо широката поддръжка на браузъра. HTML5, който познаваме днес, е силно различен от HTML от миналото и тук ще обсъдим какво точно се промени най-новият стандарт с неговото издаване. Откакто HTML5 стартира, той беше широко приет и всички негови функции и възможности се поддържат от всички основни браузъри. Все още има няколко хълцания тук и там, но като цяло HTML5 добре се асимилира с модерния онлайн опит.
Като уеб разработчик може да сте или стар професионалист, който е усвоил по-старите стандарти, или начинаещ любопитно да наблюдава развитието на нови стандарти в кулоарите. Така или иначе трябва в крайна сметка да започнете да преминавате към HTML5.
HTML Vs HTML5 Инфографика
Първата стъпка към преминаването към HTML5 или ученето е да разберем разликата между по-стария стандарт и най-новия. Ето някои ключови разлики между HTML и HTML5:
-
HTML5 е жив език
HTML5 е жив език, незавършена работа. Невероятно е да видите какво може да прави HTML5, но също така е важно да знаете, че HTML5 не е напълно стандартизирана версия като HTML4, която е на повече от десет години и е определен стандарт, непроменим.
Ако влизате в HTML5, ще трябва да направите някои актуализации. Атрибутите и елементите се добавят и редовно се променят всяка година. Това също зависи от това колко използвате богати елементи, но това определено е един от рисковете, свързани с използването на течност, промяна на езика като HTML5.
-
HTML5 е по-прост
Въпреки че HTML5 има рискове като постоянни актуализации, обикновено е лесно да бъдете в крак с промените и актуализациите поради по-простия синтаксис в сравнение с HTML4. Например, имате много проста декларация в началото на страницата, за да я зададете като HTML5 страница:
Простата декларация на Doctype е едно от опростяванията, направени в синтаксиса на HTML, който е съвместим с всички версии от HTML4 и чак до XHTML1. HTML5 обаче не е съвместим със SGML.
Препоръчителни курсове
- Безплатно обучение по програмиране на Python
- Курс за безплатен софтуер за тестване на сертификати
- Безплатни курсове за програмиране на Java
- Пълен курс PERL
-
Новият елемент
HTML5 идва с редица нови елементи и елиминира няколко други (които ще разгледаме след малко), но един от ключовите му добавени елементи е, който е повлиял изключително много на използването на Adobe Flash в уебсайтове. Въпреки че Flash все още се използва от няколко уебсайта, HTML5 е приет от много хора и много хора смятат, че в крайна сметка той ще направи Flash остарял. Само времето ще реши това; дотогава, каскадният елемент на HTML5 се оказа добра алтернатива на Flash.
Елементът може да се използва за рисуване на графики с различни форми и цветове чрез скриптове, обикновено JavaScript. Елементът е просто контейнер за графиката; трябва да използвате скрипт, за да определите графиките. По подразбиране платно е правоъгълна зона без съдържание или граници. Пазарът е така:
Важно е да определите атрибут id, както и ширина и височина за определяне на размера на платното. Можете да добавите атрибут на стил, за да дефинирате граници.
Можете да използвате и JavaScript, като следния пример:
var c = document.getElementById („myCanvas“);
var ctx = c.getContext („2d“);
ctx.fillStyle = “# FF0000”;
ctx.fillRect (0, 0, 150, 75);
-
Новото и стихиите
Друго голямо допълнение, с което се предлага HTML5, са новите и елементи, показващи нова анатомия в мрежата. С тези нови маркери вече няма нужда да се идентифицират двата елемента с маркер.
Спецификациите определят заглавния елемент като представлява група от „навигационни“ или „въвеждащи“ помощни средства. Като такъв, елементът може да се използва за определяне на въведение в раздел на страница или към самата страница. Ето кодов фрагмент, който използва заглавния елемент.
Заглавие
Автор Автор Пила в Web 2.0
Основен текст
Спецификациите на HTML5 се отнасят до подножието като представяне на „долен колонтитул за най-близкото съдържание на секцията на предците или корен елемент на секцията“ и като цяло съдържа информация относно секцията, като име на автора, данни за авторските права, връзки към документи и т.н.
Логично долен колонтитул е поставен в долната част на уеб страницата. Но може да бъде поставен и в края на раздел от страницата. Ето някои примери за кодиране, които използват елемента на долния колонтитул:
Заглавие на съдържанието
Автор Автор Пила в Web 2.0
Основен текст.
Тагове: Командна линия, Компас, CSS, Sass, Терминал
10 харесвания
Тук подножието съдържа маркери за публикации и публикацията „Facebook харесва“.
-
И елементите
Сега, ако прегледате горните примери, щяхте да забележите още няколко нови елемента, като например. Този елемент, заедно с елемента, ви дава възможност да маркирате конкретни секции от вашето оформление и са изключително полезни за оптимизация на търсачките. Елементът на артикула е посочен като представлява самостоятелен компонент на уеб страница, който трябва да бъде независимо използваем или може да бъде разпространяван. Това може да бъде вестник, публикация във форума, статия в списанието, запис в блога или нещо друго.
Елементът на статията обикновено има свое заглавие в заглавен елемент и може би дори долен колонтитул, както видяхте в горния пример. Можете просто да мислите за елемента като запис в блог или независима част от съдържанието; трудната част е идентифициране на това, което е независимо. Просто казано, независима част от съдържанието е тази, която има смисъл сама по себе си.
Добър начин да разберете дали част от съдържанието е независима е като попитате дали има смисъл в RSS емисия. Статиите в блога и статичните страници имат смисъл, а някои сайтове имат емисии за коментари. Но параграф в статия не би имал никакъв смисъл отделен от останалото съдържание. Ето фрагмент на код с футър и публикуване на маркери.
Заглавие на съдържанието
Публикувано: 2016-02-24
Основен текст
Лиценз на Creative Commons Attribution-ShareAlike
Елементът на секцията, съгласно спецификациите на W3C, представляващ „общ раздел“ на приложение или документ. Може да се обърка с маркера, така че нека изясним объркването в момента. Маркерът на секциите се използва, когато съдържанието в него трябва да бъде групирано отделно от останалата част на страницата с една тема и когато трябва да се разглежда като запис в очертанията на страницата. Елементът div обаче е определен като „генеричен контейнер“, което означава, че не е отделен от самата главна страница, освен собствените атрибути на заглавие, език и клас.
-
Нови и елементи
Новите и елементите на HTML5 са част от спецификациите на Интерактивните елементи, но са сред най-малко говоримите елементи от разработчиците. Като се има предвид факта, че мрежата се е променила в по-току свързана страница и документи, тези елементи са добре дошли за по-голяма интерактивност в мрежата.
Елементът не трябва да се бърка с елемента, който е дефиниран като HTML навигационен маркер, който представлява блока за навигация на страницата. Обикновено съдържа връзки за потребителите, които могат да преминат през секции в страницата или към друга страница. От друга страна, етикетът на менюто представлява командите на менюто за опростяване в настолни и мобилни приложения. Ето пример за елемента в действие:
Здравей свят
Междувременно елементът е друг начин за подреждане на изображения и текст. Използва се заедно с елемента за маркиране на илюстрации, диаграми и снимки. Дадено по-долу е кратък фрагмент от код, който включва и двата елемента в действие.
-
Нови и елементи
Това са две основни допълнения към стандарта HTML5. Аудио тагът, подобно на видео маркера, дава възможност на разработчиците да вграждат музика и аудио на уебсайта си. За разлика от предишния стандарт, вие не се ограничавате да добавяте midi музика, въпреки че все още има някои ограничения за типа на използваните файлове. Повечето браузъри, свързани с Webkit, поддържат обикновени MP3 файлове, но други поддържат само OGG формат. Добрата новина е, че има много файлови конвертори и можете просто да предоставите две версии на аудио файла; правилната версия ще бъде избрана автоматично.
Можете да използвате аудио маркера като всеки друг елемент. Ето примерен фрагмент:
Аудио маркерът също има редица атрибути за допълнителни контроли, включително атрибути на събитията, а събитията включват събития на прозореца, събития във формата, медийни събития и събития на мишката. Видео елементът също има редица атрибути на съдържанието, включително SRC, глобални атрибути, цикъл, контрол, предварително зареждане и плакат. Атрибутите SRC, цикъл, автоматична игра и контрол са доста обясняващи се и еднакви за всички медийни елементи, докато глобалните атрибути са общи за всички елементи. Те включват режисьор, скрито, контекстно меню и др.
Има няколко други мултимедийни атрибута и елементи, които идват с HTML5, като елемента на песента, който предоставя текстови песни за видео елемента.
-
Нови форми
HTML5 сега идва с форма и елементи. Ако не планирате да използвате много таблици на страницата, можете също да премахнете атрибута и да разгледате направените промени, преди да продължите напред.
-
Няма повече и елементи
Това означава, че всички атрибути, които позволяват на разработчиците да създадат перфектно подредена, тонирана таблица, като границата, bgcolor, подравняване, височина, правила и други. Всички тези атрибути се заменят с CSS.
-
Не повече и
Това е чудесно за онези разработчици, които са работили през първите дни на HTML. Атрибутите frameset, frame и noframes са премахнати изцяло, заедно с други като blink, basefont и други. Ще трябва да управлявате, без да използвате таблици за оформлението. Таблиците все още са част от HTML5, но те вече не са предназначени за пиксели. Спецификациите казват, че таблиците не трябва да се използват за помощни средства за оформление и за контрол на оформлението на страницата.
заключение
Както ясно виждате, има много промени в HTML5 и трябва да го използвате внимателно и предпазливо. Също така трябва да актуализирате знанията си за езика, тъй като той се променя с течение на времето и получава повече актуализации. Необходимо е да спрете използването на елементи, които HTML5 е премахнал от себе си и да използвате новите HTML5 елементи, които определено ще останат, като заглавките или етикетите на долния колонтитул.
Това, което видяхте по-горе, е само опростената версия на броя на промените, които HTML5 направи с неговото стартиране. Но нека бъдем честни тук; няма нищо просто или бавно в начина, по който се приема HTML5, а новият стандарт добавя много възможности, които са от решаващо значение за съвременното потребителско изживяване. Трябва да сте в крак с новия език и също да научите някои CSS, които имат по-голяма роля от преди.
Хубавото на тези промени е, че въпреки че са големи, те са към по-добро и това се разбира от всички заинтересовани страни, участващи тук. Браузърите ще бъдат по-мощни, когато се движат към облака, с възможност да се справят повече сами. С неща като Ajax и с вграждане на видео и аудио и така нататък, ще бъде много по-лесно да се кодира в директен метод и да се позволи на браузъра да поеме тежките задължения. Например, нови елементи на структурата като фигура, подножие, обобщение и раздел се отнасят до структурата на документа и изобразяването е оставено на браузъра.
Свързани статии:-
Ето няколко статии, които ще ви помогнат да получите повече подробности за HTML срещу HTML5, така че просто преминете през линка.
- HTML и XML
- HTML5 срещу Flash Top 9 разлики (с Инфографика)
- HTML срещу XHTML
- HTML5 срещу Flash
- Невероятни разлики HTML5 спрямо JavaScript
- 10 страхотни полезни съвета относно програмирането на Python (трикове)