Особенности стандарта HTML5

 

Байкальский государственный университет экономики и права

Кафедра информатики и кибернетики













КУРСОВАЯ РАБОТА

«Особенности стандарта HTML5»


Работу выполнил: студент группы ИС-09-2

Михайлова А.М.

Руководитель: Артамонов И.В.








Иркутск

г.


Содержание


Введение

.История появления HTML5

.Особенности HTML5

.Отличия HTML5 от предыдущих версий. Сравнительный анализ плюсов и минусов

.1Преимущества HTML5

.2Недостатки HTML5

.Примеры реализации на HTML5

.Примеры российских сайтов на HTML5

.Сравнение браузеров (HTML)

Заключение

Использованные источники

Приложения



Введение


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

Самые заметные HTML5 возможности - это появление таких тегов как aside, footer, header, nav и article и полная поддержка новейших типов полей ввода в формах, включая атрибут placeholder (подсказывает подсказку в поле ввода), phone и email (которые обеспечивают правильную валидацию), а также ряд новейших медиа-элементов, которые включают audio, video и canvas, позволяющий динамически менять или рисовать контент.стремиться сделать интернет-сайты боле семантически правильными, более интерактивными, более быстрыми. Новый HTML стандарт включает функции, которые раньше требовали Flash или Javascript, а это значит, что сайты станут менее зависимы и смогут работать на многих платформах. [1]

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

.История появления HTML5


Стандарт HTML прошел долгий эволюционный путь. Его первая версия была опубликована в 1993 году в виде черновой спецификации для Интернета. В 90-е годы HTML оказался в центре всеобщего внимания. Очередные версии быстро сменяли друг друга. Вскоре после выпуска версии 2.0 вышла версия 3.2, затем - 4.0 (и это на протяжении всего лишь одного года) и, наконец, в 1999 году- версия HTML 4.01. Контроль за разработкой соответствующих спецификаций по мере развития языка осуществляет международный консорциум W3C.

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

В 2004 году по инициативе небольшой группы специалистов, представлявших ряд крупных производителей браузеров и заинтересованных в поднятии веб-платформы на новый технологический уровень, было основано сообщество WHATWG (Web Hypertext Application Working Group). Благодаря усилиям его участников и появилась спецификация HTML5. Они же инициировали и разработку новых средств, специально предназначенных для веб-приложений, поскольку ясно осознавали, насколько велика потребность в таких средствах. Именно в то время все чаще стали употреблять термин "Web 2.0". Все это давало основания полагать, что мы действительно являемся свидетелями второго возрождения Интернета, если первым считать период, когда статические веб-сайты уступили место более динамичным и социально направленным веб-сайтам, нуждавшимся в гораздо большем разнообразии различных средств в своем арсенале.

В 2006 году к работе над HTML вновь подключился Консорциум W3C и начали появляться постоянные ссылки или временные <#"justify">2.Особенности HTML5

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

Основная идея разработчиков HTML 5 - сделать жизнеспособный язык разметки, который будет работать на практике, и приносить пользу посетителям и разработчикам сайтов. Один из принципов, положенных в основу стандарта: на первом месте стоят интересы реальных пользователей, затем - создателей сайтов, затем - разработчиков браузеров и других приложений, затем - авторов самого стандарта, и только потом - теоретические и идеологические соображения, которые Консорциум безуспешно продвигал последние десять лет. HTML 5 должен стать преемником как HTML 4.0, так и XHTML 1.0, поэтому в стандарте уделяется большое внимание обратной совместимости. С одной стороны, новый язык не полностью совместим с предыдущими версиями, но, с другой стороны, не уходит в радикальный отрыв, как XHTML 2.0.существует в двух вариациях - как разновидность XHTML и как модификация «исторического» HTML. Создатели веб-страниц могут применять любую из этих вариаций. В первой вариации новый язык полностью согласован с XML 1.0, так что разработчикам доступны все преимущества XML и смежных технологий. Во второй вариации HTML5 покончил с кошмарным наследием прошлого - формальной совместимостью с SGML. Все предыдущие стандарты HTML претендовали на эту совместимость, но ни один браузер не обрабатывал код HTML по замысловатым правилам SGML. Вместо этого использовались простые алгоритмы, распознающие набор конкретных элементов и атрибутов. HTML 5 узаконил такое поведение браузеров. Новый стандарт не оглядывается на SGML, а описывает частные правила для интерпретации конкретных тэгов и других синтаксических конструкций. По сути, HTML 5 документирует принципы, по которым браузеры уже обрабатывают код последние пятнадцать лет.

