Подгоняем сайт под мобильники и планшеты

В среднем по кухне у меня планшеты и телефоны стали достигать почти четверть трафика. Поэтому стало важно что бы эти пользователи не терялись. Доброжелательный Google стал присылать мне телеги о том что мол я виновен в том что мобильные пользователи на твоем сайте просто теряются и уходят. Сначала я думал что добавить META viewport - вполне достаточно. Однако пристально взглянув в мобилок на сайт я понял что работы тут намного больше. 1. Итак, по пунктам, что я применял: Проще всего конечно поставить хороший CSS Framework и успокоиться. Из них я обожаю Imperavi Kube. В этом случае все элементы сайта начнут прыгать по ширине так что смотреть их на телефоне становиться более менее удобно. 2. Добавить в шаблон <meta name="viewport" content="width=device-width, initial-scale=1.0"> 3. Подгонять шрифты и блоки так что бы выглядело красиво. Я некоторым блокам даже стал присваивать значения исходя из ширины экрана. Это сделано чисто на JavaScript: $("h1, #range").css("font-size", ($('body').width() / 16) + "px"); 4. И проверять на телефонах и планшетах. Проверять и проверять. И кстати у Google есть сервис где могут вам чего-нибудь подсказать по делу.
🔘 Бесплатная Раскуртка сайта
🧮 Апдейты ИКС
🏆 История ТОП LinkFeed
🏆 История ТОП Trustlink