0 Пользователей и 1 Гость просматривают эту тему.
  • 6 Ответов
  • 1431 Просмотров
*

Artorius

  • Захожу иногда
  • 23
  • 1
Здравствуйте!

Сейчас запускаем сайт на Joomla 3 http://massagkazan.ru/ и столкнулись с верстальщиком на такие ошибки в PageSpeed Insights:
1)
Цитировать
Изменение размера и сжатие изображения по адресу http://massagkazan.ru/images/interior/interior_05.jpg уменьшит его на 301,5 КБ (97 %).
Изменение размера и сжатие изображения по адресу http://massagkazan.ru/images/interior/interior_02.jpg уменьшит его на 297,2 КБ (96 %).
и т.д. - фото интерьера выводимые слайдером на главной.
Дело не в том что мы не сжали без потерь что-то как например ошибки вида
Если сжать без потерь изображение http://massagkazan.ru/images/headers/icon-vk.png, это уменьшит его размер на 2,5 КБ (75 %).
там все это сделано было, как я понимаю он хочет чтобы на мобильной версии сайта подгружались картинки не 1300*900, а с обрезанным исходником.
Я не пойму как это сделать без изменения ссылки сайта. Есть ли какой-то способ реализовать это или обойти ошибку?
Соответственно для ПК такой ошибки нет т.к. 1300 это нормально для монитора.
2) Удалите из верхней части страницы код JavaScript и CSS, блокирующий отображение
Я использовал скрипт мердж и объединил все CSS и js в два отдельных файла и вынес их перед /body (кстати не пойму как этим плагином сделать перед /html)
пару скриптов запретил вручную и вывел перед /html
Но слайдер слетает если вывести jquery.min.js перед /body или /html
Выдает такую ошибку
Цитировать
Удалите код JavaScript, препятствующий отображению:
http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js

Если я убираю этот jquery.min.js и ставлю перед /html то мобильный рейтинг сразу взлетает на 40 пунктов, но слетает слайдер.

Перерыл кучу гайдов но именно на эти два вопроса ответа не нашел, с многими другими ошибками справились.
Заранее благодарю за ответ.
« Последнее редактирование: 20.10.2015, 11:44:06 от b2z »
*

Филипп Сорокин

  • Практически профи
  • 1816
  • 138
Здравствуйте! Попробуйте мой плагин. Буду рад, если он поможет решить Вашу проблему!
Ссылка
Ставь лайк, если согласен, и делай репост!

  => мои публикации
    => мои работы
      => спектр моих услуг
*

Artorius

  • Захожу иногда
  • 23
  • 1
Здравствуйте! Попробуйте мой плагин. Буду рад, если он поможет решить Вашу проблему!
Ссылка
Слушай, классно! Плагин работает!
Сразу ошибки красные с изображениями ушли!
Но только мультивывод изображений не заработал в автоматическом режиме.
Настройки такие - Автоматический
Включить
_small
В слайдере фото http://massagkazan.ru/images/interior/interior.jpg Также я создал и положил рядом с файлом на хосте http://massagkazan.ru/images/interior/interior_small.jpg
Но не подцепляет вроде. Хотя я может не так проверяю. Я просто сузил окно хрома до 300 точек по ширине и перезагрузил страницу. В просмотре кода элемента стандартная картинка. В PageSpeed Insights ошибок нет, хотя и с отключенным Мультивывод изображени тоже нет. Подгрузка спасает!
*

Филипп Сорокин

  • Практически профи
  • 1816
  • 138
Я просто сузил окно хрома до 300 точек по ширине и перезагрузил страницу.

Значение ширины экрана берётся не из CSS свойства width, а из JS свойства window.screen.width, что равноценно CSS свойству device-width, то есть физическим пикселям. Например, iPhone 6 Plus имеет ширину, соответствующую 414 физическим пикселям (device-width). В то время как логических пикселей у данного девайса 980 — значение width = 980px. Так что, проверять надо на девайсах, а не на десктопных браузерах.
« Последнее редактирование: 19.10.2015, 23:17:32 от Филипп Сорокин »
Ставь лайк, если согласен, и делай репост!

  => мои публикации
    => мои работы
      => спектр моих услуг
*

Artorius

  • Захожу иногда
  • 23
  • 1
Филипп, спасибо!

Проблему с jquery.min.js я решил топорно как советовали на хабре http://habrahabr.ru/post/266357/
Просто скопировал код скрипта и вставил этот код в хеад.
Думаю это плохо т.к. ботам поисковиков теперь придется очень долго читать HTML пока они дойдут до контентной части и так делать не рекомендуется, но другого решения пока не нашел.
*

Филипп Сорокин

  • Практически профи
  • 1816
  • 138
Не за что  ^-^

Кстати, если будете пользоваться данным плагином, не пропустите — сегодня будет очень важное обновление с фиксом бага кэширования изображений в автоматическом режиме мультивывода. А через недельки 2 планирую добавить поддержку Retina (high-density) изображений.
« Последнее редактирование: 20.10.2015, 00:16:38 от Филипп Сорокин »
Ставь лайк, если согласен, и делай репост!

  => мои публикации
    => мои работы
      => спектр моих услуг
*

Филипп Сорокин

  • Практически профи
  • 1816
  • 138
Обновите версию: я выпустил патч с фиксом.
Ставь лайк, если согласен, и делай репост!

  => мои публикации
    => мои работы
      => спектр моих услуг
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться
 

Добавить фон-изображение, вместо цвета (решено)

Автор klipius

Ответов: 17
Просмотров: 121
Последний ответ 29.08.2017, 14:28:06
от lexxbry
[Решено] Нет класса active в меню

Автор jimka

Ответов: 2
Просмотров: 80
Последний ответ 29.08.2017, 09:45:56
от jimka
[Решено] Проблема с отображение меню

Автор Wess21

Ответов: 2
Просмотров: 56
Последний ответ 27.08.2017, 21:10:51
от Wess21
Не выводится заголовок изображения вводного текста

Автор fireman

Ответов: 0
Просмотров: 95
Последний ответ 23.07.2017, 22:50:45
от fireman
Вывод изображения тега под материалом

Автор lalalag

Ответов: 0
Просмотров: 116
Последний ответ 13.07.2017, 13:24:43
от lalalag