Как уменьшить размер сайта

Как изменить масштаб страницы в браузере: обновленная инструкция

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайта

Как изменить масштаб страницы в браузере

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайта

Мини-приложения для 11

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайта

Как отключить мини-приложения в 11

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайта

Как вернуть старое контекстное меню в 11

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайта

Не запускается PC Health Check на 11

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайта

Не могу обновиться до 11

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

Как изменить масштаб страницы в браузере

Сегодня многие сталкиваются с проблемой, что информация в окне веб-проводника слишком мелкая и ее неудобно читать. Бывают и другие ситуации, когда рисунки и текст чрезмерно крупные, что не позволяет охватить и быстро проанализировать имеющуюся информацию. Для решения проблемы нужно знать, как в браузере уменьшить масштаб страницы или внести изменения в сторону увеличения. Рассмотрим алгоритм действий для разных программ.

Yandex

По желанию можно изменить масштаб всех или только одной страницы. Рассмотрим каждый из вариантов.

Чтобы изменить масштабирование для всех страниц, сделайте следующее:

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайта

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайта

После входа на определенный сайт можно поменять масштаб в браузере для одной странички. Для этого:

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайта

Изменение масштабирования доступно с помощью горячих кнопок. К примеру, зажатие Ctrl и «+» позволяет увеличить его, а Ctrl и «-» — уменьшить. Альтернативный вариант — использование жестов, но для этого нужно заблаговременно внести необходимые настройки.

Информация о внесенных изменениях хранится в программе, поэтому при очередном входе на страницу внесенные данные будут сохранены.

Microsoft Edge

Чтобы уменьшить масштаб экрана в браузере или, наоборот, увеличить его, можно использовать два пути.

С помощью настроек:

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайта

При необходимости используете комбинацию горячих клавиш. Здесь срабатывание Ctrl и «+» позволяет изменить данные — увеличить масштаб, а Ctrl и «-» — уменьшить.

Internet Explorer

Многие люди еще пользуются веб-проводниками IE. Но перед тем, как увеличить размер страницы в браузере или уменьшить ее, необходимо учесть версию программы. Выделим основные варианты:

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайта

Google Chrome

Одним из наиболее востребованных браузеров считается Гугл Хром. Не удивительно, что пользователи часто спрашивают, как изменить размер страницы именно в этом браузере.

Стандартный способ через меню:

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайта

Для ускорения работы можно воспользоваться комбинацией горячих кнопок. Здесь нажатие Ctrl и «+» позволяет увеличить размер, а Ctrl и «-» — уменьшить.

Для удобства можно использовать настройки браузера для всех страниц одновременно (для видеофайлов, картинок и текста). Алгоритм такой:

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайта

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайта

Mozilla Firefox

Не менее популярный вопрос — как увеличить масштаб окна браузера или текста в Мозилла Фаерфокс. Цель таких действий — улучшение общей читабельности.

Чтобы изменить масштабирование всего сайта в браузере, сделайте такие шаги:

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайта

Как вариант, можно использовать горячие кнопки Ctrl и «+» и Ctrl и «-». Для установки нужного масштабирования для всех страниц одновременно можно использовать приложение Fixed Zoom или, как вариант, Zoom Page We.

Для изменения размера текста:

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайта

При желании можно настроить браузер на применение минимального размера текста для всей страницы. При этом программа сможет изменить отображение с учетом предпочтений пользователя.

Для уменьшения минимального размера:

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайта

Opera

Теперь рассмотрим, как в браузере менять размер сайта или текста для веб-проводника Опера. Пользователи Windows могут сделать такие шаги:

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайта

Чтобы изменить параметр, можно использовать горячие кнопки Ctrl и «+» или Ctrl и «-».

Для дальнейшего удобства можно установить масштабирование по умолчанию. Для этого:

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайта

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайта

После внесения правок все открываемые страницы будут показываться в необходимом размере. Если уже были открыты какие-то сайты, их нужно перезагрузить.

Safari

При желании в браузере Сафари можно изменить масштабирование одной или сразу всех страниц.

В первом случае сделайте такие шаги:

