Автор: Пользователь скрыл имя, 18 Апреля 2012 в 21:29, курсовая работа
Целью данной курсовой работы является:
изучение возможностей современных информационных технологий, областей их применения.
изучение возможностей сервисов всемирной сети Интернет.
изучение основ HTML и освоение технологий разработки Web-документов.
АНИЕ.................................................................................................4
ВВЕДЕНИЕ...................................................................................................................5
1 ТЕОРЕТИЧЕСКАЯ ЧАСТЬ..................................................................................6
1.1 Понятие сети Интернет. Классификация сервисов Интернет..................6
1.2 Преимущества и направления использования Интернет для бизнеса…………………………………………………………………………………..9
1.3 Понятие, цели и задачи Web-сайтов. Классификация Web-сайтов…………………………………………………………………………………..11
1.4 Этапы проектирования Web-сайтов……………………………………..12
1.5 Средства разработки приложений……………………………………….14
1.5.1 Средства разработки приложений…………………………………14
1.5.2 Программные продукты…………………………………………….15
1.5.3 Классификация средств разработки приложений…………...........16
1.5.4 Классификация приложений, использующих базы данных...........19
2 ПРАКТИЧЕСКАЯ ЧАСТЬ.................................................................................22
2.1 Постановка задачи.........................................................................................22
2.2 Обоснование выбора средства разработки Web-сайта…………………..22
2.3 Разработка структуры Web-сайта…………………………………………23
2.4 Выбор компоновки Web-страниц …………………………………...........25
2.5 Разработка контента и оформление Web-страниц………………............27
2.5.1 Структура и компоненты HTML-документа……………………….28
2.5.2 Теги для структурирования и форматирования текста…………….29
2.5.3 Теги для работы с графикой в HTML-документах………………...33
2.6 Разработка и настройка системы гиперссылок…………………………...34
2.7 Тестирование и продвижение Web-сайта………………………………..36
ЗАКЛЮЧЕНИЕ…………………………………………………………………….39
СПИСОК ИСПОЛЬЗОВАННЫХ ИСТОЧНИКОВ………………................41
ПРИЛОЖЕНИЕ А
ПРИЛОЖЕНИЕ В
2.5 Разработка контента и оформление Web-страниц
Контент
сайта - это информационное наполнение
страниц сайта. В основном используется
графический и текстовый
В зависимости от назначения и содержания страниц выделяют:
- презентационные;
- информационные.
Презентационная страница должна помещаться на один экран, содержать много графики, мало текста и ссылок. Информационные страницы, наоборот, должны содержать минимум графики и быть заполнены самой существенной и актуальной информацией в зависимости от тематики сайта.
Одним из требований к представлению информации на Web-сайте является чёткая сортировка ее по разделам (например, Index, About, Literature и т. д.). Существуют также определенные принципы размещения информации:
- алфавитный порядок;
- хронологический порядок;
- по тематической важности.
Что же касается оформления страниц, то здесь всё зависит от назначения сайта, его целевой аудитории, фантазии автора. Стандартные требования к электронному справочнику следующие:
- использование темного шрифта на светлом фоне;
-
достаточная читабельность
-
следует избегать слишком
-
не загромождать текстовую
2.5.1 Структура и компоненты HTML-документа
Язык HTML (Hypertext Markup Language, язык разметки гипертекста) – это язык, на котором создаются Web-страницы.
Кроме полезного текста в HTML-документах используются специальные управляющие последовательности символов – теги.
Когда Web-браузер получает документ, он определяет, как документ должен быть интерпретирован. Самый первый тег, который встречается в документе, должен быть тегом <HTML>. Данный тег сообщает Web-браузеру, что документ написан с использованием HTML.
Минимальный HTML-документ имеет структуру:
<HTML>
...тело документа…
</HTML>
Теги <HTML> и </HTML> заключают внутри себя все элементы HTML-кода, указывая, что используется язык HTML.
Тем не менее, принято выделять заголовочную часть и тело Web-документа.
Теги <HEAD> и </HEAD> обозначают заголовочную часть Web-документа. Как правило, заголовочная часть содержит название документа, метатеги с информацией для индексирования и некоторые общие установки для данного документа.
Тег заголовочной части документа должен быть использован сразу после тега <HTML> и более нигде в теле документа.
Теги <BODY> и </BODY> обрамляют тело (основную часть) документа. Здесь размещается основная смысловая текстовая и графическая информация. Тело документа отображается в окне браузера.
Разделение документа на заголовочную часть и тело имеет лишь смысловую нагрузку. Текст, приведенный в любой из этих частей, на экране выглядит совершенно одинаково.
В общем виде Web-документ имеет следующую структуру:
<HTML>
<HEAD>
<TITLE>
…текст для строки заголовка браузера
</HEAD>
<BODY>
…тело документа (в окне браузера)
</BODY>
</HTML>
Внутри контейнера <HEAD> может использоваться тег <TITLE>, как показано выше. Большинство Web-браузеров отображают содержимое этого тега в строке заголовка окна Web-браузера, содержащего документ, и в файле закладок, если он поддерживается Web-браузером.
Как любой язык, HTML позволяет вставлять в тело документа пояснительный текст (комментарий), который сохраняется при передаче документа по сети, но не отображается браузером.
Синтаксис комментария следующий:
<!- Это комментарий - >
Комментарии могут встречаться в любом месте документа.
Для корректной работы с Web-страницами в заголовочной части каждой страницы необходимо добавить метатеги, определяющие кодировку и язык страницы:
<HEAD>
…
<META HTTP – EQUIV = “Content-type” CONTENT = “text/html; charset = windows-1251”>
<META HTTP – EQUIV = “Content-Language” CONTENT = “ru”>
…
</HEAD>
2.5.2 Теги для структурирования и форматирования текста
К тегам блочного уровня относят:
- тег абзаца (параграфа) разделяет два абзаца пустой строкой:
<P
ALIGN=LEFT/CENTER/RIGHT/
Этого тег может не иметь пары </P>. Атрибут ALIGN задает выравнивание информации. Применение атрибута NOWRAP дает возможность писать текст без переноса слов.
-
для центрирования текста или
графики можно использовать
- теги заголовков (от 1-го до 6-го уровня) используются для выделения структурных частей текста. Каждый стиль заголовка имеет свой размер. Тег <H1> имеет наибольший размер:
<H1/H2/H3/H4/H5/H6 ALIGN=…> текст < H1/H2/H3/H4/H5/H6 >
- тег горизонтальной линейки предназначен для вычёркивания горизонтальной линии:
<HR ALIGN=…SIZE=…WIDTH=…NOSHADE>,
где атрибут SIZE задает толщину линии в пикселях,
WIDTH – ширину в пикселях или процентах от ширины окна браузера,
NOSHADE позволяет представить линию без тени в виде простой темной полоски.
- тег конца строки вызывает переход на новую строчку без разрыва абзаца:
<BR>
- тег <WBR> - определяет место возможного (рекомендуемого) переноса (разрыва) строки.
- контейнер <NOBR>…</NOBR> заключает в себе текст, который не должен разбиваться на строки, даже если она выходит за границы экрана. Вместо этого браузер позволит горизонтально прокручивать текст.
- контейнер <PRE>…</PRE> используется для отображения на экране символов табуляции, возврата каретки, дополнительных пробелов, сохраняет предварительно выполненное форматирование текста. При отображении такого текста используется моноширинный шрифт. Внутри контейнера могут использоваться другие теги форматирования.
- контейнер <BLOCKQUOTE> предназначен для обозначения в документе цитаты из другого источника. Текст, обозначенный этим тегом, отступает от левого края документа на 8 пробелов.
Для структурирования текста на Web-странице используются теги списков. (HTML позволяет форматировать нумерованные, маркированные и вложенные списки, а также списки терминов и определений.
Нумерованный список (Ordered List):
<ol>
<li>пункт списка
<li>пункт списка
<li>пункт списка
…
</ol>
Маркированный список (Unordered List):
<ul>
<li>пункт списка
<li>пункт списка
<li>пункт списка
…
</ul>
Вложенный список:
<ol>
<li>пункт списка 1
…
<ul>
<li>пункт списка 2
…
</ul>
…
</ol>
Список терминов и определений:
<dl>
<dt>Название термина
<dd>Определение термина
<dt>Название термина
<dd>Определение термина
…
</dl>
Для маркированных, нумерованных и вложенных списков могут использоваться атрибуты:
START - устанавливает начальный номер в текущем списке при использовании арабских цифр
TYPE - устанавливает тип маркера
Для нумерованных списков:
A - маркер в виде прописных букв,
a - маркер в виде строчных букв,
I - маркер в виде больших римских цифр,
i - маркер в виде маленьких римских цифр,
1 - маркер в виде арабских цифр.
Для маркированных списков:
disc – маркер в виде закрашенного кружка,
square – маркер в виде незакрашенного кружка,
circle – маркер в виде квадратика.
TITLE – всплывающая подсказка
<OL TYPE=A TITLE=”нумерованный список”>
…
</OL>
Теги, используемые для форматирования текста:
- <FONT SIZE=… COLOR=… FACE=…> текст </FONT>
SIZE – устанавливает размер шрифта, который будет использоваться текстом, содержащимся в пределах элемента FONT. Можно задать абсолютный размер шрифта, указав целое число от 1 до 7. Для шрифта можно также указывать относительный размер, присваивая атрибуту целое число со знаком (например, SIZE=”+1” или SIZE=”-2”).
COLOR – указывает цвет, которым будет выделен данный фрагмент текста. Цвета задаются в виде RGB-значения с шестнадцатеричной нотацией, либо выбирается символьное значение одного из стандартных цветов.
FACE – задает гарнитуру шрифта, например FACE=ARIAL;
<b>текст</b> - выделить текст полужирным шрифтом.
<i>текст</i> - выделить текст курсивом.
<tt>текст</tt> - выделить текст шрифтом фиксированной ширины.
<u>текст</u> - текст подчеркнуть.
<strike>текст</strike> - перечеркнуть текст горизонтальной линией.