brelade,
1. This code snippet should work as is, but is not what you should use. Try
inserting the snippet, and then I will explain why you shouldn't use it as
written (and by the way, I don't pretend to be a coder...or that this hacked
together piece of code is the proper way to write it ;-) Insert the
following and do a web page preview:
<a target="_blank"
href="
http://www.breladecockerspaniels.co.uk/images/cocker_spaniel_dogs/toby_head.jpg"><IMG
SRC=
http://www.breladecockerspaniels.co.uk/images/cocker_spaniel_dogs/toby_head.jpg
ALT="Toby Head" border="0" width="120" height="175"></a>
The primary reason this snippet shouldn't be used as is...because it is
importing the same, large, high resolution 705 X 1024 image as it links to,
but it is importing it into a 120 X 175 space. You should have a "thumbnail"
size image that you are importing into that space to save loading time.
You should resize and optimize the image you want to import into the page
and upload it to your images file. I assumed that you wanted a thumbnail
that is 120 pixels wide, which dictated almost a 175 pixel length to
maintain the aspect ratio of the picture. However, when you resize your
image in an image editing program to 120, then note what the length is, and
substitute in that length instead of the 175. As you are going to optimize
the images, you can use 72 dpi for the smallest and fastest loading image,
or 96 dpi for a larger, slower loading, but "best quality" image, assuming
the viewer has there monitor set to view at 96. As you are linking to a
"best quality" image, I would suggest sticking with the 72 dpi for the
thumbnail imported into the page, as you want to maximize loading
speed...not quality. Just experiment with your thumbnail size and
resolution.
And for that matter, if you are going to do this, you should also resize and
optimize the large picture too. You are bypassing the "compress graphics"
feature in Publisher when you approach things this way. It appears to me
that your large image is over 2 megs, and is probably in its original
resolution and size. 2 megs is too large....takes me 10 minutes on my
dial-up connection to load the darn thing. Guess who is not going to wait.
Assuming that you do make a thumbnail picture, and you call it
"toby_head_120.jpg" then just change the link accordingly. Note change
border to 1 and you will get a border. And of course you can change the Alt
tag to anything you want from "Toby Head" (mouseover the image in web page
preview and it will show the Alt tag).
<a target="_blank"
href="
http://www.breladecockerspaniels.co.uk/images/cocker_spaniel_dogs/toby_head.jpg"><IMG
SRC="
http://www.breladecockerspaniels.co.uk/images/cocker_spaniel_dogs/toby_head_120.jpg"
ALT="Toby Head" border="0" width="120" height="175"></a>
Also when you get ready to size the html code fragment box, I would suggest
temporarily inserting the thumbnail image into the page, and sizing it full
size: Format > Picture > Size Tab and Scale at 100%. Then you can size the
code fragment box the same size by use the snap to function. Just move the
code fragment box over to touch the inserted thumbnail, and change the
dimension of the box to exactly the same as the thumbnail. Then you can
delete the thumbnail picture.
As per question 2...yeah, you can. I will give you an example snippet, but
you should figure out the tags and such yourself. I spent a lot of time on
sites such as
http://www.htmlgoodies.com/ reading about html tags, and such,
and experimenting. You can do the same, but this will get you started. Try
inserting this code snippet:
<a target="_blank"
href="
http://www.breladecockerspaniels.co.uk/images/cocker_spaniel_dogs/toby_head.JPG"onclick="NewWindow(this.href,'name','800','625','yes');return
false"><IMG
SRC="
http://www.breladecockerspaniels.co.uk/images/cocker_spaniel_dogs/toby_head.JPG"
ALT="Toby Head" border="0" width="120" height="175"></a>
Have fun....DavidF
