Автор работы: Пользователь скрыл имя, 13 Октября 2013 в 07:21, курсовая работа
HTML5 — это пятая версия основного языка разметки веб-страниц. HTML5 стремиться сделать интернет-сайты боле семантически правильными, более интерактивными, более быстрыми. В связи с этим значительный интерес представляет изучение данной области. Целью данной курсовой работы является рассмотрение стандарта HTML5, его особенности, преимущества и недостатки, примеры реализаций, примеры сайтов на HTML5 как зарубежных, так и российских.
Введение 3
1. История появления HTML5 4
2. Особенности HTML5 6
3. Отличия HTML5 от предыдущих версий. Сравнительный анализ плюсов и минусов 10
3.1 Преимущества HTML5 10
3.2 Недостатки HTML5 14
4. Примеры реализации на HTML5 16
5. Примеры зарубежных и российских сайтов на HTML5 17
6. Сравнение браузеров (HTML5) 20
Заключение 23
Список литературы 24
В HTML5, чтобы избежать подобной ситуации для тегов iframe была спроектирована технология Sandbox. Благодаря ей, все скрипты, запускающиеся через iframe будут работать в специально ограниченной виртуальной среде, которая не выпустит результаты их работы за пределы браузера, а значит и не сможет поразить пользовательскую операционную систему. Даже если предположить, что запуск вируса посредством этого тега все же произойдет, какие-либо серьезные последствия он понести уже не сможет. [5]
В HTML5 становится проще и безопаснее. Правильность введения данных контролируется в режиме реального времени непосредственно во время ввода. В HTML4.0 проверка ошибок и сообщение о них происходит уже после отправки документа, что может создавать проблемы пользователям. [6]
До
недавнего времени бесспорным лидером
анимированной графики для
Суть
такого мощного нововведения как
canvas состоит в том, что для браузеров на
экране выделяется специальное пространство,
положение которого на веб-странице определяется
разработчиком сайта. В этой области с
помощью целого набора специальных графических
HTML5 команд можно составлять графические
изображения, в том числе и анимированные,
практически любой сложности. Более того,
для 3-D графики разрабатывается специальный
набор команд аналогичных всемирно известному
стандарту трехмерной графики OpenGL6(Википедия,
свободная энциклопедия: [сайт]. URL: http://ru.wikipedia.org/wiki/
Если
для HTML5 и дальше продолжат развивать
направление трехмерных игр, в недалеком
будущем мы имеем все шансы
получить игровые проекты с современной
шейдерной графикой7
(Википедия, свободная энциклопедия: [сайт].
URL: http://ru.wikipedia.org/wiki/
Для того чтобы воспроизвести видео или аудио поток в браузере пользователю приходиться прибегать к помощи все той же Flash технологии, требуемые в HTML4.0.
Браузерам для этого приходиться постоянно пользоваться Flash проигрывателями, а также скачивать постоянные обновления от Adobe для этой технологии, без которых пользователи сильно рискуют заразить свои компьютеры вирусами через бреши в старых версиях Flash.
HTML5 призван
наконец избавить браузеры от этих дополнительных
программ и дать им возможность полноценного
воспроизведения аудио и видео контента
своими силами. Для этого в HTML5 коде предусмотрены
специальные теги, такие как <video> и
<audio>. Впрочем, у этого нововведения
имеются и свои недостатки, например отсутствие
единого стандарта для видеокодеков8
(Википедия, свободная энциклопедия: [сайт].
URL: http://ru.wikipedia.org/wiki/
Сложно
представить современные веб-
Проектировщики HTML5 не могли обойти эту проблему стороной. Новый стандарт обеспечивает поддержку многопоточности, которую именовали как Web Works. Таким образом, современные многоядерные системы получают возможность параллельно выполнять обработку скриптов и тем самым увеличить скорость работы сайта на несколько порядков в зависимости от его конструкции и сложности. [5]
Пользователи комфортно работают с теми сайтами, которые способны сохранять изменения в настройках, например для внешнего вида рабочего пространства. Для того, чтобы сохранить какую-либо информацию о действиях пользователя сайт обычно пользуется технологией cookies, которая позволяет сохранять на компьютере посетителя текстовый файл со своими данными.
Технология Web Storage для HTML5 затмит cookies своими возможностями только потому, что представляет из себя не форматно ограниченный текстовый файл, а специально ориентированную базу данных для различных видов информации. Теперь в такой базе сайт может хранить не только отдельные настройки сайта, а целые фрагменты его кода, что позволит работать с веб-приложениями даже при отсутствии подключения к сети Интернет.[5]
Делают структуру веб-документа более простой, а код чище. Новые семантические элементы header, nav, section, article, aside и footer могут использоваться вместо контейнеров div, применяющихся сейчас в HTML4.0. новые элементы позволяют более конкретно описывать заголовок, нижний колонтитул, колонки текста и другие. Эти нововведения могут использоваться для автоматической генерации оглавления и организации более эффективной и простой навигации по веб-странице. Код при этом становится более чистым и менее засоренным второстепенными деталями.
Несколько конкретных примеров:
Пример1. Вместо громоздкой записи HTML4:
<!DOCTYPE html PUBLIC ”_//DTD XHTML1.0 Transitional//EN”
“http://www.w3.org/TR/xhtml1/
в HTML5 это будет выглядеть следующим образом:
<!DOCTYPE html>.
Пример2: В HTML4 для создания заголовка необходим код:
<div id=”header”>
<h1> Мой блог</h1>
<p class=”tagine”> Здесь помещается текст </p>
</div>
В HTML5 есть специальный элемент <header>, который позволит записать этот же фрагмент в виде:
<header>
<h1>Мой блог</h1>
<p class=”tagine”> Здесь помещается текст </p>
</header>
Как видим код становится проще и понятнее.
Текст
и изображения становятся одним
целым. Полностью меняются возможности
отображения изображений и
Например такими:
(URL: http://www.apple.com/iphone/)
(URL: http://www.nikebetterworld.
(URL: http://www.ultranoir.com/en/#!
С HTML5 жизнь конечного пользователя становится заметно легче:
На сегодняшний день в HTML5 присутствуют минусы, из-за которых он проигрывает прежним технологиям. Имеет место некоторая уязвимость HTML5 в области защиты данных. Такую уязвимость создает больший, по сравнению с cookie стандарта HTML4, объем данных, которые сохраняются на жестком диске пользователя. Опасность заключается в том, что в больших объемах данных может содержаться более подробная информация о пользователе. Эксперты высказывают мнение, сто если хранилище HTML5 остается на компьютере пользователя в течение многих месяцев, то интернет-сайты, обращаясь к нему через JavaScript после загрузки страницы, могут незаметно для пользователя собирать и передавать данные владельцу сайта.
В отношении мультимедийного
контента тоже есть недостатки, не
позволяющие сделать
Различие в форматах HTML5 видео/аудио в различных браузерах может привести:
Также есть и другие недостатки в использовании HTML5 видео/аудио:
Недостатки HTML5 в разработке игр:
Платформа Flash используется также для анимации и разработки интерфейсов, ее применяют для создания более сложной рекламы и в трехмерной графике. Она постоянно эволюционирует и совершенствуется.
Как отметил Филипп Ле Эгаре (Philippe Le Hegaret), руководитель направления компании W3C, которая разрабатывает стандарт HTML5, в ближайшие годы не получиться отказаться от технологии Flash. Причиной этому он назвал то, что потребуется длительное время для перехода всех веб-клиентов к поддержке HTML5. В течение ближайшего времени технологии HTML5 и Adobe Flash будут существовать. [6]
Примеры реализации игр:
Игроку предстоит побороть инопланетную угрозу, уничтожая плещущие корабли противника.
Интересная
логическая головоломка, в которой
нужно вращать мышью
Шахматы,
полностью оформленные с
Примеры реализации приложений:
Веб-приложение от известной компании, созданное по последним интернет-технологиям. Здесь исследуется человеческое тело в различных его анатомических структурах. Модель тела полностью трехмерна. Вращение и приближение осуществляется мышью.
Программа, которая позволит немного поиграться с кистями и красками. На экране можно создавать неплохие графические надписи для своих проектов.
Программа позволяет писать тексты и задавать им в отображении любую траекторию. Созданное творение можно применить на своем сайте. Сервис позволяет преобразовывать полученное изображение в простой HTML, который можно разместить у себя на сайте.