Что за программа html5

HTML5 уже появился, и Web уже никогда не будет прежней.

Несомненно, вы уже слышали об этом. Догадываюсь, что, когда вы это услышали, вы заволновались, закатили глаза или пробормотали «с какой стати?» и слегка нахмурились. А может, вы испытали все эти эмоции.

Я не стал бы винить вас за это. HTML5 — интересная штука, и потенциально он действительно способен несколько изменить ту Web, которую мы знаем сейчас, но не более того. Я сам испытывал подобные эмоции, когда создавал приложения с использованием HTML5. Тематика по HTML5 весьма широкая, поэтому разобраться в ней трудно, особенно если не знаешь, с чего начать изучение этого интересного нового набора технологий.

Это первая статья из целой серии для журнала «MSDN Magazine», цель которой — дать полную картину того, почему первая фраза в этой статье является правильной (и важной). На протяжении нескольких месяцев я попытаюсь помочь вам понять, что HTML5 означает для вас — как для веб-разработчика, так и для разработчика, использующего инструментарий и технологии Microsoft. Я надеюсь упростить некоторые сложности, окружающие HTML5, и развеять многие мифы, возникшие на волне общей шумихи вокруг HTML5. Я также познакомлю вас с некоторыми средствами HTML5, доступными в настоящее время, и рядом интересных технологий, которые, хоть и не достигли должного уровня зрелости, заслуживают пристального внимания. Наконец, я дам кое-какие рекомендации, которые помогут вам задействовать технологии HTML5 уже сейчас, несмотря на то, что вы все еще ведете разработки с учетом пользователей более старых браузеров.

HTML #4 — Что нового в HTML5?

Если вас интересует HTML5, я помогу превратить этот интерес в идеи, которые вы сможете немедленно реализовать на практике. Если же вы настроены скептически, я помогу понять, в чем заключается важность HTML5. А если вы даже не понимаете, что означает HTML5, не бойтесь: об этом мы поговорим в первой же статье из этой серии.

Что такое HTML5?

К этому моменту вы, вероятно, поняли, что под HTML5 разные люди подразумевают разные вещи. Для некоторых это просто новые теги вроде и и масса новых атрибутов, доступных в разметке. Для других это все новое и интересное в Web, в том числе технологии, реализованные всего в одном из браузеров, или какие-то спецификации, официально не включенные в HTML5. Поэтому для начала нужно разобраться в том, чем на самом деле является HTML5.

И, если честно, такому разнообразию толкований можно найти оправдание. HTML5 огромен! Формально определенный организацией международных стандартов World Wide Web Consortium (W3C), HTML5 состоит из более чем 100 спецификаций, относящихся к веб-технологиям нового поколения. Хотя охватить разом столь широкое понятие, как HTML5, и недвусмысленно определить его очень трудно, я считаю, что W3C пыталась ввести HTML5 как обобщающую концепцию перемен, происходящих в Web.

По сути, HTML5 — широкий термин, описывающий набор спецификаций HTML, CSS и JavaScript, разработанных для создания веб-сайтов и приложений нового поколения. Примечательно, что в этом определении есть три части: HTML, CSS и JavaScript. Они определяют, как разработчики должны использовать улучшенную разметку, более богатые стилевые возможности и новые JavaScript API. Проще говоря, HTML5 = HTML + CSS + JavaScript.

Учим Html за 35 минут для начинающих от 10 лет (Основы) + Мотивация для разработчиков #ДомаВместе

Вот и все. HTML5 — это совокупные изменения в HTML, CSS и JavaScript. Эти три термина описывают всю широту и масштаб HTML5. Вы по-прежнему думаете, что это некоторое упрощение? Возможно, но, как вы вскоре увидите, исчерпывающее определение HTML5 не столь значимо по сравнению с технологиями, которые вы выбираете и считаете заслуживающими вашего времени и сил в освоении.

Покончив с определением, потратим несколько минут на позицию Microsoft в отношении HTML5.

HTML5 и Internet Explorer

Как я уже упоминал, набором спецификаций, образующих HTML5, управляет W3C. W3C состоит из персонала, организаций и индивидуальных лиц, заинтересованных в развитии и определении будущего Web. WC3 действует на основе консенсуса и, как правило, формирует комитеты (называемые рабочими группами) для деления работы над спецификациями на части. Спецификации могут предлагаться любым членом, и все спецификации, которыми владеет W3C — их куда больше тех, что относятся к общему термину HTML5, — проходят пятиступенчатый процесс от первого чернового варианта до официальной рекомендации.

