Jump to content

Recommended Posts

Добрый день! недавно закончил под свой проект мобильную адаптивную версию шаблона. Что очень порадовало, увеличилось количество покупок с айпадов и андроидов, сделал вывод что с мобильных устройств очень часто заходят на сайт, при этом показатели тока растут. Интересно кто нибудь из сообщества адаптирует свои сайт под мобильные устройства, планшеты телефоны? какие варианты решение используют? и просто интересно ваше мнение.

Share this post


Link to post
Share on other sites

Я делаю следующее:

1. в css ставлю правила для нужных разрешений (@media only screen), и трансформирую элементы под них.

2. заменяю все jquery-примочки на адаптивные (слайды, табы, меню, лайтбоксы и пр.)

Получается примерно так: http://ocs1541juicyblue.webmix.info/

p.s. пробовал всякие скрипты и фреймворки - решил, что проще и быстрее самому.

p.p.s. по уму еще лучше сделать доп.меропреятия: в зависимости от разрешения подгружать или не подгружать разные стили, шрифты, элементы; подготовить отдельные версии картинок под разные разрешения - этим экономится трафик посетителя, увеличивается скорость загрузки.

Share this post


Link to post
Share on other sites

Я делаю следующее:

1. в css ставлю правила для нужных разрешений (@media only screen), и трансформирую элементы под них.

2. заменяю все jquery-примочки на адаптивные (слайды, табы, меню, лайтбоксы и пр.)

Получается примерно так: http://ocs1541juicyblue.webmix.info/

p.s. пробовал всякие скрипты и фреймворки - решил, что проще и быстрее самому.

p.p.s. по уму еще лучше сделать доп.меропреятия: в зависимости от разрешения подгружать или не подгружать разные стили, шрифты, элементы; подготовить отдельные версии картинок под разные разрешения - этим экономится трафик посетителя, увеличивается скорость загрузки.

На своем сайте как раз через отдельный шаблон mobile.css и в нем (@media only screen) стилей сделал шаблоны под разные разрешения.

По поводу js вобщем сложностей не заметил работает на мобильных устройствах. единственное возможно не адаптированы под точ прикосновения.

Кстати по js, пислись ли правила отмены обработки в зависимости от разрешения экрана?

Share this post


Link to post
Share on other sites
Guest brk

Респонс конечно решает, но не забываем про фильтры!

Не так давно с коллегой обсуждали и искали хоть один пример магазина с полным респонсом и фильтрами.

Скрипты фильтров на мобилах не работают (

Share this post


Link to post
Share on other sites

Вы про какие фильтры? Типа разных сортировок (по цене, от А до Я и пр.)?

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

Share this post


Link to post
Share on other sites

Вы про какие фильтры? Типа разных сортировок (по цене, от А до Я и пр.)?

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

имелись в виду фильтры подбора товаров по атрибутам и прочим параметрам.

Share this post


Link to post
Share on other sites

проверил у себя фильтр от соора. на планшете работает отлично :) единственно надо адаптировать удобство пользование под маленькое разрешение экрана. пока сркыл ибо очень обменный получается.

Share this post


Link to post
Share on other sites

А как еще можно сделать адаптивную версию (не мобильную, а именно responsive), кроме как используя правила css под разные разрешения? :) И какие проблемы могут быть у фильтров? Ведь меняются только правила css, никто же не запрещает подгружать скрипты для работы фильтров в адаптивной версии. Я у себя делал все, взяв за основу тему responsive9, но из-за идиотской реализации в категориях и товарах пришлось все переделать, в итоге от изначальной задумки остались лишь верхние комбобоксы со ссылками меню и категориями, а касаемо фильтра получилось вот так, при этом даже на самом маленьком экране в 240рх вполне можно работать (это filterpro):

 

gY7R.png

Share this post


Link to post
Share on other sites
Guest brk

А как еще можно сделать адаптивную версию (не мобильную, а именно responsive), кроме как используя правила css под разные разрешения? :) И какие проблемы могут быть у фильтров? Ведь меняются только правила css, никто же не запрещает подгружать скрипты для работы фильтров в адаптивной версии. Я у себя делал все, взяв за основу тему responsive9, но из-за идиотской реализации в категориях и товарах пришлось все переделать, в итоге от изначальной задумки остались лишь верхние комбобоксы со ссылками меню и категориями, а касаемо фильтра получилось вот так, при этом даже на самом маленьком экране в 240рх вполне можно работать (это filterpro):

 

gY7R+.png

Да картинки тут ни при чем.

Попробуйте заюзать в деле.