Чтобы изменить только текстовую информацию, в разделе Вид установите Изменять только масштаб текста.

Для изменить масштабирование по всем страницам, сделайте такие шаги:

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайта

После выполнения этих действия шрифт будет изменен для всех страниц браузера.

Как отменить изменения?

При дальнейшем пользовании может возникнуть необходимость отменить внесенные ранее настройки. Здесь нужно действовать с учетом браузера.

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайта

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайта

Для установки стандартного масштаба в размере 100% достаточно нажать Ctrl и «0»

Microsoft Edge — варианты:

Internet Explorer — способы для разных версий:

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайта

Альтернативный вариант — используйте горячие клавиши е Ctrl и «+» или Ctrl и «-» для получения 100-процентного масштаба.

Еще один вариант, как изменить масштаб страницы в браузере — нажать Ctrl и 0 в браузере для сброса информации.

Для возврата к первоначальному формату, если настройки устанавливались для всех сайтов, войдите в меню, Zoom, а там Сброс масштабирования.

Теперь вы знаете, как изменить масштаб страниц в разных браузерах и вернуть настройки к прежнему формату (если внесенные правки уже не нужны).

Источник

Как изменить масштаб страницы в браузере

Рассмотрим как установить масштаб страницы в браузере по умолчанию и как быстро увеличить или уменьшить масштаб на текущей странице / веб-сайте

Многие пользователи испытывают неудобства при просмотре некоторых сайтов — мелкий шрифт, либо наоборот крупный шрифт. Тоже самое касается картинок и остального контента. Либо вообще не устраивает текущий уровень масштаба всех страниц на разных сайтах. Можно настроить единый масштаб для всех сайтов по умолчанию и он будет постоянным, пока вы его не захотите опять вернуть или изменить. Дополнительно можно будет изменить масштаб на конкретных сайтах, браузер его запомнит и будет использовать в дальнейшем постоянно.

Далее приведена подробная инструкция, как увеличить масштаб в браузере или как уменьшить масштаб в браузере, сделать его по умолчанию, и также изменить масштаб для отдельных страниц.

Как изменить масштаб по умолчанию в браузере для всех сайтов

Как изменить масштаб по умолчанию в Яндекс Браузере

Откройте настройки браузера « » и выберите вкладку «Настройки»

И здесь вы выбираете удобный Вам масштаб страниц, который далее будет использоваться на всех вновь открытых вкладках по умолчанию.

