Добавлен: 30.06.2023
Просмотров: 107
Скачиваний: 2
СОДЕРЖАНИЕ
1. Цели и концепция Web-ресурса
1.2. Обоснование необходимости создания Web-ресурса
1.3. Описание свойств Web-ресурса, требуемых для решения выбранной задачи
1.4. Характеристика целевой аудитории
1.5. Характеристика и анализ Web-ресурсов по аналогичной тематике
2. Параметры и внешний вид Web-ресурса
2.1. Обоснование выбора имени и названия Web-ресурса
2.2. Обоснование лингвистического обеспечения Web-ресурса
2.3. Обоснование выбора графического режима Web-ресурса
2.4. Обоснование принятых решений по цветовой схеме Web-ресурса
2.5. Обоснование принятых решений по размеру и виду шрифта
2.6. Обоснование принятых решений по формированию фирменного стиля
3. Обоснование выбора инструментария для создания Web-ресурса
3.1. Обоснование технологии получения и размещения информационного наполнения Web-ресурса
3.3. Обоснование выбора программного обеспечения для создания Web-ресурса
3.3.1. Обоснование выбора программных продуктов для создания графики
3.3.2. Обоснование выбора программных продуктов для создания анимации
3.3.3. Обоснование выбора СУБД
3.3.4. Обоснование выбора программных продуктов для создания программного кода
3.4. Обоснование выбора способа размещения Web-ресурса в Интернет
4. Структура и содержание сайта
4.1.Разделы сайта и система навигации
4.2.Функциональные и технические требования
4.4. Описание процедуры тестирования созданного Web-ресурса
5. Разработка рекламной кампании по продвижению Web-ресурса в Интернет
5.1. Формирование массива ключевых слов для поиска Web-ресурса в поисковых системах
Рис.9. Статистика Google Analytics
Чтобы выбрать оптимальную ширину для нашего сайта можно воспользоваться статистикой посещений пользователей и установить фиксированную ширину под самое распространенное разрешение.
Кроме этого, для пользователей мобильных телефонов и для пользователей с другими разрешениями можно подключить отдельные стили для изменения ширины сайта.
2.4. Обоснование принятых решений по цветовой схеме Web-ресурса
Цветовая схема была выбрана красная/белая. Эти цвета хорошо сочетаются, страницы получаются яркими, контрастными, в то же время не агрессивными.
2.5. Обоснование принятых решений по размеру и виду шрифта
Для сайта был выбран шрифт 12, так как меньший шрифт будет трудно читаться, а больший может выглядеть не очень хорошо.
Хороший вариант использования шрифта – Verdana. Будет хорошо и удобно читаться, благодаря ширине букв и междубуквенном расстоянии.
2.6. Обоснование принятых решений по формированию фирменного стиля
Стиль электронного ресурса полностью соответствует фирменному стилю компании. Редизайн не проводился.
3. Обоснование выбора инструментария для создания Web-ресурса
3.1. Обоснование технологии получения и размещения информационного наполнения Web-ресурса
Источники информации на сайте – приказы, инструкции руководства компании, законодательные акты в сфере услуг.
Таблица 1
Характеристика информации
Вид информации |
Источник |
Частота |
Объем |
Информация о компании |
Руководство |
1 раз в год |
1 стр. |
Вакансии |
Руководство |
1 раз в 6 мес. |
1 стр. |
Новости |
Руководство Законодательные акты |
1 раз в неделю |
1 стр. |
Информационные блоки для трансляции не покупаются.
3.2. Обоснование выбранных технологий для обеспечения совместимости Web-ресурса с различными браузерами
Для задания режима совместимости на стороне клиента в HTML-коде страниц следует, используя любой HTMLGредактор, вручную добавить соответствующий тэг ко всем страницам сайта, расположив его внутри элемента HEAD перед всеми остальными тэгами кроме TITLE и META.
<head>
<meta http#equiv="X_UA_Compatible" content="IE=EmulateIE7">
<!—Здесь располагаются другие тэги группы HEAD ##>
</head>
Для задания режима совместимости на стороне сервера, т. е. для автоматической вставки соответствующего заголовка во все страницы, отсылаемые в браузер с данного веб-сервера, можно использовать несколько способов.
Можно добавить специальный HTTP-заголовок, используя средство управления веб-сервером Internet Information Services — IIS Manager. Этот заголовок может быть добавлен как для отдельного сайта, расположенного на сервере (site-wide), так и для всех сайтов (server-wide). Для этого следует выполнить следующие шаги:
- Выполнить команду Start | Administrative Tools | Internet Information Services (IIS) Manager.
- Раскрыть вкладку Connections и выбрать сайт, для которого будет добавлен дополнительный HTTP-заголовок.
- В панели утилит выбрать иконку HTTP Response Headers и дважды щелкнуть по ней мышью.
- В панели Actions выбрать команду Add.
- В панели Add Custom HTTP Response Header добавить в поле Name значение X0UA0Compatible, а в поле Value — значение IE=EmulateIE7.
- Щелкнуть кнопку Ok для сохранения изменений.
Аналогичные действия можно выполнить и из утилиты командной строки. Для этого в каталоге %systemroot%\system32\inetsrv следует выполнить следующую команду:
appcmd.exe set config –section:system.webServer/httpProtocol
/+”customHeaders.[name=’X_UA_Compatible’,
value=’IE=EmulateIE7’]” /commit:apphost
Также можно сконфигурировать веб-сервер, изменив содержимое конфигурационного файла Web.config или applicationhost.config следующим образом:
<?xml version="1.0" encoding="utf#8"?>
<configuration>
<system.webServer>
<httpProtocol>
<customHeaders>
<clear />
<add name="X_UA_Compatible" value="IE=EmulateIE7" />
</customHeaders>
</httpProtocol>
</system.webServer>
</configuration>
После этого поместите измененный конфигурационный файл Web.config в корневой каталог вашего веб-сайта. Отметим, что при использовании решения на серверной стороне не нужно включать META-тэг в HTML-код страниц — он будет вставляться автоматически.
3.3. Обоснование выбора программного обеспечения для создания Web-ресурса
3.3.1. Обоснование выбора программных продуктов для создания графики
Одним из наиболее распространенных типов программ для работ с графикой являются графические редакторы. Графический редактор – компьютерная программа позволяющая ее пользователю создавать и редактировать изображения на экране компьютера и сохранять их во многих популярных форматах, например JPEG, PNG, GIF, TIFF.Некоторые графические редакторы специализируются на редактировании фотореалистических изображений, в то время как другие более «заточены» на создание и редактирование рисунков.
AdobePhotoshop– графический редактор, разработанный и распространяемый фирмой AdobeSystems.Этот продукт является лидером рынка в области коммерческих средств редактирования растровых изображений, и наиболее известным продуктом фирмы Adobe. Часто эту программу называют просто Photoshop (Фотошоп).
Программное обеспечение AdobePhotoshop меняет стандарты обработки цифровых изображений, предлагая мощные инструменты для работы с фотографиями и обеспечивая передовые возможности комплексного выбора изображений, реалистического рисования и интеллектуального ретуширования. Фотошоп применяют для создания фотореалистических изображений, работы с цветными сканированными изображениями, ретуширования, цветокоррекции, коллажирования, трансформации графики, цветоделения и т.д.
AdobeIllustrator – мощный профессиональный графический пакет для быстрого создания и редактирования векторной графики.AdobeIllustrator является незаменимым инструментом для творческих работников,web-дизайнеров, видеомонтажеров и других специалистов по компьютерной графике, которым приходится воплощать свои идеи в виде печатной продукции или публиковать изображения на web-страницах.
Возможности программы AdobeIllustrator: трехмерные спецэффекты; искажение и деформация изображения; спецэффекты в режиме реального времени; эффект прозрачности; эффект Scribble (векторные обьекты будут выглядеть как наброски, нарисованные от руки); инструменты рисования, соответствующие отраслевым стандартам; стили символов и параграфов; пользовательский интерфейс в стандартном стиле Adobe; средства создания файлов Adobe PDF; интеграция с другими приложениями; повышенная производительность; расширенные возможности печати; улучшенные средства работы с текстом; поддержка слоев Adobe PDF; тесная интеграция с продуктами Microsoft Office; создание собственных шаблонов.
Photo! Editor – бесплатный редактор графических файлов. Инструменты в Photo! Editor могут работать как в автоматическом режиме, так и ручном.
Photo! Editor позволяет сменить формат фотографии — поддерживаются такие распространенные форматы, как.jpeg,. Bmp,. Png,. Gif и.tiff.
Некоторые возможности Photo! Editor: удаление эффекта красных глаз (автоматически и в ручном режиме); цветокоррекция для настройки цветового баланса, контраста, яркости и насыщенности; удаление световых и цветовых шумов на фотографии, сделанной при плохом освещении; новейшая технология настройки резкости изображения (даже для очень расплывчатой фотографий); набор инструментов деформации изображения для создания карикатур; полный набор инструментов для ретуширования портретных изображений; баланс освещения — для создания художественных световых эффектов и 3D рельефа; инструмент для выравнивания изображения; пакетная обработка изображений
Для создания графики был выбран Photoshop, так как она наиболее функциональная и распространенная.
3.3.2. Обоснование выбора программных продуктов для создания анимации
Рассмотрим программные продукты для создания анимации.
Программа Easy GIF Animator предназначена для создания анимированных изображений формата GIF, дополняя их при этом разного рода спецэффектами.
Easy GIF Animator имеет много настроек, при помощи которых можно изменять практически все характеристики GIF-файла. В том числе цветовую гамму ролика и его продолжительность. Кроме того, программа позволяет добавлять тексты непосредственно на изображение, осуществлять предварительный просмотр проекта в браузере и преобразовывать GIF-анимацию в AVI-файлы. Также можно добавлять в создаваемую анимацию звуковое сопровождение и сохранять результат в формате SWF
AdobeFlash CS5 Professional – это одна из самых мощных и популярных программ, которая предназначена для профессиональной разработки интерактивных флэш-роликов или интерактивного содержимого веб-страничек, а также для создания видео-флешроликов.
Приложение AdobeFlash CS5 Professional имеет в своем арсенале широкие функциональные возможности, позволяющие легко и просто создавать интерактивные проекты под разные платформы, в результате чего у вас не будет проблем с демонстрацией своих творений перед любой публикой.
AnimeStudio - программа для создания двумерной анимации. AnimeStudio включает в себя набор мощных инструментов по созданию векторной графики, работе с растровыми изображениями. Имеется встроенный мастер создания персонажей, есть обучающий режим, поддерживается трассировка растровых картинок. Программа позволяет импортировать в проект звуковые файлы или записать собственные, синхронизировав речь персонажа с воспроизводимым звуком. Библиотека программы включает в себя множество готовых сцен, персонажей, аудио- и видеоклипов, кистей для рисования и т.д. Использование встроенной системы "костей" позволяет с лёгкостью анимировать движения частей тела персонажа. Есть возможность публикации проекта на YouTube и Facebook. Созданные мультяшки можно экспортировать в форматы MOV, AVI и SWF.
Active GIF Creator - это программа для создания анимированных изображений в графическом формате GIF.
С помощью программы Active GIF Creator вы сможете создавать превосходные анимации для веб-страничек. Кроме того, используя картинки или графику, созданную в любой программе редактирования изображений, например, такой как WindowsPaint, AdobePhotoshop и дюжине других подобных программ можно легко и быстро создавать даже фильмы.
Active GIF Creator является очень полезной утилитой для создания анимированных изображений в формате GIF.
На сайте будет использована анимация на странице «Контакты», там есть карта сайта. Для этого была выбрана программа AdobeFlash CS5 Professional.