В отличие от предыдущих стандартов, предназначенных в основном для разработчиков кода, HTML5 строго и подробно описывает поведение браузеров. Он требует от браузеров обрабатывать не только грамотный код, но и по возможности корректировать ошибки, вплоть до употребления отсутствующих в стандарте элементов. Например, HTML 5 не позволяет авторам кода использовать элементы nobr или marquee, но описывает, как браузер должен поступать, если они все-таки встретятся в документе. Это соответствует очередному генеральному принципу HTML5 - максимальной совместимости с уже существующим наполнением сети. Миллионы действующих сайтов не должны пострадать от появления нового языка и поддерживающих его браузеров.

Ещё одна особенность нового стандарта: он описывает документ HTML в терминах объектной модели (DOM). Перед тем, как отображать веб-страницу, браузер формирует древовидную структуру её элементов и других объектов. Предыдущие стандарты стыдливо замалчивали этот этап, а HTML5, наоборот, во многом опирается именно на такое представление документа. Это позволяет включить в спецификацию объекты, свойства и методы DOM, которые широко используются с незапамятных времён, однако никогда не были стандартизованы: window.open(), alert(), prompt(), document.links, document.images, innerHTML, contentEditable и так далее. Наконец, в HTML 5 официально включён элемент embed.

Однако HTML5 впитал не всё, что поддерживается в браузерах. Некоторые элементы, наоборот, удалены из стандарта: acronym, applet, basefont, big, center, dir, font, isindex, s, strike, tt, u. Убраны фреймы (frame, frameset, noframes), хотя остался элемент iframe. Нет больше атрибутов, которыми почти никто не пользовался (accesskey, longdesc и др.) или которыми не имеет смысла пользоваться (align, border, valign, cellpadding, cellspacing и др.). Некоторые старые элементы переосмыслены: например, i и b теперь обозначают разные формы смыслового выделения, а не курсив и полужирный шрифт; hr отвечает за разрыв в структуре документа. Элемент menu обрел вторую молодость и позволяет создавать настоящие меню, а address ущемлён в правах и предназначен строго для контактной информации в узком контексте.

Наконец, в HTML5 добавилось много нового. Для статей, блогов, документации и подобных материалов будут полезны элементы article и section, а также новая система заголовков и рубрикации. «Шапка» и «подвал», панель навигации и боковая панель обозначаются элементами header, footer, nav и aside. Для мультимедийного содержания появились элементы audio и video. Они внедряют в страницу соответствующий ресурс и обеспечивают стандартные элементы управления - кнопки запуска, паузы и остановки, проматывание, регулятор громкости. Для тех браузеров, где эти элементы не поддерживаются, HTML5 позволяет дополнить их альтернативным содержанием - например, роликом Flash, с помощью которого сейчас внедряется большинство аудио- и видеозаписей. В продвинутых браузерах полноценно сработает элемент audio или video, а во всех остальных - альтернативный ролик, так что все пользователи останутся довольны. (см. Приложение 1)

Здесь проявляется ещё один генеральный принцип - новые возможности HTML5 должны создавать как можно меньше проблем в тех браузерах, где они не поддерживаются. Почти все новшества языка устроены так, что для старых браузеров можно обеспечить их реализацию с помощью альтернативного содержания, CSS, JavaScript и других технологий. Отдельного упоминания заслуживает элемент canvas, который предоставляет область для рисования изображений «на лету» средствами JavaScript. Собственно, массовый интерес к HTML 5 начался после того, как Firefox и Opera решили поддерживать этот элемент.

Формы в HTML5 изменились до неузнаваемости. Примитивные процедуры заполнения и отправки формы, описанные в прежних версиях HTML, уже сейчас никого не устраивают, поэтому разработчики сайтов выдумывают собственные расширения интерфейса, средства проверки, самодельные элементы управления. В HTML5 эта самодеятельность урегулирована стандартными элементами, атрибутами и интерфейсами DOM. В дополнение к обычным текстовым полям, появились поля для ввода определённых данных. Например, input type="number" - это поле для ввода числа, а input type="range" - ползунок для регулирования громкости или чего-то похожего. Атрибуты min, max и step определяют диапазон и точность допустимых значений в поле. Элемент datalist обеспечивает поле со списком, а элемент output - область для вывода динамически генерируемых результатов. Атрибут required для элемента управления обозначает, что этот элемент обязателен для заполнения, так что без него форма не будет отправлена. Атрибут autofocus позволяет установить фокус ввода в данный элемент. Метод checkValidity() проверяет правильность заполнения полей. До сих пор эти возможности имитировались на сайтах с помощью кустарных сценариев JavaScript.

