
- •2. Описание выполненных работ
- •2.1. Техническое задание на разработку
- •2.1.1. Введение
- •2.1.2 Основание для разработки
- •2.1.3 Назначение разработки
- •2.1.4 Требования к программе
- •2.2. Описание языка гипертекстовой разметки html
- •2.3. Структура языка гипертекстовой разметки html документа
- •2.4. Создание заголовка
- •2.5. Атрибуты html
- •2.6. Создание абзаца в языке гипертекстовой разметки html
- •2.7. Заголовки
- •2.8. Отображения на web-странице изображений
- •2.9. Язык программирования Java Script
- •2.10. Анализ некоторых существующих сайтов (Таб. 2)
2.8. Отображения на web-странице изображений
Тег <IMG> предназначен для отображения на web-странице изображений в графическом формате GIF, JPEG или PNG. Этот тег имеет единственный обязательный параметр src, который определяет адрес файла с картинкой. Если необходимо, то рисунок можно сделать ссылкой на другой файл, поместив тег <IMG> в контейнер <A>. При этом вокруг изображения отображается рамка, которую можно убрать, добавив параметр border="0" в тег <IMG>.
Рисунки также могут применяться в качестве карт-изображений, когда картинка содержит активные области, выступающие в качестве ссылки. Такая карта по внешнему виду ничем не отличается от обычного изображения, но при этом оно может быть разбито на невидимые зоны разной формы, где каждая из областей служит ссылкой.
Синтаксис:
<img src="URL" alt="">
Закрывающий тег отсутствует. К параметрам относятся:
Align - определяет, как рисунок будет выравниваться по краю и способ обтекания текстом.
Alt - альтернативный текст для изображения;
Border - толщина рамки вокруг изображения;
Height - высота изображения;
Hspace - горизонтальный отступ от изображения до окружающего контента;
Ismap - говорит браузеру, что картинка является серверной картой-изображением;
Lowsrc - путь к графическому файлу низкого разрешения для предварительного отображения;
Src - путь к графическому файлу;
Vspace - вертикальный отступ от изображения до окружающего контента;
Width - ширина изображения;
Usemap - ссылка на тег <MAP>, содержащий координаты для клиентской карты-изображения.
<img src="images/girl.png" width="189" height="255" alt="lorem">
2.9. Язык программирования Java Script
Язык программирования Java Script был разработан Бренданом Эйком (Brendan Eich) в Netscape Communications как язык сценариев для обозревателей Netscape Navigator, начиная с версии 2.0. В дальнейшем к развитию этого языка подключилась корпорация Microsoft, чьи обозреватели Internet Explorer поддерживают Java Script, начиная с версии 3.0. Версия Microsoft получила название JScipt, поскольку Java Script является зарегистрированной маркой фирмы Netscape. В 1996 г. ECMA приняла решение о стандартизации этого языка, и в июне 1997 г. была принята первая версия стандарта под названием ECMAScript (ECMA-262). В апреле 1998 г. этот стандарт был принят ISO в качестве международного под номером ISO/IEC 16262. Мы в последующем изложении основываемся на третьей версии стандарта ECMA (декабрь 1999 г.).
Java Script - это разработанный корпорацией Netscape межплатформенный объектно-ориентированный язык сценариев. Язык Java Script основан на языке Java, а VBscript - на Visual Basic. Java Script содержит набор основных объектов и набор элементов языка. Это язык программирования, позволяющий выполнять несложные вычисления, добавлять на страницы интересные визуальные эффекты, сделать страницы интерактивными. Программы Java Script выполняются браузером и встраиваются непосредственно в текст HTML-файла.
Java Script - объектно-ориентированный язык программирования, предназначенный для написания сценариев, работающих как на стороне клиента, так и на стороне сервера. Поэтому он не является "полноценным" языком программирования, а ориентирован на использование возможностей той среды, в которой сценарии исполняются.
Web -обозреватель, работающий на компьютере-клиенте, обеспечивает среду, в которой Java Script имеет доступ к объектам, которые представляют собой окна, меню, диалоги, текстовые области, фреймы и ввод-вывод в Web-страницу. Кроме того, обозреватель позволяет присоединить сценарии на языке Java Script к таким событиям, как загрузка и выгрузка страниц и графических образов, нажатие клавиш и движение мыши, выбор текста и пересылка форм. При этом программный код сценариев только реагирует на события и поэтому не нуждается в главной программе. Набор объектов, предоставляемых обозревателем, известен под названием Document Object Model (DOM).
Web -сервер обеспечивает иную среду, в которой объектами являются запросы к базам данных, клиенты, файлы и механизмы блокировки и совместного использования данных. Совместное использование сценариев и на стороне клиента, и на стороне сервера позволяет распределить вычисления между ними и обеспечить желаемый пользовательский интерфейс для Web -приложения.
Чаще всего программы Java Script строятся по модульному принципу, с использованием процедур и вызовом этих процедур по событиям, происходящим с объектами на странице. Например, при щелчке по кнопке или наведении курсора на "горячую зону".
Программы Java Script помещаются в контейнер парного тега <SCRIPT>. Для того чтобы браузеры, не поддерживающие язык Java Script, не отображали на экране программу в виде текста, ее код помещается внутрь ремарок, представляющих собой комбинацию из символов <!-- . . . -->.
Java Script основан на объектах. Это значит, что и языковые средства, и возможности среды представляются объектами, а сценарий (программа) на Java Script — это набор взаимодействующих объектов. Объект Java Script — это неупорядоченный набор свойств, каждое из которых имеет нуль или более атрибутов, которые определяют, как это свойство может использоваться. Объекты имеют свойства и с ними могут происходить события. Например, объект кнопки <BUTTON> имеет свойства высоты, ширины, текста надписи. C кнопкой могут происходить события: щелчок (onClick), наведение мышки (onMouseOver). При любом событии может активироваться процедура, способная изменять свойства.
Java Script содержит несколько встроенных объектов, таких, как Global, Object, Error, Function, Array, String, Boolean, Number, Math, Date, RegExp. Кроме того, Java Script содержит набор встроенных операций, которые, строго говоря, не обязательно являются функциями или методами, а также набор встроенных операторов, управляющих логикой выполнения программ. Синтаксис Java Script в основном соответствует синтаксису языка Java, но упрощен в сравнении с ним, чтобы сделать язык сценариев легким для изучения. Так, к примеру, декларация переменной не содержит ее типа, свойства также не имеют типов, а декларация функции может стоять в тексте программы после ее вызова.
Для временного хранения данных Java Script использует переменные. Переменная в языке Java Script универсальна и может принимать как символьное (текстовое), так и числовое значение. Переменная может объявляться заранее или не объявляться, главное, чтобы первая операция с переменной была связана с определением ее значения.
СРАВНИТЕЛЬНЫЙ АНАЛИЗ ТЕХНОЛОГИЙ ADOBE FLASH И HTML5
Adobe Flash
Adobe Flash - мультимедийная платформа компании Adobe для создания веб-приложений или мультимедийных презентаций. Широко используется для создания рекламных баннеров, анимации, игр, а также воспроизведения на веб-страницах видео- и аудиозаписей.
Достоинства:
Adobe Flash зрелая технология
Adobe Flash являлась наиболее популярной технологией для создания мультимедийного контента на протяжении нескольких лет и использовалась в огромном количестве приложений. Благодаря тому, что Flash разрабатывается крупной компанией,
Adobe, большое количество усилий было вложено в создание стабильной и многофункциональной платформы. Большие возможности по работе с графикой Flash использует мощные алгоритмы для рендеринга графики, предоставляет различные встроенные визуальные эффекты, которые позволяют разработчикам создавать эффектные графические приложения.
Хорошая производительность
Adobe Flash оптимизирован под большинство Windows платформ для получения хорошей производительности даже на не очень мощных компьютерах. Следовательно, даже большие приложения работают достаточно быстро на большинстве Windows платформ. Большое количество инструментов для создания визуальных эффектов, 3D графики и пр. Adobe Flash предоставляет разработчикам ряд полезных инструментов для создания и изменения графического контента. Например, изначально присутствует поддержка анимаций, различных преобразований и эффектов. Таким образом возможна разработка сложного графического приложения.
Недостатки:
Требует установки специального программного обеспечения Главным недостатком Flash является то, что для воспроизведения SWF файла, пользователю необходимо установить Adobe Flash Player. Это вызывает ряд ограничений, таких как: устройство и ОС должны быть совместимы с Flash, и версия Flash, установленная у пользователя, должна совпадать с используемой для разработки приложения. Низкая производительность на некоторых платформах На некоторых платформах (например, Mac OS и Linux), Flash работает очень медленно, в связи с тем, что он не имеет доступа к графическому процессору. Это означает,
что обработка графики происходит на центральном процессоре, что очень замедляет работу приложения. Не поддерживается в iOS Работа Flash не поддерживается на iOS устройствах (смартфоны и планшеты).
HTML5
HTML5 — язык для структурирования и представления содержимого для всемирной паутины, а также основная технология, используемая в Интернете. Это пятая версия HTML-стандарта и находится в стадии разработки по состоянию на ноябрь 2012 года. Основной её целью является улучшить язык, поддерживающий работу с новейшими мультимедийными приложениями, при этом сохраняется лёгкость чтения кода для человека и ясность исполнения для компьютеров и приспособлений (веб-браузеры, синтаксические анализаторы и т. д.).
Достоинства:
Не требует установки специального программного обеспечения Главное преимущество HTML5 перед другими технологиями в том, что он изначально поддерживается браузерами, и нет необходимости устанавливать какое-либо приложение для отображения контента.
Работает на мобильных устройствах
Изначально поддерживаясь всеми основными браузерами, HTML5 корректно отображается и в браузерах мобильных устройств (смартфоны и планшеты, такие как iPhone и iPad, различные Android устройства и т.п.). Это является главным преимуществом HTML5 перед Flash, т.к. мобильные устройства на платформе iOS сейчас очень популярны. Показывает лучшую производительность чем Flash на некоторых платформах На некоторых платформах, например на Mac OS X и Linux, HTML5 показывает лучшую производительность чем Flash. Для примера, на Mac OS X HTML5 работает примерно на 58% быстрее, чем Flash приложения.
Недостатки:
Технология все еще в стадии разработки Находясь в стадии разработки, HTML5 проигрывает Flash в надежности. Функциональность может быть изменена в долгосрочной перспективы, а это значит, что ее использование потребует больше усилий, чем поддержание Flash приложений. К примеру, еще не реализована поддержка надежной работы с видеопотоками. Меньшая производительность чем у Flash На большинстве Windows платформ HTML5 приложения работают медленнее, чем
приложения, созданные на Flash. Как следствие, использование тяжелой графики (анимации и различных визуальных эффектов) в HTML5 приложениях может создать определенные проблемы с производительностью. Низкие возможности создания 3D контента, визуальных эффектов и т.п. HTML5 не обеспечивает изначальной поддержки анимаций, поэтому разработчики вынуждены полагаться на другие технологии (например, JavaScript). Так же, в отличие от Flash, который главным образом направлен на создание графики и анимаций, HTML5 направлен на упорядочивание и представление контента в сети, что означает предоставление ограниченной поддержки создания различных визуальных эффектов. Зависимость от браузера. Так как HTML5 является веб-стандартом, и каждый браузер отображает его по-своему, одни и то же содержимое может быть отображено различно в различных браузерах. Например, какой-либо визуальных эффект может быть корректно отображен в одном браузере, но вовсе не отображен другим, либо отображен совсем иначе. Малое количество документации и инструментов разработчика. Так как технология находится в стадии разработки, на данный момент доступно не так много инструментов разработчика и документации. Таким образом, процесс разработки HTML5 приложений является не таким легким, как разработка на Flash.
Для сравнения рассмотрим Html и CSS (Таб.1).
Таблица 1
Критерий сравнения |
HTML |
CSS |
Ключевая лексическая единица |
Тег |
Селектор или атрибут style |
Приписывание свойств ключевой единице |
Для некоторых тегов необязательно |
Приписывание свойств обязательно всегда |
Основные символы-ограничители |
Символы < и > охватывают ключевую единицу |
Символы { и } или " и " (в случае атрибута style) охватывают только списки параметров |
Дополнительные символы-ограничители |
|
( и ) для значения url |
Символ присвоения свойства |
Знак равенства = |
Двоеточие : |
Символы-разделители параметров в списках |
Пробел |
Точка с запятой ; |
Проведенные исследования технологий создания выявили, что язык гипертекстовой разметки Html не очень хороший язык, но самый простой среди остальных языков программирования. Но зато любой человек может создать свой сайт. Преимущества HTML над CSS является простота в работе, предельно минимальные системные требования и легко воспринимаемый код