реклама
Бургер менюБургер меню

Ирина Никулина – Настольная книга веб-дизайнера. Практический курс по веб-дизайну и проектированию сайтов (страница 15)

18

Рис.38. Техническое задание: Система навигации (карта сайта)

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

Рис. 39. Подписи сторон на ТЗ

Техническое задание, не имеющее подписи и печати, не может быть признано юридическим документом.

4. Ошибки техзадания

В этом разделе рассмотрим типичные ошибки, совершаемые при заполнении ТЗ сайта. Эти ошибки приводят к задержке сроков, удорожанию стоимости проекта, к созданию сайта, несоответствующего ожиданиям заказчика.

Ошибки ТЗ:

1. Не указан тип (вид) сайта. Вместо блога разработчик сделает вам лэндинг-продажник, если чётко не прописать, что это за сайт.

2. Не указаны цели сайта, не описаны целевые действия. Если не спроектировать сайт с определенными целями, потом будет сложно ожидать точной аналитики и определённой конверсии сайта.

3. Нет примеров сайтов, которые понравились заказчику. Веб-дизайнер выбрал такие примеры по своему усмотрению, и они не соответствуют ожиданиям клиента.

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

5. Не указаны счётчики посетителей и семантическая разметка на сайте (помогает поисковым системам проиндексировать сайт).

6. Не предоставлена структура сайта, не описан функционал и модули на первой странице.

7. Не обозначены этапы разработки сайта с конкретными сроками окончания работ и оплаты.

8. Неконкретное описание дизайна и функционала сайта. Ошибкой будет вместо конкретики использовать такие термины, как: красивый, стильный сайт. Лучше написать так: «сделать красный баннер, как на сайте таком-то, статьи оформить, как на сайте таком-то» и т.д.

9. Нет подписей на документе.

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

Ссылка на примеры техзаданий, скачать можно бесплатно:

https://drive.google.com/drive/folders/1P-S9HAToNUSTMl7rPmqtS8DOpfzn0f9y?usp=sharing

Глава 6. Анализ темы и направления сайта

В этой главе:

1. Знакомство с темой

2. Анализ конкурентов

3. Создание базы образцов

4. Подбор ключевых слов (сбор семантического ядра)

5. Авторское право на веб-дизайн

1. Знакомство с темой

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

Например, мне как-то позвонил клиент и сказал, что хочет продавать «гибкие» окна. Чтобы понимать, о чём идет речь, я нашла в поиске определение того, что такое гибкие окна ПВХ и для чего они нужны. После этого я прочитала несколько познавательных статей на эту тему. И только после того, как я получила хотя бы поверхностное понимание того, что такое окна ПВХ, где применяются и для чего нужны, я смогла поговорить с клиентом и заполнить для него техзадание.

На самом деле есть много тем, которые могут быть для веб-дизайнера непонятными и это нормально. Еще пример: цифровой инжиниринг. Надо вникать в то, что это за направление работы. Или: VR-картинг, продажа компактных водородных аккумуляторов, LPG-массаж и т.д. Для некоторых дизайнеров даже такие виды деятельности, как ремонт двигателей тракторов или ландшафтный дизайн могут оказаться малознакомой сферой бизнеса. Поэтому изучение темы сайта – это первый шаг.

Изучение темы по шагам:

1. Найдите определение в сети Интернет.

2. Прочитайте статьи на форумах и в соцсетях.

3. Просмотрите сайты, посвящённые этому бизнесу.

4. Найдите знакомых, чьи профессии близки к теме и пообщайтесь с ними.

5. Прочитайте специальные издания: журналы или газеты.

Рис.40. Знакомство с темой сайта, поиск определения

2. Анализ конкурентов

Вторым этапом будет анализ сайтов-конкурентов. Сделать офлайн анализ фирм конкурентов не нужно, достаточно посмотреть на сайты, которые попали в топ выдачи поисковой системы (Яндекс) по основному ключевому слову.

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

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

Выберите десять-пятнадцать сайтов конкурентов, и список ссылок на эти сайты отправьте своему заказчику. Пусть он посмотрит цены, предложения, фотографии товаров, как подана информация, какие модули есть на сайтах конкурентов. Попросите отобрать 3-5 сайтов, которые больше всего понравились вашему клиенту и переслать вам ссылки обратно. Это поможет лучше понять вкус заказчика и стиль, который ему нравится в веб-дизайне.

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

Ещё бывает так, что клиент присылает вам список понравившихся сайтов, а вы видите, что эти сайты имеют устаревший дизайн или явные ошибки вёрстки, или не являются продающими. Тогда надо предложить клиенту свой список сайтов, мягко сославшись на то, что эти конкуренты более «продвинутые», успешные, и их сайты более современные, чем те, что предложил заказчик.

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

Запомните: ваш сайт должен быть не такой же, как у конкурентов, а в несколько раз лучше, иначе он не будет конкурентоспособным!

3. Создание базы образцов

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

Делается это так:

1. Сохраните файл со ссылками на удачные (в целом) сайты.

2. Сохраните скриншоты понравившихся модулей сайтов по теме клиента. Например, на одном сайте вы нашли симпатичный каталог товаров, на другом сайте вам понравился модуль «О компании», на третьем – иконки в модуле «Преимущества». Все это нужно сохранить. Скриншоты могут быть сохранены в растровом редакторе отдельными файлами или в документе MS Word.

3. Сохраните дизайны сайтов по теме. Найти их можно в картинках Яндекса, набрав в поиске запрос «Дизайн сайта … (дальше пишите свою тему, например, «аренда спецтехники» или «агрофирма»).

Посмотрите на рис. 41, так выглядит папка с образцами сайтов, только обычно их бывает больше, несколько десятков.

Рис.41. Банк образцов понравившихся сайтов по теме

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

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

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

4. Подбор ключевых слов (сбор семантического ядра)

Маленький Вова учился на двойки.

Школы он сайт продвигал за пятёрки.

В школу теперь не пускают упорно:

Школа есть в топе по слову лишь "порно"

Стихи из сети Интернет

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

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