Загрузка и хранение картинок на сайте

Дата публикации:

Все о том как хранить и загружать картинки на сайт. Изображения для веб сайта необходимы для визуализации данных, например фото пользователей, или простых картинок котов в постах. Рассмотрим путь изображения, от пользователя до сайта, увидим какие операции проводятся над изображениями после их загрузки на сайт. Узнаем каким должен быть размер изображений и то как правильно их называть.

Загрузка изображения на сайт - что дальше

Для загрузки картинки на сайт, требуется произвести несложную операцию. По перемещению ее в определенную папку:

<?php
foreach ($_FILES["pictures"]["error"] as $key => $error) {
if ($error == UPLOAD_ERR_OK) {
$tmp_name = $_FILES["pictures"]["tmp_name"][$key];
// basename() может спасти от атак на файловую систему;
// может понадобиться дополнительная проверка/очистка имени файла
$name = basename($_FILES["pictures"]["name"][$key]);
move_uploaded_file($tmp_name, "data/$name");
}
}
?>

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

Сжатие изображений, после загрузки

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

То, до каких размеров сжимать картинки, можно узнать исходя из нужных действий. Например, если вы хотите выводить на экран, картинки в виде галереи по 50 и более изображений, имеет смысл создавать тумбнэйлы (thumbnails). Это значит, что при выводе страницы галереи, необходимо загружать картинки максимально малого размера для увеличения скорости загрузки.
Thumbnails - обычно очень небольшого размера, до 128 пикселей в ширину и высоту. Они значительно выигрывают по скорости загрузки с оригиналом изображения, так как имеют небольшой вес.

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

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

Как называть изображения для сайта

Имена это отдельная история, которая будет

Новый коментарий
Реклама