Microsoft является членом W3C и играет очень активную роль в процессе выработки спецификаций для многих стандартов HTML5, а также участвует в рабочих группах. Как и все основные поставщики браузеров, Microsoft внесла большой вклад в HTML5 и работает с W3C и другими организациями, чтобы обеспечить надежную и совместимую реализацию технологий HTML5 во всех основных браузерах.

В этом контексте подход Microsoft сводится к четырем пунктам.

  1. Обеспечить реализацию HTML5 уже сегодня (site-ready HTML5) через Internet Explorer 9.
  2. Предоставлять будущую функциональность разработчикам через Internet Explorer Platform Preview.
  3. Активно участвовать в обеспечении совместимости через тесты, передаваемые W3C.
  4. Создавать прототипы неустоявшихся стандартов через лаборатории HTML5.

Под термином «Site-Ready HTML5» Microsoft подразумевает технологии HTML5, которые можно использовать уже сегодня благодаря широкой поддержке со стороны всех основных браузеров. Технологии вроде новых HTML-тегов, Canvas, Scalable Vector Graphics, Audio and Video, Geolocation, Web Storage и многих новых модулей CSS3 — все попадают под эту категорию, и все они реализованы в Internet Explorer 9, равно как и в других мейнстримовых браузерах. Я предполагаю отвести в этой серии статей немалое время на обсуждение данных технологий, а также тому, как вы можете внедрять их уже сегодня.

Помимо того, что доступно в настоящее время, Microsoft использует общедоступные Platform Preview для информирования разработчиков о том, что появится в следующей версии браузера, и сбора замечаний и предложений. В случае Internet Explorer 9 компания Microsoft выпускала Platform Preview через каждые шесть-восемь недель, объявляя при этом о новых усовершенствованиях, функционале и повышении быстродействия HTML5 и предлагая разработчикам самим опробовать и оценить очередную предварительную версию. Internet Explorer 9 был выпущен в марте, а уже в начале июля Microsoft выпустила две Platform Preview для Internet Explorer 10, сигнализируя тем самым, что Microsoft продолжает регулярный выпуск предварительных версий новых наработок для Internet Explorer. Как разработчик вы наверняка захотите посмотреть новейшие наработки, чтобы проверить их в деле и повлиять на дальнейшее развитие этого браузера. Вы можете скачать новейшую предварительную версию платформы Internet Explorer с сайта IETestDrive.com.

Читайте также:
Что за программа на день вдв

Чтобы добиться согласованной работы HTML5 между всеми браузерами, Microsoft вносит активный вклад в обеспечение совместимости, создавая и передавая в W3C единый крупнейший набор тестов, относящихся к HTML5. Впервые этот набор будет использоваться W3C как авторитетный источник при проверке «готовности» HTML5 в каждом браузере. В конечном счете результат таков, что мы можем один раз внедрить и реализовать технологии HTML5, а потом быть уверенными, что они будут согласованно работать во всех браузерах. Подробнее о работах Microsoft в этой области см. по ссылке bit.ly/dxB12S.

Хотя некоторые технологии HTML5 уже имеются в Internet Explorer 9, а другие заявлены для Internet Explorer 10 через Internet Explorer Platform Previews, некоторые популярные и важные спецификации нуждаются в доработке W3C и поставщиками браузеров до того, как они будут готовы к реализации в наших приложениях. Один из примеров — Web Sockets, потрясающе интересная спецификация, которая позволяет разработчикам устанавливать двухсторонние коммуникационные каналы с внутренними серверами (back-end servers), что открывает веб-приложениям недоступные прежде возможности поддержки соединений уровня «реального времени». Как разработчик вы, несомненно, можете вообразить бесчисленные области применения Web Sockets даже в тех приложениях, которые вы создаете прямо сейчас. Но спецификация Web Sockets все еще быстро меняется, ее ключевые аспекты активно обсуждаются в W3C. С учетом этой ситуации на данный момент эту технологию было бы затруднительно реализовать согласованно и надежно в разных браузерах.

