I was wondering if anyone can teach me how to optimize an image when a user uploads? I would like to reduce the size quality of the image so when I show it on my page, it will load faster.
Thank you
Use GD or ImageMagick:
http://php.net/manual/en/book.image.php
http://php.net/manual/en/book.imagick.php
Take a look to http://www.white-hat-web-design.co.uk/articles/php-image-resizing.php, examples are very easy to follow.
Added: I recomend you to keep the source image in its original size and create the resized one in a different folder.
Added: According to documentation, the function imagecopyresampled used by the class, does some kind of optimization:
_imagecopyresampled() copies a rectangular portion of one image to another image, smoothly interpolating pixel values so that, in particular, reducing the size of an image still retains a great deal of clarity. _
Anyway, if you want more fine tune, as #mingos said, you can use ImageMagick, it's a bit harder, but there is a lot of samples here: http://www.imagemagick.org/Usage/
Related
I'm currently trying to speed up the websites we develop. The part I'm working on now is to optimise the images so that they are as small (filesize, not dimensions) as possible without losing quality.
Our customers can upload their own images to the website through our custom CMS, but images aren't being compressed or optimised at all. My superior explained this is because the customers can upload their own images, and these images could be optimised beforehand through Photoshop or tools like it. If you optimise already optimised images, the quality would get worse. ...right?
We're trying to find a solution that won't require us to install a module or anything. We already use imagejpeg(), imagepng() and imagegif(), but we don't use the $quality parameter because of reasons previously explained. I've seen some snippets, but they all use imagejpg() and the like.
That being said, is there a sure-fire way of optimising images without the risk of optimising previously optimised images? Or would it be no problem at all to use imagejpeg(), imagepng() and imagegif(), even if it would mean optimising already optimised images?
Thank you!
"If you optimise already optimised images, the quality would get worse. "
No if you use a method without loose.
I don't know for method directly in php but if you are on linux server you can use jpegtran or jpegoptim ( with --strip-all) for jpeg and OptiPNG or PNGOUT for png.
Going from your title, I am going to assume compression
So, lets say a normal jpg of 800x600 is uploaded by your customers.
The customers jpg is 272kb because it has full details and everything.
You need to set tresholds for filesizes at dimensions what is acceptable.
Like:
if $dimensions->equals(800,600) and file_type($image) =='jpg' and file_size($image) > 68kb
then schedule_for_compression($image)
and that way you set up parameters for what is acceptable as an upper limit of file size. If the dimensions match, and the filesize is bigger, then its not optimised.
But without knowing more details what exactly is understood about optimising, this is the only thing I can think of.
If you are using a low number of images to compress, you might find an external service, such as: https://tinypng.com/developers might be of assistance.
I've used their on-line tools for reducing filesize on both JPG and PNG file manually but they do appaear to offer a free API service for the first 500 images per month.
Apologies if this would be better as a comment than an answer, I'm fairly new to stackoverflow and haven't got enough points yet, but felt this may be a handy alternative solution.
Saving a JPEG with the same or higher quality setting will not result in a noticeable loss in quality. Just re-save with your desired quality setting. If the file ends up larger, just discard it and keep the original. Remove metadata using jpegran or jpegoptim before you optimize so it doesn't affect the file size when you compare to the original.
PNG and GIF wont't lose any quality unless you reduce the number of colors. Just use one of the optimizers Gyncoca mentioned.
I've read many articles and discussions in forums and I still cann't figure out the difference between resizing a large image with php(not with html) and creating thumbnails. Except for the fact that the most people suggest phpthumb and imageMagick for thumbnails I don't understand why I should or not prefer to use these and not php functions like imagecreatefromgif(png,jpeg) and imagecopyresampled which can do this job(according to what I read.). What I'm trying to do is to create many galleries, so I want the images the user uploads to be resized in a smaller size if they are too large. Moreover, I need these images to be resized in smaller pictures that will be shown to gallery and when the user clicks on them they get their real size. So far, the user can upload an image that will be saved in a folder. I resize my images for galleries with html(which I know it's wrong) and I use fancybox for clicking and enlarging part with which I am satisfied. Please help understand the difference and give me the your advice what is the best thing to do. Thanks
Take this scenario.
I'm a highly equiped professional photographer and your photo application will store every image I take. I shoot in RAW so my images are massive. I also want to upload the original hi res JPEGs.
Now if you do not resize these images to thumbnails (by whatever mechanism you choose), if I try and view a particular album, I might have to load a 10x 20Mb images, only to have them resized down to 80x60pixels (and become totally crackling/noisy and extremely pixelated).
So what can you do?
Resize the images on your server, using something like ImageMagick as you suggest to generate multiple versions of this image.
This way you can deliver optimzed qualities for every occassion.
You should always intend to display an image in it's native resolution/dimension to avoid rastering or resizing noise.
And also, you want to save the different versions of the images.
imagecreatefromgif() will use the GD library by default.
Some reasons why one might prefer ImageMagick are detailed here and here.
That said, if you're happy with what you've got already and if there's no realistic chance of running into any GD dealbreakers later on, you certainly may reasonably decide to stay with what you have.
I am working on a site at the moment, that requires the admins of the site to be able to upload pretty much any size of image, I then need to find a way to get the image down to the size required for the front end of the end the site, all this needs to be done without know what size of image the user is uploading, but the image always needs to scale to 209x293 without looking awful.
Is this even possible?
You should argue with your client, to forget that rule(accept ANY image), and accept rather, only images in that proportion, or better, you can use a tool to crop the image, forcing the user to crop an image in your needed resolution.
Jcrop is a library in Jquery which can help you a lot if you want to create that cropping feature.
Don't know your precise requirements, but since you tagged it with CodeIgniter, you can check out the Image Manipulation Class which has everything you need to do the job.
Not knowing the size of images before uploading is, you know, quite a common problem...Just be careful of the MAX SIZE, which is set in your php.ini.
You might find useful also the page on file uploading right in php's manual.
I am writing an PHP script to upload image files to the server and I have a few questions?
Is there a way to decrease the size of images in terms of kilobytes?
When I am using those files what is the best practice to embed those images into page? I mean do I always have to download the whole page?
Lastly, When resizing the pages(like 250X250 pixels) what is the pratice in order not to face the resolution problems?
I hope my questions are not too general. Thanks in advance!
Take a look at this http://www.webmotionuk.co.uk/php-jquery-image-upload-and-crop/ - There are many other free tools out there to convert images after the upload. The resolution shouldn't be an issue that is usually a problem when you give a size to an image object in html that is huge and not proportioned.
Here is another php resizer I have used this code before to do what you are requesting.
Is there a way to decrease the size of
images in terms of kilobytes?
You'll need to create a new image, based on the one you received.
You should first take a look at the PHP GD functions.
For instance: http://ch2.php.net/manual/en/function.imagecreatefromjpeg.php
When I am using those files what is
the best practice to embed those
images into page? I mean do I always
have to download the whole page?
What do you mean by embedding?
If you are talking about decreasing the size of the image before is uploaded, you can't with PHP, unless you use something like HTML5/Flash to pre-process the file before being sent.
What you want to do, after a user uploads that image, verify that the file is a real image, then using some library (if you use a framework, it probably has a way to resize images) resize the image to whatever max width or max height or max width and height you are wanting.
This will decrease the size of an image.
For the 2nd question, if I understand it, you are talking about what about when a user uploads a 500x500 and you want it to be 400x250, then you must scale and crop, this way the image is never stretched but a few pixels from the top or the bottom will probably be removed.
So I'm in the middle of working on a website that deals with photographs. A user uploads their original photograph and GD library creates a smaller sized image of the same photo. However, when comparing a manually sized down image with the GD one, the GD image seems to lose quite a bit of color quality like it had been slightly desaturated. Any alternate suggestions or ways to improve this?
Thanks!
I'd advice using imagemagick for handling anything serious about photos.
besides quality, you'll find using imagick functions like more convenient
Imagick::cropThumbnailImage()
Imagick::thumbnailImage()
Use imagecopyresampled instead of imagecopyresized. It gives much better quality. Also, try NOT to use GIF images as output.
Wow, the answer is imagemagick. Easier to use and maintains the full photograph quality!