Технологии проектирования Web-документов

Понятие сайта и требования к нему

Сайтом называется совокупность html-страниц (Web-страниц), связанных между собой взаимными гиперссылками, т.е. с каждой страницы сайта можно перейти по цепочке гиперссылок на любую другую страницу сайта (если на нее разрешен доступ).

Web-страница может содержать информацию, представленную в различных формах: текст, таблицы, графику, анимацию, а также звук и видео. Просмотр Web-страниц осуществляется с помощью специальных программ просмотра – браузеров.

Сайт имеет стартовую страницу. Так называется страница, которая открывается Web-браузером при обращении к сайту и имеет название index.html или default.html.

Создание сайта начинается обычно с разработки его страницы-шаблона, на которой размещаются элементы, общие для всех страниц, в частности панель навигации. Она обеспечивает возможность перехода на любую страницу сайта. Панель навигации может быть текстовой или оформлена в виде кнопок.

Web-сайты можно разделить на несколько категорий:

· сайты, содержащие текстовые страницы и изображения (в определенном смысле это электронная версия бумажных публикаций);

· интерактивные сайты, в которых реализована обратная связь с сервером и его персоналом;

· сайты, реализующие персональный сервис для пользователя, например, позволяющие выбирать и сортировать содержание сайта по выбору пользователя (http://www.pingwin.ru/);

Web-интерфейсы – сайты, Web-страницы которых представляют программный интерфейс к некоторой системе функций. Простейшим примером такого сайта является Web-почта.

Другой пример – страницы с Java-апплетами, т.е. программами, выполняющимися в окне браузера (http://www.college.ru/physics/applets/a_content.htm).

Самое большое внимание нужно уделить разработке стартовой страницы – index.html, так как именно ее видит посетитель сайта первой, и, просмотрев ее, он либо посетит другие страницы сайта, либо покинет его. Следовательно, эта страница должна быть наиболее привлекательной и информативной, но быстро загружаемой.

Самые лучшие Web-сайты должны выглядеть привлекательно, емко выражать основную идею и не заставлять пользователей ждать получения информации на их экранах слишком долго. Вот несколько советов по созданию успешного сайта:

· сайт должен содержать информацию, соответствующую его назначению;

· информация сайта должна соответствовать типу аудитории, на которую он рассчитан;

· сайт должен использовать быстро загружаемые элементы и быть визуально привлекательным;

· не следует перегружать страницы сайта слишком большим количеством информации;

· необходимо предусмотреть на сайте кнопки навигации;

· сайт должен быть тщательно протестирован.

При создании Web-страниц следует учитывать некоторые технические приемы:

· при написании заголовков страниц и разделов обязательно использовать теги H1 ... Н6 (теги заголовков); если вместо этого использовать просто шрифтовое выделение, то в дальнейшем информационно-поисковые системы не обнаружат этих заголовков;

· если используются изображения, особенно в качестве кнопок гиперссылок, обязательно создавать альтернативный текст (тег <ALT="...">), чтобы посетитель с отключенным в браузере показом графики, вместо изображений мог увидеть альтернативный текст (с сохранением гиперссылки), а не пустые квадратики;

· никогда не уменьшать существенно размеров изображений в Web-редакторе, так как качество изображения при этом ухудшается, а размер файла изображения не изменяется, и время загрузки его не соответствует видимому изображению.

Создать сайт можно, используя:

1) язык гипертекстовой разметки HTML (HyperTextMarkupLanguage);

2) Web-редакторы (например, FrontPage, Dreamweaverи др.);

3) текстовый процессор Word;

4) средства, интегрированные с новыми версиями браузеров.

Язык разметки гипертекста HTML

Гипертекст – это нелинейный текст, в который включены гиперссылки, позволяющие пользователю с помощью их активизации перейти на другие ресурсы.

Особенности языка HTMLсвязаны с его применением в сети Интернет:

· принципиальная невозможность точного воспроизведения вида документа (разные ОС, браузеры, настройки);

· необходимость передачи по сети файлов и требование их минимального объема;

· при разработке документа нужна возможность – читать и редактировать исходный файл;

· язык HTML предназначен не для форматирования (как, например, Word), а для функциональной разметки документа.

Основа используемой в языке HTML технологии состоит в том, что в обычный текстовый документ вставляются управляющие символы (дескрипторы или теги), в результате чего получается Web-страница.

Браузер при загрузке Web-страницы представляет ее на экране в том виде, который задается тегами. С помощью тегов можно изменять размер, начертание и цвет символов, определять положение текста на странице, вставлять графические изображения, анимацию, звук и видео, изменять цвет фона и т. д. Важно, что с помощью тегов в Web-страницу можно вставлять гиперссылки, в том числе и в графической форме.

Основные понятия языка HTML представлены в таблица1.

Таблица 1

Основные понятия языка HTML

Основные команды языка HTML (теги) приведены в приложении 1. Примеры функциональных блоков языка HTML приведены в приложении 3.

Подготовка Web-страниц с помощью Web-редактора

Web-редакторы – это самое удобное средство для подготовки своих страниц пользователями-непрофессионалами. Это вытекает из следующихособен-ностей:

Web-редактор можно интегрировать с комплексом MicrosoftInternetExplorerи быстро вызывать прямо из него;

при вызове Web-редактора из MicrosoftInternetExplorer текущая страница загружается в Web-редактор и готова к редактированию;

Web-редакторы имеют простой и понятный интерфейс, схожий с другими Win-приложениями;

Web-редакторы не требуют от пользователя знания языка HTML и работают по принципу «что вижу, то и получаю»;

возможности Web-редакторов намного превышают потребности любителя и скорее относятся к полупрофессиональным.

Есть две принципиально разные возможности создания сайтов в Web-редакторах:

1) строительство сайта, а затем создание и редактирование отдельных его страниц,

2) создание отдельных страниц сайта в Web-редакторе, а затем строительство сайта путем связывания страниц гиперссылками.

Реализация второй возможности описана в методических указаниях к выполнению задания для Web-редактора MicrosoftFrontPage.

ПРИЛОЖЕНИЕ 1

Приложение 3