Для неустоявшихся или развивающихся спецификаций вроде Web Sockets (которые я подробно рассмотрю в следующей статье) Microsoft создала HTML5 Labs — сайт для разработчиков, где можно поэкспериментировать с черновыми реализациями этих технологий. Этот сайт предоставляет прототипы, которые можно скачать и опробовать локально, а некоторые спецификации можно посмотреть в виде демонстраций. Цель — создать такое место, где можно самостоятельно экспериментировать с этими спецификациями и сообщать свои замечания как Microsoft, так и W3C. Подробнее о HTML5 Labs см. на сайте html5labs.com.

HTML5 и средства разработки Microsoft

Помимо участия в работе W3C и поддержки спецификаций HTML5 в браузере, есть и другой аспект в подходе Microsoft к HTML5, важный для разработчиков: инструментарий для HTML5.

В начале 2011 года Microsoft обновила два своих инструмента разработки: Visual Studio 2010 и Expression Web 4. В пакеты обновлений была включен тип документов HTML5 для проверки, а также поддержка IntelliSense для новых тегов и атрибутов HTML5. Если вы используете Visual Studio 2010 SP1, то можете включить HTML5 Schema, выбрав Tools | Options | Text Editor | HTML | Validation, а затем указав HTML5 в раскрывающемся списке Target, как показано на рис. 1. Вы также можете установить HTML5 как схему по умолчанию из HTML Source Editing Toolbar в любом HTML-файле (рис. 2).

Включение HTML5 Schema через диалог Options

Рис. 1. Включение HTML5 Schema через диалог Options

Задание HTML5 Schema в HTML Source Editing Toolbar

Рис. 2. Задание HTML5 Schema в HTML Source Editing Toolbar

Задав схему по умолчанию, вы получите поддержку IntelliSense в Visual Studio для 28 новых семантических HTML-тегов, а также новых глобальных и специфических для конкретных тегов атрибутов (рис. 3).

HTML5 IntelliSense в Visual Studio 2010 SP1

Рис. 3. HTML5 IntelliSense в Visual Studio 2010 SP1

Очередное обновление поддержки HTML5 произошло в июне 2011 года с выпуском Web Standards Update for Microsoft Visual Studio 2010 SP1. Это расширение, работающее со всеми редакциями Visual Studio 2010, добавляет дополнительную поддержку HTML5 IntelliSense и проверки в Visual Studio, включает JavaScript IntelliSense для новых возможностей браузера вроде Geolocation и DOM Storage, а также предоставляет обширную поддержку CSS3 IntelliSense и проверку. Вы можете скачать это обновление, которое будет регулярно обновляться с целью совершенствования инструментария для разработки под HTML5, по ссылке bit.ly/m7OB13.

В Expression Web 4 SP1 предлагается та же поддержка IntelliSense, если вы укажете схему HTML5 в Tools | Page Options, а также CSS3 IntelliSense для нескольких черновых модулей CSS3.

Если вы используете WebMatrix (web.ms/WebMatrix), то, вероятно, заметили, что все новые документы .html, .cshtml или .vbhtml, создаваемые вами, содержат разметку по умолчанию, подобную той, которую вы видите на рис. 4. Как будет рассказано в следующей статье, это базовый допустимый документ HTML5. Самое примечательное заключается в том, что теги doctype и meta charset потеряли много своего хлама. Использование этого простого doctype инициирует включение режима HTML5 во всех современных браузерах, и WebMatrix облегчает эту работу, предоставляя документ HTML5 по умолчанию.

Рис. 4. HTML-документ по умолчанию в WebMatrix

Если вам мало этого нового инструментария HTML5, то для ASP.NET MVC недавно вышел пакет ASP.NET MVC 3 Tools Update, объявленный на конференции MIX11 в апреле. Наряду с различными новыми средствами ASP.NET MVC 3 Tools Update предоставляет возможность использовать HTML5 doctype в новых проектах и помещает Modernizr 1.7 в папку Scripts новых приложений. Modernizr — это библиотека JavaScript, которая значительно упрощает разработку с применением HTML5; о ней мы поговорим в будущей статье.