В стандарте предлагается элемент datagrid для организации динамических структур данных, элемент command для вызова пользовательских команд, элемент progress - индикатор хода выполнения операции, а также средства DOM для редактирования содержания прямо на веб-странице, перетаскивания, выделения, работы с буфером обмена и многого другого. Это отвечает общей тенденции развития Всемирной Паутины: если раньше сайты были чем-то вроде публикаций, то теперь они превратились в полноценные приложения, требующие функционального и удобного пользовательского интерфейса. Соответственно, новый HTML также должен стать не столько языком публикаций, сколько языком описания приложений. [4]

3.Отличия HTML5 от предыдущих версий. Сравнительный анализ плюсов и минусов


3.1Преимущества HTML5


1)Повышенная безопасность

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

В HTML5, чтобы избежать подобной ситуации для тегов iframe была спроектирована технология Sandbox. Благодаря ей, все скрипты, запускающиеся через iframe будут работать в специально ограниченной виртуальной среде, которая не выпустит результаты их работы за пределы браузера, а значит и не сможет поразить пользовательскую операционную систему. Даже если предположить, что запуск вируса посредством этого тега все же произойдет, какие-либо серьезные последствия он понести уже не сможет. [5]

)Ввод данных

В HTML5 становится проще и безопаснее. Правильность введения данных контролируется в режиме реального времени непосредственно во время ввода. В HTML4.0 проверка ошибок и сообщение о них происходит уже после отправки документа, что может создавать проблемы пользователям. [6]

Поддержка полноценной графики

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

Суть такого мощного нововведения как canvas состоит в том, что для браузеров на экране выделяется специальное пространство, положение которого на веб-странице определяется разработчиком сайта. В этой области с помощью целого набора специальных графических HTML5 команд можно составлять графические изображения, в том числе и анимированные, практически любой сложности. Более того, для 3-D графики разрабатывается специальный набор команд аналогичных всемирно известному стандарту трехмерной графики OpenGL. Теперь браузер будет способен воспроизводить не только красивые двухмерные интерактивные приложения, но и полноценные трехмерные игры.

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

)Видео и аудио

Для того чтобы воспроизвести видео или аудио поток в браузере пользователю приходиться прибегать к помощи все той же Flash технологии, требуемые в HTML4.0.

Браузерам для этого приходиться постоянно пользоваться Flash проигрывателями, а также скачивать постоянные обновления от Adobe для этой технологии, без которых пользователи сильно рискуют заразить свои компьютеры вирусами через бреши в старых версиях Flash.призван наконец избавить браузеры от этих дополнительных программ и дать им возможность полноценного воспроизведения аудио и видео контента своими силами. Для этого в HTML5 коде предусмотрены специальные теги, такие как <video> и <audio>. Впрочем, у этого нововведения имеются и свои недостатки, например отсутствие единого стандарта для видеокодеков, что не способствует пока широкому распространению этой удобной для пользователя и веб-разработчиков технологии. [5]

)Многократное увеличение скорости работы

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

Конечно же, проектировщики HTML5 не могли обойти эту проблему стороной. Новый стандарт обеспечивает поддержку многопоточности, которую именовали как Web Works. Таким образом, современные многоядерные системы получают возможность параллельно выполнять обработку скриптов и тем самым увеличить скорость работы сайта на несколько порядков в зависимости от его конструкции и сложности. [5]

)Технология Web Storage

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

Технология Web Storage для HTML5 затмит cookies своими возможностями только потому, что представляет из себя не форматно ограниченный текстовый файл, а специально ориентированную базу данных для различных видов информации. Теперь в такой базе сайт может хранить не только отдельные настройки сайта, а целые фрагменты его кода, что позволит работать с веб-приложениями даже при отсутствии подключения к сети Интернет.[5]

)Структурные возможности HTML5

