Методические указания для выполнения курсовой работы

1. Структура курсовой работы

В теоретической части курсовой работы необходимо наиболее развернуто рассмотреть вопросы, указанные в задании в соответствии с вариантами.

Практическая часть курсовой работы включает следующие пункты:

2.1. Постановка задачи

В данном пункте курсовой работы необходимо проанализиро­вать специфику выбранной тематики сайта и обосновать необходимость его разработки. Требуется сформулировать основ­ные функциональные возможности сайта и предположить возмож­ные выгоды от его использования.

2.2. Обоснование выбора и описание программного средства в разработке Web-сайта

В данном пункте курсовой работы необходимо дать краткий об­зор функциональных возможностей выбранного ви­зуального редактора веб-страниц.

Результатом анализа возможностей редактора, а также его дос­тоинств и недостатков должно стать обоснование выбора рассмотренной программы в качестве средства разработки сайта. При описании возможностей программы необходимо обратить особое внимание реализации поддержки в ней технологии визуального проектирования.

2.3. Разработка структуры Web-сайта

В данном пункте курсовой работы необходимо дать краткий об­зор существующих типов организационных структур сайтов. Обос­новать выбор структуры, наиболее подходящей для разрабатывае­мого сайта, и представить ее в графическом виде. Описать исполь­зованный принцип распределения страниц сайта и дополнительных файлов по разделам сайта. Реализовать структуру в выбранном редакторе, уделив особое внимание требованиям к именованию страниц и па­пок структуры.

2.4. Выбор компоновки Web-страниц

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

2.5. Разработка конвента и оформление Web-страниц

В данном пункте курсовой работы необходимо изложить воз­можности по заполнению сайта текстовым контентом. При изучении технологии обработки текста веб-страниц необходимо руководствоваться теоретическими сведениями и ме­тодическими указаниями. Кроме этого необходимо дать краткое описание графиче­ских форматов, оптимальных для использования на веб-страницах. Рассмотреть воз­можности по созданию графических и текстовых карт сайта. Для разрабатываемого сайта необходимо соз­дать оба типа карт и описать их функциональные возможности как вспомогательного средства навигации. Процесс разработки карт сайта и конечный результат тестирова­ния их работоспособности в браузере необходимо представить в виде копий экрана.

2.6. Разработка и настройка системы гиперссылок

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

2.7. Тестирование и продвижение Web-сайта

В данном пункте курсовой работы необходимо рассмотреть воз­можности по тестированию сайта, которое является одним из важнейших мероприятий по подготовке сайта к публикации. Этапы тестирования сайта необходимо представить копиями экрана и соответствующими диалоговыми окнами с задан­ными параметрами и сопроводить кратким описанием.

Необходимо рассмотреть тех­нологию регистрации сайта в каталогах и поисковых системах. Привести список ресурсов, на которых целесообразно зарегистри­ровать разработанный сайт.

В данном пункте необходимо сделать обзор мероприятий по продвижению разработанного сайта. Для каждого из мероприятий необходимо привести краткое описание его воз­можностей и проанализировать планируемую эффективность с уче­том специфики его тематики и возможностей сайта.

3. Заключение

В данном пункте курсовой работы необходимо дать краткий об­зор функциональных возможностей, реализованных в разработан­ном сайте. Сделать вывод о целесообразности проведенной оптими­зации сайта под поисковые системы.

Разработка структуры Web-сайта.

Сайт представляет собой совокупность множества Web-страниц, связанных между собой гиперссылками. Информационные связи между отдельными Web-страницами принято называть структурой сайта.

Существуют различные навигационные структуры веб-сайтов:

1. линейная, когда страницы веб-документа следуют строго одна за другой, имеется возможность возврата на один уровень назад;

2. нелинейная, при которой существует возможность перехода от страницы к странице независимо от иерархии;

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

4. комбинированная, которая создана на основе иерархической и присутствуют элементы линейной.

Навигационная структура сайта может включать следующие элементы:

1. Главная страница − начальная страница, загружаемая при открытии сайта (index.html).