Сухой остаток заключается в том, что, хотя HTML5 только появляется в наших браузерах, его официальная поддержка быстро добавляется в инструментарий, и Microsoft даже добавляет поддержку библиотек (вроде Modernizr), разработанных сообществом. Таким образом, вы уже сейчас можете ориентироваться на HTML5 с некоторой помощью со стороны инструментария Microsoft и ожидать, что поддержка HTML5 и в дальнейшем будет расширяться и улучшаться.

«Внедрение» HTML5 в ваши приложения

К этому моменту вы уже поняли, что HTML5 не является единой сущностью, которую можно внедрить или на которую можно перейти одним махом. Внедрение HTML5 заключается в оценке каждой технологии и принятии решений о том, какие из них подходят для вашего приложения. Оценивая каждую технологию HTML5 и решая, готова ли она для принятия вами, принимайте во внимание (как минимум) следующие факторы:

  • насколько широко реализована данная технология во всех основных браузерах?
  • как вы будете внедрять ее и что будете делать с поддержкой для браузеров, не поддерживающих эту технологию?

Первый фактор наиболее важен, и при понимании того, какие браузеры чаще всего используются посетителями вашего сайта, он должен дать четкую картину о подмножестве из ста с лишним спецификаций, которое имеет смысл рассматривать дальше. Это подмножество должно состоять из набора устоявшихся спецификаций, которые можно надежно внедрять для ваших пользователей уже сегодня.

Однако даже с этим набором не следует игнорировать пользователей, не переходящих на более новые браузеры. Если вы ежедневно активно занимаетесь разработкой для своего сайта, то, несомненно, хотя бы примерно представляете доли браузеров, используемых посетителями сайта. Большинству из нас будет легко увидеть процент пользователей с устаревшими браузерами и прийти к выводу, что внедрение любых технологий HTML5 негативно скажется на этих пользователях. К счастью, есть такая методика, как «поли-заполнение» («polyfilling»), избавляющая нас от ожидания некоей расплывчатой даты в будущем, когда мы сможем уверенно внедрять HTML5.

Читайте также:
Бтв что это за программа

Пол Айриш (Paul Irish) (разработчик проектов jQuery и Modernizr) определяет поли-заполнение как «…тонкая прослойка, которая имитирует будущий API и предоставляет выпадающую функциональность для устаревших браузеров». Эта прослойка подобна шпаклевке для веб-сайтов; она позволяет определить, доступна ли конкретная функция HTML5 пользователю, который в данный момент просматривает ваш сайт, и предоставить ему либо имитацию ее поддержки, либо корректно сократить функциональность сайта.

Наиболее популярная библиотека, использующая поли-заполнение, — Modernizr, библиотека JavaScript, о которой я уже упоминал. Modernizr предоставляет некоторые базовые средства поли-заполнения для семантической разметки, распознавание поддержки функций браузером для большинства технологий HTML5 и поддержку условного CSS в зависимости от поддерживаемых функций. Как отмечалось, Modernizr будет предметом обсуждения в следующей статье; кроме того, ее средства (наряду со средствами многих других библиотек поли-заполнения) будут использоваться в примерах на протяжении всей серии статей. Чтобы узнать больше, скачайте Modernizr с сайта modernizr.com.

Когда дело доходит до выбора внедряемых технологий, ваш финальный список может оказаться комбинацией широко поддерживаемых спецификаций и спецификаций, которые потребуют поддержки поли-заполнения для определенных браузеров.

В предстоящих статьях мы обсудим несколько значимых спецификаций — от Geolocation и Forms and Canvas до Web Workers, Web Sockets и IndexedDB. Некоторые из них широко поддерживаются и готовы к использованию уже сегодня, а некоторые (вроде Web Sockets) являются настолько прорывными, что их нельзя игнорировать даже несмотря на то, что на сегодняшний день они еще не устоялись.

Если вы хотите побольше узнать о HTML5 прямо сейчас, могу посоветовать несколько книг по этой тематике. В частности, рекомендую прочитать книги Брюса Лоусона (Bruce Lawson) и Реми Шарп (Remy Sharp) «Introducing HTML5» (New Riders, 2010) и Марка Пилгрима (Mark Pilgrim) «HTML5 Up and Running» (O’Reilly Media, 2010). Кроме того, обязательно посетите сайт W3C.org, где вы найдете актуальную информацию по всем спецификациям, а также сайты BeautyoftheWeb.com и IETestDrive.com, чтобы скачать соответственно Internet Explorer 9 и Internet Explorer 10 Platform Preview и узнать больше о поддерживаемых Microsoft технологиях HTML5 в этих браузерах.

