Автор работы: Пользователь скрыл имя, 23 Апреля 2013 в 08:20, курсовая работа
Термин HTML (Hyper Text Markup Language) означает "язык маркировки гипертекстов". Это понятие более широкое, включает в себя Интернет и локальные сети, редакторы, браузеры, разнообразные програмные продукты, компакт-диски, обучающие курсы, дизайн и многое другое. HTML – своеобразная противоположность сложным языкам программирования, известным только специалистам.
ВВЕДЕНИЕ 4
ИСТОРИЯ HTML 5
ВЕРСИИ HTML 5
ГИПЕРТЕКСТ 6
СТРУКТУРА WEB-СТРАНИЦЫ 8
<HTML></html> 8
<HEAD></head> 9
<TITLE></title> 9
<STYLE></style> 9
<META> 9
<BODY></body> 9
<!-- Комментарий --!> 10
<H1><h1> 10
<HR> 10
<A></a> 11
Переход внутри одного документа 11
Переход к другому документу 12
<BASE> 14
ПРАВИЛА СИНТАКСИСА 15
КОДИРОВАНИЕ СИМВОЛОВ 16
ИСПОЛЬЗОВАНИЕ СИМВОЛОВ 16
УПРАВЛЕНИЕ ЦВЕТОМ 18
КОНСТРУКТОР ДОКУМЕНТОВ 20
ПРИЛОЖЕНИЕ. СТРУКТУРА ПРИЛОЖЕНИЯ 20
ЦЕПОЧКА 20
Применение цепочек 21
ИЕРАРХИЯ 22
УЛОЖИМ КАРТИНКУ В ФОНОВЫЙ ПАРКЕТ 23
ГРАФИКА 27
ФОРМАТ GIF 27
ФОРМАТ JPG 27
КАК ПРОГРАММИРОВАТЬ КАРТИНКИ 28
Картинка в тексте 28
Картинка как ссылка 29
ПОСТРОЕНИЕ ТАБЛИЦ. 30
ЧТО ТАКОЕ ТАБЛИЦА 30
КАК ЗАДАТЬ ТАБЛИЦУ 30
Атрибуты команды TABLE 31
Атрибуты команды TR 31
Атрибуты команды TD (TH) 32
МНОГОЛИКИЕ ТАБЛИЦЫ 33
Страничные отступы 33
Замечание 34
Многоколонная верстка 34
Наложение картинок 34
Замечание 35
ТАБЛИЦЫ СТИЛЕЙ 36
УРОВНИ CSS 36
СПОСОБЫ ОПРЕДЕЛЕНИЯ ТАБЛИЦ СТИЛЕЙ 36
ЗАПИСЬ ШАБЛОНА CSS 38
Группировка и наследование 38
Селекторы 39
Псевдоклассы 40
Применение таблиц стилей CSS 40
CSS в форматировании текста 40
Единицы измерения в таблицах стилей 41
Структурное форматирование 42
ВВЕДЕНИЕ В JAVASCRIPT 44
ИСПОЛЬЗОВАНИЕ JAVASCRIPT 44
ВАЖНОСТЬ ИЗУЧЕНИЯ JAVASCRIPT 44
JAVASCRIPT В ДЕЙСТВИИ 44
Ввод/вывод информации с помощью JavaScript 45
Объекты, методы и свойства 45
УПРАВЛЕНИЕ ДАННЫМИ С ПОМОЩЬЮ ПЕРЕМЕННЫХ 46
Значения в языке JavaScript 46
Переменные в языке JavaScript 48
МАССИВЫ JAVASCRIPT И ESCAPE-ПОСЛЕДОВАТЕЛЬНОСТИ 49
Как пользоваться массивами 50
ВЫРАЖЕНИЯ, УСЛОВИЯ, ОПЕРАЦИИ, СТРОКИ И ЧИСЛА 52
Что такое выражения и условия 52
Знакомство с операциями 53
СОЗДАНИЕ СЦЕНАРИЕВ С ПОМОЩЬЮ ФУНКЦИЙ И СОБЫТИЙ 56
ОПИСАНИЕ БРАУЗЕРОВ 59
ПРОСМОТР WEB-СТРАНИЦ 59
MICROSOFT INTERNET EXPLORER 59
NETSCAPE COMMUNICATOR 61
ТЕРМИНОЛОГИЯ 64
ПРАКТИЧЕСКАЯ ЧАСТЬ 67
СПИСОК ЛИТЕРАТУРЫ 68
Разработка web сайта на основе HTML с использованием JavaScript.
Содержание:
Введение 4
История HTML 5
Версии HTML 5
Гипертекст 6
Структура WEB-страницы 8
<HTML></html> 8
<HEAD></head> 9
<TITLE></title> 9
<STYLE></style> 9
<META> 9
<BODY></body> 9
<!-- Комментарий --!> 10
<H1><h1> 10
<HR> 10
<A></a> 11
Переход внутри одного документа 11
Переход к другому документу 12
<BASE> 14
Правила синтаксиса 15
Кодирование символов 16
Использование символов 16
Управление цветом 18
Конструктор документов 20
Приложение. Структура приложения 20
Цепочка 20
Применение цепочек 21
Иерархия 22
Уложим картинку в фоновый паркет 23
Графика 27
Формат GIF 27
Формат JPG 27
Как программировать картинки 28
Картинка в тексте 28
Картинка как ссылка 29
Построение таблиц. 30
Что такое таблица 30
Как задать таблицу 30
Атрибуты команды TABLE 31
Атрибуты команды TR 31
Атрибуты команды TD (TH) 32
Многоликие таблицы 33
Страничные отступы 33
Замечание 34
Многоколонная верстка 34
Наложение картинок 34
Замечание 35
Таблицы стилей 36
Уровни CSS 36
Способы определения таблиц стилей 36
Запись шаблона CSS 38
Группировка и наследование 38
Селекторы 39
Псевдоклассы 40
Применение таблиц стилей CSS 40
CSS в форматировании текста 40
Единицы измерения в таблицах стилей 41
Структурное форматирование 42
Введение в JavaScript 44
Использование JavaScript 44
Важность изучения JavaScript 44
JavaScript в действии 44
Ввод/вывод информации с помощью JavaScript 45
Объекты, методы и свойства 45
Управление данными с помощью переменных 46
Значения в языке JavaScript 46
Переменные в языке JavaScript 48
Массивы JavaScript и Escape-последовательности 49
Как пользоваться массивами 50
Выражения, условия, операции, строки и числа 52
Что такое выражения и условия 52
Знакомство с операциями 53
Создание сценариев с помощью функций и событий 56
Описание браузеров 59
Просмотр WEB-страниц 59
Microsoft Internet Explorer 59
Netscape Communicator 61
Терминология 64
Практическая часть 67
Список литературы 68
Термин HTML (Hyper Text Markup Language) означает "язык маркировки гипертекстов". Это понятие более широкое, включает в себя Интернет и локальные сети, редакторы, браузеры, разнообразные програмные продукты, компакт-диски, обучающие курсы, дизайн и многое другое. HTML – своеобразная противоположность сложным языкам программирования, известным только специалистам.
HTML давно перестал быть просто языком программирования. Человек, изучавший этот язык, обретает возможность делать сложные вещи простыми способами и, главное, быстро, что в компьютерном мире не так уж и мало. Гипертекст подходит для включения элементов мультимедиа в традиционные документы. Практически именно благодаря развитию гипертекста, большинство пользователей получило возможность создавать собственные мультимедийные продукты и распространять их на компакт-дисках. Такие информационные системы, выполненные в виде набора HTML-страниц, не требует разработки специальных программных средств, так как все необходимые инструменты для работы с данными (WEB-браузеры) стали частью стандартного программного обеспечения большинства персональных компьютеров. От пользователя требуется выполнить только ту работу, которая относится к тематике разрабатываемого продукта: подготовить тексты, нарисовать рисунки, создать HTML-страницы и продумать связь между ними.
HTML, как основа создания WEB-страниц, имеет прямое отношение и к новому направлению изобразительного искусства – WEB-дизайн. Художнику в Интернете недостаточно просто нарисовать красивые картинки, оригинальный логотип, создать новый фирменный стиль. Он должен еще поместить все это в Сети, продумать связь между WEB-страницами, чтобы все двигалось, откликалась на действие пользователя, поражало воображение, вызывало желание создать что-нибудь свое, оригинальное в этой области.
Цель работы: изучить языки программирования HTML и JavaScript.
Исходя и выше поставленной цели при создании данного проекта я поставил следующие задачи:
Первая версия HTML была разработана в 1989 году Тимом Бенерс-Ли для популярного в прошлом браузера Mosaic. Но в то время ни для языка, ни для браузера не нашлось достойного применения. В 1993 году появился HTML+ , и эта версия также осталась практически незамеченной. Начало широкого использования гипертекста дала версия 2.0, которая, появилась в июне 1994 года. Это был год роста популярности WWW по всему миру. Элементы, включенные в версию 2 , в большинстве своем используются по сей день.
В версии 3.0 HTML, которая появилась год спустя, была реализована возможность прорисовки математических символов (знаков интервала, бесконечности, дроби, скобок и т.д.) при помощи элементов языка. Под эту версию был разработан браузер Arena. Но этот проект оказался тупиковым и не получил дальнейшего распространения.
В 1996 году появился HTML 3.2. Это было новаторское решение, в спецификацию языка были введены фреймы, которые стали теперь весьма популярны у разработчиков WEB-страниц. Даже сейчас на основе этой спецификации можно реализовать интересные дизайнерские решения. Практически все современные браузеры поддерживают версию 3.2, поэтому авторы WEB-страниц уверенны в работоспособности всех элементов.
Наряду с официальными спецификациями языка, которые разрабатывались организацией W3C (W3 Консорциум ),компании-производители браузеров создавали собственные элементы (расширения). Впоследствии, некоторые из этих элементов, после получения всеобщего признания включились в спецификацию следующих версий языка. Но новаторское решение – фреймы, не были включены в спецификацию 3.2. Но браузеры поддерживали фреймы и многие книги, посвященные HTML, содержали описание фреймов без упоминания о том, что это нестандартные элементы. В последствии, фреймы стали стандартом де-факто. В версии 4 они уже были включены на полном основании.
И наоборот, элементы APPLET и SCRIPT, необходимые для расширения HTML другими программными кодами версии 3.2, не сыграли той роли, которую были призваны сыграть. Это объясняется тем, что браузеры различных версий по-разному интерпретировали программы на разных языках JAVA, JAVASCKRIPT, Visual Basic (VBScript). В результате не удалось получить достаточно надежный работающий код, и данные языки использовались любителями HTML в основном для экспериментов.
Официальная спецификация HTML 4 (Dynamic HTML) появилась в 1997 году. В это время уже было очевидно, что дальнейшее развитие гипертекста будет осуществляться за счет скрипт - программирования. Это оказалось немногим более эффективным, чем вводить в язык все новые элементы. Появившиеся в то время браузеры (Netscape Navigator 4, Microsoft Internet Explorer 4 и др.) уже достаточно надежно интерпретировали программный код (был установлен определенный уровень стандартизации). Однако проблемы у разработчиков еще остались. В качестве примера можно отметить, что многие скрипты начинаются с определения версии браузера, чтобы потом использовать тот или иной фрагмент кода. Очевидно, что на программиста ложится обязанность тестирования страниц на всех популярных в настоящие время браузерах.
В результате, использование всех возможностей Dynamic HTML стало уделом программистов достаточно крупных организаций, где есть условия для разработки сложных программ и всестороннего их тестирования. Создателям личных WEB-страниц подчас приходится искать компромисс между надежностью и новаторством, чтобы получить достаточно грамотный HTML-код.
Уже достаточно много времени затрачено на то, чтобы научиться при помощи HTML и браузера выводить на экран тексты.
Но это просто тексты. Используя мощный текстовый процессор, такой, как Microsoft Word, сверстать объявление, письмо брошюру и небольшую книгу можно гораздо быстрее, и результат будет лучшего качества.
При этом не надо писать программы, вникать во все тонкости многочисленных тегов и их атрибутов. Работая в Worde, практически не надо думать ни о чем, кроме содержания собственного произведения. Разнообразный оформительский инструментарий имеет интуитивно-понятный интерфейс и многочисленную библиотеку шрифтов, линий, значков, рамочек, орнаментов, фигур, картиночек и других полезных "штучек", которые делают текст на экране и бумаге приятным для глаза. При условии, конечно, что вы не лишены вкуса и чувства меры.
Так почему же во всем мире разразился настоящий бум HTML-программирования? Сбывается мечта А.П.Ершова: программирование становится второй грамотностью, народным увлечением.
Главных причин популярности HTML три. Вот они в порядке возрастания важности.
HTML-программирование очень
простое. В нем нет
(Отступлением от этого тезиса являются
ссылки. С их помощью можно организовать
ветвление и процедурный вызов. Об этом
будет рассказано ниже. Однако, эти средства
слишком примитивны для серьезного сопоставления
с аналогичными структурами языков типа
Си или Паскаль.)
Многие авторы учебников даже стесняются называть HTML-тексты программами. Работу HTML-проектировщика они называют разметкой текста. На самом деле, в этом названии заключена методическая ошибка. Ведь оно (название) предполагает такой порядок работы:
берется обычный текст
и размечается, то есть, на него накладывается сетка из тегов так, чтобы браузер смог показать строчки текста на экране.
Однако, хорошие гипертекстовые документы при таком подходе получить гораздо сложнее, чем в случае когда, структура HTML-документа планируется еще до написания текстов. Ведь гипертекст устроен принципиально иначе (см. третью причину).
Переносимость.
Если, работая в Word'e, вы создаете документ для собственного потребления, у вас нет проблем. Нет проблем и тогда, когда вы посылаете свою работу в мир как печатную копию. Если же ваш партнер, издатель или коллега просит прислать электронную версию -- начинаются проблемы.
Для того чтобы документ
появился на экране у абонента, необходимо,
чтобы его компьютер и
Для того чтобы документ загрузился в Word, крайне желательно совпадение версий этого продукта у вас и вашего коллеги.
Для того чтобы текст на экране не выглядел как древненорвежский манускрипт, необходимо, чтобы ваш партнер имел на своем компьютере шрифты, которые были использованы при создании вашего текста.
Но даже, если все эти условия выполнены, все равно мало шансов на то, что ваш товарищ увидит текст неискаженным (картинки вылезают из рамок, границы страниц плывут по тексту,...). Это происходит потому, что ваш Word и Word вашего партнера настроены по-разному.
После того, как по телефону (или электронной почте) редакторы будут настроены одинаково, текст все равно может выглядеть по-разному уже по причинам, известным только фирме Microsoft.
Все, о чем говорилось, называется непереносимостью продукта. Не в том смысле, что продукт кого-то не любит, а в том, что разным пользователям невозможно, или крайне тяжело, отображать у себя то, что сделано в другом месте.
HTML-документ является перенос
Переносимость HTML-документа достигается за счет того, что пересылается не экранное изображение, а программа. А изображение строит браузер, выполняя команды этой программы. Правда, и здесь не все гладко. Разные браузеры могут работать немного по-разному.
HTML-документ -- это гипертекст.
Обычный текст имеет линейную структуру. И хотя пользователь может читать любые его страницы и строчки, листая документ на экране или в бумажной книге, автор предполагает, что текст читается по порядку. Сначала первая страница, потом вторая и так далее.
Первый этюд к гипертексту
Некоторое нарушение линейности обычной книги вносят сноски, ссылки на другие страницы и ссылки на другую литературу.
Предполагается, что пользователь может прервать линейное чтение в месте ссылки, посмотреть другую часть читаемого текста или даже совсем другой текст, а затем продолжить чтение с места прерывания.
Второй этюд к гипертексту
Из массы линейной текстовой продукции выделяются словари, справочники, энциклопедии. Физически текст устроен линейно: за страницей 10 обязательно следует страница 11, а за сотой -- сто первая. Однако, предполагается, что читатель обращается к книге для справки, а не читает ее всю подряд от корки до корки.
Информация о работе Разработка web сайта на основе HTML с использованием JavaScript