Создание, раскрутка и поддержка сайтов
Разработка, дизайн и продвижение сайта: “Petrovich Group”


Если вы видите эту надпись - скачайте новую версию ( IE )



Создание сайтов arrow Статьи - Заказчикам arrow Требования к дизайну при создании сайта
Требования к дизайну при создании сайта

Стандартные требования к Дизайнеру при проведении им работ по разработке дизайна сайта

Данный документ должен учитываться дизайнером при работе над дизайном сайта. Приём работ происходит примерно по этому списку требований.

Предполагается, что работа над дизайном ведётся на основании как минимум Бриф, ТЗ на разработку и создание сайта, предоставленной нашей студией.

Все требования обязательны за исключением пунктов ( подпунктов 5, 6, 7, пункта 2;   и  подпункта 4 в третьем пункте), которые носят рекомендательный характер. Также, приоритетом перед этим документом обладают ТЗ на сайт. ( Здесь и далее под  ТЗ понмают  — техническое задание на создание сайта сайта )

  1. Общие требования к макету дизайна сайта

    1. Дизайн сайта передаётся на вёрстку шаблонов страниц в виде файла формата PSD и файла формата JPEG с минимальным сжатием.

    2. Все элементы дизайна сайта должны быть предоставлены в PSD-файле на отдельных понятно названных по-русски слоях, логически объединённых в понятно названные по-русски группы. Например: слои «Форма поиска» и «Кнопка поиска» объединены в группу «Поиск», которая вместе со слоями «Логотип» и «Слоган» объединена в группу «Шапка».

    3. Макеты дизайна главной и внутренних страниц сайта, если они отличаются друг от друга, предоставляются в одном PSD-файле, размещённые в отдельных понятно названных по-русски группах. Так же должны быть предоставлены варианты страниц, отличающихся друг от друга наличием и расположением элементов — блоков, колонок и пр.

    4. Все «невидимые» (отключенные) слои в PSD-файле верстальщиком игнорируются.

    5. В PSD-файле все нестандартные для программы “Adobe Photoshop” стили или фильтры должны быть «сведены» в отдельные обычные слои.

    6. Ширина макета дизайна не должна быть больше заявленной минимальной ширины страниц сайта.

  2. Требования к дизайну элементов страниц сайта

    1. В макете дизайна должны быть представлены все элементы, указанные в ТЗ — навигаторы, формы, текстовые области, тематические картинки, пиктограммы и пр. В том числе стоит обратить внимание на следующее:

      • Дополнительная навигация. Ссылки на некоторые служебные страницы, не входящие, как правило, в основную карту сайта. Например: «Личный кабинет, RSS, Прайс, Карта сайта, Контакты, Написать письмо»). Могут быть в виде пиктограмм. Из них рекомендуется предусмотреть по крайней мере «Личный кабинет», «RSS», «Карту сайта» и «Написать письмо», поскольку соответствующие страницы при всей своей важности, как правило, труднодоступны из основной навигации по сайту.

      • Путь по сайту (Главная страница ? Продукция ? Люстры). Нужно учитывать, что он может быть довольно длинным.

      • «Подвал» с контактной и правовой информацией, кнопкой техподдержки студии, местом для счётчиков и т.п.

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

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

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

    5. Высоту шапки для внутренних страниц информационного сайта желательно делать не более 300 пикселей.

    6. Все тексты на сайте обязаны хорошо читаться и на плохо настроенном мониторе. Рекомендация по шрифтам для обычного текста — “Verdana”, 11-13 пикселей.

    7. Если это не указано в ТЗ на дизайн сайта явно, для информационных сайтов предпочтительно использовать тёмный шрифт на светлом фоне. Для сайтов, больше ориентированных на дизайн, чем на информационное наполнение, допустимо использование светлого шрифта на тёмном фоне.

    8. Для всех текстов на сайте, кроме тех, что будут представлены в виде графики, рекомендуется использовать только стандартные шрифты. В случае взаимного согласия заказчика и разработчика дизайна сайта, допускается использование нестандартных шрифтов, но подгрузка шрифтов на машину посетителя сайта производиться не будет. Кроме того, в случае использования нестандартных шрифтов и вёрстки шаблонов страниц студией “Scrofa Tridens” эти шрифты должны быть переданы вместе с макетом дизайна сайта.

    9. Текст, который должен быть представлен на сайте в виде графики, в макете дизайна должен быть переведён в растр. Текст, который должен быть представлен на сайте в виде текста, должен быть оставлен в макете дизайна текстом.

    10. В макете дизайна необходимо обозначить внешний вид всех типов ссылок:

      • Обычная ссылка
      • Активная ссылка
      • Ссылка посещённой страницы
      • Ссылка при наведении курсора мыши
      • Ссылка в фокусе
    11. Внешний вид всех типов ссылок должен отличаться от внешнего вида всех других элементов сайта (заголовков, текста, выделенного полужирным, и пр.) цветом и (или) подчёркиванием.

    12. Назначение пиктограмм («иконок») должно быть интуитивно понятно посетителю сайта.

    13. В основном навигационном меню используются исключительно текстовые ссылки. При необходимости дополнительно можно использовать тематические картинки к разделам с жёстко прописанными адресами этих страниц. Так же, исключительно текстом, должны быть представлены все заголовки всех уровней. Желательно так же — название сайта, слоган, контактная информация и т.д. В идеале — весь текст должен быть текстом, а не графикой.

    14. Меню основной навигации стоит располагать в верхней и нижней части страницы, если в ТЗ не оговорено другое.

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

  3. Замечания по компоновке страниц сайта

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

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

      • Каждый шабон страницы (тип страницы) содержит несколько областей отображения контента. Как правило, их три (но теоретически может быть неограниченно много) — левая с навигацией и второстепенными информационными блоками, центральная с основным наполнением и правая с различными информационными врезками, например, комментариями по основному наполнению, лентой новостей и пр. Часто правую область(-ти) имеет смысл сделать в виде обтекаемого(-ых) основным текстом блока(-ов) вместо реализации полной колонкой.

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

      • Каждый из функциональных блоков содержит в себе несколько объектов своих функций. Например, блок с лентой новостей содержит несколько новостей с датой, названием-ссылкой и анонсом, блок с текстом может содержать несколько разных объектов текста (хоть это и не столь очевидно внешне), блок с фотоальбомом содержит в себе несколько фотографий с названиями, описанием и пр.

    2. Для страниц сайта с требовательным к ширине страницы контентом (таблица товаров и т.п.) следует предусмотреть отсутствие правой(-ых) колонки ( области итображения информации).

    3. Создавая узкие области отображения, важно помнить, что бывают длинные слова или слишком широкие баннеры и таблицы, которые будут не укладываться в отведённое для них место.

    4. Функциональный блок желательно визуально выделять в дизайне сайта для лучшего восприятия информации — фоном, рамкой или какими-либо графическими элементами (в основном это касается ФБ слева и справа).

    5. Функциональный блок, как правило, имеет заголовок, а многие объекты внуьтри блока — изображения (превьюшки). Нужно предусмотреть для них место.

    6. Создавая макет дизайна страницы, важно помнить, что никто не помешает заказчику ввести в любую позицию ( область отображения) и фунциональный блок произвольное количество информации. Т.е., высота (а часто и ширина) любого ОО и ФБ непредсказуемы. Дизайн это должен учитывать.

  4. Требования к оформлению контента

    В макете дизайна необходимо предусмотреть внешний вид всех элементов контента — заголовков разных уровней, абзацев, ссылок, списков, таблиц, всех элементов форм и пр.  Элементы контента нужно вывести ( представить) как:

    1. Текст со следующими элементами:

      • Заголовки всех, с первого по шестой, уровней
      • Параграфы
      • Таблица с заголовками
      • Картинка
      • Нумерованный и ненумерованный списки
    2. Новости с датой, заголовком, анонсом и картинкой:

      • Блок с последними новостями (боковая панель)
      • Основной блок с новостями в центральной области отображения
    3. Подробный просмотр новости (дата, заголовок, картинка, текст новости, автор, ссылка на источник)

    4. Форма ввода со следующими элементами:

      • Поле ввода
      • Флаг
      • Переключатель
      • Многострочное поле ввода
      • Выпадающий список
      • Обычная кнопка
    5. Фотоальбом с картинкой, названием, описанием, автором, ссылкой на источник и флагом «Проголосовать» в каждом из как минимум двух представленных объектов

    6. Голосование

    7. Гостевая книга

    8. Все остальные фунциональные блоки, указанные в ТЗ на сайт и имеющие индивидуальный дизайн ( Каталог, галерея, Интернет магазин, карта и т.д.)

  5. Предоставляемые, по окончании работ,  материалы

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

    1. PSD-файл макета дизайна и, для сверки, JPEG-файл макета дизайна.

    2. Исходники в векторном виде всех изначально векторных графических элементов (логотипы, 3D-модели, пиктограммы и пр.), использующихся в дизайне сайта.

    3. Сопроводительный текстовый документ, в котором должно быть чётко описано следующее:

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

      • В случае растягиваемого сайта — минимальная и максимальная ширина страниц сайта, а также алгоритмы и нюансы поведения всех элементов дизайна при изменении ширины страницы (размеров окна браузера): относительная (или абсолютная) ширина областей отображения, относительные позиции других элементов страницы и т.д. Иногда для удобства воприятия информации,и принципов движения фунциональных элементов сайта, делаются 2 варианта дизайна для узкого и широкого мониторов

      • Список всех использующихся в дизайне сайта шрифтов.

 