Помимо всего прочего, начинайте внедрять HTML5. Web уже никогда не будет прежней, это правда, и вы сможете стать частичкой движущей силы этих перемен, создавая веб-приложения нового поколения с использованием HTML5.

Брэндон Сэтром — разработчик-идеолог в Microsoft. Ведет блог UserInexperience.com и пишет заметки в Twitter.com/BrandonSatrom.

Выражаю благодарность за рецензирование статьи экспертам Джону Боксу (Jon Box), Демьяну Эдвардсу (Damian Edwards) иКларку Селлу (Clark Sell).

Источник: learn.microsoft.com

Что такое HTML5?

Jeff Reifman

Jeff Reifman Last updated Mar 17, 2016

Read Time: 13 min

Кредит: Тема Простая — Что такое HTML5? Они делают классные анимированные ролики.

Введение в HTML5

Добро пожаловать в Envato Tuts +! Этот учебник содержит вводный обзор HTML5. Если вы ничего не слышали об этом или просто хотите понять его значимость, вы попали в нужное место.

HTML5 является последним стандартом для браузеров для отображения и взаимодействия с веб-страницами. Утвержденный в 2014 году, это первое обновление для HTML за 14 лет. Это прямо целая жизнь между обновлениями.

Целью HTML5 является, в первую очередь, упрощение для веб-разработчиков и создателей браузеров соблюдения стандартов, основанных на консенсусе, которые повышают эффективность и расширение прав. Он также предназначен для обеспечения более лучшего, более быстрого и удобного пользовательского интерфейса для десктопа и мобильных пользователей.

Вот несколько ключевых улучшений в HTML5:

  • На страницах есть более простая, более прямолинейная структура элементов, что упрощает их сбор, настройку и отладку — и создание автоматизированных службы, которые помогут вам найти важные ресурсы в Интернете.
  • Он предоставляет стандартные элементы для обычных медиа-объектов, которые ранее требовали раздражающих плагинов для аудио, видео и т.д. Эти плагины необходимо было регулярно обновлять, то есть повторять загрузки для управления безопасностью.
  • Существует встроенная интеграция с интерфейсами для удовлетворения современных веб-и мобильных потребностей. Одним из моих любимых примеров этого является геолокация, которая позволяет вам определять координаты GPS посетителя через браузер. Ранее эта функция была ограничена телефонами с поддержкой GPS.

Например, ниже приведен пример геолокации HTML5 из «Создание вашего стартапа с PHP: геолокация и Google Места» (Tuts +):

What is HTML5 Geolocation Example

Для кого HTML5 имеет значение?

Вы просто веб-пользователь или поклонник YouTube?

HTML5 улучшит скорость, удобство использования и согласованность в Интернете. Да, ваш опыт YouTube будет постепенно становиться все лучше. Будет меньше обновлений для браузера и плагинов, меньше угроз безопасности и больше более элегантных, более читаемых и более быстрых веб-сайтов.

Вы веб-разработчик?

HTML5 делает вашу жизнь невероятно легкой и значительно расширяет возможности. Это также означает, что вы сможете создавать страницы и больше полагаться на разработчиков браузеров, чтобы обеспечить согласованность. Это означает гораздо меньше условного кода в макетах.

Вы хотите создать веб-браузер?

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

Хотите узнать больше?

Предистория HTML5

Откуда выходит HTML5?

HTML5 является последним за более чем 20 лет стандартов программирования браузера с момента запуска Интернета в 1991 году.

История HTML

HTML впервые появился в качестве стандарта в 1993 году, и вот график версий HTML, принятых комитетами по стандартам:

  • HTML 2.0: 1995
  • HTML 4.0: 1997
  • HTML 4.01: 2000
  • HTML 5: 2014

Цели HTML5

Согласно Википедии, HTML5 предназначен для консолидации более ранних версий и дифференцированных типов документов, таких как XHTML 1 и DOM Level 2 HTML:

[HTML5] расширяет, улучшает и рационализирует разметку, доступную для документов, и вводит разметку и . (API) для сложных веб-приложений . HTML5 также является потенциальным кандидатом для кросс-платформенных мобильных приложений. Многие функции были разработаны с использованием маломощных устройств, таких как смартфоны и планшеты, которые были приняты во внимание.