2. Навигатор по сайту, включающий несколько веб-страниц (например, «О нас» – страница содержит информацию о названии сайта и разработчике (o_nas.html).

3. Разделы по тематикам (content.html).

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

Структура сайта на уровне разделов.

При разработке структуры сайта сначала определяется его состав на уровне крупных разделов, содержание которых постепенно дета­лизируется и уточняется. В такой же последовательности устанав­ливаются и связи между разделами сайта. При создании структуры каждый раздел сайта представляется отдельной папкой, в которой хранятся веб-страницы этого раздела. Например, если сайт содер­жит раздел «О компании», то в структуре необходимо создать пап­ку с таким же именем (AboutFirm), в которой могут храниться такие веб-страницы: «История компании», «Контактная информация», и др. Соответственно, будут следующие названия файлов: History.html, Contact.html и т. д.

При разработке структуры сайта желательно размещать взаимосвязанные страницы в одной папке.

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

Файлы разных типов размещаются в отдельных папках (на­пример, графические - в папке Images, звуковые - Sound и т. д.). Если таких файлов много, их распределяют по вложенным папкам, имена которых должны соответствовать названию страниц, где эти файлы используются.

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

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

Есть определенная связь между степенью деления документов и частотой их обновления. Чем динамичнее содержимое сайта, чем чаще обновляется на нем информация, тем более мелким становит­ся его деление на разделы.

Выбор компоновки Web-страниц.

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

Следует отметить следующие принципы оформления:

1. баланс – это равновесие взаимодействующих или противоположных сил в композиции. Его можно достичь с помощью правильного размещения объектов, размеров объекта и по цвету. Баланс может быть симметричным, асимметричным, радиальным (объекты расположены кругом и расходятся из одной точки);

2. контраст – это взаимодействие противоположных элементов композиции, таких как цвет, размер, текстура и т.д. Примеры контраста: большой и маленький, шероховатый и гладкий, толстый и тонкий, черный и белый;

3. значимость и подчиненность – этот принцип предполагает выделение, так называемого, центра интереса, на котором предполагается сосредоточить внимание зрителя. Объекты должны находиться в иерархии по значимости и подчиненности. Если все объекты будут иметь одинаковую значимость, то внимание пользователя рассеивается;

4. направление внимания - управление движением взгляда зрителя во время его перемещения по сайту, чтобы привлечь его внимание к значимым элементам;

5. пропорция – это отношение отдельной части ко всему объекту, а также соотношение отдельных частей друг с другом;

6. масштаб – это реальный, видимый размер объекта, рассматриваемый в отношении других предметов, людей, окружающей среды;

7. предполагает повторение элементов дизайна для достижения определенной цели, например, чтобы задать направление взгляда или для непрерывности внимания;

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

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

Любая страница, публикуемая в сети, состоит из набора элементов, которые являются неотъемлемыми компонентами любого Интернет-ресурса. Каждый из них исполняет определённую функцию, то есть несет свою смысловую нагрузку. Элементов, не несущих ни какой информации, размещать на странице не следует. Основные элементы компоновки веб-страницы:

1. «Header» – шапка сайта. Это сегмент, в котором обычно размещается картинка-логотип, слоган, форма для поиска и если есть в этом необходимость – горизонтальное меню. Однако в этом элементе размещается, прежде всего, заголовок, который может быть выполнен как в текстовом, так и в графическом варианте, однако и в том и в другом случае он должен располагаться в верхней части документа. Непосредственно подзаголовком документа, как правило, располагается пространство, отведенное для размещения рекламного баннера или логотипа.

2. контент – основное содержимое, несущее самую важную смысловую нагрузку. Это – текст, картинки, ссылки и так далее, занимающие основную часть веб-страницы.

3. элементы навигации – средство связи веб-страниц в сайте. Могут быть выполнены в виде графических объектов, готовых кнопок, текстовых строк и т.д.

4. контактные данные, информация о разработчиках сайта и адрес электронной почты, по которому посетители ресурса могут направить владельцам странички свои отклики, предложения и пожелания.

Существуют следующие наиболее распространенные компоновки веб-страниц с различным расположением навигационной панели:

1. левосторонняя (правосторонняя);

2. с верхним расположением навигации;

3. комбинированная.

В левосторонней (правосторонней) компоновке веб-страниц осуществлено позиционирование элементов навигации по левой (правой) границе документа. Пример левостороннего расположения панели навигации представлено в соответствии с рис.1.

Рис.1. Левостороннее позиционирование Панели навигации

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

При верхнем позиционировании Панель навигации располагается вверху документа в соответствии с рис.2.

Рис.2. Верхнее позиционирование Панели навигации

Существует так же комбинированная компоновка, примерная схема которой приведена на рис.3.

Рис.3. Комбинированная компоновка веб-страницы

Разработка конвента и оформление Web-страниц.

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

HTML — теговый язык разметки документов. Любой HTML-документ имеет структуру, и находится внутри парного тега <HTML>. В общем виде Web-документ имеет следующую структуру:

<HTML>

<HEAD>

<TITLE>… заголовок… </TITLE>

</HEAD>

<BODY>… тело документа…</BODY>

</HTML>

Кроме того к структуре HTML-документа часто относят тег <META>, который содержит специальную служебную информацию, не отображающуюся при просмотре веб-страницы:

<meta name="Author"> - имя автора веб-страницы;

<meta http-equiv="Content-Type" > – используется для указаний инструкций пользователю.

Язык HTML предоставляет возможность создания красиво оформленных электронных документов, содержащих заголовки, информационный текст, таблицы, списки, иллюстрации, звуки, видеоклипы (переходы или гиперссылки).