Advertisement

Позвонить бесплатно!

Бесплатный звонок с сайта!

( У вас на компьютере должен быть включен микрофон ).

Интересное!


  :: Как создать почту на кирилическом домене
  :: рассылки с бесплатных почтовых ящиков перестают работать
  :: Владивосток - новый алгоритм работы Яндекса
  :: Покупка AVITO Южно - Африканским холдингом
  :: Объем рекламного рынка уменьшился
  :: алгоритм Минусинск - больба со ссылками
  :: 21 апреля Google запустил алгоритм mobile-friendly
  :: Цветные домены .PINK, .BLUE, .RED и .BLACK
  :: Мобильные приложения обогнали Голливуд по доходам
  :: Сравнение CMS по потреблению ресурсов сервера
  :: О качестве работы хостинга firstvds.ru
  :: Открытое письмо Яндекса о накрутках
  :: О Государственной электронной почте
  :: Открыта регистрация доменов в зонах .diamonds, .exposed, .gift, .land, .limo, .pink, .red, .solar
  :: Крым собирает Интернетчиков
  :: 10 самых дорогих продаж доменов в июне 2014
  :: новые домены .vodka .sexy .photo и т.д.
  :: Технологии корпоративных почтовых сервисов
  :: Доменины 2014
  :: Восстановить удалённую информацию на сайте
  :: Увеличение посещаемости сайта как закономерный результат продвижения
  :: Пример раскрутки наших сайтов по слову объявления
  :: Пример продвижения сайта клиента
  :: Период приоритетной регистрации новых доменов
  :: А как вам Up Time сервера 68%?
  :: PayPal заработал в нашей Раше...
  :: Как настроить почтовую программу The BAT на вашем компьютере
  :: Первые результаты раскрутки нового клиента
  :: DevCon 2013 – ежегодная конференция по разработке и тестированию ПО
  :: Новые доменные зоны .САЙТ .ОНЛАЙН .РУС
  :: Отзыв о работе хостинга Siteko.ru
  :: домен .РУС появится в 2013 году
  :: Корпоративные сервисы ( почта ) теперь платные на Гугле
  :: компания Apple зарабатывает и на доменах
  :: доменная зона .РФ считается самой успешной среди национальных доменов верхнего уровня
  :: Сколько стоит раскрутка сайта?
  :: Задержки индексирования или эффект песочницы для новых сайтов
  :: Новые домены верхнего уровня .РУС и другие
  :: Требования к дизайну при создании сайта
  :: Электронные деньги
  :: Идентификация при регистрации доменных имён
  :: Продвижение cайта по трафику и продвижение по ключевым словам
  :: Прогнозы развития Информационных технологий
  :: Веб-интерфейс для доступа к почте через браузер (webmail)
  :: Переполнение почтового ящика
© 2006 - 2017. Создание сайтов во Владивостоке.Телефон: +7 423 2 930091, 2 412000.
Продвижение, раскрутка сайтов: “Petrovich Group” Владивосток.
продвижение сайтов