Images Check List

An adult webmaster resource...

Written by Tom from Tom's Newbie Booster

As adult webmasters we probably use more images than anyone else out there. We've got thumbnails, logos, banners, buttons, photos, and MORE images to deal with. I wanted to make a few notes here on adding IMAGES to porn pages. These are a few tricks that will probably save you some heartache down the road and should help keep those images under control:

1) PATHS - Are the images loading from your hard disk?

If you're using some kind of html editor, such as Frontpage or Dreamweaver, it's easy to make the mistake of having the wrong 'path' to your images. When you add a picture or anything like that to your webpage, it's quite normal for the computer to see the picture on your hard disk and think that THAT's where it will always be. The computer doesn't realize that when you upload that webpage to the Internet, people out there surfing about won't be able to access your hard disk as you can.

Check that the path to your picture is something like this:

<IMG SRC="images/pic1.jpg">

... and NOT this:

<IMG SRC="C:\images\free%20pictures\images\pic1.jpg">

This is such a confusing thing because it will LOOK OK when you're previewing the page on the web. Check the code very carefully and even get a pal to check this out for you. We've all made this mistake...

2) TaKiNg CaRe WiTh cAse

Keep image names in lower case.

Rename any image files from:

Pic1.jpg to pic1.jpg

and...

pic1.JPG to pic1.jpg

Webpages are case sensitive which means that it will see pic1.JPG differently to pic1.jpg. If you link to pic1.jpg but the image name is pic1.JPG - the image could show up as 'broken' - that horribly looking white square that I'm sure you've seen out there on the web.

3) Physical sizes

Check your porn pics ain't to big. The longest side should be around 450 pixels - or UNDER. No-one's going to shoot you for having a pic which is say 500 pixels long, but just don't be tempted to have any MONSTER size pics on your sites. This could eat away at your hosting and you'll get charged more at the end of the month. Use your paint packages - photoshop, paintshop - whatever you prefer, to resize all images so that they are 'web-friendly', and more importantly, hosting bill friendly!

<IMG SRC="./smilies/light.gif"> For your file sizes - keep the pics at around 25kb - 35kb and the thumbnail images, well as small as you dare go. 5kb? That would be fine, but you might be able to get them even smaller.

4) The picture should be the same size ON the page as off...

In HTML / webpage making, when you put a picture on a webpage, you can instruct the webpage to show that picture at a set size. This is specified in width and height in pixels.

Eg:

<IMG WIDTH="450" HEIGHT="300" SRC="images/pic1.jpg">

Whatever size you put in here, will 'overwrite' the size that the picture actually is. So, even if our picture is 600 pixels long on the LONGEST side, the webpage will squish it down to 450 to show the surfers. It doesn't actually alter the size of the picture, it just shows it smaller. This is problematic because it's not efficient. What we should have done here is to shrink the picture down in the paint package FIRST to it's FINAL size - 450 on the longest side. NEVER let the HTML shrink (or s-t-r-e-t-c-h a pic).

5) USE the width and height - one way or another...

As I mentioned just now, you can add width and height to an image. Whether you program HTML by hand, or use an editor to make it easier, there's always a way to add in the width and height. Doing this will make images load faster, so it's important that ALL of your ad graphics have the width and height put on there. Some editors, such as NoteTab Lite will add in the W & H sizes for you, so it's not a great task. And here's a sneaky tip for ya. DON'T add the width and height to your photos - that makes them load slower... think about how to use that one. <IMG SRC="./smilies/wink.gif">

6) Gif or JPEG

The 2 image formats on the web are GIF and JPEG. Gif will show graphics at 256 colors MAX, and is best for flat colors, simple logos and so on. JPEGs show full-color images in millions of lovely colors, and are the way to go for photos. Make sure you choose the BEST format for the image you're working on. Now, that's simple enough right? BUT what about a logo with photos on it? An advert graphic with a photo AND a flat area of color? Experiment saving in BOTH formats. <IMG SRC="./smilies/wink.gif">

7) Distorted images

Girls with boobs that look like scary aliens. Stretched-heads and shrunken heads. BBW girls that are meant to be slim models - I've seen some squished, weird-looking photos in my time! Be sure that when you're saving your images, or when you're specifying the pixel width and height sizes that you're not making anything WEIRD happen with your model. If you want to shrink down a picture, be certain that you shrink the height the same amount as the width. ALL paint packages have a little box that you check (usually 'maintain aspect ratio) which ensures that the picture will NOT be distorted in this way.

8) Relative paths

Let's look at our example here:

<IMG WIDTH="450" HEIGHT="300" SRC="images/pic1.jpg">

This is a relative path. Relative means 'short'! If we were to include the long or 'relative' path to this image, the image tag would then look something like this:

<IMG WIDTH="450" HEIGHT="300" SRC="http://www.mydomain.com/images/pic1.jpg">

Linking to every picture with that LONG path means the browser has to connect to the web the long way round EVERY picture. That's not efficient! We're already on this domain name - what's the point of going back out and then back in again. If you want to get something from your fridge, you don't go out the back door, round the block, and then climb in an upstairs window - you just go straight to the fridge. This works the same way. Always use the short path wherever possible - the RELATIVE PATH.

9) Check the links...

It's very rare that I get anything right first time, and with thumbnail galleries there's so much that can go wrong. Always check out the links on your gallery pages. Make sure that the link goes to the corresponding picture.

Always try to put those pictures on HTML pages - don't just link straight to the bare JPG. You CAN do this, but it sure looks ugly and you're losing a lot of very valuable advertising real estate and MORE pages that could have been added to the search engines too!

10) Alt text

ALT text - it could help with the search engines, and it can also help you sell. Check out one of my articles here:

Using your ALT text...
http://www.tomsnewbiebooster.com/using-your-alt-text.html

.. which should cover the basics.

FURTHER READING:

Troubleshooting image problems
http://www.pageresource.com/trouble/timage.htm

"Fix Your Web Site or Say "Good-Bye" To Sales! "
http://www.firstbusinesswebsite.com/articles/troubleshoot_site.html

Including Images in the Page
http://bip.cnrs-mrs.fr/bip10/images.htm

Using images
http://www.htmal.com/htmal/usingimages.asp

Adding Images
http://www.iweb.net.au/Web101/index5a.html

TOM ^"^


ICQ 12616560
Email tom@tomsnewbiebooster.com

Enter TOM'S NEWBIE BOOSTER

">Printer Friendly Version