Делают структуру веб-документа более простой, а код чище. Новые семантические элементы header, nav, section, article, aside и footer могут использоваться вместо контейнеров div, применяющихся сейчас в HTML4.0. новые элементы позволяют более конкретно описывать заголовок, нижний колонтитул, колонки текста и другие. Эти нововведения могут использоваться для автоматической генерации оглавления и организации более эффективной и простой навигации по веб-странице. Код при этом становится более чистым и менее засоренным второстепенными деталями.

Несколько конкретных примеров:

Пример1. Вместо громоздкой записи HTML4:

<!DOCTYPE html PUBLIC _//DTD XHTML1.0 Transitional//EN

<#"justify">7)Преимущества для конечного пользователя

С HTML5 жизнь конечного пользователя становится заметно легче:

·Не требуется установка многочисленных дополнительных программ;

·HTML5, в отличие от HTML4 совместим, помимо ПК и ноутбуков, еще и с планшетами, смартфонами и современными моделями телевизоров, которые предоставляют доступ в интернет. [6]

.2Недостатки HTML5


На сегодняшний день в HTML5 присутствуют минусы, из-за которых он проигрывает прежним технологиям. Имеет место некоторая уязвимость HTML5 в области защиты данных. Такую уязвимость создает больший, по сравнению с cookie стандарта HTML4, объем данных, которые сохраняются на жестком диске пользователя. Опасность заключается в том, что в больших объемах данных может содержаться более подробная информация о пользователе. Эксперты высказывают мнение, сто если хранилище HTML5 остается на компьютере пользователя в течение многих месяцев, то интернет-сайты, обращаясь к нему через JavaScript после загрузки страницы, могут незаметно для пользователя собирать и передавать данные владельцу сайта.

В отношении мультимедийного контента тоже есть недостатки, не позволяющие сделать окончательный выбор в пользу HTML5. Как отмечается в официальном блоге YouTube, поддержка видео HTML5 позволяет воспроизводить мультимедийный контент на компьютерах и устройствах, которые не поддерживают Flash Player, однако в полной степени HTML5 всем этим потребностям все еще не отвечает. На сегодняшний день Adobe Flash обеспечивает наилучшую платформу для воспроизведения видео. В HTML5 пока нет, например, полноэкранного режима. Имеются недостатки, касающиеся использования HTML5 для создания игр. И, кроме того, новый стандарт пока еще не поддерживается всеми браузерами. [6]

Различие в форматах HTML5 видео/аудио в различных браузерах может привести:

)К увеличению времени тестирования и разработки;

)К увеличению затрат дискового пространства и нагрузке на сервер.

Также есть и другие недостатки в использовании HTML5 видео/аудио:

)На данном этапе ни один их кодеков не может поддерживать шифрование потока с распаковкой на клиенте, то есть не имеют возможности отдавать контент в одну точку (теоретически его одновременно без шифрования сможет смотреть неограниченное число клиентов, а следовательно придется регулировать доступ к конкретному потоку на стороне сервера, что приведет к затратам мощностей);

)Нет ни одного универсального решения кроме как Flash для создания митингов и онлайн-трансляций прямо в браузере без установки дополнительного ПО. [7]

Недостатки HTML5 в разработке игр:

·Медленная работа игр, созданных при помощи HTML5;

·Не каждая платформа поддерживает игры, разработанные на HTML5;

·При разработке игры на HTML5 требуется гораздо больше ресурсов и времени;

·Открытость кода HTML5 неприемлема для бесплатных игр;

·Отсутствие мощных и удобных инструментов для создания игр, особенно для анимации;

·Невозможность адекватно упаковывать игру в один файл для дистрибуции на разных порталах;

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

Как отметил Филипп Ле Эгаре (Philippe Le Hegaret), руководитель направления компании W3C, которая разрабатывает стандарт HTML5, в ближайшие годы не получиться отказаться от технологии Flash. Причиной этому он назвал то, что потребуется длительное время для перехода всех веб-клиентов к поддержке HTML5. В течение ближайшего времени технологии HTML5 и Adobe Flash будут существовать. [6]

4.Примеры реализации на HTML5


Примеры реализации игр:2 [8 ]

Игроку предстоит побороть инопланетную угрозу, уничтожая плещущие корабли противника.trap [9 ]

Интересная логическая головоломка, в которой нужно вращать мышью предложенную конструкцию в центре экрана таким образом, чтобы песок, заключенный в ней, был высыпан в расположенное снизу ведро.Chess [10]

