Маркетинг интернет сайта: основные этапы разработки сайта. Часть 2-ая

3. Кроссбраузерная и адаптивная вёрстка

После того, как дизайн готов и утверждён клиентом, он уходит в вёрстку!

маркетинг интернет сайта

Что такое вёрстка? Грубо говоря, вёрстка это программирование дизайна сайта (картинки) в html код, который распознаётся браузерами и уже является «условно» условно работающим сайтов – кнопочки нажимаются, ссылочки работают и пр.

Почему условно работающим? Потому что как правило для работы сайта – нужны более серьёзные интерактивные элементы сайта, чем просто отправка формы! Поэтому для полноценных сайтов: блогов, интернет-магазинов уже вёрстка «натягивается» на движок (прикручивается к движку). Об этом поговорим более подробно дальше.

Что важно учесть при вёрстке:

1. Самое банальное – это конечно же кросс-браузерность. В данный момент большинство пользователей интернета пользуются браузерами: Chrome, Safari, Firefox и пр. Многие браузеры имеют свои нюансы восприятия html кода и надо обязательно протестировать вашу вёрстку в следующих браузерах. Всё должно работать корректно, формы открываться, шрифты, таблицы и картинки оставаться на своих местах и корректно масштабироваться и пр.

Топ браузеров Рунета за февраль 2017

2. Самое важное в вёрстке, чтобы она была оптимизирована под мобильные устройства. Доля мобильных браузеров в общем трафике на сайтах недавно превысила 50% и значит что почти половина, а иногда и больше Ваших пользователей – изучают Ваш сайт с мобильного устройства и значит сайт должен корректно масштабироваться под маленький экран – должны увеличиваться шрифты и размеры кнопок и пр.

Такая вёрстка, которая адаптируется под размер экрана и называется адаптивной.

Кроме прочего корректное отображение сайта на мобильных экранах важно и поисковым системам. Более того, если Ваш сайт не оптимизирован под мобильные устройства – то он получит гораздо меньший вес в поисковых системах. И при прочих равных будет гораздо ниже своих конкурентов.

4. Настройка системы управления сайтами и программирование дополнительных модулей

Если у Вас не статический лендинг, то Вам, как правило, требуется регулярно вносить в сайт новую информацию, а также наверняка есть и динамические интерактивные элементы: корзины, калькуляторы, выборки по тегам и рубрикам и пр. Это возможно только, если контент на сайте генерируется динамически – то есть CMS система управления сайтом – генерирует страницы «на лету» из базы данных, куда внесены данные вручную через систему управления или автоматически, допустим каталог товаров, цены и наличие из системы 1С и т.п.

В современных системах управления сайтами, таких как российский лидер CMS 1C-Битрикс и мировой лидер CMS WordPress, большинство функциональных модулей уже созданы и идут в базовом наборе, либо их можно бесплатно или платно установить с внутреннего маркетплейса системы.

Но очень часто возникают какие-то конкретные уникальные задачи, которые должен решать сайт и в такой ситуации необходимо уже привлекать программистов для написания той или иной функции или модуля. Это, как правило, делают те же самые специалисты в компании, которые занимаются внедрением CMS системы (прикручивают вёртску и пр.) Хотя в больших проектах могут быть разнесены сборщики и программисты, но это, как правило, редкость и встречается только в очень крупных проектах.

Чек-лист требований к системе управления сайтом:

1. CMS всегда должна быть промышленная и широкораспространённая, тогда Вам будет легко подобрать/поменять команду её разработки и поддержки. Для простых сайтов с маленьким бюджетом лучшим решением будет CMS Wordpress. Для больших проектов, особенно порталов и e-commerce проектов будет лучше CMS 1C-Битрикс.
2. Язык программирования и база данных сайта, чтобы не мучаться потом с поиском программистов на экзотическом языке программирования или базы данных – для большинства простых проектов языком веб-программирования был и будет PHP, а базой данных MySQL.
3. Остальные требования и рекомендации разберём более подробно в отдельном разделе.

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

Предыдущая статья из этой серии: Маркетинг интернет сайта: основные этапы разработки сайта. Часть 1-ая

Где можно более подробно ознакомиться с данными материалами?

1. Большая часть материалов вошла также и в наш Учебник №2: Landing Page: продающий сайт (лендинг), который завтра выходит в новой версии (добавилось несколько текстовых и около 15 новых видеоуроков): http://bloggerschool.ru/lp
2. Полную версию учебника для бизнес-школ в авторской версии можно получить в наборе учебных материалов и видеопродуктов Domashenko.2017 http://bloggerschool.ru/2017