Создание веб-сайта что хорошо работает на мобильных устройствах, непростая, но выполнимая задача. Пока вы проверяете свой сайт перед отправкой, нет никаких причин, по которым мобильные пользователи не должны получать отличный опыт. Однако вы можете задаться вопросом, какие элементы требуют вашего внимания больше всего.
В этом руководстве мы предоставим вам простой список критериев, которым должен соответствовать ваш сайт. Если это так, ваши пользователи, скорее всего, получат отличные мобильные возможности, а если нет, мы расскажем, как это изменить. Начнем с пункта номер один!
1. Протестируйте свой сайт в нескольких разрешениях.
Когда речь идет о мобильных сайтах, одна из самых важных вещей - это то, что ваш сайт не должен выглядеть уменьшенной версией настольной версии. Это означает, что каждый из ваших элементов должен быть в поиске нескольких разрешений.
Если, с другой стороны, ни один из ваших элементов не отображается на мобильных устройствах, это может негативно сказаться на вашем показателе отказов. Разумнее всего проверить свой Веб-сайт предварительно на нескольких разрешениях и посмотреть, все ли корректно отображается.
К счастью, этот процесс не так сложен, как кажется, и для этого вам не нужно иметь несколько устройств. Есть множество сервисов, позволяющих быстро все протестировать Веб-сайт в разных разрешениях, например:
Chrome Dev Tools : Эта встроенная функция браузера Chrome включает панель инструментов устройства, которую вы можете использовать для тестирования своего сайта при различных разрешениях.
Такие услуги, как Screenfly et BrowserStack : Эти сторонние сервисы позволяют вам тестировать ваш сайт на самых разных разрешениях.
Все инструменты, которые мы упомянули, бесплатны, поэтому бюджет не должен быть проблемой, и нет оправдания для пропуска этого шага!
2 - Убедитесь, что ваше меню и навигация отображаются на экранах меньшего размера.
В большинстве случаев меню являются основным средством навигации для вашего посетителей. Если ваши ссылки трудно нажимать или читать при меньшем разрешении, это повлияет на удобство использования. Кроме того, вы также хотите, чтобы все элементы вашего меню были легко доступны независимо от устройства, которое вы используете для навигации.
Имея это в виду, давайте сделаем несколько шагов, чтобы убедиться, что вы ничего не пропустите, когда пришло время протестировать ваши мобильные меню:
- Убедитесь, что все пункты меню видны.
- Убедитесь, что каждая ссылка выровнена и подменю вложены.
- Убедитесь, что вы можете прочитать каждый пункт меню и нажмите на него.
Большинство современных тем WordPress автоматически создают адаптивные меню для вас. Если у вас есть проблемы с этим аспектом на вашем сайте, вам следует подумать об изменении темы.
3 - Убедитесь, что ваши изображения хороши на малых разрешениях
Изображения — ключевая часть всего Веб-сайт, но иногда ваша графика может быть не в лучшем разрешении. Например, если ваш логотип не читается, когда кто-то заходит на ваш сайт с мобильного телефона, это явно повлияет на имидж вашего бренда.
В большинстве случаев люди больше беспокоятся об «искажении» своих изображений, но масштабирование также может быть проблемой. Не все изображения можно масштабировать, чтобы они идеально подходили для любого разрешения, но есть шаги, которые вы можете предпринять, чтобы сделать это менее проблемным:
Сосредоточьте свои усилия на важных изображения для вашего бренда.
Ищите масштабируемые альтернативы популярным типам изображений, например SVG.
По возможности выбирайте лучше обрезанные изображения, чтобы они лучше подходили к меньшему размеру.
Если вы помните об этих советах, все будет в порядке. Просто помните, что когда дело доходит до очень сложных изображений, таких как компьютерная графика, вы не сможете полностью масштабировать их при низком разрешении.
4. Проверьте свой контент на читабельность.
Одним из аспектов, который больше всего влияет на удобство использования мобильных устройств, является удобочитаемость. При работе с меньшим форм-фактором вам необходимо компенсировать это, убедившись, что ваш текст по-прежнему отображается, несмотря на небольшой размер экранов, вместо того, чтобы просто уменьшать шрифт. Цель здесь проста: вашим пользователям не нужно увеличивать масштаб, чтобы прочитать ваш контент. В конце концов, это идеальный рецепт раздражения пользователя.
К счастью, удобочитаемость является аспектом, который относительно легко решить:
- Выберите базовый шрифт, легко читаемый для содержимого.
- По возможности используйте субтитры, чтобы разбить ваш контент на легко читаемые разделы.
- Выберите тему, которая дает вам больше контроля над отображением текста.
Что касается нашего последнего пункта, многие современные темы должны предложить вам вариант, который вы ищете.
Вот и все для этих советов, надеюсь, они помогут вам лучше оптимизировать ваши блоги для мобильных устройств. Если у вас есть какие-либо вопросы, не стесняйтесь их задавать.