Шахматы, полностью оформленные с применением новой технологии и возможностью переключения обзора доски с фигурами из 2D в 3D вид.

Примеры реализации приложений:Body Browser [11]

Веб-приложение от известной компании, созданное по последним интернет-технологиям. Здесь исследуется человеческое тело в различных его анатомических структурах. Модель тела полностью трехмерна. Вращение и приближение осуществляется мышью.Muro [12]

Программа, которая позволит немного поиграться с кистями и красками. На экране можно создавать неплохие графические надписи для своих проектов.[13]

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

5.Примеры российских сайтов на HTML5


)17 февраля 2011 года в Москве прошла конференция HTML5 Camp. Это первая из серии международных конференций Microsoft, посвященных теме современных веб-стандартов и будущего веб. Мероприятие посетили около 400 веб-профессионалов и свыше 24000 присоединились к онлайн-трансляции.

Отчеты и видео-доклады с мероприятия выложены на сайте: <#"justify">Компания Mail.ru объявила о выпуске агента ICQ, написанного на HTML5 и JavaScript, его может разместить на своем сайте любой партнер компании. Функционал получил название ICQ On-Site и предназначен для сайтов, которые хотят использовать инфраструктуру уже готовой системы мгновенных сообщений для взаимодействия своих посетителей друг с другом. Новый JavaScript-агент дает пользователю ICQ возможность общаться с посетителями сайта прямо в веб-интерфейсе, передавать им ссылки на страницы сайта и обсуждать их. Подобный функционал позволит владельцам сайтов расширить аудиторию, сделать ее более лояльной и не писать собственных клиентов для обмена мгновенными сообщениями.

Выпуск On-Site позволит Mail. ru привлечь к ICQ новых клиентов, а старым дать новые функциональные возможности для общения. Компания стремится подстроиться под новую парадигму, в центре которой стоит браузер. Это связано с тем, что уже сейчас около 20% запросов к сервису генерируют пользователи альтернативных операционных систем, куда входят и мобильные платформы, такие как iOS и Android. Хотя компания разработала для этих платформ специализированные клиенты, тем не менее иногда пользователям неудобно устанавливать дополнительные программы. В этом случае можно воспользоваться веб-клиентом, который может быть размещен на партнерском сайте.

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

Для самой компании Mail.ru новый продукт является попыткой увеличить число пользователей ICQ путем привлечения постоянных посетителей сайтов-партнеров. Компания в начале года провела «очистку» среди своих пользователей, заблокировав учетные записи роботов. Для этого была использована технология борьбы со спамом, которая разрабатывалась не только для системы мгновенных сообщений Mail.Ru Агент, но и для других проектов компании. Кроме того, компания уменьшила число рекламных баннеров - теперь под сообщением может появиться один баннер, а не три, как раньше. Все это делается, чтобы повысить привлекательность ICQ и улучшить отношение к ней со стороны пользователей. Основным методом монетизации пользователей ICQ по-прежнему остается реклама, поэтому компания всеми силами старается увеличить количество пользователей.

Между тем Mail.ru Group уже имеет три системы мгновенных сообщений: кроме ICQ, у компании есть собственный Mail.Ru-Агент, а также система сообщений в социальной сети «Одноклассники». Александр Горный, руководитель проекта ICQ в компании Mail.ru, хочет создать единую среду передачи сообщений, однако он пока не раскрывает планов по интеграции указанных сервисов.

В то же время у ICQ есть проблема однократного входа, которая связана с появлением веб-модуля и приложений для мобильных платформ. Когда протокол создавался, то допускалось только единственное подключение от одного пользователя, который работает за компьютером. Однако сейчас вполне возможно, что человек одновременно подключается к ICQ с агента, работающего на настольном компьютере, с модуля On-Site на планшетном компьютере и с Java-клиента на мобильном телефоне. Сейчас такое подключение сделать нельзя - при аутентификации в модуле On-Site агент теряет связь с сервером, даже если они работают на одном компьютере. Горный считает проблему однократного входа наиболее актуальной, поэтому возможно, что в ближайших версиях агента эта функциональность все-таки появится. [14]

.Сравнение браузеров (HTML5)


В сети появился сайт html5test.com <#"justify">БраузерВерсияОчкиБонус-очкиInternet Explorer91385Safari5.13178Firefox123459Opera11.603389Chrome1840013Maxthon3.3.743715

