Разработка информационного ресурса 'Вуз - территория здорового образа жизни'. Дипломная (ВКР). Информационное обеспечение, программирование.

🛑 👉🏻👉🏻👉🏻 ИНФОРМАЦИЯ ДОСТУПНА ЗДЕСЬ ЖМИТЕ 👈🏻👈🏻👈🏻

Информационное обеспечение, программирование

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


Помощь в написании работы, которую точно примут!

Похожие работы на - Разработка информационного ресурса 'Вуз - территория здорового образа жизни'

Скачать Скачать документ
Информация о работе Информация о работе


Скачать Скачать документ
Информация о работе Информация о работе


Скачать Скачать документ
Информация о работе Информация о работе


Скачать Скачать документ
Информация о работе Информация о работе


Скачать Скачать документ
Информация о работе Информация о работе


Скачать Скачать документ
Информация о работе Информация о работе


Скачать Скачать документ
Информация о работе Информация о работе

Нужна качественная работа без плагиата?

Не нашел материал для своей работы?


Поможем написать качественную работу Без плагиата!

МИНИСТЕРСТВО
ОБРАЗОВАНИЯ И НАУКИ РОССИЙСКОЙ ФЕДЕРАЦИИ


ФЕДЕРАЛЬНОЕ
АГЕНТСТВО ПО ОБРАЗОВАНИЮ


ДАЛЬНЕВОСТОЧНЫЙ
ГОСУДАРСТВЕННЫЙ УНИВЕРСИТЕТ


Институт
физики и информационных технологий


«Вуз -
территория здорового образа жизни»




Должиков
С.В., к.ф-м.н., доцент ДВГУ














В данной работе описывается построение сайта на заказ Дальневосточного
государственного университета и подробно описываются его особенности.







Необходимо в краткие сроки разработать сайт, в строгом, деловом стиле,
непосредственное содержание для которого (т.н. контент, материал) будет дано
позже. Задача разбивается на подзадачи:


·   разработка цветовой схемы для сайта


·       разработка дизайна (с расположением меню)


·       придание материалу стилистики сайта, помещение на сайт


·       при наличии времени - ввод дополнительных элементов дизайна


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


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







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


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




Поскольку стилистика сайта была определена как деловая, для расположения
элементов сайта была выбрана классическая схема с горизонтальным меню сверху,
вертикальным слева и контент материалом, занимающим большую часть экрана под
горизонтальным меню (рисунок 1):




Рисунок
1 - Схема расположения элементов сайта


Такое расположение элементов меню дает пользователю интуитивно-понятный
интерфейс передвижения по сайту.


Дизайн сайта составлялся с помощью кода HTML с применением средств языка каскадных таблиц CSS. Для написания не использовались
никакие WYSIWYG-редакторы, правка кода
осуществлялась в обычном «Блокноте» (Notepad), поставляемом вместе с Windows, что гарантировало чистоту и понятность кода.


Как видно из схемы, сайт имеет табличный вид. Реализация была обеспечена
средствами HTML методом комбинированных таблиц.
Метод комбинированных таблиц подразумевает использование вложенных друг в друга
разнообразных таблиц с абсолютными и относительными размерами. Как правило, стили
таких таблиц подробно описываются в CSS, оперируя видимостью, толщиной, цветом и типом границ отдельно по каждой
стороне (верхней - top, нижней - bottom, правой - right, левой - left).


В верхнее меню были вынесены ссылки на основные страницы сайта, названия
которых совпадали с ключевыми словами семантики задачи: «Спорт» и «Здоровье».
Кроме того, вверх была вынесена ссылка «Об университете» и «Контакты».


Боковое меню содержит прочие ссылки на более конкретизированные страницы:
«документы», «новости» и др. Кроме того, в меню добавлен раздел «Ссылки», в
котором присутствуют основные ссылки на внешние сайты, связанные тематикой
«ДВГУ, спорт, здоровье», а также указан телефон молодежного центра ДВГУ.




В сайте использовались следующие стандартные теги:


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


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


·       Устанавливает цвет фона документа, используя значение цвета в
виде RRGGBB - пример: FF0000 - красный цвет, либо используя константы цвета,
например для желтого цвета, используемой на данной странице


Указывает на url-адрес изображения - фона документа


