Автор работы: Пользователь скрыл имя, 30 Августа 2012 в 01:06, дипломная работа
World Wide Web – глобальная компьютерная сеть на сегодняшний день содержит миллионы сайтов, на которых размещена всевозможная информация. Люди получают доступ к этой информации посредством использования технологии Internet. Для навигации в WWW используются специальные программы – Web-браузеры, которые существенно облегчают путешествие по бескрайним просторам WWW. Вся информация в Web-браузере отображается в виде Web-страниц, которые являются основным элементом байтов WWW.
I. ВВЕДЕНИЕ …………………………………………………………….
1.1 Концепция WWW ………………………………………………….
II. ОСНОВНЫЕ ПРАВИЛА И ЭТАПЫ СОЗДАНИЕ САЙТА ………...
2.1 Правила Web-дизайна ……………………………………………..
2.1.1 Что такое стиль? ………………………………………….
2.1.2 Цветовые ассоциативные и эмоциональные модели …..
2.2 Браузеры ……………………………………………………………
2.3 Влияние дисплеев на Web-дизайн ………………………………..
2.4 Стандартные размеры и разрешения дисплеев ………………….
2.5 Обеспечение доступности Web-страницы ……………………….
2.6 Представление графики на Web-страницах ……………………...
2.6.1 Разрешение и размер файла изображений ……..…....….
2.7 Графические редакторы …………………………………...……...
2.7.1 Редакторы растровой графики …………………………..
2.7.2 Редакторы векторной графики …………………………..
III. ВЫБОР СТРУКТУРЫ WEB-СТРАНИЦЫ …………………………...
3.1 Создание фиксированных и гибких Web-страниц …………...….
3.2 Разработка комбинированных Web-страниц …………………….
3.3 Язык HTML …………………………….…………………………..
3.4 Теги HTML …………………………………………………………
3.5 Структура HTML документа ……………………………………...
3.5.1 Форматирование текста ………………..………………...
3.6 Программа и ее описание ………………………………………….
IV. ЗАКЛЮЧЕНИЕ ………………………………………………………...
V. ЛИТЕРАТУРА ………………………………………………………….
VI. ПРИЛОЖЕНИЕ (листинг программы)
Поскольку HTML-документы записываются в ASCII-формате, то для ее создания может использован любой текстовый редактор.
Обычно HTML-документ - это файл с расширением .html или .htm, в котором текст размечен HTML-тегами (англ. tag - специальные встроенные указания). Средствами HTML задаются синтаксис и размещение тегов, в соответствии с которыми браузер отображает содержимое Веб-документа. Текст самих тегов Веб-браузером не отображается.
Все теги начинаются символом
'<' и заканчиваются символом '>'.
Обычно имеется пара тегов
- стартовый (открывающий) и
<p>Информация</p>
Здесь стартовым тегом является тег <P>, а завершающим - </P>. Завершающий тег отличатся от стартового лишь тем, что у него перед текстом в скобках <> стоит символ '/' (слэш).
Браузер,
читающий HTML-документ, отображает его
в окне, используя структуру HTML-тегов.
В каждом HTML-документе должны присутствовать
три главных части:
A) Объявление
HTML;
B) Заголовачная часть;
C) Тело документа.
A) Объявление HTML
<HTML> и </HTML>. Пара этих тегов сообщает программе просмотра (браузеру) что между ними заключен документ в формате HTML, причем первым тегом в документе должен быть тег <HTML> (в самом начале документа), а последним - </HTML> (в самом конце документа).
<HTML>
.
.
</HTML>
B) Заголовочная часть.
<HEAD>
и </HEAD>. Между этими тегами располагается
информация о документе (название, ключевые
слова для поиска, описание и т.д.). Однако
наиболее важным является название документа,
которое мы видим в верхней строке окна
браузера и в списках "Избранное (BookMark)".
Специальные программы-спайдеры поисковых
систем используют название документа
для построения своих баз данных. Для того
чтобы дать название своему HTML-документу
текст помещается между тегами <TITLE>
и </TITLE>.
<HTML>
<HEAD>
<TITLE>Моя первая страница</TITLE>
</HEAD>
</HTML>
C) Тело документа.
Третьей
главной частью документа является
его тело. Оно следует сразу
за заголовком и находится между
тегами <BODY> и </BODY>. Первый
из них должен стоять сразу после тега
</HEAD>, а второй - перед тегом </HTML>.
Тело HTML-документа - это место, куда автор
помещает информацию, отформатированную
средствами HTML.
<HTML>
<HEAD>
<TITLE> Моя первая страница</TITLE>
</HEAD>
<BODY>
..............................
..............................
..............................
</BODY>
</HTML>
Теперь
мы можем написать HTML-код нашей
странички:
<HTML>
<HEAD>
<TITLE>Моя первая страница</TITLE>
</HEAD>
<BODY>
Здесь будут мои страницы!
</BODY>
</HTML>
В разделе BODY все символы табуляции и конца строк браузером игнорируются и никак не влияют на отображение страницы. Поэтому перевод строки в исходном тексте HTML-документа не приведет к началу новой строки в отображаемом обозревателем тексте при отсутствии специальных тегов. Это правило очень важно помнить и не забывать ставить разделяющие строки теги, иначе у текста не будет абзацев, и он станет нечитаемым.
Для начала новой строки используется тег <BR> (сокр. от англ. break - прервать). Этот тег приводит к отображению браузером дальнейшего текста с начала следующей строки. Закрывающий для него тег не используется. Он удобен, если требуется с какого-то места писать с новой строки без начала нового абзаца, например, в стихотворении. Повторное его использование позволяет вставить одну или несколько пустых строк, отодвинув следующий фрагмент страницы вниз.
Сплошной текст без промежутков читается не очень легко, его неудобно просматривать и находить нужные места. Разбитый на абзацы, текст воспринимается гораздо быстрее. Для начала нового абзаца используется тег <P> (англ. paragraph - абзац). Этот тег, кроме начала новой строки, вставляет одну пустую строку. Но многократное повторение <P>, в отличие от <BR>, не приведет к появлению нескольких пустых строк, останется все та же одна пустая строка.
Внутри скобок тега кроме его названия могут размещаться также атрибуты (англ. atributes - атрибуты). Они отделяются от названия и между собой пробелами (одним или несколькими), а пишутся в виде имя_атрибута="значение". Если значение не содержит пробелов, то кавычки могут быть опущены, но так делать не рекомендуется. Тег <P> может содержать атрибут ALIGN, определяющий выравнивание абзаца. По умолчанию абзац выравнен влево ALIGN="left". Возможны также выравнивания вправо ALIGN="right" и по центру ALIGN="center". При использовании атрибутов, после форматируемого текста следует использовать закрывающий тег </P>. Если его нет, то новый тег <P> означает закрытие предыдущего, соответственно вложенные <P> невозможны. Выравнить текст по центру возможно также тегом <CENTER>.
Теперь мы можем поместить на нашу Web-страницу некоторый текст с различным выравниванием:
<HTML>
<HEAD>
<TITLE>Моя первая страница</TITLE>
</HEAD>
<BODY>
<P align=center>Здесь будут мои личные страницы!
<P align=left>На них Вы сможете найти:<BR>-
рассказ обо мне и о моих увлечениях;<BR>-
мои фотографии.
<P align=right>С одной из моих страниц можно
будет<BR>отправить мне электронное
письмо.
</BODY>
</HTML>
Кроме использования этих тегов, для разрыва строк возможно использование символов конца строк и табуляций в самом HTML-документе. Для этих целей существует тег <PRE>. Весь текст, помещенный между тегами <PRE> и </PRE> будет выводиться без изменений, то есть со всеми концами строк и табуляциями.
Например:
<PRE>Это текст
написан
в две строки.</PRE>
В HTML-документе, кроме текста, могут содержаться горизонтальные разделительные линии. Они, как и текст, не требуют никаких внешних файлов. Тег <HR> выведет горизонтальную линию единичной толщины вдоль всей ширины страницы. Горизонтальная разделительная линия всегда приводит к разрыву строки, но пустых строк между линией и текстом не появляется. Тег <HR> можнт содержать несколько атрибутов. <HR SHADE> и <HR> дают контурную линию с трехмерным эффектом углубления. <HR NOSHADE> дает сплошную черную линию. Линия может не простираться во всю ширину страницы, а составлять лишь некоторую часть. Атрибут WIDTH задает ширину линии, в процентах от ширины всей страницы или в пикселах. Например, 50% - половина ширины страницы, 400 - ширина в 400 пикселов. Атрибут ALIGN может принимать значения, аналогичные его значениям для тега <P>, но выравнивание по умолчанию - по центру. Атрибут SIZE задает толщину линии в пикселах от 1 до 175; по умолчанию 1, но если <HR SHADE>, (линия - контурная), то добавляется толщина, необходимая для трехмерного эффекта углубления.
Линии, наряду с абзацами, позволяют выделить логические фрагменты текста. Но большое количество горизонтальных линий неприятно для посетителя вашей Веб-страницы, поэтому после каждого абзаца их ставить не следует. Они больше подходят для выделения целых разделов.