Thank you, Cary, for answering my questions.
Cheyenne
Help in critiquing website
-
- Rank III - Intermediate
- Posts: 86
- Joined: Wed Sep 20, 2006 1:57 pm
- Location: CA
John Zeman
You posted the following on April 7, 2007:
Anyhow------
My main question is how do I perform what you are suggesting. The only thing I find online on compression is putting the file into a zip.
I also like your idea of the reduced size and making a small photo (jpg) or gif opening into full size with a click.
You posted the following on April 7, 2007:
I have Windows Photo Gallery/Paint - and - Vista Home Premium. Would Irfanview do just as good if not better?I would reduce the original photos down using the Photoshop, PaintShop Pro or whatever graphics program you use, saving them as JPGs with medium compression. Then if you want the full sized photos available you could make the reduced sized ones on the page clickable, where a click on a small photo would open the full size image.
Anyhow------
My main question is how do I perform what you are suggesting. The only thing I find online on compression is putting the file into a zip.
I also like your idea of the reduced size and making a small photo (jpg) or gif opening into full size with a click.
-
- Rank III - Intermediate
- Posts: 54
- Joined: Sat Dec 11, 2004 2:17 pm
IrfanView will work fine, it's been so long since I've used Paint I don't remember much about it. The compression I mentioned has nothing to do with zipping files, it's an option you can set with IrfanView (or whatever imaging program you use that supports creating JPGs) when you save a jpg. High compression in a jpg results in smaller file sizes but less quality whereas low compression does the opposite. It has nothing to do with the image size (dimensions), you set that separately with IrfanView.
Here's a little snippet of code from one of my pages where I display a clickable thumbnail image which opens another page containing a larger version of it.
Here's a little snippet of code from one of my pages where I display a clickable thumbnail image which opens another page containing a larger version of it.
Code: Select all
<p><a href="nw-arrowwood-1.html"><img src="nw-arrowwood-t.jpg" width="150" height="99" border="0" alt="" title="">
<br>
Arrowwood Resort, Okoboji</a></p>
-
- Site Admin
- Posts: 3785
- Joined: Sat Dec 11, 2004 9:23 am
- Location: Near Dallas, TX
Also, what I do is reduce the resolution by resizing the image. Digital photography is my hobby so when I post a photo somewhere, I will crop it and resize it and then use the "save for the web" feature in Adobe Photoshop Elements. It's great in that it will show you a preview and tell you how large the file will be before you actually save it.
After cropping, I usually resize images so that they're 720 pixels wide, but if you're doing thumbnails, they'll need to be much smaller than that.
Also check the web for tutorials about this. I'm sure there's a lot of useful info out there.
There's also programs that will do most of it for you, like ACDSee's "create HTML album" tool. But if you want to make sure these tools are generating good HTML and have the time to correct any problems, then you should run any created HTML through CSE HTML Validator. I usually don't have the time to do this (but would if the page was important).
After cropping, I usually resize images so that they're 720 pixels wide, but if you're doing thumbnails, they'll need to be much smaller than that.
Also check the web for tutorials about this. I'm sure there's a lot of useful info out there.
There's also programs that will do most of it for you, like ACDSee's "create HTML album" tool. But if you want to make sure these tools are generating good HTML and have the time to correct any problems, then you should run any created HTML through CSE HTML Validator. I usually don't have the time to do this (but would if the page was important).
Albert Wiersch, CSS HTML Validator Developer • Download CSS HTML Validator FREE Trial
-
- Rank III - Intermediate
- Posts: 54
- Joined: Sat Dec 11, 2004 2:17 pm
Code: Select all
Digital photography is my hobby
-
- Site Admin
- Posts: 3785
- Joined: Sat Dec 11, 2004 9:23 am
- Location: Near Dallas, TX
Yep... I spend "too much" money on it too, at least that's what my wife would say.John Zeman wrote:You too eh Albert? I've always enjoyed photography but since the digital age I've really gotten into it. I probably spend way too much $$$ on equipment and software but I love every minute I'm playing with my "toys".Code: Select all
Digital photography is my hobby
Albert Wiersch, CSS HTML Validator Developer • Download CSS HTML Validator FREE Trial
-
- Rank III - Intermediate
- Posts: 86
- Joined: Wed Sep 20, 2006 1:57 pm
- Location: CA
Cary:
Regarding your post of July 4
I finally got a chance to do your suggestion. Wow, what a difference your CSS code made!
I've downloaded and installed Lightbox 2 you suggested on July 11. Instructions for installing are at www.huddletogether.com/projects/lightbox2
Two questions that were not answered in their forum, huddletogether.
1)Do I put lightbox.js in the CSS sheet or the web page. If so, where?
2)All of my jpgs and gifs are <img src>. Do I need to change them all to <a href=....>?
Thank you!!!
Regarding your post of July 4
I finally got a chance to do your suggestion. Wow, what a difference your CSS code made!
I've downloaded and installed Lightbox 2 you suggested on July 11. Instructions for installing are at www.huddletogether.com/projects/lightbox2
Two questions that were not answered in their forum, huddletogether.
1)Do I put lightbox.js in the CSS sheet or the web page. If so, where?
2)All of my jpgs and gifs are <img src>. Do I need to change them all to <a href=....>?
Thank you!!!
-
- Rank II - Novice
- Posts: 46
- Joined: Sun Oct 01, 2006 2:18 pm
- Location: CA
Yes I see you've made the changes to your Snaggs-Photos page. And you can easily change the space around images simply by adjusting the margin styling. However, I did notice a typo when you copied the styling. You have "border-styl" instead of "border-style", though this doesn't really matter unless the image is a link.Cheyenne wrote:I finally got a chance to do your suggestion. Wow, what a difference your CSS code made!
After you unzip the zip file, you should have 3 folders (css, images, and js). Put all of them in the same location on your site.Cheyenne wrote:I've downloaded and installed Lightbox 2 you suggested on July 11. Instructions for installing are at www.huddletogether.com/projects/lightbox2
Two questions that were not answered in their forum, huddletogether.
1)Do I put lightbox.js in the CSS sheet or the web page. If so, where?
Then add the following lines to the head of your html if your page will be using the lightbox scripts (only pages containing links to images will be able to make use of lightbox):
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen">
Modify all the above paths so they point correctly to wherever you have placed the three folders on your site. As they are, the paths assume that the folders are in the same folder/directory as the html page.
If they're all <img src> then you don't need to (in fact you can't) use lightbox, but if you have larger versions of the images, then you can change them to <a href=....> image links and then make use of lightbox.Cheyenne wrote:2)All of my jpgs and gifs are <img src>. Do I need to change them all to <a href=....>?
Normally, you would use lightbox to enhance a page which already has thumbnail images linking to larger image files.
So instead of this:
<a href="images/image-1.jpg" title="my caption"><img src....></a>
You would have this:
<a href="images/image-1.jpg" rel="lightbox" title="my caption"><img src....></a>
The additional code activates lightbox.
-
- Rank III - Intermediate
- Posts: 86
- Joined: Wed Sep 20, 2006 1:57 pm
- Location: CA
Cary:
Thank you for your help.
I also found out more about Lightbox at
http://www.dynamicdrive.com/dynamicinde ... /index.htm
I'm not to sure I'll change the current sigs I have, but this information is very important to me.
Thank you for your help.
I also found out more about Lightbox at
http://www.dynamicdrive.com/dynamicinde ... /index.htm
I'm not to sure I'll change the current sigs I have, but this information is very important to me.