Закройте данную вкладку (browser://settings) — все изменения будут сохранены автоматически.

Браузер также запоминает масштаб для отдельных вкладок, который вы задали им отдельно. Так например все сайты будут открываться с масштабом по умолчанию, заданный вами, а определенные сайты будут открываться с масштабом, который вы им установили принудительно. И это очень удобно.

то в ней вы можете увидеть список сайтов, для которых вы установили разный масштаб

Как изменить масштаб по умолчанию в Google Chrome

Откройте настройки браузера « » в правом верхнем углу и выберите вкладку «Настройки»

Здесь, в строке «Масштабирование страницы» вы устанавливаете удобный для ваших глаз масштаб страниц, который далее будет использоваться на всех вновь открытых вкладках по умолчанию.
Закройте данную вкладку (chrome://settings), все изменения будут сохранены автоматически.

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

Данный браузер, как и предыдущий, запоминает масштаб страниц, установленный Вами для конкретных страниц (вы можете установить масштаб для каждой страницы отдельно и браузер его запомнит для использования в будущем).

Как изменить масштаб по умолчанию в браузере Mozilla Firefox

Откройте меню браузера « » (правый верхний угол вашего браузера) и выберите вкладку «Настройки»

Находясь здесь, также можете изменить шрифт, размер и цвет текста по умолчанию.

Как изменить масштаб по умолчанию в браузере Internet Explorer / Microsoft Edge

Internet Explorer обновился и теперь он называется Microsoft Edge.

Откройте Параметры и прочее «» (ALT + F) в правом верхнем углу браузера и выберите вкладку «Параметры»

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайтаMicrosoft Edge — «параметры»

Слева выберите раздел «Внешний вид» и в правом окне установите требуемый масштаб по умолчанию для всех сайтов. Ниже также можете изменить размер и сам шрифт по умолчанию.

После закрытия данного окна (edge://settings/appearance), новые настройки будут сохранены автоматически.

Как изменить масштаб по умолчанию в браузере Opera

Откройте «Простая настройка» в правом верхнем углу браузера, прокрутите в самый низ и выберите вкладку «Перейти к настройкам браузера»

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайтаOpera — настройки браузера

Прокрутите до раздела «Оформление» и установите требуемый масштаб по умолчанию для всех сайтов.

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайтаOpera — изменение масштаба по умолчанию

После закрытия данного окна с настройками (opera://settings), новые настройки будут сохранены автоматически.

Как быстро изменить — увеличить или уменьшить масштаб для веб-сайта

Рассмотрим, как можно уменьшать и увеличивать масштаб отдельных веб-сайтов, они же вкладки.

Использование горячих клавиш для изменения масштаба:

Практически во всех браузерах действует одинаковое сочетание клавиш, для мгновенного / быстрого изменения масштаба веб-сайта, она же веб-страница:

Нажав и удерживая « Ctrl » нажмите кнопку « ➕ » — увеличивает масштаб страницы;

Нажав и удерживая « Ctrl » нажмите кнопку « ➖ » — уменьшает масштаб страницы.

Как быстро увеличить и уменьшить масштаб веб-сайта с помощью колесика мыши:

Самый быстрый и удобный способ изменения масштаба страницы веб-сайта.

Как изменить масштаб для отдельного веб-сайта в браузере через меню — управление масштабом

Яндекс браузер — управление масштабом веб-сайта

Откройте настройки браузера « » и на самом верхнем уровне вы увидите текущий масштаб. Нажимая на «+» или «» установите новый масштаб страницы.

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайтаЯндекс браузер — управление масштабом

Нажав на число по центру вы вернете масштаб к значению по умолчанию — 100%.

В адресной строке справа, нажав на значок масштабирования (лупа с плюсом), вы можете посмотреть текущий масштаб и нажав на кнопку « Сбросить » установить масштаб на 100%.

Google Chrome — управление масштабом веб-сайта

Откройте настройки браузера « » в правом верхнем углу и в строке «Масштаб» измените масштаб нажимая на «+» (увеличить масштаб) или «» (уменьшить масштаб).

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайтаGoogle Chrome — управление масштабом

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайтаGoogle Chrome текущий уровень масштабирования

Mozilla Firefox — управление масштабом веб-сайта

Откройте меню браузера « » (правый верхний угол вашего браузера) и в строке «Масштаб» измените масштаб нажимая на «+» (увеличить масштаб) или «» (уменьшить масштаб).

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайтаMozilla Firefox — управление масштабом

Нажав на число с установленным масштабом, вы установите масштаб по умолчанию — 100%.

Также можно наблюдать текущий масштаб и сбросить его по умолчанию (нажав на него), в адресной строке справа.

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайтаMozilla Firefox текущий уровень масштабирования

Microsoft Edge — управление масштабом веб-сайта

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайтаMicrosoft Edge — управление масштабом

В адресной строке справа, нажав на значок масштабирования, вы можете посмотреть текущий уровень масштабирования. Также его уменьшить, увеличить или сбросить на 100%.

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайтаMicrosoft Edge — текущий уровень масштабирования

Opera — управление масштабом веб-сайта

В данном браузере быстро изменить масштаб можно, только, с помощью Ctrl и колеса прокрутки мыши и также с помощью сочетания клавиш: Ctrl — «+» и «»

В адресной строке справа, нажав на значок масштабирования, вы можете увидеть текущий уровень масштабирования. Можете сбросить по умолчанию на 100%, увеличить или уменьшить масштаб текущий веб-страницы.

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайтаOpera — текущий уровень масштабирования

Мы рассмотрели с Вами все способы управления (изменения) масштабом страниц для всех популярных веб браузеров.

Источник

Как ускорить сайт с помощью gzip, brotli, кэша, минификации и других способов

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайта

В статье:

Зачем уменьшать размер HTML-страницы

С каждым годом вес HTML-страниц в среднем увеличивается. По данным MachMetrics, средний размер веб-страницы в 2018 году — 2МБ, это в три раза больше, чем три года назад. Это происходит, потому что на сайты добавляют более качественные и тяжелые изображения и видео, CSS или JS-файлы.

Большой вес страницы — одна из причин медленной загрузки, поэтому рекомендуем сжимать объекты и избавляться от ненужных элементов. Это не единственная причина медленной загрузки ресурса, на нее влияет много факторов, но всегда лучше исправить то, что доступно.

Пользователи не будут ждать долгой загрузки, максимум, который они ждут — 2-3 секунды на десктопе или 3-4 на мобильном устройстве. Если сайт так и не загрузился, пользователь закроет страницу — для поисковиков это будет значить, что сайт не удовлетворяет задачи пользователей. Поисковики стимулируют веб-мастеров ускорять и облегчать сайты. Обновление Google Speed Update занижает позиции очень медленных сайтов, к тому же Google переводит сайты в Mobile-first index — это значит, что mobile-friendly сайты получат преимущество, десктопная выдача будет строиться на основе мобильной, где особенно важен вес страницы.

Иногда незначительные задержки скорости не критичны, если посетители целенаправленно хотят получить услуги, товары или информацию с конкретного сайта. К примеру, по данным инструмента Google PageSpeed Insights, у сайта amazon.com довольно низкая скорость загрузки с мобильных устройств, но Amazon востребован: пользователи готовы ждать, чтобы делать выгодные заказы.

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайтаАнализ amazon.com

Скорее всего Amazon рассчитывает на то, что пользователи со смартфонов будут скачивать мобильное приложение, поэтому не работает над скоростью мобильной версии сайта.

Измерить скорость загрузки своего сайта и сравнить с конкурентными можно с помощью инструментов Google PageSpeed Insights или Проверка скорости сайта от PR-CY.

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайтаФрагмент результатов проверки

Если хотите ускорить загрузку страницы, то рекомендуем уменьшить ее размер.

Как уменьшить размер HTML

Для уменьшения размера HTML-страницы нужно сжать код и облегчить элементы:

Использовать сжатие gzip или brotli

Сайтам, которым особенно важна скорость загрузки, рекомендуем пользоваться алгоритмами сжатия данных. Способы сжатия дополнительно нагружают сервер из-за операций архивирования, но зато уменьшают размер загружаемых данных и ускоряют загрузку сайта.

Самый популярный алгоритм сейчас — gzip, он появился одним из первых. Gzip поддерживают все серверы и распространенные браузеры. После работы над gzip инженеры сосредоточились на алгоритме, который сжимал бы еще сильнее, и разработали brotli — у него больше степеней сжатия по сравнению с gzip, но на высоких уровнях сжатия его скорость чуть меньше.

Сжатие данных алгоритмами состоит из этапов:

На втором этапе браузер сообщает серверу, какие методы сжатия поддерживает — посылает заголовки Accept-Encoding с кодом, где указаны алгоритмы сжатия, например, «accept-encoding: gzip, deflate, br». Сервер выбирает форматы из доступных: если клиент поддерживает brotli, то сервер ищет суффикс «.br» в заголовке и отправляет клиенту нужный файл. Если его нет, будет использовать другой алгоритм. Если клиент не поддерживает сжатие вообще, сервер отправит несжатую версию.

Какой алгоритм сжатия выбрать: gzip или brotli?

Многие веб-мастера используют оба способа, поскольку brotli позволяет сжимать сильнее, но gzip поддерживают больше браузеров, поэтому он будет использоваться чаще.

Как использовать сжатие gzip

Сжатие gzip уменьшит объем данных, передаваемых сервером хостинга, в браузеры посетителей ресурса. Скорость загрузки из-за этого увеличится, а объем данных уменьшится в несколько раз.

Сжатие gzip для Nginx

В новых версиях Nginx gzip сжатие включено по умолчанию, но если такого нет, его можно настроить. Чтобы запустить сжатие gzip для сервера Nginx, нужно включить сжатие в модуле /etc/nginx/nginx.conf:

Директива «gzip_disable «msie6»» отключает сжатие для эксплорера 5.5 и 6, «gzip_proxied any» позволяет сжимать данные для proxy-серверов.

Уровень сжатия указывают в директиве «gzip_comp_level 6».

Директива «gzip_types text/css text/javascript application/javascript» указывает типы файлов для сжатия на сервере. Перечислите те, которые вам нужны. Cжатие text/html подразумевается и не может быть отключено, если вы не установили gzip off, а text/css и application/x-javascript включает сжатие gzip для файлов CSS и javascript соответственно.

Сжатие gzip можно включать и выключать для каждого «сервера» Nginx — более мелкой структуры, и для конкретного location — еще меньшей, зачастую располагающейся внутри него.

Gzip-сжатие файлов SVG для Nginx

Сжатие gzip будет работать для SVG, если формат векторной графики SVG есть в файле, который обычно располагается по пути «/etc/nginx/mime.types». Добавьте строку изображения «image/svg+xml svg svgz»

В файле конфигурации Nginx найдите «gzip types» и добавьте «image/svg+xml» к концу строки. Получившаяся строка может выглядеть так:

Сжатие gzip для Apache

Сервер Apache для работы со сжатыми ресурсами использует модуль mod_deflate или mod_gzip.

Есть еще такой вариант перечисления типов файлов для сжатия в одной строке:

В строке DeflateCompressionLevel 7 указывают степень сжатия. Сжатие будет работать после сохранения.

Gzip-сжатие файлов SVG для Apache

После вставки и сохранения функция должна работать. Следите, чтобы код в файле не повторялся.

Как использовать сжатие brotli

Brotli поддерживают браузеры Chrome, Firefox и Edge 15 для SSL-соединений. В заголовках должен быть «Accept-Encoding: br». В brotli есть собственный словарь из более сотни тысяч фраз, который используется для сжатия данных. Он же встроен в браузеры, которые поддерживают алгоритм, поэтому словарь не передается в архиве, и архив весит меньше.

Алгоритм сжатия brotli сжимает файлы сильнее, чем gzip. Максимальная степень сжатия у gzip — 9, а у brotli 11, степень 11 brotli дает файл на 25% меньше, чем сжатый 9 степенью gzip.

Некоторые веб-мастера считают, что brotli нет смысла использовать для динамических страниц, поскольку он медленнее gzip. Такое ощущение складывается, если сравнивать параметры по умолчанию: у команды brotli стоит максимальный 11 уровень сжатия, для него нужно больше времени, поэтому процесс сжатия получается медленнее.

Для динамических страниц рекомендуем использовать уровень 5-6, тогда скорость сжатия будет достаточно быстрой. Для статических страниц можно использовать скрипт для сжатия 11 уровня.

Сжатие brotli для Nginx

Сервер Nginx использует brotli при включенном модуле «brotli_static» в конфигурации «brotli_static on». Тогда сервер получит от браузера заголовок, проверит, есть ли в нем файл с расширением «.br» и отдаст нужный файл как архив, сжатый в brotli.

Brotli-архивы нужно установить из репозитория или собрать утилиты:

Для сжатия «на лету» можно установить дополнительный модуль nginx brotli. Модуль Nginx для сжатия brotli «на лету» на Github.

Сжатие brotli для Apache

Сжатие brotli поддерживает Apache версии 2.4.26 и выше.

Как проверить сжатие данных

Алгоритм сжатия данных будет работать сразу после установки кодов. Проверить корректность работы можно несколькими способами.

Для проверки работы gzip есть Check GZIP compressed.

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайтаФрагмент результатов проверки тестом

Google PageSpeed Insights оценит скорость загрузки и покажет список файлов, для которых не работает сжатие.

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайтаФрагмент результатов проверки инструментом

Инструмент «Проверка скорости сайта» от PR-CY оценит скорость и покажет страницы, на которых не работает сжатие.

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайтаФрагмент результатов проверки инструментом

Использовать минификацию HTML, CSS и JS

Еще один способ уменьшить код — сократить его. В коде часто остаются комментарии, ненужные фрагменты, разрывы строк, разделители блоков и лишние пробелы, библиотеки JavaScript, которые не используют. Ненужные символы можно удалить, для этого проводят минификацию CSS, JS, HTML-файлов.

Минификация помогает уменьшить размер фрагментов кода JS, она не влияет на сам файл, но оптимизирует его и уменьшает размер, за счет чего повышается скорость загрузки. Файлы, прошедшие минификацию, получают расширение «.min». После минификации в CSS, HTML, JS-файле не будет разделителей, переносов, лишних пробелов, поэтому его будет сложнее читать.

Бесплатные инструменты для минификации CSS, JS, HTML-файлов

Собрали несколько бесплатных онлайн-инструментов для сокращения кода.

Использовать кэш браузера для ускорения

Ускорить загрузку страницы помогает кэширование в браузере пользователя. При первой загрузке страницы файлы помещаются в кэш браузера с меткой времени, а при повторных посещениях они загружаются из кэша, а не с хостинга. Когда указанный промежуток времени пройдет, файлы обновятся с хостинга. Для кэширования подойдут файлы, которые изменяются не постоянно, иначе пользователь не увидит важных изменений. Статические объекты можно кэшировать от года и дольше.

Google рекомендует настроить сервер так, чтобы он возвращал ответ с HTTP-заголовком Cache-Control, например:

Директива «max-age» указывает, как долго браузер должен кэшировать ресурс в секундах. Значение 31536000 соответствует году: 60 секунд * 60 минут * 24 часа * 365 дней = 31536000 секунд.

Google советует применять «no-cache» для объектов, которые могут обновляться: тогда браузер по-прежнему будет кэшировать ресурс со значением «no-cache», но сначала проверит актуальность на сервере.

Кэширование для Nginx

Для сервера Nginx подходит модуль expires в файле конфигурации. Нужно перечислить форматы файлов для кэширования и указать время хранения кэша:

Время можно указать в любом формате: секунды — s, часы — h, дни — d и месяцы — m, обозначение «max» указывает на кэширование навсегда.

Вместо времени хранения файла можно указать дату следующего обновления файла в кэше:

Строка log_not_found off нужна для снижения нагрузки на сервер, она отключает ведение лога сообщений с ошибкой 404 для перечисленных файлов.

Кэширование для Apache

Метод Cache-Control

Кэширование по времени

Внимательно подойдите к выбору сроков хранения контента, определите временные промежутки, которые подойдут файлам. Если вы планируете изменять какие-то элементы, а в кэш указали долгий срок хранения, то пользователь не увидит обновления, если не будет чистить кэш браузера.

После сохранения нужно обновить страницу.

Проверить кэширование в Google Chrome можно с помощью веб-инспектора Chrome DevTools. Столбец Size в Chrome DevTools поможет убедиться, что ресурс в кэше:

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайта

Столбец Size в Chrome DevTool. Источник — Google

Вкладка Headers покажет, как установлен Cache-Control:

Как уменьшить размер сайта. Смотреть фото Как уменьшить размер сайта. Смотреть картинку Как уменьшить размер сайта. Картинка про Как уменьшить размер сайта. Фото Как уменьшить размер сайта

Проверка заголовка Cache-Control. Источник — Google

Сжать фотографии, иллюстрации и другую графику

На сайтах часто используют много больших графических элементов в хорошем качестве — фотографии в высоком разрешении, баннеры, иллюстрации. Если они много весят, то тормозят загрузку страницы, поэтому их нужно сжать. Даже если для просмотра принципиально важно хорошее качество и большой размер фотографий, есть способы сжимать изображения без визуальных потерь.

Как оптимизировать картинки для сайта:

Инструменты и сервисы для оптимизации изображений на сайте:

Вес HTML-страницы — один из факторов влияния на скорость ее загрузки у пользователей, поэтому ускорить загрузку можно, если облегчить вес страницы. Для этого рекомендуем сжать и сократить код, сжать изображения и избавиться от лишних элементов — неинформативных картинок, тяжелых анимаций и флеша.

Источник

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *