Ошибки, которые вы, скорее всего, уже сделали как веб-дизайнер

5

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

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

Использование вспышки

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

Существуют различные проблемы, возникающие при использовании Flash в веб-дизайне. У вас более длительное время загрузки, проблемы с мобильными пользователями из-за отсутствия поддержки и другого используемого языка программирования. Количество устройств, которые в настоящее время поддерживают Flash, очень мало. Также в будущем мы не ожидаем усиления поддержки. Совершенно новые библиотеки кажутся более сильными и популярными, особенно те, которые основаны на JavaScript, такие как AngularJS и jQuary.

Использование действительно больших изображений

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

Загрузка страницы автоматически увеличивается всякий раз, когда используются большие изображения. Это может привести к очень плохому сценарию для посетителя сайта. Хорошая новость заключается в том, что у нас есть доступ к различным инструментам, которые очень помогают в оптимизации изображений. Те, которые вы можете рассмотреть, включают:

Такие приложения, как PrePros, могут помочь автоматически оптимизировать изображения внутри приложений. Проблема в том, что инструменты помогут рабочим процессам, но не решат огромную проблему, связанную со временем загрузки, по крайней мере, не полностью.

Многие дизайнеры сейчас используют SVG. Они используют коды для анимации и рисования графики в среде браузера. Таким образом, мы получаем ускоренную загрузку страницы и различные элементы, которые привлекают внимание.

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

W3C теперь работает над использованием «<picture>» в качестве элемента HTML5. Это позволит вызывать изображения разных размеров в зависимости от ширины экрана просмотра. избегайте больших изображений.

Использование фиксированной ширины и высоты

Адаптация автоматически ограничивается для пользователей при кодировании фиксированных размеров. У нас есть обходные пути, но мы всегда должны думать о создании шаблона веб-дизайна, который на 100% адаптивен. Фиксированная высота, заданная в CSS, может ограничивать видимую область для пользователя. Преодолеть это можно с помощью настроек медиа-запросов, но добавленный дополнительный код приведет к проблемам с производительностью. Вам это действительно не нужно. В большинстве случаев не следует использовать фиксированные размеры. Их следует избегать, насколько это возможно, в среде современного веб-дизайна.

Предположения о проектных соответствиях

Веб-дизайнеры обычно работают с такими программами, как Adobe Photoshop или Sketch. Когда работа выполнена, обычно предполагается наличие определенной точки останова в адаптивном рабочем процессе. Ширины экрана, которые считаются стандартными, будут охватывать множество различных размеров экрана, но охват всех из них не является гарантированным. У нас есть тысячи мобильных устройств, доступных на рынке. Создать дизайн, который бы работал на все, очень сложно.

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

Использование слишком большого количества эффектов и анимации

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

Есть две большие проблемы, связанные с перебором с анимацией и эффектами:

  • Время загрузки страницы увеличено
  • Эффекты и анимация будут проблематичными для старых компьютеров.

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

Неправильное оформление ссылок

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

Не использовать DRY в CSS

Если вы не знаете об этом, DRY означает «Не повторяйтесь». Это метод в веб-дизайне, и на практике он означает, что дизайнеру помогают сохранять код кратким и клонировать. Для стилизации веб-сайта всегда рекомендуется использовать только необходимый код.

При использовании традиционного CSS необходимо многократно повторять определенные элементы, которые используются внутри других элементов. Селекторы получаются очень большими, и их написание займет много времени. Когда вы используете классы в дизайне вместо того, чтобы стилизовать каждый отдельный элемент на HTML-странице, все становится намного проще.

На данный момент очень хорошей идеей является использование языков предварительной обработки, таких как Sass. Они довольно полезны с точки зрения необходимой технологии CSS. Используемые языки ускорят разработку и проектирование, поскольку они включают в себя такие функции, как переменные, функции, примеси, вложения и многое другое. Полученный код затем будет скомпилирован в код CSS. Веб-разработчики и веб-дизайнеры теперь могут использовать меньше строк кода, а благодаря языкам можно легко избежать повторения.

Изящная деградация

Мы можем определить Graceful Degradation как практику создания веб-функций, способных предлагать определенный уровень взаимодействия с пользователем в современном браузере, в то время как в более старых браузерах снижается до более низкого уровня взаимодействия с пользователем. Это звучит немного сложно, но в качестве примера мы можем обсудить поддержку Internet Explorer 8 и 7. Вы были бы удивлены, узнав, что большинство пользователей просто не будут обновлять браузеры в течение длительного периода времени. Из-за этого вам нужно добавить изящную деградацию, чтобы была надлежащая поддержка для обеих версий браузера.

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

Прогрессивное улучшение

Это нечто похожее на упомянутую выше Graceful Degradation. Разница в том, что процесс выполняется в обратном порядке, начиная с базового уровня опыта, который поддерживается каждым отдельным веб-браузером. Затем дизайнер/разработчик добавляет расширенную функциональность, доступную для браузеров, которые могут ее использовать.

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

Проблемы с навигацией — быть неудобным для пользователя

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

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

Недостаток внимания к содержанию

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

Веб и графический дизайн очень похожи на современную архитектуру с точки зрения необходимого функционала. Форма объекта должна в первую очередь основываться на предполагаемой цели или функции. Что касается веб-сайтов, мы можем рассматривать их как информационные базы данных, разбросанные по всему Интернету. Пользователь посещает веб-сайт для получения конкретных данных. Именно здесь контент вступает в игру, чтобы предложить эти данные. Поскольку посетитель попадает на сайт и не находит данных, он будет искать их где-то еще, даже не глядя на дизайн. В то же время, если дизайн действительно затрудняет поиск или переваривание данных, происходит тот же результат.

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

Выводы

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

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

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

Источник записи: instantshift.com

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