image size specification: optional?

I'm in the practice of specifying img width and height in my style
definitions, although I usually use the actual size of the image. I'm
reworking the style and it would be convenient to leave image size
unspecified unless I need to change its dispayed size.

What, if any, are the reasons why an image size should be specified in
a stylesheet if it will be displayed in its actual size?

--
Haines Brown

Haines Brown wrote:

I'm in the practice of specifying img width and height in my style
definitions, although I usually use the actual size of the image. I'm
reworking the style and it would be convenient to leave image size
unspecified unless I need to change its dispayed size.

What, if any, are the reasons why an image size should be specified in
a stylesheet if it will be displayed in its actual size?

Because the image may be downloaded after the main content. By
specifying the size, the browser knows how much space to leave for it.

If it doesn't know, other content may be moved around after loading to
accommodate the image. If your user is halfway through reading the first
paragraph only to have all the text shift around, it can be very
distracting.

Why not put it in the <img> tag? I don't see that as presentational
markup - it is a property of the image file.

--
Mark.
http://tranchant.plus.com/

Haines Brown <brownh (AT) teufel (DOT) hartford-hwp.com> wrote:

I'm in the practice of specifying img width and height in my style
definitions, although I usually use the actual size of the image. I'm
reworking the style and it would be convenient to leave image size
unspecified unless I need to change its dispayed size.

What, if any, are the reasons why an image size should be specified in
a stylesheet if it will be displayed in its actual size?

Image dimensions should normally be specified in the markup. As always,
CSS is optional and the purpose of specifying dimensions for
embedded/replaced content is to allow the UA to layout a page before the
dependencies have finished downloading, or perhaps the UA is configured
not to load the dependencies at all.

--
Spartanicus

On Thu, 05 Aug 2004 13:46:28 GMT, Haines Brown
<brownh (AT) teufel (DOT) hartford-hwp.com> wrote:

I'm in the practice of specifying img width and height in my style
definitions, although I usually use the actual size of the image. I'm
reworking the style and it would be convenient to leave image size
unspecified unless I need to change its dispayed size.

What, if any, are the reasons why an image size should be specified in
a stylesheet if it will be displayed in its actual size?

By omitting the height and width of an image in the HTML, the browser
cannot leave sufficient space for the image when the page is rendered
before the image is downloaded. As a result, the visitor experiences
distracting and annoying jumping around while the image loads.

I do not think it's wise to leave this out of the HTML. Perhaps there is a
PHP solution where the image element is generated based upon the
properties of the image to be included, but I have insufficient knowledge
of PHP to advise on this. Short of this, the only way to dependably let
the UA allow proper space for the image while rendering is to use the
height and width attributes in the image element.

CSS should always be viewed as an optional enhancement of the HTML
content. Pages which cannot function without CSS are not properly designed.

"Neal" <neal413 (AT) yahoo (DOT) com> wrote

On Thu, 05 Aug 2004 13:46:28 GMT, Haines Brown
brownh (AT) teufel (DOT) hartford-hwp.com> wrote:

I'm in the practice of specifying img width and height in my style
definitions, although I usually use the actual size of the image. I'm
reworking the style and it would be convenient to leave image size
unspecified unless I need to change its dispayed size.

What, if any, are the reasons why an image size should be specified in
a stylesheet if it will be displayed in its actual size?

By omitting the height and width of an image in the HTML, the browser
cannot leave sufficient space for the image when the page is rendered
before the image is downloaded. As a result, the visitor experiences
distracting and annoying jumping around while the image loads.

I do not think it's wise to leave this out of the HTML. Perhaps there is a
PHP solution where the image element is generated based upon the
properties of the image to be included,

The browser doesn't interpret HTML differently depending on whether it's
hard-coded or generated by server-side code.

Mark Tranchant <mark (AT) tranchant (DOT) plus.com> writes:

Haines Brown wrote:

I'm in the practice of specifying img width and height in my style
definitions, although I usually use the actual size of the image. I'm
reworking the style and it would be convenient to leave image size
unspecified unless I need to change its dispayed size.
What, if any, are the reasons why an image size should be specified
in a stylesheet if it will be displayed in its actual size?

Because the image may be downloaded after the main content. By
specifying the size, the browser knows how much space to leave for it.

Why not put it in the <img> tag? I don't see that as presentational
markup - it is a property of the image file.

Thanks, Mark. Based on your advice and that of others, I've restored
the size declaration for img.

--
Haines Brown

On Thu, 5 Aug 2004 12:58:14 -0400, "Harlan Messinger"
<h.messinger (AT) comcast (DOT) net> wrote:

"Neal" <neal413 (AT) yahoo (DOT) com> wrote in message
newspsb9lo8ku6v6656 (AT) news (DOT) individual.net...

I do not think it's wise to leave this out of the HTML. Perhaps there is a
PHP solution where the image element is generated based upon the
properties of the image to be included,

The browser doesn't interpret HTML differently depending on whether it's
hard-coded or generated by server-side code.

I have a feeling that what Neal was getting at was to generate the
page by some dynamic means and then have the software locate the image
file on disk and read its header to find its width and height to
include in the image element before generating it.

This seems a little like overkill to me, but there's not really any
reason why it *couldn't* work. (assuming the images are actually
stored as files on disk)

-Claire