Дипломная (вкр): Создание web-сайта Таразского инновационно-гуманитарного университета

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

Кроме того, некоторые технологии, такие как Java и Cascading Style Sheets (каскадные таблицы стилей), не доступны для пользователей Windows 3.0 (примерно 40 % пользователей AOL). Владельцы компьютеров Macintosh не смогут использовать JavaScript и ряд других возможностей (примерно 8 % пользователей).

К счастью, создан специальный сайт в помощь тем Web-дизайнерам, которые стремятся сделать свои страницы интересными и доступными для пользователей AOL. Особого внимания заслуживает таблица браузеров, где вы найдете специальный список для каждого из браузеров (по версиям и платформам), перечень технологий и поддерживаемых функций, а также процент сбоев для каждого из браузеров. . Opera - это маленький и простенький браузер, созданный норвежской компанией Opera Software в Осло. Этот браузер обладает исключительно малым временем загрузки и минимальными требованиями к объему диска. Достоинством Opera является полное соответствие стандартам HTML. Неточности в написании тегов (например, пропущенные закрывающие теги, неправильное вложение и т. д.), которые пропускают более солидные браузеры, не будут правильно отображаться этим браузером. Opera 5.0 поддерживает Java, каскадные таблицы стилей и DHTML.

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

Люди действительно используют Lynx, поэтому не стоит удивляться, если клиент закажет разработку сайта для Lynx. Этот браузер также важен для инвалидов по зрению: они используют Lynx вместе с речевыми устройствами.

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

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

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

Обеспечение доступности web-страницы. При разработке Web-страницы фиксированного размера, вероятно, придется выбирать для нее размер экрана. Здравый смысл подсказывает, что страница должна быть доступна (и правильно отображаться) для максимально возможного числа пользователей. Идея проста: необходимо определить наиболее часто используемое разрешение дисплея и разработать страницу таким образом, чтобы страница гарантированно заполняла все рабочее пространство.

Большинство дизайнеров рекомендуют разрабатывать страницы в формате 640x480, чтобы при просмотре пользователям не пришлось применять горизонтальную прокрутку. Горизонтальная прокрутка всегда затрудняет восприятие, поэтому дизайнеры традиционно ее отвергают.

Все большее число разработчиков считает стандартным разрешение 800x600. И совсем единицы разрабатывают страницы для еще более высоких разрешений. Конечно, ваше решение будет, в первую очередь, зависеть от аудитории. Например, если сайт ресурсов для дизайнеров графики, то считаем, что они имеют дисплеи, по крайней мере, с разрешением 800x600 или выше, в соответствии с чем и разрабатывается страница. Если сайт предназначен специально для WebTV или какого-то другого устройства отображения, следует ориентироваться на это конкретное устройство.

Достойный уважения Web-дизайн включает разработку страниц, доступных для пользователей с ограниченными возможностями, в частности по зрению и слуху. Консорциум World Wide Web объявил об инициативе Web Accessibility Initiative (WAI), которая ставит целью сделать Web более доступным для всех пользователей. Однако успех данной инициативы зависит от участия в ней рядовых разработчиков, которые могут (или не могут) создать Web-сайты в соответствии с поставленными задачами.

Пользователи с ограниченными возможностями зрения могут использовать специальные устройства для увеличения изображения, находящегося на экране. В этом случае к дизайну не предъявляется никаких специальных требований. Многие люди с проблемами зрения используют текстовые браузеры (такие как Lynx) вместе с программным обеспечением, которое громко читает содержимое страницы. В любом случае основное внимание уделяется структуре документа и его тексту. Графическое содержимое может быть просто утеряно.

Представление графики на web-страницах. На данный момент почти все изображения в Web, представлены в двух форматах: GIF и JPEG. Третий соперник, заслуживающий упоминания, формат PNG, борется за поддержку и внимание браузеров. Далее - краткий обзор "большой тройки" онлайновых графических форматов. Более подробная информация представлена в главах, посвященных каждому из форматов.. GIF - Grafic Interchange Format можно назвать традиционным форматом файлов Web. Он был первым форматом файлов, который поддерживался Web-браузерами, и по сей день продолжает оставаться основным графическим форматом Web.

Его свойства состоят в следующем:

поддерживает не более 256 цветов (меньше можно и часто нужно);

использует палитру цветов;

