Translate

понедельник, 29 декабря 2014 г.

8 СОВЕТОВ ЗАКАЗЧИКУ ПРИ СОЗДАНИИ САЙТА


ОПУБЛИКОВАНО: OXANA D. • 28.02.2013 • 12:00 • ЗАКАЗЧИКАМ • ДИЗАЙНЕРАМ • ПРОСМОТРОВ: 12433
Мы понимаем, что наши клиенты — люди занятые, и не могут знать всех тонкостей работы с креативщиком. Поэтому мы даем несколько советов, которые помогут правильно скоординировать дизайнера. Предостерегая вас от самых частых ошибок, мы укажем, на что нужно обращать внимание.

1. Определите основную задачу сайта
Создавая бриф, постарайтесь определить 1-3 основные задачи вашего будущего сайта. Ведь дизайн — это не просто декорирование, это решение проблем бренда.
Например, если вы создаете страничку, чтобы рассказать, чем занимается ваша компания, то хорошим решением будет наглядно и ёмко перечислить предоставляемые услуги или отличительные характеристики на главной странице (от 1 до 9).
main_vers2_2 copy
Если вы хотите побудить посетителей к каким либо действиям, например, связаться с вами — сделайте кнопку с призывом в верхней части сайта, и гостю никуда не деться! 
Если ваша услуга абсолютно уникальная и новая — одноминутное видео в шапке сайта будет отличным способом ёмко рассказать о себе. 
2. Учитывайте сетку
Все элементы сайта придерживаются условных колонок. Если вы разрабатываете сайт впервые, мы советуем вам указать в брифе ширину сайта в 960 пикс, то есть все функциональные элементы должны быть в рамках заданной ширины. Такой формат убережет вас от сюрпризов: он будет хорошо смотреться на разных мониторах и планшетах.
 grid
Сетка используется не только по техническим соображением, то также чтобы структурировать информацию и упросить ее для восприятия. Колонки побудят дизайнера к тому, чтобы все элементы были распределены и выровнены пиксель к пикселю. Скажите ему, что шаблоны для работы можно скачать тут, ему будет очень непривычно и приятно получить от вас такую поддержку!
3. Рисуйте схемы
Создавая грамотное тех. задание для дизайнера, мы настоятельно рекомендуем набросать план вашей домашней страницы. Да, это займет некоторое время, возможно, заставит вас поискать аналоги в интернете. Но в итоге, это сэкономит самое ценное — время, которое потом уйдет на ожидание поправок! Схема поможет дизайнеру в работе, и позволит больше сконцентироваться на проработке деталей. 
scetch
Набросать чертеж можно как угодно, приветсвуются даже наброски на бумаге карандашем. Специально разлинованные листы для такого мозгового штурма можно скачать тут, хотя подойдет даже тетрадь в клетку! Учитывайте выравнивание по колонкам. Укажите, как вы видите расположенние следующих элементов:
  • логотип
  • меню (перечислите все закладки)
  • слайдер/баннер с описанием услуги, акции, товара или ознакомительное видео
  • призыв к действию
  • перечисление услуг или категорий товаров
  • форма обратной связи
  • отзывы
  • строка поиска
  • другие блоки (товары, новости, популярное, реклама и т.п.)
  • футер (нижний блок с дополнительными ссылками. Например, контактами)
