HTML Help

dmomm · Joined: 22 Sep 2009 Posts: 1

My first website, okay? Please be kind. (-:

How do you tell the image to be smaller in html? I don't want to go back to Photoshop to resize it. Is that even possible?

Here's my code so far:

<p align="center">
<img src="web hdr.jpg" alt="Lakeview UCC Church"

width="1000" height="157">
</p>

sticks464 · Joined: 31 Dec 2006 Posts: 2627

You can change these numbers to any size you want.
width="1000" height="157"
Reducing it with the browser will not keep it in proportion like photoshop will. It takes less that a minute to resize in photoshop and is the best way.

PayneLess Designs · Joined: 28 Feb 2007 Posts: 4289 Location: MS

This is a proper image tag: Code: <img style="width: XXpx; height: YYpx; border: 0;" src="Path to image" alt="Text Description">

DO NOT USE COMPOUND folder and file names: "web hdr.jpg"

Change to one of these:

web_hdr.jpg
web-hdr.jpg
webhdr.jpg

Some browsers will not accept white space in a file name and will not be able to load the file.

In your case, just reduce the width/height of those attributes, but do it so it maintains the same aspect ratio: w:h

1000:157 is an aspect ratio of 6.3694267:1

If you reduce the width by 1/2 to 500 (px), then the height will be 500 / aspect ratio or 500 / 6.3694267 = 78.5 (px). Can't have half a pixel so round up/down. Using conventional math rounding techniques, 78.5 will be just 78. Then: Code: <img style="width: 500px; height: 78px; border: 0;" src="web_hdr.jpg" alt="Web Header"> [/code]

cfaj · Joined: 13 Apr 2009 Posts: 4

sticks464 wrote: You can change these numbers to any size you want.
width="1000" height="157"
Reducing it with the browser will not keep it in proportion like photoshop will. It takes less that a minute to resize in photoshop and is the best way.

Reducing it in the browser will keep the same proportions if you only specify one dimension.

If you want to specify both, make sure you use the correct proportions. I use this script (called prop) to get the final dimension:

Code:
awk "BEGIN { print ($2 * $3) / $1; exit }"

I call it with, for example:

Code:
prop width height newwidth

Or:

Code:
prop height width newheight