Сколько времени от клика на фильтр до выдачи на реальном телефоне с GPRS ?

Share this post


Link to post
Share on other sites

Господа, извиняюсь что не по теме. У самого нету мобильной версии сайта, но купил OpenCart Mobile Framework, так и не смог хорошо ее настроить по себя.

 

Проблема заключается в том, у меня на айфоне 4 магазин начинает лагать (медленно зумится, перемещается и т.п.) когда я ставлю код яндекс.метрики с вебвизором. Как только отключаю его (удаляю в коде), все работает отлично.

 

Без вебвизора совсем грустно.

У меня:

Не мобильные устройства 2 786
Мобильные телефоны и КПК 1 417
 
Не мобильные устройства 28
Мобильные телефоны и КПК 16
 
Причем "Мобильные телефоны и КПК 16" = 100% apple (ipad/iphone), ни одного аyдроида и wm =)
 
Кто может помочь? Что-бы сайт не лагает с вебвизором?
Да и вообще, я бы заплатил за работу по настройки  OpenCart Mobile Framework (дизайн) или css.

Share this post


Link to post
Share on other sites

Да картинки тут ни при чем.

Попробуйте заюзать в деле.

Сколько времени от клика на фильтр до выдачи на реальном телефоне с GPRS ?

По вашему для клиентов с GPRS именно загрузка выборки фильтра будет наибольшей проблемой, при том, что адаптивная верстка абсолютно не подразумевает уменьшение веса страницы? :)

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

Share this post


Link to post
Share on other sites

Добрый день! недавно закончил под свой проект мобильную адаптивную версию шаблона. Что очень порадовало, увеличилось количество покупок с айпадов и андроидов, сделал вывод что с мобильных устройств очень часто заходят на сайт, при этом показатели тока растут. Интересно кто нибудь из сообщества адаптирует свои сайт под мобильные устройства, планшеты телефоны? какие варианты решение используют? и просто интересно ваше мнение.

 

В какой-то момент мне эта тема показалась полезной. Потом начал читать. Вначале пришел к выводу, что high resolution для iphone это приходящая мода (так и оказалось судя по текущей ситуации), а сейчас я обнаруживаю, что пользователи iphone 4,5 и ipad хрен ложили на @media и нормально зумят все пальцами без волнений. Так что процитированному месседжу ТС я не очень доверяю. Вот если бы Вы сказали, что продажи с Android-девайсов подскочили, то я бы поверил - там довольно много гаджетов на низком разрешении (в нищебродском СНГ так их сегмент особенно большОй) и бОльший разнобой браузеров.

 

UPD:

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

  • +1 1

Share this post


Link to post
Share on other sites

В какой-то момент мне эта тема показалась полезной. Потом начал читать. Вначале пришел к выводу, что high resolution для iphone это приходящая мода (так и оказалось судя по текущей ситуации), а сейчас я обнаруживаю, что пользователи iphone 4,5 и ipad хрен ложили на @media и нормально зумят все пальцами без волнений. Так что процитированному месседжу ТС я не очень доверяю. Вот если бы Вы сказали, что продажи с Android-девайсов подскочили, то я бы поверил - там довольно много гаджетов на низком разрешении (в нищебродском СНГ так их сегмент особенно большОй) и бОльший разнобой браузеров.

 

UPD:

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

сам лично имею телефон на андроиде с разрешением 480на 800. после адаптации сайта получаю удовольствие от срефинга по сайту. в случае необходимости очень легко оформить заказ либо посмотреть что то по наличию. Аналогично думаю у клиентов. Могу точно сказать после адаптации заказов стало больше. Я кстати адаптировал сайт под 3 разрешения до 480 для мобильных устройств до 800 для планшетов и все остальное.

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

Share this post


Link to post
Share on other sites

сам лично имею телефон на андроиде с разрешением 480на 800. после адаптации сайта получаю удовольствие от срефинга по сайту. в случае необходимости очень легко оформить заказ либо посмотреть что то по наличию. Аналогично думаю у клиентов. Могу точно сказать после адаптации заказов стало больше. Я кстати адаптировал сайт под 3 разрешения до 480 для мобильных устройств до 800 для планшетов и все остальное.

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

 

На самом деле чтобы действительно адаптировать сайт под мобильные устройства нужно индивидуальную навигацию делать. Некоторые функции, которые во многих движках активно используются на мобильный устройствах работают плохо или вообще ни как (например выпадание меню по наведению курсора или раскрывающиеся деревья). Тут адаптивной версткой не обойтись. Погуглите по поводу разработки дизайна под мобильные устройства, посмотрите на Ext Touch. Работа с тачскринами несколько отличается от работы с традиционными средствами ввода.

  • +1 1