Вот краткое описание того, как MakeUseOf объясняет цели HTML5:

What is HTML5 Plugin Past for Video Element

  • Устранение плагинов, таких как Flash, для общих функций, которые вам нужны. Создание собственной поддержки для таких вещей, как аудио, видео и т.д.
  • Уменьшение необходимости в JavaScript и дополнительном коде с новыми встроенными элементами.
  • Обеспечение согласованности между браузерами и устройствами.
  • При этом сделать все это максимально прозрачным.

Кредит изображения: Простая тема

Какие новые возможности предлагает HTML5?

Выходи что очень много! HTML5 предоставляет такой впечатляющий список новых возможностей, которые основные браузеры по-прежнему не полностью еще поддерживают даже через 18 месяцев после его принятия:

Читайте также:
Cms exe что это за программа

What is HTML5 Browser compatiblity

Там также эта интерактивная визуальная радуга в HTML5Readiness. Наведите указатель мыши на разные дуги, и вы увидите, какие функции поддерживаются браузерами:

What is HTML5 Compatibility Rainbow

Это весело, но другие диаграммы на других сайтах могут быть более функционально интуитивными в использовании.

Уровни поддержки HTML5

В 2011 году Wikipedia сообщила, что около трети из 100 лучших веб-сайтов поддерживали некоторые возможности HTML5. К августу 2013 года было сделано около 153 сайтов из списка Fortune 500.

Вот визуализация огромности возможностей HTML5:

What is HTML5 Feature Overview

Новые элементы HTML5

Самые основные новые элементы HTML5 облегчают выкладку веб-страниц и отладку кода. Это также облегчает автоматические услуги для сканирования документов в Интернете и понимания важности различных компонентов страницы.

Для макета страницы и ключевых функций в настоящее время существуют определенные элементы, такие как:

  • и
  • для всех видов меню
  • для боковых панелей или близлежащего контента
  • , куда идет контент, такой например, как сообщение в блоге
  • похож на , но более ориентирован на контент
  • и , чтобы браузеры управляли воспроизведением каждого из них. Больше нет плагинов и обновлений безопасности для этого
  • специально для того, чтобы вы могли рисовать графику с помощью отдельного языка сценариев
  • для размещения внешнего контента или приложений на странице

Вот хороший визуальный очерк их Smashing Magazine:

What is HTML5 New Elements

Вот некоторые из более продвинутых функций HTML5, включая интеграцию API, что делает программирование в JavaScript для сложных действий более простым и последовательным в браузерах:

  • Воспроизведение аудио и видео: обеспечивает воспроизведение мультимедиа в браузерах без использования плагинов.
  • Геолокация: укажите местоположение посетителя.
  • Перетаскивание: для загрузки файлов из браузера с помощью простых жестов.
  • Кэш приложения: обеспечивает поддержку для запуска HTML-сайтов в автономном режиме.
  • Веб-воркеры: выполняет JavaScript в фоновом режиме (неблокирование).
  • События, отправленные сервером: позволяют серверам обновлять веб-страницы в браузере после их загрузки, проще и эффективнее, чем AJAX и JavaScript.
  • Автономное хранение данных: обеспечивает способ хранения данных локально в браузере независимо от файлов cookie. Как использовать автономное хранилище HTML5 на вашем сайте предоставит вам хороший обзор этой возможности.

HTML5 и «Будущее Интернета» предлагают другое руководство по этим функциям. Вот один из их выводов — они очень ценят кэш приложений:

Google Gears предоставил нам автономное хранилище данных, и Flash познакомил нас с кешем приложений (Pandora использует его для сохранения вашей информации в журнале). Благодаря HTML5 эти возможности теперь доступны для использования прямо в браузере и могут быть легко расширены с помощью JavaScript.

Нужно выяснить, какие функции поддерживаются в браузерах? HTML5Test имеет полезную интерактивную оценку функций и поддержки браузера:

What is HTML5 Feature Compatibility Browser Matrix

Существует так много новых функций, что невозможно создать каталог и упомянуть здесь все из них. Проверьте ссылки ресурсов внизу этого руководства для более глубоких ресурсов, которые я рекомендую.

Несколько примеров HTML5 в действии

