Одним из главных моментов для лендинга является быстрая загрузка его целевой страницы. Чем дольше она грузится, тем больше вероятность того, что посетители просто уйдут, не дождавшись…
Сейчас я расскажу, как уменьшить вес лендинга, чтобы он быстрее загружался. Для этого нам необходимо ужать фотки и ужать скрипты.
Для того чтобы ужать фотки, будем использовать сервис https://tinypng.com/
В папке с сайтом берем все фотографии с расширением jpg и png и перетаскиваем их drag & drop. Видим, что ужимается их вес, и скачиваем в ту папку, куда сохраняет браузер.
Далее вы просто подменяете их на сервере, копируя поверх, т.к. имя у них одинаковое, и различаются они только размером. Это первый шаг.
Далее обратимся к сайту https://www.base64-image.de/.
Здесь мы поступаем аналогичным образом. Все фотографии на сайте сервера выделяем и перетаскиваем системой drag & drop.
Дальше смотрим код страницы index.html, открывая редактором, например, Notepad+, и, одновременно в браузере.
Чтобы проверить нашу кодировку, для примера, берем любую фотографию с сервера, смотрим, как она выглядит в браузере, нажимаем в окне кодировки show code, далее нажимаем последовательно select all copy и to clipboard , и заменяем в файле index ее название вместе с расширением на полученный, закодированный.
Да, имя нашей фотографии заменилось на вот такую длиннющую запись. Таким образом поступаем со всеми картинками лендинга.
Просматривая лендинг мы и не догадаемся, что наши картинки теперь в другой кодировке, пока не перетянем в строку браузера и увидим, что ее имя – та длиннющая строка. Мы также можем вообще удалить теперь картинки с сервера, но они все равно будут отображаться на нашем лендинге.
Теперь следующее – это скрипты.
Для того чтобы поменять скрипты, воспользуемся сервисом https://unused-css.com/ В положенное место вводим название сайта, жмем remove Unused CSS.
1) здесь нам показывают скрипты, css файлы, которые нужно оптимизировать.
2) вводим свой e-mail, куда пришлют уже оптимизированные скрипты с таким же именем, которое у вас на сервере.
Вам только нужно будет заменить эти скрипты.
Вот таким образом можно оптимизировать страницы для скорейшей их загрузки.
Также смотри все вышеописанное в моем видео