Верстка вики-страниц под мобильные устройства

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

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

В мобильных такой вариант выглядит так

iPhone

Android

Windows Phone

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

В мобильных такой вариант выглядит так

iPhone

Android

Windows Phone

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

В мобильных этот вариант выглядит так

iPhone

Android

Windows Phone

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

<- Вернуться назад

Заказать оформление / задать вопрос

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

Пожалуйста, заполните все обязательные поля формы помеченные символом (*) и поставьте галочу (✓) напротив "Я не робот" сверху кнопки "Отправить".

Ваше письмо отправлено!

В ближайшее время с Вами свяжется наш специалист.

ОШИБКА

Не введена электронная почта.

ОШИБКА

Не введена капча. Поставьте галочу (✓) напротив "Я не робот" сверху кнопки "Отправить".