использует сжатие без потери информации по методу LZW (который подобен применяемому в архиваторе PKZIP, и, следовательно, GIF-файлы в дальнейшем практически не сжимаются);

поддерживает чересстрочную развертку;

является поточным форматом, т.е. показ картинки начинается во время перекачки;

позволяет назначить одному из цветов в палитре атрибут прозрачный, что применяется при создании так называемых прозрачных GIF-ов;

имеет возможность сохранения в одном файле нескольких изображений, что находит свое применение при изготовлении анимированных GIF-ов;

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

А теперь немножко разъяснений - к чему эти свойства могут привести. Как мы написали, GIF поддерживает не больше 256 цветов, а это значит, что все изображения, которые мы сохраняем в GIF-формате, явно или неявно уменьшают количество цветов, чтобы уложиться в этот лимит (разные программы с разным успехом). А отсюда вывод - если у взять красивую фотографию с плавными переходами и едва уловимыми оттенками цвета, то после преобразования все будет гораздо хуже - оттенки перестанут быть неуловимыми, и вся фотография приобретет неестественный, нереалистичный вид. Поэтому, если надо все-таки сохранить фотографию в формате GIF и передать все оттенки, то приходится идти на хитрости. Например, к фотографии можно применить какой-нибудь художественный фильтр и превратить ее в рисунок или применить тонирование. Зато нет никаких проблем с сохранением рисунков и чертежей в этом формате, они, как правило, хорошо сжимаются и не содержат много цветов.. Вторым наиболее популярным графическим форматом в Web является JPEG - Joint Photographic Experts Group. Он содержит 24-разрядную информацию о цвете. Это 16,77 млн цветов в отличие от 256 цветов формата GIF. В JPEG используется так называемое сжатие с потерями. Это означает, что некоторая информация об изображениях в процессе сжатия отбрасывается, но в большинстве случаев ухудшение качества изображения не наносит вреда и часто даже не заметно.

Фотографии или любые изображения с плавными градациями цветов лучше всего сохранять в JPEG-формате, потому что он предлагает более высокое качество изображений, умещающихся в файл меньшего объема. Тем не менее, JPEG не является лучшим решением для графических изображений с одноцветными областями, поскольку этот формат имеет тенденцию испещрять цвета крапинками и конечный файл, как правило, будет несколько больше, чем GIF-файл для того же изображения.. Есть еще третий графический формат, конкурирующий за постоянное использование в Web. Это формат PNG - Portable Network Graphic, который, несмотря на некоторые достоинства, с 1994 г. находится более или менее в тени. Только недавно браузеры начали поддерживать PNG как встроенную графику, но PNG имеет все шансы стать очень популярным форматом в Web. Именно поэтому он включен здесь в "большую тройку". PNG может поддерживать 8-разрядные индексированные цвета, 16-разрядные полутона или 24-разрядные полноцветные изображения, используя схему сжатия без потерь. Это обеспечивает более высокое качество изображений, а иногда и меньший объем файлов по сравнению с форматом GIF. Кроме того, файлы PNG имеют некоторые замечательные функции, например, встроенное управление коэффициентом гамма, и изменяемые уровни прозрачности (это позволяет показывать рисунок фона сквозь отбрасываемые мягкие тени) [19].

.3 Пользовательская часть сайта

Сайт ТИГУ - двуязычный. Главная страница пользовательской части сайта на казахском языке (рис. 16). Она будет, как и всё содержимое сайта, на двух языках: казахском (пока не полностью переведено, постепенно будет) и русском, а в дальнейшем можно будет добавить, например, и английский. На главной странице располагаются: новостной слайдер, описание университета, и чуть ниже - последние новости, из вкладки меню «новости». Пункты меню легко добавить из панели администратора Joomla, так же, как и содержимое слайдера, текст описания на главной.

Рис. 16. Главная страница сайта на казахском

На странице «Новости» показаны последние новости (рис. 17). На страницу их выводится по пять штук. В каждой новости в этом меню выводится картинка к ней, если есть, заголовок новости, за ним вводный текст, ссылка на полный текст новости, дата публикации и количество просмотров. Под всеми новостями располагаются кнопки перехода на следующую страницу новостей, на последнюю страницу, активный номер страницы, в общем постраничная навигация.

Рис. 17. Страница новостей

В меню «Государственные символы» находится информация о символах Республики Казахстан.

