Question

Problem: When designing the website I sometimes used width: xxx; on images. That way I was able to adjust the images. However, that creates overhead in size.

Solution: Automatically fetch all images which have a width: propery. Resize them to that :width property keeping the dimensions. Save the file as a .gif on the computer.

Does anyone know a good solution?

Answer 1

You can do it using GD (if you have GD or GD2 enabled on your php instalation)
http://php.net/image

<?php
    function resizeImage($image,$width=null,$height=null){
        if(!$width and !$height) return false;
        $info = getimagesize($image);

        if(!$height) $height = $width/$info[0]*$info[1];
        if(!$width) $width = $height/$info[1]*$info[0];

        $new = newEmptyImage($width, $height);
        $resource = imagecreatefromgif($image);

        imagecopyresampled($new,$resource,0,0,0,0,$width,$height,$info[0],$info[1]);

        return imagegif($new,$image);
    }
    function newEmptyImage($width,$height){
        $new = imagecreatetruecolor($width,$height);
        imagealphablending($new, false);
        imagesavealpha($new, true);
        $bg = imagecolorallocatealpha($new,0,0,0,127);
        imagefill($new,0,0,$bg);

        return $new;
    }
?>

now you can simply call resizeImage("example.gif",120);