Разработка web-сайта ТФ МГУКИ. Создание информационного массива "Учебная часть"
Дипломная работа - Компьютеры, программирование
Другие дипломы по предмету Компьютеры, программирование
ние, а только потом на его внутренне содержание или различные способности по управлению и функциональностью. Гармоничность цветов играет не мало важную роль в оформлении дизайна сайта, позволяя реализовать основную идею создания информационного массива учебная часть, а цветовая гамма и размер текста представленных на страничках раздела дают возможность информации о ВУЗе выглядеть в лучшем виде.
При создании фоновой графики были использованы синии и белые тона, так как они обладают хорошим эффектом визуализации и выдерживают строгость, спокойствие всего сайта. Цветовая схема текста на протяжении всех страничек является черной, что позволяет сайту соответствовать строгости создания именно сайта высшего учебного заведения.
Для контроля фона меню, ссылок, цветом и размером текста были использованы каскадные таблицы стилей, позволяющие контролировать все эти действия из одного файла. При этом с легкостью можно менять размер загловков их цвет и многое другое, что связано с оформлением страниц сайта.
В оформлении сайта использовались следующие стили, первый из которых отвечает за тело всех страниц.ody {font-family: verdana, helvetica, arial, sans-serif; // Указывает имя шрифта или шрифтового семейства, используемого в элементе страницы.
Font-size: 80%; // Возможно задание либо абсолютного размера шрифта в одной из поддерживаемых CSS единиц измерения, либо как процент от размера шрифта родителя.
Margin: 0; // Задает ширину полей между элементами страницы и его соседями.
Padding: 0; // Задает отступ между элементом страницы и различными границами.
Background-color: #ffffff ;} // Задает фоновый цвет Web-страницы или ее элемента.
Следующий стиль отвечает за фоновый рисунок для страничек сайта, где background - задает все свойства фона элемента страницы в один прием, а background-repeat - устанавливает порядок повторения фонового рисунка на Web-странице или ее элементе. Иногда этот атрибут необходим, чтобы занять все свободное пространство, если фоновый рисунок слишком мал, чтобы покрыть пространство без повторения.
.tbl1 {background: url (back.jpg);
background-repeat: no-repeat;}
Также в каскадной таблице стилей указывается размер и шрифт текста непосредственно задающего как заголовки, под заголовки, так и основной информационный текст страничек. Ниже представлены некоторые из них:
.style1 {font-size: 36px;style: italic;}
.style4 {font-size: smaller;: #507DB4;-weight: bold;}
Последним представленным стилем в файле является стиль динамического меню, который полностью отображает цвета оформления графических рисунков, текста в них, так как меню состоит из трех уровней, то и текст должен быть представлен в нескольких вариантах. Еще не мало важным эффектом является указание расположения на страничке, как графики первого уровня, так и последующих при раскрытии меню. Все это учитывается в каскадной таблице стилей динамического меню выглядещего следующим образом:
DIV.clSlide{position:absolute;;z-index:10; left:0; width:138; height:22; clip:rect(0,138,22,0); padding:3px;} // position: absolute; - задает абсолютное свободное позиционирование, z-index - задает порядок перекрытия свободно позиционированными объектами друг друга, clip - задает прямоугольный фрагмент элемента страницы, который будет видим. Предопределенное значение auto задает видимость всего элемента страницы. Оно же является значением по умолчанию. Для того чтобы ограничить видимую часть элемента страницы прямоугольным фрагментом, задаются четыре координаты границ этого прямоугольника, разделенные пробелами.
DIV.clSlideSub{position:absolute; ;z-index:10; padding:2px; clip:rect(0,127,20,0); width:127; height:20; left:8; visibility:hidden} // visibility - позволяет элементу быть видимым или невидимым на странице, в данном случае элемнт будет невидимым.
Таким образом, каскадная таблица стилей очень удобное средство для работы с текстом и фоновыми цветами, позволяющая с легкостью манипулировать различными операциями по смене размера, цвета текста и все что с ним связано. Конечный вариант каскадной таблицы стилей представлен в приложении Б.
Фоновый рисунок разработан с помощью специальной программы, которая позволила с легкостью манипулировать различными эффектами и цветами, а также дополнительными рисунками, которые были добавлены по верх всего фона. Сначала было выделено место под заголовок сайта и точно распределено размещение гербовой символики высшего учебного заведения. Заголовок написан строго по центру и выделен цветом и шрифтом. После его написания по краям добавлены два герба, которые непосредственно используются в структуре. Также было создано два фрагмента графики, одна из которых разрабатывалась под динамическое меню сайта и гармонично подходят друг другу.
Как уже упоминалось ранее, структура сайта соответствует табличной форме, что позволяет размещать текстовые и графические материалы в уже разработанные для них строки или столбцы. Так вся текстовая информация, выложенная на страничках сайта, находится в центре таблицы и не зависимо от странички ее место положение не меняется. Это же относится к динамическому меню, табличная структура не позволяет изменять положение и строго соответствует месту, разработанному под него.
На главной страничке размещена краткая информация о предоставляемых услугах, специальностях, на которые можно выучиться; указываются сроки обучения; отделения (очное, заочное); указаны предметы необходимые сдать при поступлении в ВУЗ, а также документация и сроки подачи заявлений на обучение.
Остальные странички сайта оформлены в этом же стиле с не большими изменениями. Так на всех них появляется дополнительная кнопка м