Кто-то сказал, что ошибки делают человека совершенным. Но есть ряд критических моментов в разработке сайтов, которые следует найти и устранить как можно быстрее.
Было бы здорово управлять временем, как в известном фантастическом романе, и возвращаться к моменту запуска сайту подобно Гарри Поттеру и Гермионе Грейнджер, чтобы всех спасти. Но нам приходится решать проблемы на ходу, во время работы.
К сожалению, к тому моменту ошибки могут отразиться на пользовательском опыте, посещаемости и конверсиях.
Самые частые ошибки веб-дизайна
1. Недостаточно уникальных изображений
Как выглядит воздушный шарик без воздуха? Безжизненным. Но заполните воздушный шарик воздухом и дайте ему плавать в облаках. Совсем другое дело? То же самое касается вашего сайта.
Вы загрузили несколько изображений. Но они либо не сочетаются с цветовой гаммой бренда, либо недостаточно высокого разрешения, размытые или просто неуникальные. Это фатальная ошибка.
2. Неудачные цвета и типографика сайта
Мы только что обсудили потребность в изображениях высокого разрешения и гармоничного оформления сайта. Все это плавно переносит нас к типографике и цвету.
Когда дело доходит до использования шрифтов и их цвета, требуется научный подход. Типографика — вопрос не только личного вкуса, но и психологического воздействия на пользователей.
Согласованность цвета и шрифта может оказаться одним из решающих факторов успеха всего проекта.
Если вы уже обнаружили несоответствие шрифта и цвета уже после запуска — лучше поздно, чем никогда. Опытные веб-дизайнеры рекомендуют придерживаться 3-4 шрифтов и цветов, которые не режут глаз и хорошо комбинируются друг с другом.
3. Отсутствие модульной сетки
Вы когда-нибудь пробовали использовать модульную сетку? Если вы продвинутый веб-дизайнер, постоянно изучающий что нового в Интернете, то наверняка слышали о сетке (grid) и ее важности.
Сетка помогает организовать веб-страницы, сделать их податливым и удобным пластилином в творческих руках дизайнера. Grid – это шаг к впечатляющим проектам завтрашнего дня.
4. Утомительная навигация по сайту
Вы принадлежите к ассоциации любителей гамбургеров? Тогда вы наверняка используете три полоски меню в своих сайтах. Хотя меню-гамбургер продолжает собирать противоречивые отзывы дизайнеров и пользователей, сегодня это лучший способ обеспечить простую и эффективную навигацию.
Если ваша навигация слишком утомительная для посетителя, пострадает глубина посещения и остальные немаловажные показатели. Нельзя допустить, чтобы люди пробирались через дюжину кликов каждый раз, когда им нужен тот или иной контент на сайте. Keep it simple!
5. Недостаточно быстрая загрузка страниц
Никто, включая нас с вами, не стал бы оставаться на сайте с загрузкой страниц по 8-10 секунд. Тем более, если вокруг море аналогичного контента с более комфортным доступом. Мы уже неоднократно повторяли, что с каждой секундой задержки конверсии падают наполовину, если не больше.
На скорость загрузки влияют многочисленные факторы, в том числе тяжелые изображения, анимация, flash, видеоролики. Просто помните, что красота оформления не должна быть в ущерб комфорту.
6. Бесплатные шаблоны и темы
Многие новичков предпочитают использовать бесплатные шаблоны и темы, доступные в Интернете. Проблема в том, что таких любителей шары миллионы, поэтому вокруг будет тьма сайтов аналогичного вида.
Если это ваш самый первый «учебный» сайт — ничего страшного. Но это серьезная ошибка веб-дизайна, если вы настроены на покорение конкурентной рыночной ниши.
Почему бы хоть здесь не потратиться на услуги профессионалов веб-разработки и не заказать проект, максимально соответствующий вашим потребностям и выделяющий вас из толпы?
Главные ошибки веб-разработки
1. Хватит использовать олдскульный HTML!
Сегодня в руках веб-разработчиков множество гибких современных инструментов, но почему-то находятся те, кто по привычке использует старые приемы разметки со времен начала Интернета. Например, <table> для layout, <div> или <span>, когда есть более подходящие опции.
До сих пор встречаются некоторые устаревшие элементы, такие как <center> или <font>, а также сущности «& nbsp;», которые несовместимы с последними стандартами HTML. Результат? Низкая эффективность и несогласованность в разных браузерах.
Некоторые из последних и самых современных браузеров, таких как Microsoft Edge, а также предыдущие версии Internet Explorer, такие как 11, 10 и 9, не поддерживают их.
Как исправить ошибку? Ограничьте использование элемента <table> и сосредоточьтесь на использовании HTML для описания содержимого, а не того, как оно отображается. CSS предлагает гораздо более совершенный функционал для надлежащего отображения контента.
2. Отсутствие кроссбраузерности
Это одна из самых грубых и далеко идущих ошибок веб-разработки.
Сайт безупречно отображается на вашем любимом Firefox? Замечательно, но стоит иметь в виду тот факт, что не все пользуются вашим браузером. В эпоху кроссбраузерности разработчики продолжают допускать эту ошибку, потому что любят одни браузеры и ненавидят другие!
Если вы ориентированы на единственную платформу, результат трудов может оказаться просто отвратительным для других платформ. Если даже Google Chrome занимает 50% российского рынка, не стоит «забивать» на остальные браузеры. Например, Yandex Browser стоит у 12% наших пользователей, и даже дедушка IE используется каждым 20-м пользователем.
Хотите знать, как отображается ваш сайт на разных платформах? Для этого в Интернете есть специальные сервисы, в том числе совершенно бесплатные. А у вас все работает?
3. Неоправданное утяжеление веб-страниц
Одна из тенденций веб-разработки — яркие привлекательные страницы, наполненные высококачественной графикой и анимацией, элементами <img> с атрибутами высоты и ширины, многочисленными CSS и JavaScript. Все это приводит к порой неоправданному утяжелению.
В результате процесс загрузки веб-страниц занимает слишком много времени, увеличивается показатель отказов. В некоторых ситуациях эта красота приводит к ошибкам.
Нередко можно встретить «профессиональные» лендинги с великолепной графикой и анимацией, которые загружаются добрых 10 секунд. Они впечатляют заказчика, но раздражают клиентов.
Серьезно подумайте над оптимизацией и удалите все лишнее.
4. Отсутствие адаптивности сайта
Адаптивность — это даже не тренд, а золотой стандарт веб-разработки. Несмотря на очевидную важность корректного отображения на всех устройствах и растущий мобильный трафик, некоторые сайты продолжают выдавать нечитабельные каракули на экране смартфона.
Более половины пользователей Интернета пользуются мобильными устройствами. Какой смысл тратиться на дорогостоящий дизайн и продающие тексты, если их просто тяжело рассмотреть на крошечном экране? Не лучше ли вложиться в разработку адаптивной версии сайта?
5. Недостаточная оптимизация страниц
Иногда разработчики увлекаются оптимизацией веб-страниц с точки зрения пользователя, не утруждая себя надлежащей практикой SEO. Поисковые системы не найдут этот замечательный контент. Результат игнорирования SEO – пустующие страницы с околонулевым трафиком.
Как исправить эту ошибку? Никогда не поздно заниматься поисковой оптимизацией. Проанализируйте содержимое сайта, сориентировав его на нужные ключевые слова. Не забывайте использовать атрибут alt = "ваше описание изображения" в тегах <img> или <area>, чтобы улучшить доступность.
Подводя итоги обсуждения
Как вы могли понять, большинство ошибок веб-дизайна и разработки сайтов проще предотвратить на этапе создания проекта, чем исправлять задним числом. Так вы повысите эффективность проекта и сохраните время на что-то более важное и продуктивное.