- Поисковые системы
- Практика оптимизации
- Трафик для сайтов
- Монетизация сайтов
- Сайтостроение
- Социальный Маркетинг
- Общение профессионалов
- Биржа и продажа
- Финансовые объявления
- Работа на постоянной основе
- Сайты - покупка, продажа
- Соцсети: страницы, группы, приложения
- Сайты без доменов
- Трафик, тизерная и баннерная реклама
- Продажа, оценка, регистрация доменов
- Ссылки - обмен, покупка, продажа
- Программы и скрипты
- Размещение статей
- Инфопродукты
- Прочие цифровые товары
- Работа и услуги для вебмастера
- Оптимизация, продвижение и аудит
- Ведение рекламных кампаний
- Услуги в области SMM
- Программирование
- Администрирование серверов и сайтов
- Прокси, ВПН, анонимайзеры, IP
- Платное обучение, вебинары
- Регистрация в каталогах
- Копирайтинг, переводы
- Дизайн
- Usability: консультации и аудит
- Изготовление сайтов
- Наполнение сайтов
- Прочие услуги
- Не про работу
Переиграть и победить: как анализировать конкурентов для продвижения сайта
С помощью Ahrefs
Александр Шестаков
Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий
Всем привет!
Мы знаем, что extract critical css - это хорошо, гугл в своем pageSpeed нам как бы намекает.
Также мы знаем, что критические стили можно сделать для любого разрешения экрана.
Устройств много, разрешений экранов тоже, плюс еще плотность пикселей разная, всем не угодишь. Но адаптивный дизайн имеет брейкпоинты, в которых он, как правило, "складывается" в высоту.
И критические стили нам нужно сделать только для этих брейкпоинтов.
То есть, например, для широких экранов экстрагируем стили width > 1200 px.
Дальше у нас есть, допустим брейкпоинт 960px, где у нас меняется менюшка. Настраиваем экстрагирование для width > 400 px < 959 px. Короче, phantomjs для нас достанет любые критические стили.
Только меня вот какой вопрос мучит:
- чтобы инлайнировать в <head> клиенту подходящие критические стили в браузере нам надо знать ширину экрана клиента т.н. css screen width в пикселях на сервере.
Сервер, конечно, не может этого знать, поэтому он по юзер-агенту обращается к какой-то там матери (deviceAtlas или wurfl). И получает искомое. Только искомое стоит 40 и 500$ в месяц, что конечно, печаль.
Может есть другие пути?!? =((
Я не заморачиваюсь с выделением стилей для каждого разрешения. Смысл critical css в том, чтобы сайт, пока грузится, как-то выглядел и не выглядел как говно. Поэтому извлечь стили для шапки сайта или для первого экрана достаточно.
При необходимости конечно можно предположить возможную ширину по юзерагенту. Есть (пока ещё) сервис яндекса, бесплатный. https://github.com/yandex-php/php-yandex-detector
Оптимизайка, сервис вроде устарел, не?
Да, я понимаю, что слегка заморачиваюсь - под каждый брейпоинт свои критические стили.
Ну, блин, хочется сделать все по красоте -)