Ваша схема ляжет в основу будущего сайта, а если вы хотите побудить дизайнера к свежим решениям — так и напишите ему об этом: «Конструктивные мысли и новые идеи всегда готов(а) взять на рассмотрение!»
4. Требуйте послойный исходник
Просите дизайнеров предоставлять на выходе «послойный исходник .psd».
Большинство дизайнов создаются в программе «Фотошоп», где есть уникальная возможность создавать каждый элемент в отдельном слое, словно на кальке. Это очень удобно для программистов: им не нужно тратить время на вырезание отдельных нюансов. 
Требуйте, чтобы все слои были разложены по папочкам, и все слои имели названия. 
layers
5. Просите использовать системные шрифты
Если вы создаете сайт впервые, попросите дизайнера использовать системные шрифты, такие как Arial и Georgia и т.п. Это избавит вас от проблем с отображением текста в разных браузерах и на разных операционных системах. Существуют также веб-шрифты, но большинство из них либо не поддерживают кириллицу, либо стоят денег. Снимок экрана 2013-02-28 в 14.31.45  
1 Georgia и Trebuchet MS поставляются с Windows 2000/XP и включены в сборку шрифтов для IE (и в некоторые другие инсталляции приложений разработанных компанией Microsoft)
2 Символические шрифты корректно отображаются только в Internet Explorer, в других браузерах используются подстановки (хотя шрифт Symbol работает в Opera, а шрифт Webdings работает в Safari).
3Шрифт Book Antiqua практически идентичен Palatino и Palatino Linotype которые включены в Windows 2000/XP, шрифт Book Antiqua использовался в Windows 98.
4Это не TrueType а битовые шрифты, именно поэтому при увеличении размера размера шрифта качество его отображение будет падать (стандартные размер таких шрифтов: 8, 10, 12, 14, 18 и 24 точки, разрешение - 96 точек на дюйм).
5Шрифты работают в Safari, но только при использовании стиля отображения normal. Comic Sans MS может отображаться как bold (жирный), но не как italic. Другие Mac браузеры будут эмулировать стили отображения.
6Шрифты присутствуют только в Mac OS X.

6. Предусматривайте эффекты при наведении
Интернет — явление интерактивное. При наведении ссылки подчеркиваются, меняют цвет, кнопки «нажимаются», а незаполненные поля отображают ошибку. Программисты не могут прочитать мысли дизайнера, и предугадать, как все элементы реагируют при наведении мыши, а дизайнеры, порой, забывают указать задуманные эффекты. Поэтому просите его подготовить отдельный документ со всеми видами ссылок, кнопок и прочих интерактивных деталей, где наглядно показано, как они преобразуются при наведении мыши и при нажатии.
Light-UI-Kit-preview-2
7. Наглядно указывайте поправки
«Кнопку налево, текст ниже», — такого рода письма поставят в ступор любого дизайнера, особенно, когда непонятно, о каком тексте идет речь и что вы подразумеваете под кнопкой. Поскольку креативщики — люди образного склада мышления, во избежание недопонимания наглядно показывайте, где нужно внести изменения. Так будет и вам нагляднее, и дизайнеру проще.
Вносить комментарии удобно в Adobe Acrobat, импортируя .jpg и пользуясь функцией комментирования (cmd+6).
Мы также вам советуем попробовать бесплатную программу Scitch, где в увлекательной форме можно отмечать области, скрывать их, рисовать стрелки и писать комментарии.
Снимок экрана 2013-02-28 в 14.01.57

 scitch
8. Мотивируйте для дальнейшего сотрудничества
Иногда, глазу даже самого опытного веб-верстальщика незаметны межстрочные расстояния, кегли шрифтов и прочие нюансы. Мы советуем вам предоставить дизайнеру проверить работу программиста и внести свои правки. Поэтому, получая макеты, учитывайте, что помощь дизайнера вам будет еще небесполезна.
Выстраивайте изначально свои отношения таким образом, чтобы и креативщику было интересно с вами продолжать сотрудничество. В процессе работы оговорите возможность его роли наблюдателя за рабочим процессом программиста, ведь дизайнер в первую очередь не хочет, чтобы результат его креатива был искажен или неправильно отображен.
Правда, нужно учитывать, что сотрудничество вне площадки GoDesigner предусматривает экстра-вознаграждения, но небольшие затраты помогут отточить дизайн и создать абсолютно качественный продукт.
http://www.godesigner.ru/posts/view/80

Комментариев нет:

Отправить комментарий