В меню «Карта сайта» располагается именно она (рис. 18). Она развёрнуто содержит все меню, все ссылки на новости, все материалы. И, согласно настройкам, в панели управления будет обновляться раз в неделю.

Рис. 18. Карта сайта ТИГУ

В пункте «Галерея» содержатся разные фотографии (рис. 19). Пока есть только категория «Университет» с фотографиями. В дальнейшем можно добавлять фотографии в данную категория, можно создать новые категории со своими фотографиями (это делается в панели управления). Есть возможность отсортировать фотографии по порядку, заголовку, дате, количеству просмотров и т.д. Есть выбор количества отображаемых фотографии на странице, стандартно - это 20 штук. Со временем можно сделать и видео-галерею.

Рис. 19. Меню «Галерея» и фотографии категории «Университет»

Меню «Поиск» ведёт на форму поиска по сайту. Есть возможность поиска всех введённых слов, одного из слов или точного совпадения.

Меню «Университет» содержит подменю: «Блог ректора», «Начальство», «Отделы», «Лицензии», «Наука», «Профсоюз».

Далее - меню «Факультеты». Оно делится на подкатегории: «Естественно-гуманитарный», «Экономика и филология», «Педагогика и право» и «Магистратура». Каждое это подменю делится на свои кафедры, меню которых ведёт на информационный материал о каждой из них.

Следующее меню - «Нормативно-правовые документы». Оно их и содержит. Меню «Tempus» - это материал о программе Tempus, цель которой поднять уровень знаний разных территорий до Европейского стандарта.

Меню «Библиотека» и «Platonus» являются ссылками на другие сайты.

«Дополнительно» для разных дополнительных материалов. В этом пункте находится форма для отправления вопроса или предложения к автору сайта от посетителя.

2.4 Панель управления (администратора) в Joomla

Введя логин и пароль администратора, жмем «Войти» (рис. 20) и мы попадаем в панель администратора (рис. 21).

Рис. 20. Вход в панель администратора

Рис. 21. Панель управления администратора

Создание материала. И уже в панели управления мы можем менять содержимое сайта во вкладке «Материалы» (рис. 22) или на боковой панели в блоке «Материалы», то есть, например, материалы, их категории, создавать новые материалы, создавать новые категории с помощью менеджеров. Материалами могут быть новости, отдельные страницы (информация о кафедрах, преподавателях, статьи и т.д.).

Рис. 22. Вкладка «Материалы»

Перейдя в Менеджер материалов (рис. 23), с помощью самой первой кнопки, можно создать новый материал или, можно сказать, новую страницу. Также можно изменить существующий материал, выделив нужный материал галочкой и нажав на кнопку «Изменить». Можно опубликовать и снять с публикации материал, то есть, сняв с публикации, никто данный материал не увидит на сайте (для сайта он как бы не существует). Там же есть возможность добавить материалы в избранные и удалить из избранных, если они там находятся. Удаляются они тоже легко. Их можно поместить в архив. Все материалы можно отсортировать по: состоянию, категории, уровню, уровню доступа, автору, языку, метке (тегу). Это можно сделать, нажав на кнопку «Инструменты поиска», и выбрав нужные параметры. Рядом находится кнопка сброса параметров сортировки, чтобы отображать все материалы.

Рис. 23. Менеджер материалов

Рассмотрим создание материала (рис. 24). Вначале нужно указать заголовок. Ввести содержимое материала (с помощью редактора можно форматировать текст, вставлять картинки, ссылки, таблицы и сразу же увидеть результат). Отделить вводную часть можно, используя кнопку «Подробнее…» под редактором. Нужно просто поставить курсор в редакторе там, где будет заканчиваться вводный текст материала и нажать «Подробнее…». Выбрать состояние, обычно опубликовано, категорию материала, доступ к материалу (какая категория пользователей сможет увидеть данный материал), далее язык, у нас два языка: русский или казахский. Если есть метки, вводим их в соответствующее поле.

В следующей вкладке создания материала «Публикация», важно ввести мета-теги Description (краткое описание материала) и Keywords (ключевые слова), Robots - это нужно для поисковых систем, остальные о датах создания материала и его авторе. Во вкладке «Изображения и ссылки» нужно выбрать две картинки (фотографии) для отображения в виде блога (так отображаются материалы новостей на сайте, в пользовательской части), также добавить ссылки.