User's Manual
Chapter 6: Accessing Functions from the Back-end: Manager
Joomla! 1.0.11 User Manual 62 Version 1.0.1.
There are two things to note about the thumbnail:
TheTrashbuttonallowsyoutodeletetheimagefromthefolder.
TheEditbuttonallowsyoutogeneratetheimage’spathnameintheImage/URLcode
field.
Notes on images:
1. I have found it best to keep the image file names as short as possible. Use lower case letters
and/or numbers without spaces. I always use the underscore, _, to put gaps in a file name if
I need it, e.g. camp_tent.gif.
2. Remember to keep files and image sizes small.
3. File Size – Someone asked why a web page with one small image and a lot of text took over 1
minute to load. The answer was simple:
(A) The original image, which was large, was scaled down to a small image size in the
browser and was, therefore, still the same file size. When you resize your image on your
web page, you have done nothing to the file size. What you are actually doing is telling the
browser to re scale the image on the fly. This creates a lot of work for the browser.
4. When you use an image-editing program to resize the image, and save it as a .jpg or a .gif, you
have actually created a smaller image and, therefore, a small file size.
5. If you want to optimise your images, the first thing you need to know about is the three image
formats recognised by your web browser.
6. gif: These are gif (pronounced jif as in Jiffy), .jpg/jpeg (pronounced Jay-Peg) and .png
(pronounced ping). .gif, jpg and png files are compressed. That means that information has
been organised inside the file in a special way to minimise the file size.
7. The difference between gif, jpg, and png files is the way that they compress the data.
JPG: JPG compression is designed to optimise photographs or images with fine gradations
of colour.
8. PNG: GIF compression is designed to optimise images with large continuous areas of colour,
such as illustrations. The PNG file format for image compression is expected to replace the
Graphics Interchange Format. The PNG format was developed by an Internet committee
expressly to be patent-free. It provides a number of improvements over the GIF format. Like
a GIF, a PNG file is compressed in lossless fashion (meaning all image information is
restored when the file is decompressed during viewing). A PNG file is not intended to
replace the JPEG format, which is ’lossy’ but lets the creator make a trade-off between file
size and image quality when the image is compressed.
9. Typically, an image in a PNG file can be 10 to 30% more compressed than in a GIF format.
An image of around 19.5K in size will take approximately 3.5 seconds to download at
56Kbps. Although broadband access to the Internet is becoming increasingly common, do
not forget to design your site for the lowest common denominator. Dial up access still
represents a significant number of Internet users.
10. Image Dimensions: Refer to the dimensions of your template to avoid adding a large image
that will stretch the width of your template, particularly if you are using a fixed width Table.
For example, if I have a fixed width Table of 760 pixels and a block on the left hand side of
150 pixels for the menu, this leaves me 610 pixels to play with for the main body of the site.
If I insert a 500-pixel width image and want to wrap my text around it, this leaves me just
110 pixels width for text. This might be too narrow.
UsingtheImage/UrlCode
The image/url code allows you to insert the <img> tag, with its correct pathname, into a Content
Item without using the {mosimage} tag.