Everyone knows “a picture is worth a thousand words”. Adding graphics to your website can enhance your content and make the message of your site clearer. However, adding graphics randomly for the sake of having them is not the best use of your layout space. Here are a few basic principles regarding graphics and webpage layouts.

Every single website graphic is square or rectangular. Circle graphics simply do not exist. You disagree? Try saving any circular looking image onto your computer and opening it in a new program. Even though it looks round, it’s really not. Why are there only square graphics? Well, it’s because of the way computers display images. Georges Seurat developed a style of painting that uses dots to form pictures, called pointillism. This is what a computer does. It uses pixels, or tiny dots to craft graphics. “But even those dots are not round, they too are square.” When you use tiny squares to make an image, the resulting picture is square or rectangular as well.

You might ask how graphics look circular if they are made up of square pixels. This is a great question. There are actually two techniques that make this possible: anti-aliasing and transparency. Anti-aliasing is a process where the computer makes the curve look blended by altering the saturation for each pixel. For example if a pixel is half one color and half another, the saturation is reduced to fifty percent. This way, even though our eyes see the blur, our brains interpret it as a crisp curve. Next in order to make the curve look like the edge of the graphic, the background color must be specified.

This is not a problem if your website background is white or black, but what about a brightly colored background? This is where transparency comes in. Transparency tells the web browser to display the graphic without the background color showing. This allows your site’s color to show through. However, website design experts do recommend that, “transparency is done on one color of your images. So if you are trying to create a curved edge with anti-aliasing, you should create the curve on a background color palette the same (or close) to what your background will be on your Web site.” Almost all of the major graphics software programs today use both anti-aliasing and transparency to aid website designers in creating amazing graphics to enhance their layout.

Do you agree or disagree?  Perhaps, I missed something?  Either way, I would just love to hear what your thoughts are on this topic… just let me know your alive!