Make you web site load quicker using Photo Optimization

Photo Optimization is necessary to allow a web page to load in the shortest amount of time possible. Fast loading time require small files. This article discusses the methods used for photo optimization. 

In an ideal world, a web designer could use the highest quality photos and have the webpage download lightening fast. Fast loading requires small file sizes for pictures. Unfortunately, there is a trade off between picture quality and file size. 

Web surfers are a notoriously impatient bunch. If a website takes too long to load, they will just click away and never come back. 

Computer monitors can only display images at 72dpi (dots per inch). So the first step in photo optimization is to reduce the resolution to 72 dpi. Large picture can be sliced up into smaller ones and the put back together on the web page. Each piece will be a very small file and together will load in a fraction of the time a single image file would load. 

Most graphic files contain information about the color palette of the image. This information is usually unnecessary for displaying on the web. Many graphic programs included the ability to “Save for the web”. This option discards all of the unnecessary information in the file without any loss of picture quality.

Another method that appears to speed up load time is to use either the GIF or PNG interlaced or the JPEG progressive property. Both of these properties allow the picture to load gradually as first a blurry image that becomes sharper and clearer. In reality the picture actually loads a fraction of a second slower than the regular formats do but it appears to load faster the site visitor. 

Width and Height IMG Attributes 

The HTML tag tells the web browser to create a specific sized box to hold the graphic. That way the browser can continue loading the rest of the web page while the graphic file is downloading. If you don’t put the width and height attributes, the web browser must pause until the images is downloaded before it can load the rest of the page.

How Many Images should you use? 

Some web designers use images for everything. While it may look good, it will definitely slow down the speed of the page loading. Page loading speed in the sum of the HTML file plus the size of all of the embedded files. Images constitute more than 50% of the download time. 

Using fewer images will speed download time and just may keep a visitor from bailing through impatience. 

Photo Quality 

Photo quality is determined by the clarity, color purity and detail of a photo. Use a graphic editor to remove noise and other unwanted features. Most editors allow you to correct red-eye and sharpen edges to improve clarity. 

Professional editors like Fireworks or Photoshop will let you change the background, adjust the color levels and do almost anything else you want to do to the photo. 

You can also use a thumbnail on the webpage that links to a larger and higher resolution version of the image so that people who want to can view it. 

Photo Optimization Guidelines 

The following suggestions will allow you to optimize your photos for fast download times without sacrificing picture quality:

• Change the resolution of all images to 72dpi.
• Convert graphic text into stylized text.
• Crop the images to the actual size needed.
• Minimize color depth when it’s not necessary for quality.
• Specify the actual width and height of all images.
• Use thumbnails where appropriate.

Bottom Line – Graphics should enhance the content of a web page except in that rare occurrence where the images are the content. In either case, you need to optimize photos and other graphic files to allow for the fastest downloading time possible for the web page otherwise you risk losing the visitor forever. 

Author: Warren Baker 

Communicating Your Needs to your Web Designer

Communicating with a web designer can be the most difficult part of the hiring process because you and the web designer don’t speak the same language when talking about the details of a website. This article explains how to get your ideas across to the web designer you want to hire. 

Ok, so you’ve decided to hire a professional web designer to build your website. You spent some time looking for the right person. Eventually you found the right web designer that you believe will design the most “remarkable”, “extraordinary” website the internet community has yet seen. 

So now what? Explaining to the web designer the layout design you have in your mind can be a very frustrating process. You will find that putting the “picture” in your mind into words can be a difficult task. Actually in most cases this is the biggest hurdle between you and the final outcome. No matter how talented the web designer is, if you can not communicate with him properly, in his own professional language, he will not be able to use his talent to achieve your design. 

There are two possible situations you may face:

1. You know what content you want on the website but have no clue how to present it to the user.
2. You know what content you want on the website, and you have the layout in your mind, but you don’t know how to implement it.

In both cases you will need to explain your thoughts to the web designer. Although most people who read those lines are probably thinking that being in the second situation is better then being in the first situation. However, real life experience shows the opposite to be true. Giving a web designer the complete freedom of action regarding the web design based solely on the website content is usually a smart thing to do. You will find that explaining to the web designer what the nature of your website is, whether it’s a product that you want to sell or a hobby item, is much easier then trying to explain to him the temperate of the color schema or an undefined shape that you would like to have in the website header. 

Actually for both of the situations, I would suggest you use the same approach, but with a minor modification to each situation. If you know of a website that has all the features you want or need and/or a site that looks the way you want your site to look, be sure to give the site’s url to the web designer. Doing so will give him some idea of want you want. You will both be looking at the same thing but will actually look at it from a different angle. Therefore, it may be better to give him more than one website as an example. The more websites you find that can express your feelings and/or needs, the easier it will be for web designers to understand your intention without you having to use a single “technical” term. Chances are that you won’t find a single website that has all of the feature you want. After all, if such a website already exists there would be no place for your new web site to be born. Use several websites to express the different features you want. Spend as much time as necessary until you find just the right websites to provide examples of your needs. Doing research at this stage will definitely save you a lot of time later trying to point the web designer in the right direction. 

Although you are the one who needs to express your self to the web designer, you must learn to listen to him as well. When he uses technical terms, ask for their meaning. Do not finish any part of the conversation unless you are absolutely sure that both sides are on the same page. Remember that when a web designer speaks about the temperature of a color, he is not talking about the next day’s forecast. 

Remember, you hired a professional web designer because you want a professional looking website and you couldn’t do it yourself. So, trust the web designer’s judgment when they tell you something you want won’t work or isn’t the best way to accomplish your goals. After all, you are paying them for their expertise. Don’t try to tell them how to do their job. 

It is OK to require that a web designer gets your approval each step of the way so you can tell them if one of your goals isn’t being met. Also, if you really don’t like how something looks and want it changed, tell them immediately. Don’t wait until everything is done and then decide you don’t like it. 

A final word about cost 

You have agreed on what needs to be done and the web designer has given you a price quote. Simple modifications and bug fixes are usually included in the price. However, other major changes or outright revisions may or may not be included. Make sure the agreement states what is included, what constitutes a revision rather than a fix, and how many changes you can make after delivery without incurring additional costs. 

Author: Warren Baker