compress image file size on upload?

Question

I am uploading product screenshots to my website... I want to upload the original image as it is and also create a thumbnail for it, but after uploading both the files the filesize of the thumbnail created is a bit larger than expected. Is there any way I could reduce the filesize of the thumbnail without compromising much on the quality in php or by using Imagemagick( which I have no idea how to use but I'm willing to learn if needed)...
Below is the code I'm using to upload my files..

<form action="<?php echo $_server['php-self'];  ?>" method="post" enctype="multipart/form-data" id="something" class="uniForm">
    <input name="new_image" id="new_image" size="30" type="file" class="fileUpload" />
    <button name="submit" type="submit" class="submitButton">Upload/Resize Image</button>

<?php
    if(isset($_POST['submit'])){
      if (isset ($_FILES['new_image'])){
          $imagename = $_FILES['new_image']['name'];
          $source = $_FILES['new_image']['tmp_name'];
          $target = "images/".$imagename;
          move_uploaded_file($source, $target);

          $imagepath = $imagename;
          $save = "images/" . $imagepath; //This is the new file you saving
          $file = "images/" . $imagepath; //This is the original file

          list($width, $height) = getimagesize($file) ; 


          $tn = imagecreatetruecolor($width, $height) ; 
          $image = imagecreatefromjpeg($file) ; 
          imagecopyresampled($tn, $image, 0, 0, 0, 0, $width, $height, $width, $height) ; 

          imagejpeg($tn, $save, 100) ; 

          $save = "images/sml_" . $imagepath; //This is the new file you saving
          $file = "images/" . $imagepath; //This is the original file

          list($width, $height) = getimagesize($file) ; 

          $modwidth = 130; 

          $diff = $width / $modwidth;

          $modheight = 185; 
          $tn = imagecreatetruecolor($modwidth, $modheight) ; 
          $image = imagecreatefromjpeg($file) ; 
          imagecopyresampled($tn, $image, 0, 0, 0, 0, $modwidth, $modheight, $width, $height) ; 

          imagejpeg($tn, $save, 100) ; 
        echo "Large image: <img src='images/".$imagepath."'><br>"; 
        echo "Thumbnail: <img src='images/sml_".$imagepath."'>"; 

      }
    } ?>

Kindly point me in the right direction...Thanks

Answer 1

Don't pass 100 as the quality for imagejpeg() - anything over 90 is generally overkill and just gets you a bigger JPEG. For a thumbnail, try 75 and work downwards until the quality/size tradeoff is acceptable.

//try this
imagejpeg($tn, $save, 75) ; 

Answer 2

Hello @halocursed I just try to compress using your code for different image type like png and gif than image comes black. So, I modify the block of code and good working for jpg, png.

<?php
    if(isset($_POST['submit'])){
      if (isset ($_FILES['new_image'])){
          // print_r($_FILES); die;
          $imagename = $_FILES['new_image']['name'];
          $source = $_FILES['new_image']['tmp_name'];
          $target = "images/".$imagename;
          move_uploaded_file($source, $target);

          $imagepath = $imagename;
          $save = "images/" . $imagepath; //This is the new file you saving
          $file = "images/" . $imagepath; //This is the original file

          list($width, $height) = getimagesize($file); 

          $tn = imagecreatetruecolor($width, $height);

          //$image = imagecreatefromjpeg($file);
          $info = getimagesize($target);
          if ($info['mime'] == 'image/jpeg'){
            $image = imagecreatefromjpeg($file);
          }elseif ($info['mime'] == 'image/gif'){
            $image = imagecreatefromgif($file);
          }elseif ($info['mime'] == 'image/png'){
            $image = imagecreatefrompng($file);
          }

          imagecopyresampled($tn, $image, 0, 0, 0, 0, $width, $height, $width, $height);
          imagejpeg($tn, $save, 60);

          echo "Large image: ".$imagepath;

      }
    } 
?>

Answer 3

75 is the default quality setting, however you'll notice quality decrease considerably if you use it. 90 gives you a great image quality and reduces the file size in half, if you want to decrease the file size even more use 85 or 80 but nothing bellow that.

Answer 4

It should be 60, it stands for 60 percent.

Example: If you open an image in Photoshop and try save it for web and select jpg, you can see that by using 60 it's still under high quality, but lower file size. If you would like lower, with more degradation, meaning the colors are distorted more.

More than 60 does not give you anything better, only larger file size.

It's standard image optimization for web. Keep high quality but keep file size as low as possible.