Jump to content
  • 0
Sign in to follow this  
TonyBlack

Адаптивная верстка. Компьютер, планшет, смартфон

Question

TonyBlack    5

Всем привет! 

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

Share this post


Link to post
Share on other sites

Recommended Posts

  • 0

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

Share this post


Link to post
Share on other sites

Новая статья

Как бесплатно получить специализированный хостинг для Adobe Muse сайта. Читайте новую инструкцию по этой ссылке.
  • 0
Guest Vadim   
Guest Vadim

Как вариант задний фон залить под фон страницы, тогда визуально полосы не будет

или как сказал админ сделать макет шире.

Share this post


Link to post
Share on other sites
  • 0

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

Это не решит проблемы с не центрированным контентом. По этому, выход только один, делать макеты шире.

Share this post


Link to post
Share on other sites
  • 0
Guest Vadim   
Guest Vadim

рекомендуют 960px подстраиваясь под разрешение 1024

Share this post


Link to post
Share on other sites
  • 0
hyfvmitw    0

Здравствуйте! Решил написать сюда! Подскажите как можно проверить корректность работы планшетной и телефонной версии сайта не в Muse, а уже опубликованного сайта? При ужимании окна браузера ничего не происходит ... Спасибо!

Share this post


Link to post
Share on other sites
  • 0
26 минуты назад, hyfvmitw сказал:

Здравствуйте! Решил написать сюда! Подскажите как можно проверить корректность работы планшетной и телефонной версии сайта не в Muse, а уже опубликованного сайта? При ужимании окна браузера ничего не происходит ... Спасибо!

Добавлять к адресу сайта:  для планшета  - ваш_сайт.ru/tablet, для телефона ваш_сайт.ru/phone

Share this post


Link to post
Share on other sites
  • 0
hyfvmitw    0
1 минуту назад, Павел Хомерики сказал:

Добавлять к адресу сайта:  для планшета  - ваш_сайт.ru/tablet, для телефона ваш_сайт.ru/phone

То есть автоматически это не должно происходить?

Share this post


Link to post
Share on other sites
  • 0
4 минуты назад, hyfvmitw сказал:

То есть автоматически это не должно происходить?

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

Share this post


Link to post
Share on other sites
  • 0
hyfvmitw    0
7 минут назад, Павел Хомерики сказал:

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

Спасибо!

Share this post


Link to post
Share on other sites
  • 0

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

Заранее спасибо за ответ.

Share this post


Link to post
Share on other sites
  • 0
24 минуты назад, АлександрРеАл сказал:

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

Заранее спасибо за ответ.

Нет не будет. Поисковики наоборот пищат от того что у сайта есть мобильная версия

Share this post


Link to post
Share on other sites
  • 0
2 минуты назад, Павел Хомерики сказал:

Нет не будет. Поисковики наоборот пищат от того что у сайта есть мобильная версия

Спасибо большое за уточнение. Скажите пожалуйста еще, у меня есть сайт ReAl-site.com.ua - Не понимаю откуда - но получается две главные страницы: ReAl-site.com.ua - открывается (без заголовка страницы, но в остальном все ок) и ReAl-site.com.ua/index.html (открывается также классно, но уже с заголовками... и т.д.) Все же видно что это две отдельные страницы. Что посоветуете делать? На данный момент поисковиками проиндексирована ReAl-site.com.ua. Да и продвижение делаю на ReAl-site.com.ua. Нужно ли скрывать от индексации в Роботс страницу ReAl-site.com.ua/index.html? А то чувствую, что если оставить ка есть, будет плохо.

Share this post


Link to post
Share on other sites
Sign in to follow this  

×
×
  • Create New...