Share this post


Link to post
Share on other sites

Извините что стреваю ваш интересный разговоро. Я в форуме первый раз, в opencart не разбераюсь, однако у меня есть сайт который нужно адабтировать под телефон  , планшет итд. Может кто подскажет кто делает такую работу и где?  пишите на почту vibro77@mail.ru Зарание спасиба 

Share this post


Link to post
Share on other sites

Здравствуйте, форумчане. =)

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

Посоветуйте, пожалуйста...

Share this post


Link to post
Share on other sites

а просто адаптивный шаблон не вариант?

Share this post


Link to post
Share on other sites

Здравствуйте, форумчане. =)

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

Посоветуйте, пожалуйста...

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

Share this post


Link to post
Share on other sites

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

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

Хочу отдельный шаблон с полной адаптацией под мобилку и планшет.

Share this post


Link to post
Share on other sites

Извините что стреваю ваш интересный разговоро. Я в форуме первый раз, в opencart не разбераюсь, однако у меня есть сайт который нужно адабтировать под телефон  , планшет итд. Может кто подскажет кто делает такую работу и где?  пишите на почту vibro77@mail.ru Зарание спасиба 

Нужно для начала заказать соответствующий дизайн. Поищите в Сети. Есть дизайнеры, которые уже освоили это направление.

Share this post


Link to post
Share on other sites

Здравствуйте, форумчане. =)

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

Посоветуйте, пожалуйста...

 

Самый надежный вариант - делать свое на этой основе.

Share this post


Link to post
Share on other sites

Для мобильных версий, лучше использовать эту тему, в качестве основы. У OMF в Free версии нет чекаута, а Pro стоит в два раза дороже, чем предложенный мною вариант, да и по дизайну уступает, имхо.

Share this post


Link to post
Share on other sites

Когда будет релиз Мобильной версии шаблона, выкладывайте поскорее, будем заценивать  :wink:

Share this post


Link to post
Share on other sites

Нужно сделать приложение  под ios & android. вопросы в личку.

Share this post


Link to post
Share on other sites

Специализируюсь на ios & android приложениях, оосбенно что касается заморочек с заказами  :)