Давайте рассмотрим несколько интересных примеров HTML5 в действии.

Страница Boilerplate HTML5

Простота HTML5 понятна в новых макетах страниц. Чем больше элементов, ориентированных на контент, тем легче понять код страницы и отладить. Вот простой пример, который я построил с помощью проекта HTML5-Reset:

Источник: code.tutsplus.com

Введение в HTML5

HTML (HyperText Markup Language) представляет язык разметки гипертекста, используемый преимущественно для создания документов в сети интернет. HTML начал свой путь в начале 90-х годов как примитивный язык для создания веб-страниц, и в настоящий момент уже трудно представить себе интернет без HTML. Подавляющее большинство сайтов так или иначе используют HTML.

В 2014 году официально была завершена работа над новым стандартом — HTML5, который фактически произвел революцию, привнеся в HTML много нового.

Что именно привнес HTML5?

  • HTML5 определяет новый алгоритм парсинга для создания структуры DOM
  • добавление новых элементов и тегов, как например, элементы video , audio и ряд других
  • переопределение правил и семантики уже существовавших элементов HTML

Фактически с добавлением новых функций HTML5 стал не просто новой версией языка разметки для создания веб-страниц, но и фактически платформой для создания приложений, а область его использования вышла далеко за пределы веб-среды интернет: HTML5 применяется также для создания мобильных приложений под Android, iOS, Windows Mobile и даже для создания десктопных приложений для обычных компьютеров (в частности, в ОС Windows 8/8.1/10).

В итоге, как правило, HTML 5 применяется преимущественно в двух значениях:

  • HTML 5 как обновленный язык разметки гипертекста, некоторое развитие предыдущей версии HTML 4
  • HTML 5 как мощная платформа для создания веб-приложений, которая включает не только непосредственно язык разметки гипертекста, обновленный HTML, но и язык программирования JavaScript и каскадные таблицы стилей CSS 3.

Кто отвечает за развитие HTML5? Этим занимается World Wide Web Consortium (сокращенно W3C — Консорциум Всемирной Паутины) — независимая международная организация, которая определяет стандарт HTML5 в виде спецификаций. Текущую полную спецификацию на английском языке можно посмотреть по адресу https://www.w3.org/TR/html5/. И надо отметить, что организация продолжает работать над HTML5, выпуская обновления к спецификации.

Поддержка браузерами

Надо отметить, что между спецификацией HTML5 и использованием этой технологии в веб-браузерах всегда был разрыв. Большинство браузеров стало внедрять стандарты HTML5 еще до их официальной публикации. И к текущему моменту большинство последних версий браузеров поддерживают большинство функциональностей HTML5 (Google Chrome, Firefox, Opera, Internet Explorer 11, Microsoft Edge). В то же время многие старые браузеры, как например, Internet Explorer 8 и более младшие версии, не поддерживают стандарты, а IE 9, 10 поддерживает лишь частично.

При этом даже те браузеры, которые в целом поддерживают стандарты, могут не поддерживать какие-то отдельные функции. И это тоже надо учитывать в работе. Но в целом с поддержкой данной технологии довольно хорошая ситуация.

Для проверки поддержки HTML5 конкретным браузером можно использовать специальный сервис http://html5test.com.

Необходимые инструменты

Что потребуется для работы с HTML5? В первую очередь, текстовый редактор, чтобы набирать текст веб-страниц на html. На данный момент одним из самых простых и наиболее популярных текстовых редакторов является Notepad++ , который можно найти по адресу http://notepad-plus-plus.org/. К его преимуществам можно отнести бесплатность, подсветка тегов html. В дальнейшем я буду ориентироваться именно на этот текстовый редактор.

Также стоит упомянуть кроссплатформенный текстовый редактор Visual Studio Code. Данный редактор обладает несколько большими возможностями, чем Notepad++, и кроме того, может работать не только в ОС Windows, но и в MacOS и в операционных системах на основе Linux.

И также потребуется веб-браузер для запуска и проверки написанных веб-страничек. В качестве веб-браузера можно взять последнюю версию любого из распространенных браузеров — Google Chrome, Mozilla Firefox, Microsoft Edge, Opera.

Источник: metanit.com

Рейтинг
( Пока оценок нет )
Загрузка ...
EFT-Soft.ru