Умный CDN OptiPic
CDN OptiPic — простое решение проблемы "Используйте современные форматы изображений"
Умная конвертация в WebP на лету
Что делает CDN OptiPic при попытке запросить у него изображение:
- Отдает Webp-версию изображения
если браузер поддерживает WebP - Отдает сжатую версию без Webp
если браузер не поддерживает WebP - Адаптирует под узкие экраны
если изображение открывается с мобильного - Кеширует и ускоряет загрузку
снимая нагрузку с вашего хостинга - Защищает
ваши изображения
сохраняя авторство через EXIF и IPTC теги
Конвертация в Webp и сжатие изображений происходит в фоновом режиме и никак не замедляет отдачу изображений.
Если оптимизированная версия еще не готова на момент запроса изображения - отдается исходная версия без какой-либо обработки.
Если оптимизированная версия еще не готова на момент запроса изображения - отдается исходная версия без какой-либо обработки.
Что дает оптимизация изображений на сайте
- Ускоряет
сайт - Улучшает
SEO - Увеличивает
конверсию - Улучшает Google
Pagespeed Insights
Как работает умный CDN OptiPic?
Конвертирует в WebP - передовой формат изображений Решает проблему "Используйте современные форматы изображений" в Google Pagespeed Insights
Если посетитель вашего сайта использует браузер, поддерживаемый формат WebP, то CDN отдает ему именно WebP-версии изображений (WebP-версии генерируются автоматически на стороне CDN).
Почему стоит использовать WebP?
Использование Webp решает проблему "Используйте современные форматы изображений" в Google Pagespeed Insights.
Если вкратце, то WebP сжимает файл лучше при прочих равных, чем более старые форматы (png и jpeg) - а значит занимает на хостинге меньше места и быстрее загружается в браузере при просмотре страницы.
Внедрение WebP активно пропагандируется Google-ом - они предоставляют такую статистику:
- WebP сжимает изображения без потерь на 26% лучше, чем PNG.
- WebP сжимает изображения с потерями лучше, чем JPEG на 25-34% при одинаковом индексе структурного сходства (SSIM)
- WebP поддерживает прозрачность без потерь (известную, как альфа-канал) при увеличении размера всего лишь на 22%.
Сжимает изображения
Если браузер посетителя не поддерживает Webp, то посетителю отдаются изображения в исходном формате (png/jpeg), но предварительно сжатые/оптимизированные.
Адаптирует под мобильные телефоны
Если посетитель открывает сайт с мобильного телефона, то изображения не только автоматически сжимаются или конвертируются в Webp, но и автоматиечески уменьшаются по ширине (чтобы еще сильнее ускорить загрузку изображений при мобильном интернете)
Кеширует и ускоряет загрузку
Изображения не будут каждый раз конвертироваться, оптимизироваться и сжиматься на лету при каждом запросе. Все эти процедуры CDN проведет единоразово для запрашиваемого изображения. В фоновом режиме, чтобы не тормозить отдачу изображений посетителю вашего сайта.
Как подключить CDN OptiPic?
Вариант #1: Используйте плагин для вашей CMS
или
просто укажите адрес своего сайта
мы автоматически определим CMS и предложим подходящий модуль интеграции
Вариант #2: Универсальное подключение через PHP (GitHub библиотека)
URL изображений на сайте изменяются автоматически. Достаточно лишь добавить 1 строчку в ваш
.htaccess или php.ini.Пример подключения через .htaccess
php_value auto_prepend_file "<SITE_ROOT_DIRECTORY>/optipic-cdn-php/optipic-cdn-php/auto_prepend_file.php"
Пример подключения через php.ini
; Automatically add files before PHP document. ; http://php.net/auto-prepend-file auto_prepend_file = <SITE_ROOT_DIRECTORY>/optipic-cdn-php/optipic-cdn-php/auto_prepend_file.php
Документация и примеры нашей php-библиотеки на GitHub
Бесплатная помощь в подключении
Проверьте, загружается ли картинка через CDN OptiPic
CDN: Конвертер url изображений в документе
Бесплатная помощь в подключении
Проверьте, загружается ли картинка через CDN OptiPic
CDN: Конвертер url изображений в документе
Библиотека на GitHub
бесплатное внедрение по запросу
Вариант #3: Универсальное подключение через Nginx (проксирование)
URL изображений на сайте не изменяются. Просто теперь весь трафик изображений автоматически перенаправляется на CDN OptiPic
# OptiPic CDN: insert it into the Server structure
location ~* \.(png|jpg|jpeg)$ {
resolver 8.8.8.8; # Google DNS
set $cdn_host_value "cdn.optipic.io";
set $from_optipic "yes"; # to disable CDN OptiPic - set "no" value
if ($arg_no_optipic) {
set $from_optipic "no";
set $cdn_host_value $host;
}
proxy_redirect off;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header Host $cdn_host_value;
if ($from_optipic = "yes") {
rewrite ^/(.*) /site-XXXXXX/$1 break;
proxy_pass http://$cdn_host_value;
}
# get-param ?no_optipic=1 - get image from your hosting directly (without CDN OptiPic)
try_files $uri 404;
}
XXXXXX — id вашего сайта в личном кабинете CDN OptiPicНастоятельно рекомендуем проверять корректность новой версии конфига перед перезагрузкрой nginx. Сделать это можно командой
nginx -t. Мягко перезагрузить (перечитать конфиги) nginx можно командой
nginx -s reloadДокументация по проксированию в Nginx
Бесплатная помощь в подключении
Проверьте, загружается ли картинка через CDN OptiPic
Бесплатное внедрение
даже на бесплатном тарифе
Вариант #4: Подключение через .htaccess (Apache проксирование)
URL изображений на сайте не изменяются. Просто теперь весь трафик изображений автоматически перенаправляется на CDN OptiPic
#---------------------------------------
# OptiPic CDN
# Requires enabled Apache modules: `rewrite`, `proxy_module` and `proxy_http_module`
# Add new 'IfModule mod_rewrite.c' block or inject into exist one
# Get support: https://optipic.io/get-free-help/?cdn=1
<IfModule mod_rewrite.c>
RewriteEngine On
SSLProxyEngine On
RewriteCond %{QUERY_STRING} !no_optipic=
RewriteRule "^(.*)\.(jpg|jpeg|png)$" "http://cdn.optipic.io/site-XXXXXX/$1.$2" [P]
</IfModule>
#----------------------------------------
XXXXXX — id вашего сайта в личном кабинете CDN OptiPicПеред модификацией
.htaccess настоятельно рекомендуем сделать бекап файла и убедиться в наличии доступа к файлу по FTP.Бесплатная помощь в подключении
Проверьте, загружается ли картинка через CDN OptiPic
Бесплатное внедрение
даже на бесплатном тарифе
Вариант #5: Просто измените URL картинок на вашем сайте!
Было
не оптимизированным
<img src="/upload/foo/bar/image.png">
Стало
автоматически оптимизированным
<img src="//cdn.optipic.io/site-XXXXXX/upload/foo/bar/image.png">
XXXXXX — id вашего сайта в личном кабинете CDN OptiPic
Начните прямо сейчас с БЕСПЛАТНОГО пакета
Гарантия качества
Если Вы не удовлетворены своей покупкой, вы можете связаться с нами в течение 30 дней со дня покупки. Если на то будут основания, то мы вернем полную или частичную стоимость Вашей покупки.
Оплата единоразовая — никаких ежемесячных платежей
Купленный пакет не сгорает в конце месяца - выгодно приобретать на несколько месяцев вперед
Вы платите за показы изображений с CDN. Итоговая стоимость использования зависит от объема трафика на ваш сайт. В среднем это от 100 руб за 1 млн показов изображений.
Первые демонстрационные 100,000 показов — бесплатно!
Первые демонстрационные 100,000 показов — бесплатно!
Вы можете сконвертировать свой баланс классического OptiPic в баланс OptiPic CDN
Конвертация происходит по формуле:
ClassicBalanceBytes / 1000
где ClassicBalanceBytes - баланс классического OptiPic (в байтах)
Примеры конвертации:
1 ГБ (1 073 741 824 байт) --> 1 073 741 просмотров
100 МБ (104 857 600 байт) --> 104 857 просмотров
Конвертация происходит по формуле:
ClassicBalanceBytes / 1000
где ClassicBalanceBytes - баланс классического OptiPic (в байтах)
Примеры конвертации:
1 ГБ (1 073 741 824 байт) --> 1 073 741 просмотров
100 МБ (104 857 600 байт) --> 104 857 просмотров
WordPress 
Joomla 
1С-Битрикс 
OpenCart 
Drupal 
Magento 
OkayCMS 
PrestaShop 
Yii 
Laravel 
Symfony 
Zend Framework 
MODx 
AMIRO.CMS 
CakePHP 
CodeIgniter 
CS-Cart 
CubeCart 
DataLife Engine 
DIAFAN.CMS 
FuelPHP 
HostCMS 
InstantCMS 
Jigoshop 
NetCat 
osCommerce 
Phalcon 
PHPixie 
RokQuickCart 
Shop-Script 
Simpla 
SiteEdit 
Slim 
TomatoCart 
Ubercart 
UMI.CMS 
VirtueMart 
WooCommerce 
X Cart 
Zen Cart 
Zeuscart 
Piwigo 
AdvantShop 
AFCommerce 
