Как сделать сайт для мобильных устройств
Создание мобильной версии сайта в Сайткрафт-Студии
 
Для того, чтобы ваш сайт, сделанный в Сайткрафт-Студии имел версию, показываемую на мобильных устройствах вам нужно:
1) создать в Сайткрафт-Студии второй сайт, который будет показываться на мобильных. Учесть требования для мобильных сайтов при его создании;
2) опубликовать мобильный сайт на поддомен «m.»;
3) задать в основном сайте перенаправление на мобильный сайт, задать в обоих сайтах настройки для робота Google;
4) проверить работу сайтов и оптимизацию их для мобильных инструментами Google.
 
Создать в Сайткрафт-Студии второй сайт, который будет показываться на мобильных. Учесть требования для мобильных сайтов при его создании.
 
Обычным образом вы создаете новый сайт. Для того, чтобы вы легко справились с этой задачей и быстро получили результат, сделайте сначала мобильный сайт из 1-2 страниц. Пройдите все настройки и убедитесь, что ваш мобильный сайт работает, и Google считает его подходящим.
Основные требования к мобильным сайтам:
1) небольшая ширина сайта до 320 точек, крупные кнопки (для нажатия пальцем), тексты написаны крупным шрифтом относительно ширины сайта, и на таких сайтах не применяют технологии, недоступные для мобильных (например, Flash).
2) cтраницам мобильного сайта должна быть задана область просмотра.
Что такое область просмотра описано на сайте Google: https://developers.google.com/speed/docs/insights/ConfigureViewport
Для универсального случая области просмотра для каждой страницы мобильного сайта добавляется дополнительный код через 4-й шаг - Настройка страниц - Доп. инструменты -  Вставить код. Вставить следующий код:
<meta name=viewport content="width=device-width, initial-scale=1">
 
Опубликовать мобильный сайт на поддомен «m.»
Обычно, для размещения мобильной версии сайта используют поддомен "m", то есть адрес мобильного сайта будет m.moysite.ru , если ваш основной сайт moysite.ru
 
На своем хостинге получите данные для публикации на поддомен «m.» и опубликуйте сайт.
Затем проверьте, насколько ваш новый сайт соответствует требованиям для мобильных устройств, используя инструменты Google: https://www.google.com/webmasters/tools/mobile-friendly/
И если нужно внесите правки.
 
Google напишет вам, что скорость загрузки вашего сайта не оптимизирована и будет требовать исправить это – не обращайте внимания. Google хочет чтобы модули, которые грузятся в начале загрузки страницы, грузились в конце. Такое в Сайткрафт-Студии сделать не возможно. Да, это и не принципиально. Гугл пытается соблюсти формальности, не обращая внимания на действительную скорость загрузки. Для того, чтобы ваши страницы в мобильном сайте грузились быстро, сделайте оптимальными (минимально возможными по «весу») картинки на этих страницах.
 
 
Задать перенаправление на мобильный сайт
 
Перенаправление задается для того, чтобы при открытии страницы вашего сайта с мобильного устройства, ваш сайт автоматически пересылал посетителя на соответствующую (указанную вами) страницу мобильного сайта.

Настройки в обоих сайтах делаются для каждой страницы добавляется дополнительный код: 4-й шаг - Настройка страниц - Доп. инструменты
 
Настройки основного сайта

Для страниц основного сайта нужно добавить код:
<link rel="alternate" media="only screen and (max-width: 640px)" href="http://m.moysite.ru/">
<script type='text/javascript'>
if(window.innerWidth<1000) location.href='http://m.moysite.ru/';
</script>
 
Оба ваши сайта: основной и мобильный будут содержать одну и ту же информацию, и чтобы Google не понижал ваши сайты в рейтингах, полагая, что информация дублируется, вам нужно указать для робота Google, что данные страницы, это один сайт, только для разных устройств. Эти настройки указываются в строке:  <link rel="alternate" media="… >
 
В кавычках кода указано, какая страница мобильного сайта, например, http://m.moysite.ru/, будет открываться при попытке открыть настраиваемую страницу основного сайта. Например, подобный код, поставленный на главную страницу вашего основного сайта moysite.ru переведет просмотр на лицевую страницу мобильного сайта m.moysite.ru  при просмотре на мобильном устройстве.
 
Для остальных страниц, кроме главной, адрес страницы, помещаемый в кавычки, будет выглядеть таким образом: http://m.moysite.ru/contact.htm или http://m.moysite.ru/p0025.htm
 
Например,
<link rel="alternate" media="only screen and (max-width: 640px)" href="http://m.moysite.ru/p0025.htm">
<script type='text/javascript'>
if(window.innerWidth<1000) location.href='http://m.moysite.ru/p0025.htm';
</script>
 
Чтобы вы понимали, в коде 1000 - это 1000 точек, ширина экрана устройства, при которой происходит переход с основного сайта на мобильный. То есть если на сайт вошли с устройства с шириной экрана меньше 1000 - откроется мобильный сайт, больше 1000 - основной сайт. Гугл именно эту ширину считает переходной.
!!! Обратите внимание, что одной странице основного сайта должна соответствовать одна страница мобильного сайта. В случае если вы зададите для нескольких страниц основного сайта пересылку на одну и ту же страницу мобильного сайта, Гугл понизит позиции вашего сайта в поиске.
Если в вашем мобильном сайте нет соответствующей страницы, и эта страница есть только в основном сайте – не задавайте никаких перенаправлений. При этом при входе на эту страницу с мобильного устройства, откроется страница основного сайта.
 
Настройки мобильного сайта:

А вот такой код надо добавить на лицевую страницу мобильного сайта (4-й шаг, Настройка страниц, Доп. инструменты-Добавить код), этот код показывает соответствие этой страницы главной странице основного сайта.
<link rel="canonical" href="http://moysite.ru/" >

Для каждой страницы должно быть указано в последних кавычках название страницы соответствия.
<link rel="canonical" href="http://moysite.ru/p0025.htm">
 
Проверка работы сайтов
 

После всех настроек проверьте работу обоих сайтов и их соответствие требованиям https://www.google.com/webmasters/tools/mobile-friendly/ 

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

     В то же время, мы сделали несколько ограничений в демо-версии:
1) Вы не можете создать сайт больше чем из 10 страниц.
2) Вы можете опубликовать сайт только на проверочное место, сайт на этом месте будет виден в Интернете в течение нескольких часов. Чтобы опубликовать сайт в любое другое место сети, вам надо купить полную версию.
3) При публикации демо-версия Сайткрафта опубликует только 5 страниц сайта. Так же и при просмотре в браузере вы увидете только 5 страниц сайта.
4) На опубликованной странице, "Сайткрафт" поставит предупреждение: "Эта страница сделана в демо-версии "Сайткрафта".
5) "Галерея" демо-версии содержит ограниченный набор картинок и кнопок.
6) Вы не можете обновить демо-версию.
7) Вы можете открыть сайт, сделанный в предыдущей версии (v 2 - 2005,
v 3- 2006), но при этом в новый формат переведутся только 10 первых страниц вашего сайта.
 
 
© 2002-2019 А.Недоря, © 2013-2019 ООО "Астра-Ком", ООО "Синергетик Лаб".
Запрещается копирование, распространение или любое иное использование информации и объектов без предварительного согласия.
При полном или частичном использовании материалов, обязательна ссылка на сайт  www.sitecraft.ru