- •Введение
- •1 Анализ требований к информационному ресурсу
- •1.1 Предметная область и постановка задачи
- •1.2 Термины предметной области
- •1.3 Техническое задание
- •2 Проектирование информационного ресурса
- •2.1 Основные положения методологии проектирования
- •2.2 Контекстная диаграмма
- •2.3 Декомпозиция контекстной диаграммы
- •2.4 Проектирование интерфейса
- •3 Реализация информационного ресурса
- •3.1 Описание средств реализации
- •3.2 Структура информационного ресурса
- •4 Ввод в эксплуатацию информационного ресурса
- •4.1 Документация пользователя
- •4.2 Сопровождение и развитие информационного ресурса
- •Заключение
- •Список использованных источников
- •Приложение Приложение 1 Таблица стилей
- •Приложение 2 Html –код страницы главной страницы
- •Приложение 3 Html –код страницы загрузок бланков
3 Реализация информационного ресурса
3.1 Описание средств реализации
Язык HTML, или универсальный язык разметки гипертекста, используется для создания самых разных интерактивных документов с гиперссылками и элементами мультимедиа — Web-страниц, интерфейсов, презентаций, электронных книг и учебных пособий. Файлы с HTML-кодом — это обычные текстовые файлы, доступные для чтения как программе, так и человеку. Благодаря этому HTML-страницы можно редактировать и просматривать на любом компьютере и в любой операционной системе.
HTML подразумевает некую стандартизированную структуру построения программы — в данном случае, HTML-документа. Такая структура описывает даже не последовательность команд, а очередность следования ряда обязательных блоков, которые содержат непосредственно программный код. В отличие от иных языков программирования, директивы HTML называются не «командами», «процедурами» или «операторами», а имеют собственное наименование — «теги» (от английского tag — отметка). Теги HTML заключаются в угловые скобки, синтаксис их записи в общем виде выглядит как <тег>. Все объекты, не заключенные в угловые скобки, интерпретатор воспринимает как текстовые элементы, отображая их на экране компьютера «как есть». Каждый HTML-документ содержит в себе две части: заголовок и тело страницы. В заголовке размещается название и некоторая специальная информацию о странице. Для реализации проекта использовались тэги описанные ниже (таблица 3).
Таблица 3
|
Название тега (пример) |
Назначение тега |
|
1 |
2 |
|
Основные теги |
|
|
<html></html> |
Указывает программе просмотра страниц что это HTML документ. |
|
<head></head> |
Определяет место, где помещается различная информация не отображаемая в теле документа. Здесь располагается тег названия документа и теги для поисковых машин. |
|
<body></body> |
Определяет видимую часть документа |
|
<title></title> |
Помещает название документа в оглавление программы просмотра страниц |
|
<a href="URL"></a> |
Создает гиперссылку на другие документы или часть текущего документа. |
|
Теги форматирования |
|
|
<pre></pre> |
Обрамляет предварительно отформатированный текст. |
|
<h1></h1> |
Создает самый большой заголовок |
|
<h6></h6> |
Создает самый маленький заголовок |
|
<b></b> |
Создает жирый текст |
|
<i></i> |
Создает наклонный текст |
|
<br> |
Вставляет перевод строки |
|
<ol></ol> |
Создает нумерованный список |
|
<li> |
Определяет каждый элемент списка и присваивает номер |
|
<ul></ul> |
Создает ненумерованный список |
Продолжение таблицы 3
|
1 |
2 |
|
Теги для работы с графикой |
|
|
<img src="name"> |
Добавляет изображение в HTML документ |
|
<img src="name" align=?> |
Выравнивает изображение к одной из сторон документа, принимает значения: left, right, center; bottom, top, middle |
|
<img src="name" border=?> |
Устанавливает толщину рамки вокруг изображения |
|
<hr> |
Добавляет в HTML документ горизонтальную линию |
|
Теги для работы с таблицами |
|
|
<table></table> |
Создает таблицу |
|
<tr></tr> |
Определяет строку в таблице |
|
<td></td> |
Определяет отдельную ячейку в таблице |
|
<table border=#> |
Задает толщину рамки таблицы |
|
<table cellspacing=#> |
Задает расстояние между ячейками таблицы. |
|
<table cellpadding=#> |
Задает расстояние между содержимым ячейки и ее рамкой |
|
<table width=#> |
Устанавливает ширину таблицы в пикселах или процентах от ширины документа |
При реализации ресурса, создаваемого в рамках данного проекта, использовалась технология каскадных таблиц стилей (CSS).
Для создания HTML-страниц можно пользоваться любым текстовым редактором, например Блокнотом. Существуют и специализированные программы. Эти HTML-редакторы делятся на два типа: визуальные и невизуальные. Визуальные HTML-редакторы обладают интуитивно понятным интерфейсом и автоматизируют работу разработчика. Невизуальные редакторы требуют тэгов «вручную».
В данном проекте использован визуальный редактор Macromedia Dreamweaver. Macromedia Dreamweaver (сейчас - Adobe Dreamweaver) - профессиональный редактор HTML для проектирования, написания кода и поддержки сайтов, web-страниц и приложений сети. Dreamweaver включает в себя много инструментов и средств для редактирования и создания профессионального сайта: HTML, CSS, JavaScript, отладчик JavaScript, редакторы кода (просмотр кода и инспектор кода), что позволяет вам, редактировать JavaScript, XML и другие текстовые документы, которые поддерживаются в Dreamweaver. Возможность визуального редактирования в Dreamweaver также позволяет быстро создавать или менять дизайн проекта.