Есть движок, админка для управления контентом, дизайн разрабатывается под заказчика. Велкам!

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
You are posting as a guest. If you have an account, please sign in.
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Similar Content

    • By colaweb
      Используйте момент чтобы обойти конкурентов.
       
      ПРЕИМУЩЕСТВ
       
      При помощи данного модуля создается полностью рабочее приложение для магазина как будто вы его загрузили из Google Play или Microsoft Store.
      Это приложение может работать без подключения к интернету. Для этого необходимо настроить кэширование необходимых страниц (планируется добавить данную опцию в следующих версиях модуля).

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

      По заявлению Google, перед специалистами Lancôme стояла задача создать быстро загружаемый, мощный мобильный инструмент, который можно будет быстро найти и просто использовать. В результате в 2016 году у компании появилось веб-приложение.
      И что же в итоге? Результаты говорят сами за себя: на 84% снизилось время загрузки, на 17% увеличилась конверсия, на 53% увеличилось количество мобильных сеансов на iOS,18% push-уведомлений открываются пользователями, 8% потребителей, которые открыли push-уведомление, совершали покупку.
      Пример компании Lancôme стал показательным для всех, кто сомневался.

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

      Третий плюс, страницы вашего магазина в интернете будут загружаться очень быстро. Для этого необходимо настроить кэширование необходимых страниц (планируется добавить данную опцию в следующих версиях модуля). Что в свою очередь положительно повлияет на выдаче Google и Яндекс.
       
      ВИДЕО
       
      Совместим со всеми версиями OpenCart и ocStore.
       
      ЛИЦЕНЗИЯ

      Лицензия дает право на установку модуля на один тестовый домен и на один рабочий домен.
      При покупке модуля обязательно указывайте тестовый и рабочий домен.

      ОБЯЗАТЕЛЬНЫЕ ТРЕБОВАНИЯ ДЛЯ РАБОТЫ МОДУЛЯ

      1. Подключение по https
      2. Ваш магазин должен быть адаптирован для показа на смартфонах и планшетах
      Работает в браузере Chrome на платформе Android для смартфонов. Для десктопов на платформе Windows 10 также в браузере Chrome.
      Другие браузеры включая Apple планируют включить полную поддержку данной технологии в ближайшее время.
       
      В настройках модуля можно изменить:
      Настройка времени, через которое посетителю сайта показывается баннер с предложением установить приложение.
      Настройка внешнего вида баннера.
      Настройка текста и значка на баннере.

      В следующих версиях модуля, будут добавлены функции Push уведомлений и моментальной загрузки страниц магазина.
       
    • By colaweb
      1 900.00 руб
      Скачать/Купить дополнение


      Мобильное и десктопное приложение для вашего магазина
      Используйте момент чтобы обойти конкурентов.
       
      ПРЕИМУЩЕСТВ
       
      При помощи данного модуля создается полностью рабочее приложение для магазина как будто вы его загрузили из Google Play или Microsoft Store.
      Это приложение может работать без подключения к интернету. Для этого необходимо настроить кэширование необходимых страниц (планируется добавить данную опцию в следующих версиях модуля).

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

      По заявлению Google, перед специалистами Lancôme стояла задача создать быстро загружаемый, мощный мобильный инструмент, который можно будет быстро найти и просто использовать. В результате в 2016 году у компании появилось веб-приложение.
      И что же в итоге? Результаты говорят сами за себя: на 84% снизилось время загрузки, на 17% увеличилась конверсия, на 53% увеличилось количество мобильных сеансов на iOS,18% push-уведомлений открываются пользователями, 8% потребителей, которые открыли push-уведомление, совершали покупку.
      Пример компании Lancôme стал показательным для всех, кто сомневался.

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

      Третий плюс, страницы вашего магазина в интернете будут загружаться очень быстро. Для этого необходимо настроить кэширование необходимых страниц (планируется добавить данную опцию в следующих версиях модуля). Что в свою очередь положительно повлияет на выдаче Google и Яндекс.
       
      ВИДЕО
       
      Совместим со всеми версиями OpenCart и ocStore.
       
      ЛИЦЕНЗИЯ

      Лицензия дает право на установку модуля на один тестовый домен и на один рабочий домен.
      При покупке модуля обязательно указывайте тестовый и рабочий домен.

      ОБЯЗАТЕЛЬНЫЕ ТРЕБОВАНИЯ ДЛЯ РАБОТЫ МОДУЛЯ

      1. Подключение по https
      2. Ваш магазин должен быть адаптирован для показа на смартфонах и планшетах
      Работает в браузере Chrome на платформе Android для смартфонов. Для десктопов на платформе Windows 10 также в браузере Chrome.
      Другие браузеры включая Apple планируют включить полную поддержку данной технологии в ближайшее время.
       
      В настройках модуля можно изменить:
      Настройка времени, через которое посетителю сайта показывается баннер с предложением установить приложение.
      Настройка внешнего вида баннера.
      Настройка текста и значка на баннере.

      В следующих версиях модуля, будут добавлены функции Push уведомлений и моментальной загрузки страниц магазина.
       
      Добавил colaweb Добавлено 03.05.2019 Категория Платные шаблоны Системные требования Сайт разработчика http://colaweb.ru/ Старая цена Метод активации По запросу на почту Ioncube Loader Нет OpenCart 3.0
      2.3
      2.2
      2.1
      2.0
      1.5.6.4
      1.5.6.3
      1.5.6.2
      1.5.6.1
      1.5.6
      1.5.5.1
      1.5.5
      1.5.4.1
      1.5.3.1 ocStore 3.0
      2.3
      2.2
      2.1
      1.5.5.1.2
      1.5.5.1.1
      1.5.5.1
      1.5.4.1.2
      1.5.4.1.1
      1.5.4.1
      1.5.3.1
      1.5.2.1
      1.5.1.3 OpenCart.Pro, ocShop Не проверялось Обращение к серверу разработчика Нет  
    • By Lena192203
      При загрузке станиц сайта через 3ж очень долго грузиться, где-то 1-2 минуты, полоса загрузки стоит на одном несте, потом резко полная загрузка (не постепенно догружаеться), все остальные сайты на 3ж нормальная постепенная загрузка 3-5 сек., с хостингом все ок, так как есть второй сайт на нем - с загрузкой нет проблем, при подключении к вай-фай отлично грузится, обыкновенная версия - отлично грузится, только как я понимаю при низкой скорости проблемы, что это может быть, мож кто сталкивался с подобной проблемой? Сайт - http://olg.com.ua/
      И да, тема адаптивна.
  • Recently Browsing   0 members

    No registered users viewing this page.

×

Important Information

On our site, cookies are used and personal data is processed to improve the user interface. To find out what and what personal data we are processing, please go to the link. If you click "I agree," it means that you understand and accept all the conditions specified in this Privacy Notice.