Uploading and displaying pictures

In the Silver INGOT there is a requirement to learn about basic HTML tags and preparing images etc for an e-portfolio. Ceating Blog pages is essentially the same. If you are going straight into the Gold INGOT it is worth taking a look at this link. The stuff on pictures is at the end but here is some more that is similar.

Prepare your picture to be the right size and quality. If it is a photo or screen shot you need it as a jpeg. Load it into a photo editing program (GIMP is free from GIMP.org.) edit it and save as or export as a jpeg. Its worthwhile spending a bit of time preparing the image. You want the file size as small as possible or your page will be slower to open. Experiment with the software to make the file size as small as possible for the image to look an acceptable quality. Here is a screen shot that is 70k saved as a jpeg at 20% quality from GIMP.

To put in this picture I went to attachments and browse and found the picture in my home director on my computer. Selected the image file and opened it then clicked add. This uploads the file. Finally click submit to say you are really sure you want this file to stay in the files on the server. Once the file is available on the server you can display it on the page. To do this click on the picture of a tree on the left of the rich-text tool bar. In image URL put the URL in the attachments section. In this case http://theingots.org/community/files/active/0/Screenshot.jpg.

Image description is just screenshot. Alignment left and dimensions 200 x 200. Below is the same image with dimensions 300 x 400. If you make the dimensions too big, some people with small screens might not fit it in the page.

The next image is the screen shot scaled to 200 x 200 in GIMP first and then displayed. This has reduced the size of the file from 70k to just 3.5k. So you are better to use your image editing software to get the image to just the right size and clarity first and then upload it and display it, it will make your pages much more efficient.