Обрезка однотонных полей у изображений

Часто изображение содержит однотонные белые рамки. Они не несут никакой полезной функции и только увеличивают размер изображения. Это замедляет загрузку изображения и страницы в целом.

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

Демонстрация работы и код PHP функции, обрезающей изображения:

Демонстрация

PHP код

HTML код

Открыть демонстрацию Скачать код примера

<?php
/**
 * Вам нужно установить imagemagick.
 * Для убунту это делается так apt install imagemagick
 */

$data = exec("magick photo.jpg -trim photo_crop.jpg", $output);
$data = array_pop($output);
?><!DOCTYPE html>
<html>
    <head>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <style>
            .grid {
                display: grid;
                grid-template-columns: 1fr 1fr 1fr;
                grid-gap: 10px;
            }
            img {
                width: 100%;
                border:2px solid black;
                border-radius: 5px;
            }
        </style>
    </head>
    <body>
        <div class="grid">
            <div>
                Исходная картинка
                <img src="./photo.jpg" />
            </div>
            <div>
                Обрезанная картинка
                <img src="./photo_crop.jpg" />
            </div>
        </div>
    </body>
</html>

<!DOCTYPE html>
<html>
    <head>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <style>
            .grid {
                display: grid;
                grid-template-columns: 1fr 1fr 1fr;
                grid-gap: 10px;
            }
            img {
                width: 100%;
                border:2px solid black;
                border-radius: 5px;
            }
        </style>
    </head>
    <body>
        <div class="grid">
            <div>
                Исходная картинка
                <img src="./photo.jpg" />
            </div>
            <div>
                Обрезанная картинка
                <img src="./photo_crop.jpg" />
            </div>
        </div>
    </body>
</html>

ПРО подписка для работы с сервисом

ПРО подписка

Для регулярной работы над сайтом или группой сайтов.

1 580 ₽

3500 страниц в неделю. Срок подписки — 1 месяц.

Баланс пополняется ежедневно на 500 страниц. Максимум баланса - 3 500.
1 страница даёт 1 запуск инструмента Проверка страницы или 1 внутренняя HTML страница вашего сайта в инструменте Проверка сайта
До 50 страниц в одной проверке в инструментах удаление неиспользуемого CSS/JS
Неограниченные проверки в инструментах пальцеприятность и отзывчивость интерфейса