Web Programming and Design: Images and Thumbnails



Get Web Design Tips and Tricks on mps-web-design.com. Web Programming and Design: Images and Thumbnails topic will increase your understanding on Web Design Tips and Tricks. We at mps-web-design.com only provide news, articles, information in Web Design Tips and Tricks. Web Design Tips and Tricks at mps-web-design.com provides the most up to date news and articles. If you have questions please do not hesitate to contact us.

Let's start with an example so you see where we're going to with this article. Consider a listings type site; in this case, let's think of a real estate website which lists properties. Each property has a picture. You have a page where you list all properties in a given neighborhood, about 20 properties per page. For each property, you display a smaller version of its picture (this is called a thumbnail), and a brief description of the property, so site visitors can click on the property they like to learn more about it. The problem is: this page takes really long to display in the browser.

There is a high probability that this problem is related to the images. You need to analyze how your site generates the thumbnails. In many scripts, the thumbnails are just the original pictures, but displayed in smaller width and height. If this is the case, then each picture takes too long to load. You should change this approach and generate real thumbnails of each picture. You also need to change your script to work with the images thumbnails, and not just the original big images.

There are different ways to generate the thumbnails:

1) Using a graphics program. You load the original image, and resize it to the thumbnail size. Then you save it with a different file name. For this approach to work, your script must let you upload the big image for each property, and also the thumbnail.

2) Your script can generate the thumbnails automatically when pictures are loaded, and save them on the server. You only need to upload the big picture. If your script is written in Php, for example, this can be accomplished by using Php image functions, which make use of the gd graphics library. These functions let you generate thumbnails in different image formats like gif, jpg and png.

3) Your script can generate the thumbnails on the fly and serve them directly to the browser. This will save storage space in the server, but requires a lot of server processing time. It is not recommended if you have many images, or if your site has many daily visits.

The important aspect to remember here is that you should not resize original images to show them as thumbnails, especially if you're showing several of these images on the same page. It will not only slow the page load in the browser, but it will also use a lot of extra bandwidth you can save.


Make Money With Your Digital Camera. - Sell Photos, Images, Screensavers and more ways to profit.
Classified Ads. - Cgi Programming.


Article Index: | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79



More Articles:


1. Protecting Your Website From Online Thieves - Part 2
Prevention cures copyright In this design article, we will go over the most important steps to take for protecting your web site and web graphic images from these online thieves. 1. Place a copyright notice on every web page The first thing to do is display your copyright notice on the bottom of your home page - and preferably on all pages of your web site. This copyright notice should be followed by the year of publication and your company name, such as: © 1997-2006, Swift Media UK. All rights …

2. Helpful Tips On Building A Website By Tara Grant
When you think about building a website, you need to take into consideration what others may think, not just what you like! Even though you may like it or think it is cool, your visitors may not! Here are some great things to keep in mind when you are building a website or when you maintain a website! Your website is a reflection of your business, products and services, so you want to keep a professional clean look at all times!Here are just a few very simple design tips to keep in mind!Sites …

3. Creating Your Own Website
Please feel free to use this article in your Newsletter, eZine,or Website in its entirety including the resource box. Pleasenotify me of publication by sending a Website link or a copy ofyour eZine/Newsletter when published tomailto:dallas@sellwritingonline.com Thank you. If you'd like to see more available articles by Dallas Franklin,visit: http://sellwritingonline.com ips.html Article Title: 'Creating Your Own Website' Author Name: DallasFranklin Contact Email Address:mailto:dallas@sellwriting…

4. Intelligent Design - Basic Design Guidelines
When talking about intelligent design, we are not talking about the creation of man. Nope, this is more important! The creation of your media and site products. There are some very basic things about design that one can learn that can vastly improve one's ability to make appealing and intelligent creations. Some of those things are: 1. Lining Things Up 2. Using Variation 3. Giving Breathing Room 4. Using the Grid 5. The Golden Section 6. Lining Things Up Things that line up look nice. Thin…