Структура сайта, Mockup главной страницы, Разработка дизайна web-страниц, Создание навигационной панели - Разработка интерактивного Web-сайта "Медицинский центр"

Структура сайта в виде блок-схемы (Рисунок 1)

Рисунок 1 - Структура сайта в виде блок-схемы

Mockup главной страницы

Макет сайта (Рисунок 2) был выполнен в графическом редакторе Adobe Photoshop CC 2015.

Рисунок 2 - Mockup главной страницы

Разработка дизайна web-страниц

Дизайн выполнен в стиле горизонтального центрирования. Меню представлено двухслойной навигационной панелью. Логотип включает в себя название сайта. Расположение логотипа общепринятое - слева. Цветовая гамма минималистична - кроме белого использован только один основной цвет - темно-оранжевый. Выбор основного цвета обусловлен позитивным воздействием оранжевого и уместность приглушенного оттенка данного цвета. Для лучшего восприятия контент страниц разделен полосами.

Способ верстки - блочная с использованием CSS.

Дизайн страницы сайта выглядит в соответствии с Рисунок 3,Рисунок 4, Рисунок 5

Рисунок 3 - Дизайн страницы контактов

Рисунок 4 - Дизайн заполненной корзины

Рисунок 5 - Дизайн формы регистрации

Создание навигационной панели

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

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

Также на навигационной панели находится логотип, который является ссылкой на главную страницу.

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

Для разметки был использован элемент список.

Вид навигационной панели представлен на рисунке Рисунок 6

Рисунок 6 - Вид навигационной панели

Похожие статьи

• Постановка задачи - Разработка интерактивного Web-сайта "Медицинский центр"

  Выполнить создание связных интерактивных web-страниц (главная, каталог, корзина, анкета, контакты) сайта медицинского центра с помощью языка разметки...

• Описание проекта, Конструкторская часть - Разработка сайта рекламного агентства "ART"

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

• ПРАКТИЧЕСКАЯ ЧАСТЬ, Разработка структуры сайта, Разработка компонентов сайта, ЭКОНОМИЧЕСКАЯ ЧАСТЬ - Разработка сайта для компании

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

• Технологическая часть, Разработка графической части, Навигационное меню сайта, Добавление контента - Разработка сайта рекламного агентства "ART"

  Разработка графической части На данном этапе создания веб-сайта для рекламного агентства "ART", был разработан дизайн подобающе данной тематике. Стиль...

• Сервисы сайта - Создание сайта

  Сервисы сайта направлены на облегчение использования сервисов компании. Так, например, онлайн-консультация позволяет пользователю быстро получить ответ...

• Оформление и заполнение - Разработка Web-сайта предприятия (ООО "Полтава")

  Для начала, дадим название нашему сайту. Для этого воспользуемся "Конструктором" для управления дизайном сайта. Для перехода в режим конструктора зайдем...

• ТЕХНИЧЕСКОЕ ЗАДАНИЕ НА РАЗРАБОТКУ ВЕБ-САЙТА, Термины, используемые в техническом задании, Структура и название сайта, Группы пользователей, Дизайн сайта, Система навигации по сайту - Проектирование и разработка веб-представительства фирмы по продаже спортивных товаров и футбольной атрибутики

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

• Описание процесса создания сайта, Руководство пользователя - Разработка сайта для сельскохозяйственного предприятия

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

• Работа в Панели управления - Разработка Web-сайта предприятия (ООО "Полтава")

  Откроется страница с мастером настройки конфигурации сайта (рис. 5). В панели управления мы вводим название садика, выбираем язык Русский, так же...

• Веб-дизайн, создание интерфейса, Шаблоны сайта Bootstrap3, Адаптация страниц под все виды мониторов (включая мобильную версию) и браузеры - Компьютерная лингвистика в образовательной среде

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

• Существующее программное обеспечение для создания сайта, Adobe Dreamweaver - Разработка интернет-магазина компьютерной техники

  Adobe Dreamweaver Adobe Dreamweaver - это HTML-редактор от компании Adobe, который на сегодняшний день очень известный. Первая его версия была выпущена в...

• Разработка ЭУП "Современные средства ЭОМ", Структура ЭУП - Современные средства создания электронного обучающего материала

  Структура ЭУП Пособие содержит две главы, каждая из которых разбита на параграфы. Первая глава рассматривает теоретический материал. Вторая глава...

• РАЗРАБОТКА САЙТА ДЛЯ ОРГАНИЗАЦИИ, ОСУЩЕСТВЛЯЮЩАЯ СВОЮ ДЕЯТЕЛЬНОСТЬ В СФЕРЕ СЕЛЬСКОГО ХОЗЯЙСТВА, Разработка структуры сайта - Разработка сайта для сельскохозяйственного предприятия

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

• Основные этапы разработки сайта - Разработка Web-сайта предприятия (ООО "Полтава")

  При разработки сайта, выделены следующие этапы: - определение целей сайта; - создание структуры сайта; - создание дизайна сайта; - сбор и...

• Выводы и рекомендации к сайту - Создание сайта

  Хотя полного аналога проекта компании "Музыкальная компания BOOM", найти на белорусском рынке не удалось, все же были выведены общие критерии, актуальные...

• Главная страница, Версия для слабовидящих, Левое меню, Меню отзывов - Официальный сайт федеральной службы исполнения наказаний

  Сайт меню навигационный Режим доступа для сайта "Федеральная служба исполнения наказаний". Ссылка: http://www. fsin. su/ оглавление. Вверху сайта, на...

