Форум SAPE.RU - Оптимизация сайта для планшетов и телефонов

Форум SAPE.RU (http://forum.sape.ru/index.php)

- Разработка и сопровождение сайтов (http://forum.sape.ru/forumdisplay.php?f=29)

Цитата:

Сообщение от D.iK.iJ (Сообщение 1487780)

Тогда уж нужно фон с параллаксом, полупрозрачные плашки и все такое.

Не. Для доров отличный шаблон в первоначальном варианте. Простой и незаюзанный ))

Кстати, хочу высказать благодарность Андрею за помощь в настройке плагина для вордпресс, чтобы на мобильных устройствах хорошо отображался. Полдня голову ломал с css, потом вспомнил про dikij.com. :)

Цитата:

Сообщение от MonAmur (Сообщение 1488010)

Не. Для доров отличный шаблон в первоначальном варианте. Простой и незаюзанный ))

Ахаха! Хорошо. Доры вон еще мои редиректы любят. Вечно пытаются их использовать ))

3 версия кнопки «Полная версия сайта» для адаптивного дизайна. Для интереса - на чистом JavaScript

Цитата:

В header страницы использован вот такой мета-тег мобильной версии:
<meta id="vp" name="viewport" content="width=device-width, initial-scale=1">

Без сохранения результата:
<a href="javascript: document.getElementById('vp').setAttribute('conten t','width=1024, initial-scale=0.3');" style="border-bottom: 1px dashed #666; text-decoration: none;">Просто ссылка для перехода на полную версию сайта</a>

<a href="javascript: document.getElementById('vp').setAttribute('conten t','width=auto, initial-scale=1');" style="border-bottom: 1px dashed #666; text-decoration: none;">Обратно на мобильную версию</a>.

Скрипт с запоминанием:
<a href="javascript: desktop();" id="vpbutton" style="border-bottom: 1px dashed #666; text-decoration: none;">Мобильная версия сайта</a>

<script>
function mobile() {
document.getElementById('vp').setAttribute('conten t','width=auto, initial-scale=1');
document.getElementById('vpbutton').innerHTML = "Полная версия сайта";
setTimeout("document.getElementById('vpbutton').hr ef='javascript: desktop();';", 500);
SetCookie("mobile=yes", "0");
}

function desktop() {
document.getElementById('vp').setAttribute('conten t','width=1024, initial-scale=0.3');
document.getElementById('vpbutton').innerHTML = "Мобильная версия сайта";
setTimeout("document.getElementById('vpbutton').hr ef='javascript: mobile();';", 500);
SetCookie("mobile=no", "30");
}

//Функция автозапуска
if (document.cookie.indexOf("mobile=no") != -1) {desktop();}

//Куки
function SetCookie(id, days){
var ws=new Date();
ws.setDate((days-0+ws.getDate()));
document.cookie=id+"; path=/; expires="+ws.toGMTString();
}
</script>

Демка
.

Цитата:

Сообщение от D.iK.iJ (Сообщение 1488311)

на чистом JavaScript

для ссылок не айс :mad:

Цитата:

Сообщение от zeta (Сообщение 1488320)

для ссылок не айс :mad:

Я вообще не знаю - кому нужна эта кнопка ))) а скрипт на PHP уже был раньше.

А вообще, можно по клику менять тег viewport, например, меняя увеличение страницы.

Народ!
Всем советую проверить сайты на адаптивность. Гугл, видимо, что-то подкрутил опять в алгоритмах и стал ругаться на "Интерактивные элементы расположены слишком близко". :fire:

Сегодня вот написал человек, у которого просели позиции просто из-за звездочек рейтинга:

https://pp.userapi.com/c850528/v8505...iPKvjYezp4.jpg

Просто звездочки со скриптом на них! А страницы признаны не адаптивными! :dont:

Проверки от Гугла:
https://testmysite.withgoogle.com/intl/ru-ru
https://developers.google.com/speed/pagespeed/insights/
https://search.google.com/test/mobile-friendly

Ну и сторонний, но показывающий такие ошибки
http://adaptivator.ru/

Год назад я тут уже выкладывал очень простой адаптивный шаблон (ссылка была на прошлой странице). Теперь вот сделал еще один!

Шаблон как у сайта Тесла!

http://dikij.com/foto/878.jpg

Прошло 10 лет и я наконец-то набросал свой скрипт поделиться ссылкой в соц.сетях
Это после какого-то очередного обновления, когда Гугл в Пейджспид стал у меня учитывать куки при работе. И уронил скорость загрузки еще сильнее.

Выглядит как-то так:
http://dikij.com/foto/890.jpg

Картинок нет.
Отслеживания нет.
Кнопки можете сами убрать или добавить.
Ничего нет. Обычный ДжаваСкрипт с document.write и минимальными стилями.
Грузится быстрее самой страницы! :D

Цитата:

Сообщение от D.iK.iJ (Сообщение 1492699)

Прошло 10 лет и я наконец-то набросал свой...

Я тут тоже как-то позабавился, чуть с красивостями и SVG:
http://gfns.net/doc/social/7/

Цитата:

Сообщение от qkowlew (Сообщение 1492716)

Я тут тоже как-то позабавился, чуть с красивостями и SVG:
http://gfns.net/doc/social/7/

У меня Адблок плюс режет. Видимо, из-за названия share.js
И еще. Можно окно открывать по центру экрана. Гляньте у меня. Я решение честно нагуглил ))