По результатам тестов больше всего очков набрал браузер Maxthon 3.3.7 - 437 очков из возможных 500. Maxthon 3 - это браузер построенный на основе сразу 2-х движков: Webkit (используется в Google Chrome <#"justify">БраузерВерсияОчкиБонус-очкиChrome1639613Chrome1438913Chrome1037313Firefox113459Firefox103429Firefox83389Firefox42989Opera11.502967Chrome629110Opera11.102887Safari5.02656Opera10.602407Opera10.501954Firefox3.61884Opera10.001260Firefox3.0760Internet Explorer8420Internet Explorer7270Internet Explorer6260html сайт браузер версия

На рис.1 представленно в виде графика сравнение популярных браузеров на протяжении 2009 - 2012г.


Рис.1


Результаты мобильных браузеров по тому же источнику:

ПлатформаОчкиБонус-очкиOpera Mobile 12.0036911Firefox Mobile 103259iOS 5.13249MeeGo/Harmattan28414Android 4.02733BlackBerry OS 72733Bada 2.02689Nokia Belle FP12269WebOS 2.22105Android 2.31891Windows Phone 7.51385

На рис.2 представленно в виде графика сравнение популярных мобильных браузеров на протяжении 2009 - 2012г.


Рис.2



Заключение

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

Язык HTML5, очередная глобальная переработка HTML, языка Интернета, создан для того, чтобы коренным образом поменять способ создания веб-страниц разработчиками и дизайнерами, а также образ взаимодействия их с посетителями. Он редактируется Яном Хиксоном (Ian Hickson) из Google и Дэвидом Хайяттом (David Hyatt) из Apple, двумя самыми креативными умами Интернета.

Кроме того что веб-разработчики и дизайнеры могут использовать более «чистый», более простой и последовательный код, HTML5 поможет освободиться от тех ограничений, которые накладывает использование сторонних плагинов, например, Adobe Flash. Впервые можно будет достичь согласованности между интерфейсом видео-плеера и остальным дизайном сайта. Пользователи смогут поворачивать и перемещать видео, менять его размер и даже фиксировать ползунок прокрутки видео, пока оно проигрывается, используя встроенные инструменты управления. [16]

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

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


Использованные источники


1)<#"justify">Приложение №1




Приложение №2




Приложение №3



Приложение №4


Сравнение браузеров (HTML5)