• Описание операций, выполняемых информационно-справочной системой - Разработка информационно-справочной системы "Аптека"

  Пользовательский интерфейс информационно-справочной системы реализован следующим образом: 1. Главное окно приложения содержит главное меню и кнопки...

• Разработка сайта, Среда разработки web-сайта - Разработка сайта для компании

  Среда разработки web-сайта При разработке web-сайта используются: - HTML - язык разметки web-страниц; - CSS - формальный язык описания внешнего...

• Характеристики объекта автоматизации, Требования к системе, Требования к системе в целом, Требования к структуре и функционированию системы, Показатели назначения, Требования к функциям системы, Требования к видам обеспечения, Состав и содержание работ по созданию системы, Порядок контроля и приемки системы, Требования к документированию - Реинжиниринг сайта структурного подразделения образовательного учреждения на примере кафедры системного анализа НИЯУ МИФИ

  Объектом автоматизации сайта "вопрос-ответ" является предметная область "Проектирование информационных систем". Основное назначение сайта "вопрос-ответ"...

• Диаграмма Гантта, Анализ структуры затрат проекта - Разработка алгоритма генерации для создания базы данных искусственных биометрических образов

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

• GSMUcoz как средство создания интернет ресурсов. Основные возможности системы - Разработка Web-сайта предприятия (ООО "Полтава")

  Ucoz -- бесплатная система управления сайтом и хостинг для сайтов, созданных с ее использованием. Модули Ucoz могут использоваться как в единой связке...

• Создание и ввод в эксплуатацию сайта, как платформы для веб-приложения, Проектирование и разработка сайта, Средства разработки, Язык гипертекстовой разметки HTML - Компьютерная лингвистика в образовательной среде

  Проектирование и разработка сайта Средства разработки Язык гипертекстовой разметки HTML В Интернете сосредотачивается и передается достаточно большое...

• Этапы создания сайта - Разработка интернет-магазина компьютерной техники

  Разработка сайта - процесс трудоемкий, в котором обычно участвуют несколько специалистов. Чтобы проект был успешным, необходимо как минимум определить:...

• Общие требования к сайтам - Разработка Web-сайта предприятия (ООО "Полтава")

  Этапы и требования к созданию сайта: 1. Определить цели и задачи сайта. Составить список ключевых запросов для продвижения и всесторонне его оценить. Без...

• Инвестиционная привлекательность рынка - Создание сайта

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

• Начало создания веб-узла., Создание фона страницы, Создание и форматирование таблиц., Установка невидимых границ таблицы, Создание гиперссылок - Создание электронного учебника (по HTML) в редакторе Microsoft Front Page

  Для создания нового сайта используем пункт меню "ФайлСоздатьСтраница или веб-узел". При этом появляется окно для выбора типа сайта (см. рис.). Кроме...

• Структура сайта - Компьютерная лингвистика в образовательной среде

  Структура сайта разработана в соответствии с основными требованиями к веб-приложению. (Рис.3) Содержит в себе 3 основные страницы (одна из которых...

• Операционный план - Разработка сайта для сельскохозяйственного предприятия

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

• Основные понятия в системе Ucoz - Разработка Web-сайта предприятия (ООО "Полтава")

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

• CSS - Разработка сайта рекламного агентства "ART"

  CSS (Cascading Style Sheets) - это еще один язык программирования, называемый еще формальным языком, который применяется для описания внешнего вида...

• Задание 3. Создание Web-страниц в PowerPoint - PowerPoint и презентация

  Программа PowerPoint, входящая в состав Microsoft Office, позволяет на профессиональном уровне подготовить слайды для проведения презентаций. Благодаря...

• Основная терминология сайта - Разработка интернет-магазина компьютерной техники

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

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

  Во введении актуализируется необходимость создания вашего электронного средства обучения (педагогический подход, используемая методика). Автор дает...

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

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

• Структура и интерфейс программы - Исследование алгоритмов

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

• Этапы создания слайдов - Работа в Power Point

  1. Открываем программу Power Point из меню Пуск (см. Рисунок 1.). Рисунок 1. Меню Пуск презентация рower рoint программа 2. На экран монитора выводится...

• Создание электронного учебника в редакторе Microsoft FrontPage, Знакомство с Microsoft FrontPage - редактором web-сайтов. - Создание электронного учебника (по HTML) в редакторе Microsoft Front Page

  Знакомство с Microsoft FrontPage - редактором web-сайтов. Работа в редакторе должна начинаться с создания нового или открытия уже существующего сайта....

• Онлайн-конструкторы - Разработка интернет-магазина компьютерной техники

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

• Обновление и техническое сопровождение информационной системы ГОСТ 24.208-80, Формирование внутренней документации по результатам выполнения работ - Функциональная структура информационных систем

  Для обновления сайта от Филиала предоставляется новая информация, фото и медиа файлы, которые нужно заменить на какой-либо из страниц. Замена...

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

  Задания: 1. Найти не менее 5 сайтов по тематике, определенной в индивидуальном задании. 2. Оценить каждый сайт по следующим параметрам: - количественный...

Структура сайта, Mockup главной страницы, Разработка дизайна web-страниц, Создание навигационной панели - Разработка интерактивного Web-сайта "Медицинский центр"

Предыдущая | Следующая