Embedded Files
Gimp Instructions
Gimp Instructions
You can use GIMP (or Photoshop) for your website images. It is important to size and compress your images for the website to reduce user issues and page load times.
You can use GIMP (or Photoshop) for your website images. It is important to size and compress your images for the website to reduce user issues and page load times.
There are other tools available for image compression and manipulation. See options on the Wiki list here: https://en.wikipedia.org/wiki/Comparison_of_raster_graphics_editors
Installing GIMP
Installing GIMP
Go to https://www.gimp.org/downloads/ and click “Download GIMP directly” to begin the installation.
Once the download is complete, click on the .exe file downloaded and follow the installation wizard.
These are some common pictures sizes. If you have questions about what size your picture should be, feel free to contact webmaster@sdsmt.edu.
Image Sizes
Image Sizes
Image Type (Width pixels x Height pixels)
Personnel Directory 135x190
2-Column Banner 788x340 or 800x300
3-Column Banner 536x232 788x318
Full Width
Homepage Banner
Icons 128x128
Methods
Methods
To scale your image down to the proper size, you only need to use one of the two methods listed. We will be using a faculty directory image as an example. To view GIMP tutorials on how to size images, go to: https://www.gimp.org/tutorials/GIMP_Quickies/
Method 1: Using a Template
Method 1: Using a Template
In the top left corner, use the drop down “File” menu to choose “New”.
The final image should be no larger than 135x190 pixels. Enter 135 as the width and 190 as the height. Click “Ok”. This will create a white template for your image.
In the top left corner, use the drop down “File” menu to choose “Open”. Navigate to your image file and click “Open”.
If your image needs cropped, see the “Cropping” section.
Right click your image, click “Edit”, and “Copy”.
Go back to your template file (click on the white template tab.)
Right click inside the template, click “Edit”, and “Paste in place”. (You will only be able to see the top left part of your image and the rest should have a dotted line.)
Right click inside this blank dotted section (where you can’t see your image), click “Tools”, “Transform tools”, and “Scale”. You should now see your image again and boxes around the edges that you can click and drag. In the scale window that pops up, be sure the "chain-link" aspect ratio is kept, or make sure to hold down the shift-key if you are scaling with the handles. You may have to click the "chain-link" box to be sure it is closed.
Correct:
Incorrect:
7. You may have to zoom in or out to see the entire image which is found in the bottom left of the work area (shown in green below). You can also use the move tool (shown in orange below).
8. Drag these boxes in so that your image fits into the template which is now highlighted yellow. When you are finished and the scale window has a width less than or equal to 135 pixels and height less than or equal to 190 pixels, click the “Scale” button.
9. The image will now look very blurry; this is normal and will look fine once on the website.
10. You may have to crop the white space from the template out so all that remains is the image.
Method 2: Scaling without a template
Method 2: Scaling without a template
To scale the image, click the “Image” drop down menu at the top of the screen and click “Scale Image”.
Enter 135 as the width and hit tab. The height will automatically fill in.
Important note: If the height is greater than 190, change the width or height until the proportions are less than or equal to 135x190. You may have to crop the image differently as well.Once you are finished, click the “Scale” button. The image will shrink and will now look very blurry; this is normal and will look fine once on the website.
Cropping
Cropping
Double click the crop box tool to display the crop window in the bottom left corner. Or, right click your image, click “Tools”, “Transform Tools”, and “Crop”.
In the crop window, be sure everything is unchecked. Click and drag to select your entire image. Then, drag the sides of the image in until it is as cropped as you want. Once you are finished, hit enter.
Exporting
Exporting
Click “File” in the top left corner and “Export As…”. If the new image doesn’t automatically save as a JPG/JPEG, click the plus box to the left of “Select file type by extension” and select JPEG image. Navigate to where you want the image and click “Export”.
A popup with appear.
In the “Export Image as JPEG” window that pops up, check “Show preview in image window” and you’ll be able to see the file size. If this is not under 50kb, lower the quality using the slider bar until it is the smallest possible size without being pixelated.
Click export when you are done.
Notes:
Because of how GIMP compresses images, it is most likely not fully compressed. If it is not under 10kb, you will have to compress it again.
and click “Upload Files” in the center of the page
Navigate to the image you just edited. If you scroll down the page, it will say how large the compressed image now is.
Click apply.
If the image is still not under 10kb, email this compressed image and the original to webmaster@sdsmt.edu for troubleshooting.
If image is under 10kb, your image is ready to upload into Ektron.
Windows Photos Instructions
Windows Photos Instructions
The default photos app on Windows 10 and 11 also has tools available to resize and edit the quality of photos.
Cropping
Cropping
Click the edit button at the top of the image
Click this button and select 16:9 in the menu that pops up below. It will automatically crop the image to that ratio. Once that is done, move the image around in the window until the content you want is framed.
Save the image in the aspect ratio and framing that you set, either as a copy or regular save
Editing size
Editing size
To edit the size, first click the 3 lines on the right side of the menu bar on the top of the image.
To edit the size, first click the 3 lines on the right side of the menu bar on the top of the image.
Select resize image from the menu.
Next, set the pixel width to the width you need and the height will change according to the aspect ratio, be sure to follow the size table shown above.
The final step is to set the quality of the image. The higher the quality the better, however the size must be under 50 KB. Once done, save the image and it can be uploaded onto the website.
Page updated
Google Sites
Report abuse