Chrome18 400 13 bonus pointsMaxthon3.3.7 437 15 bonus pointsFirefox12 345 9 bonus pointsParsing rules111111<!DOCTYPE html> triggers standards mode » <#"justify">?Yes ?Yes ?HTML5 tokenizer » <#"justify">?Yes ?Yes ?HTML5 tree building » <#"justify">?Yes ?Yes ?SVG in text/html » <#"justify">?Yes ?Yes ?MathML in text/html » <#"justify">?Yes ?Yes ?Canvas202020canvas element » <#"justify">?Yes ?Yes ?2D context » <#"justify">?Yes ?Yes ?Text » <#"justify">?Yes ?Yes ?Video213121video element » <#"justify">?Yes ?Yes ?Subtitle support » <#"justify">?Yes ?No ?Poster image support » <#"justify">?Yes ?Yes ?MPEG-4 support » <#"justify">?Yes ?No ?H.264 support » <#"justify">?Yes ?No ?Ogg Theora support » <#"justify">?Yes ?Yes ?WebM support » <#"justify">?Yes ?Yes ?Audio202020audio element » <#"justify">?Yes ?Yes ?PCM audio support » <#"justify">?Yes ?Yes ?AAC support » <#"justify">?Yes ?No ?MP3 support » <#"justify">?Yes ?No ?Ogg Vorbis support » <#"justify">?Yes ?Yes ?WebM support » <#"justify">?Yes ?Yes ?Elements252421Embedding custom non-visible data » <#"justify">?Yes ?Yes ?New or modified elementsSection elementsYes ?Yes ?Yes ?Grouping content elementsYes ?Partial ?Partial ?Text-level semantic elementsPartial ?Partial ?Partial ?Interactive elementsPartial ?Partial ?Partial ?Global attributes or methodshidden attribute » <#"justify">?Yes ?Yes ?Dynamic markup insertionYes ?Yes ?Yes ?Forms748656Field typesinput type=textYes ?Yes ?Yes ?input type=searchYes ?Yes ?Yes ?input type=telYes ?Yes ?Yes ?input type=urlYes ?Yes ?Yes ?input type=emailYes ?Yes ?Yes ?input type=datetimeNo ?Partial ?No ?input type=dateNo ?Partial ?No ?input type=monthNo ?Partial ?No ?input type=weekNo ?Partial ?No ?input type=timeNo ?Partial ?No ?input type=datetime-localNo ?Partial ?No ?input type=numberYes ?Yes ?No ?input type=rangeYes ?Yes ?No ?input type=colorNo ?Partial ?No ?input type=checkboxYes ?Yes ?Yes ?input type=imagePartial ?Partial ?Partial ?input type=fileYes ?Yes ?Yes ?textareaYes ?Yes ?Yes ?selectYes ?Yes ?Yes ?fieldsetPartial ?Partial ?Yes ?datalistNo ?Partial ?Yes ?keygenYes ?Yes ?No ?outputYes ?Yes ?Yes ?progressYes ?Yes ?Yes ?meterYes ?Yes ?No ?FieldsField validationYes ?Yes ?Yes ?Association of controls and formsYes ?Yes ?Partial ?Other attributesYes ?Yes ?Partial ?CSS selectorsYes ?Yes ?Partial ?EventsYes ?Yes ?Yes ?FormsForm validationYes ?Yes ?Yes ?User interaction373735Drag and dropAttributesYes ?Yes ?Partial ?EventsYes ?Yes ?Yes ?HTML editingEditing elementsYes ?Yes ?Yes ?Editing documentsYes ?Yes ?Yes ?APIsYes ?Yes ?Yes ?Spellcheckspellcheck attribute » <#"justify">?Yes ?Yes ?History and navigation555Session history » <#"justify">?Yes ?Yes ?Microdata000Microdata » <#"justify">?No ?No ?Web applications181720Application Cache » <#"justify">?Yes ?Yes ?Custom scheme handlers » <#"justify">?Yes ?Yes ?Custom content handlers » <#"justify">?No ?Yes ?Custom search providers » <#"justify">?No ?Yes ?Security550Sandboxed iframe » <#"justify">?Yes ?No ?Seamless iframe » <#"justify">?No ?No ?iframe with inline contents » <#"justify">?No ?No ?Various444Scoped style element » <#"justify">?No ?No ?Asyncronous script execution » <#"justify">?Yes ?Yes ?Runtime script error reporting » <#"justify">?Yes ?Yes ?Base64 encoding and decoding » <#"justify">?Yes ?Yes ?related specificationsLocation and Orientation202020Geolocation » <#"justify">?Yes ?Yes ?Device Orientation » <#"justify">?Yes ?Yes ?WebGL2525243D context » <#"justify">?Yes ?Yes ?Native binary dataYes ?Yes ?Partial ?Communication353737Cross-document messaging » <#"justify">?Yes ?Yes ?Server-Sent Events » <#"justify">?Yes ?Yes ?XMLHttpRequest Level 2Partial ?Yes ?Yes ?WebSocket » <#"justify">?Yes ?Yes ?Files202010FileReader API » <#"justify">?Yes ?Yes ?FileSystem API » <#"justify">?Yes ?No ?Storage202020Session Storage » <#"justify">?Yes ?Yes ?Local Storage » <#"justify">?Yes ?Yes ?IndexedDB » <#"justify">?Yes ?Yes ?Web SQL Database » <#"justify">?Yes ?No ?Workers151010Web Workers » <#"justify">?Yes ?Yes ?Shared Workers »Yes ?No ?No ?Local multimedia0200Access the webcam » <#"justify">?Yes ?No ?Notifications10100Web Notifications » <#"justify">?Yes ?No ?Other777Page Visibility » <#"justify">?Yes ?Yes ?Text selection » <#"justify">?Yes ?Yes ?Scroll into view » <#"justify">?Yes ?Yes ?experimentalAudio440Web Audio API » <#"justify">?Yes ?No ?Video and Animation444Full screen support » <#"justify">?Yes ?Yes ?window.requestAnimationFrame » <#"justify">?Yes ?Yes ?


Байкальский государственный университет экономики и права Кафедра информатики и кибернетики КУРСОВАЯ РАБОТ

Больше работ по теме:

КОНТАКТНЫЙ EMAIL: [email protected]

Скачать реферат © 2017 | Пользовательское соглашение

Скачать      Реферат

ПРОФЕССИОНАЛЬНАЯ ПОМОЩЬ СТУДЕНТАМ