Нежелательный. Устанавливает цвет текста документа, используя значение
цвета в виде RRGGBB - пример: 000000 - черный цвет, либо используя константы
цвета, например для зеленого цвета, используемой на данной странице


Нежелательный. Устанавливает цвет гиперссылок, используя значение цвета в
виде - пример: 00FF00 - зеленый цвет, либо используя константы цвета, например
для красного цвета, используемой на данной странице


Фоновое изображение прокручиваться не будет. Т.е. текст будет двигаться
при нажатии PageDown, а фон - нет.


.    - служит
для внедрения графики в страницу.


Обязательный атрибут, указывающий URL рисунка


Выравнивает изображение к одной из сторон документа (см. таблицу 1)




Таблица
1 - Значения атрибута "align" тега "img"




Выводит текст к картинке. Полезно, если браузер не отображает графику на
странице


Устанавливает толщину рамки вокруг изображения в пикселях. По умолчанию
рамка не используется. При использовании изображения в качестве гиперссылки
рекомендуется установить BORDER=0, чтобы подавить цветовую окантовку, которая
появится вокруг изображения


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


Определяет размер свободного места в пикселях слева и справа от
изображения, улучшает внешний вид страницы, отделяя изображение от текста


Определяет размер свободного места в пикселях сверху и снизу от
изображения, улучшает внешний вид страницы, отделяя изображение от текста


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


.    - служит для
внедрения графики в страницу.


Задает имя элемента. Имя используется, например, для создания ссылок
между фреймами


Задает URL ресурса, на который должен перейти пользователь, щелкнув по
ссылке. Атрибут может указывать как на внешний документ, так и на элемент
внутри данного документа.


Для создания гиперссылки вызова почтовой программы для написания письма
используется .


Строка, определяющая или получающая одно из следующих значений




Загружает ссылку в
родительском окне

Загружает ссылку в панель
поиска браузера. Доступно в Internet Explorer 5 и выше

По умолчанию. Загружает
ссылку в это же окно, где был произведен клик по ссылке

Таблица
2 - Значения атрибута "target" тега "a"




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


Выравнивание таблицы относительно документа. Возможные значения: center,
left, right


Строка, определяющая рисунок для заднего фона


Толщина рамки в пикселях. Если атрибут не указан, то таблица выводится
без видимой рамки


Задает расстояние между ячейками таблицы


Задает расстояние между содержимым ячейки и ее рамкой


Ширина таблицы в процентах или пикселях


3.1 определяет строку в таблице


Выравнивает текст в ячейке по вертикали


3.2 определяет отдельную ячейку в таблице.


o  left - по левому краю (по умолчанию)


Выравнивает текст в ячейке по вертикали


Указывает кол-во столбцов которое объединено в одной ячейке (по
умолчанию=1)


Указывает кол-во строк которое объединено в одной ячейке (по умолчанию=1)



3.3   Тег определяет заголовок для таблицы TABLE.
Элемент CAPTION может располагаться только непосредственно после начального
тега TABLE. Элемент TABLE может включать только один элемент CAPTION.
Закрывающий тег обязателен.


Теги логического и физического форматирования текста:


1.  Тег создает
жирный текст. Закрывающий тег обязателен.


2.     Тег
создает наклонный текст. Закрывающий тег обязателен.


.       Тег
указывает на то, что текст должен быть подчеркнут. Закрывающий тег обязателен.


.       Тег (BReak line) вставляет перевод строки. Не требует
закрывающего тега.


.       Тег (NO BReak line) запрещает перевод строки.
Бывают случаи, когда возникает надобность в операции противоположного
назначения - запретить перевод строки. Текст, заключенный между тэгами
и , будет гарантированно располагаться в одной строке
без переноса на другую. Закрывающий парный тег обязателен.


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


.       Тег и обязательный парный ему
Тег предназначен для горизонтального выравнивания ВСЕХ элементов
посередине окна браузера. CENTER это тег уровня блока, поэтому им можно
центрировать, например, таблицы, тексты.


.       Тег

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

рекомендуется ставить, но обязательным он не является.


Устанавливает высоту(толщину) линии


Устанавливает ширину линии в пикселях или процентах


10. Тег (Unordered List) служит для создания ненумерованного
списка. Допускается вложение ненумерованного списка в списки другого вида.
Требуется закрывающий тег.


Определяет тип маркера (см. таблицу 3)




Таблица
3 - Значения атрибута "type" тега “UL”




5.1  Тег