I have hundreds of pictures on my site. The thumbnails are all a standard
size, and most of the bigger ones are the same size too. When I run my html
code through my optimizer it throws out a warning if I don't have an image
size in the html, but I want to put that into the CSS instead, and clean up
my html code.
What's more important, having the IMG size in the html, or minimalised code?
I knwo the theory behind the size in html is so that when the poage loads it
leaves a space available for the pics, so the page doesn't keep jumping
about while it accommodates the picture... does this still work if all the
sizes are incorporated in CSS?
Thanks
CM
--
==Not nuts, just a little eccentric==
African Bush Tours and Safaris http://www.africanbush.co.za/ 18  2197 
On Sun, 07 May 2006 11:30:51 +0200, pecan <pe**********@iafrica.com> wrote: What's more important, having the IMG size in the html, or minimalised
code?
I knwo the theory behind the size in html is so that when the poage
loads it
leaves a space available for the pics, so the page doesn't keep jumping
about while it accommodates the picture...
I find the size of an image matters when the image takes an important
place in the design of a page, like an illustration with a story. But when
it is just a list of images (in rows or whatever layout), I don't think it
matters that much.
does this still work if all the
sizes are incorporated in CSS?
There's an easy way to find out: Did you test it out before you asked?
--
______PretLetters:
| weblog | http://www.pretletters.net/weblog/weblog.html |
| webontwerp | http://www.pretletters.net/html/webontwerp.html |
|zweefvliegen | http://www.pretletters.net/html/vliegen.html |
pecan wrote: I have hundreds of pictures on my site. The thumbnails are all a standard
size, and most of the bigger ones are the same size too. When I run my html
code through my optimizer it throws out a warning if I don't have an image
size in the html, but I want to put that into the CSS instead, and clean up
my html code.
What's more important, having the IMG size in the html, or minimalised code?
I knwo the theory behind the size in html is so that when the poage loads it
leaves a space available for the pics, so the page doesn't keep jumping
about while it accommodates the picture... does this still work if all the
sizes are incorporated in CSS?
The difference is that with an image, the width and height are inherent
attributes of the image, not an optional presentation detail.
"Harlan Messinger" <hm*******************@comcast.net> wrote in message
news:4c*************@individual.net... pecan wrote: I have hundreds of pictures on my site. The thumbnails are all a
standard size, and most of the bigger ones are the same size too. When I run my
html code through my optimizer it throws out a warning if I don't have an
image size in the html, but I want to put that into the CSS instead, and clean
up my html code.
What's more important, having the IMG size in the html, or minimalised
code? I knwo the theory behind the size in html is so that when the poage
loads it leaves a space available for the pics, so the page doesn't keep jumping
about while it accommodates the picture... does this still work if all
the sizes are incorporated in CSS?
The difference is that with an image, the width and height are inherent
attributes of the image, not an optional presentation detail.
Not sure what the implication is of that. I am resizing all my pics to the
same size, so that I can set it up in CSS, for the right size.
CM
"Barbara de Zoete" <tr******@pretletters.net> wrote in message
news:op.s86ddej3l8uz2z@zoete_b... On Sun, 07 May 2006 11:30:51 +0200, pecan <pe**********@iafrica.com>
wrote: What's more important, having the IMG size in the html, or minimalised
code?
I knwo the theory behind the size in html is so that when the poage
loads it
leaves a space available for the pics, so the page doesn't keep jumping
about while it accommodates the picture...
I find the size of an image matters when the image takes an important
place in the design of a page, like an illustration with a story. But when
it is just a list of images (in rows or whatever layout), I don't think it
matters that much.
does this still work if all the
sizes are incorporated in CSS?
There's an easy way to find out: Did you test it out before you asked?
I didn't... I was hoping someone knew. I've now tested, and it does pick up
the size from css and allocate the space.
CM
--
==Not nuts, just a little eccentric==
African Bush Tours and Safaris http://www.africanbush.co.za/
In article <e3**********@ctb-nnrp2.saix.net>,
"pecan" <pe**********@iafrica.com> wrote: I have hundreds of pictures on my site. The thumbnails are all a standard
size, and most of the bigger ones are the same size too. When I run my html
code through my optimizer it throws out a warning if I don't have an image
size in the html, but I want to put that into the CSS instead
Why would you want to make a site CSS-dependant? CSS is great fun, but
CSS-dependancy is as silly as javascript-dependancy.
In other words, I agree with your optimizer. (You can still add a
different width & height in your CSS if you think that makes for nicer
presentation. I do that sometimes in cases where I want the image to
scale along with the user's font-size, using em or ex.)
[...]
I knwo the theory behind the size in html is so that when the poage loads it
leaves a space available for the pics, so the page doesn't keep jumping
about
Yes. I think that's a valid argument.
--
Sander Tekelenburg, <http://www.euronet.nl/%7Etekelenb/>
Harlan Messinger <hm*******************@comcast.net> writes: The difference is that with an image, the width and height are
inherent attributes of the image,
In the context of HTML, the width and height attributes of any element
types do not address inherit dimensions at all; they are defined 'to
override the natural image or object size' by the HTML 4 spec. Of
course you can always *try* to resize them to the inherent dimensions
(if any exist); in practice that works as expected in the browsers I
know because they do not implement pixels as a relative length (as they
should, according to the same spec).
--
||| hexadecimal EBB
o-o decimal 3771
--oOo--( )--oOo-- octal 7273
205 goodbye binary 111010111011
Sander Tekelenburg <us**@domain.invalid> writes: "pecan" <pe**********@iafrica.com> wrote: [...] When I run my html
code through my optimizer it throws out a warning if I don't have an image
size in the html, but I want to put that into the CSS instead
Why would you want to make a site CSS-dependant?
How would that *make* a site CSS-dependant?
And in return I could ask why you would make a site image-dependant;
explicit dimensions for images can make all or part of the alternate
text inaccessible in popular GUI browsers when the image is not
displayed (for various possible reasons).
--
||| hexadecimal EBB
o-o decimal 3771
--oOo--( )--oOo-- octal 7273
205 goodbye binary 111010111011
"Eric B. Bednarz" <be*****@fahr-zur-hoelle.org> wrote in message
news:m3************@nntp.bednarz.nl... Harlan Messinger <hm*******************@comcast.net> writes:
The difference is that with an image, the width and height are
inherent attributes of the image,
In the context of HTML, the width and height attributes of any element
types do not address inherit dimensions at all; they are defined 'to
override the natural image or object size' by the HTML 4 spec. Of
course you can always *try* to resize them to the inherent dimensions
(if any exist); in practice that works as expected in the browsers I
know because they do not implement pixels as a relative length (as they
should, according to the same spec).
Wow... this opens up a whole new can of worms!! Tell me if what I've been
doing is correct: I resize my picture to 900 x 675 pixels, and then I add
the size in html as 900 x 675. Are you saying they are not displayed like
that?
At one stage I was making the pictures size at 100%, but then I discovered
that it would take a smaller picture and resize it to the size of the
screen, and if the screen was a different proportion then it would distort
the picture. Since not all my pictures are the same size, I now want to
resize them to 900 x 675, and leave off the height and width attributes. I
know that if I make the size AUTO in CSS then it pics up the dimensions from
the picture, but it doesn't (I presume) allocate the space on loading.
CM
--
==Not nuts, just a little eccentric==
African Bush Tours and Safaris http://www.africanbush.co.za/
"Eric B. Bednarz" <be*****@fahr-zur-hoelle.org> wrote in message
news:m3************@nntp.bednarz.nl... Sander Tekelenburg <us**@domain.invalid> writes:
"pecan" <pe**********@iafrica.com> wrote:
[...] When I run my html
code through my optimizer it throws out a warning if I don't have an
image size in the html, but I want to put that into the CSS instead
Why would you want to make a site CSS-dependant?
How would that *make* a site CSS-dependant?
And in return I could ask why you would make a site image-dependant;
explicit dimensions for images can make all or part of the alternate
text inaccessible in popular GUI browsers when the image is not
displayed (for various possible reasons).
Hmm.... I'm not sure about the CSS dependent. I've been brainwashed into
thinking that it would help if I streamlined my code by putting the
repetitive stuff on CSS.
Explain what you mean about GUI browsers? I'm not familiar with the term.
CM
--
==Not nuts, just a little eccentric==
African Bush Tours and Safaris http://www.africanbush.co.za/
On Sun, 7 May 2006, pecan wrote: "Eric B. Bednarz" <be*****@fahr-zur-hoelle.org> wrote in message
news:m3************@nntp.bednarz.nl...
In the context of HTML, the width and height attributes of any
element types do not address inherit dimensions at all;
"inherent", I think you meant to type...
they are defined 'to override the natural image or object size' by
the HTML 4 spec.
Indeed, this seemed very strange to me when I originally spotted it.
I had previously assumed that the height and width attributes *in
HTML* had been intended to give browsers some pre-warning of the
inherent size of the object before it had been retrieved. However,
the HTML4 specifications say pretty-much the opposite, quite against
the normal ethos of HTML "strict".
Even worse, for the definition of the pixel unit in this HTML
attribute value, they cross-reference the CSS px unit (i.e as scaled
according to the presentation situation). Very strange.
I think my interpretation is closer to what actually happens in most
browsers on most platforms, in spite of what the specification says.
I suspect hardly anyone other than you and me has even noticed...?
Of course you can always *try* to resize them to the inherent
dimensions (if any exist); in practice that works as expected in
the browsers I know because they do not implement pixels as a
relative length (as they should, according to the same spec).
Wow... this opens up a whole new can of worms!!
Indeed it does... except that practical reality often enough differs
from what the specs say should happen, and this seems to be just such
a case.
Tell me if what I've been doing is correct: I resize my picture to
900 x 675 pixels, and then I add the size in html as 900 x 675.
Are you saying they are not displayed like that?
In practice, in the absence of anything contrary in your CSS, they
mostly will be displayed like that - except that users always have the
last word - Opera users can readily zoom images, and there are
bookmarklets for other browsers which can be used to get a similar
effect.
At one stage I was making the pictures size at 100%, but then I
discovered that it would take a smaller picture and resize it to the
size of the screen, and if the screen was a different proportion
then it would distort the picture.
As a *general* rule, you'd be advised to offer pictures for display at
their natural size.[1] If you display them much smaller, you're
downloading too much data to no good effect. If you display them much
larger, they're likely to look rough and/or fuzzy.
[1]assuming that they have a natural size, usually pixel-based
formats.
If you want them at a different size, then re-size them yourself,
using decent graphics software, and serve them out in their intended
size.
However, for some purposes it can be useful to size images (via CSS)
in em units, so that they scale up and down with the user's choice of
text size. Samples and comment at
http://ppewww.ph.gla.ac.uk/~flavell/...g-em-size.html
Since not all my pictures are the same size, I now want to
resize them to 900 x 675,
Fine...
and leave off the height and width attributes.
OK, but it'll do no real harm to specify those attributes in the HTML,
and might just stabilise the browser rendering while waiting for
images to arrive.
"Alan J. Flavell" <fl*****@physics.gla.ac.uk> writes: On Sun, 7 May 2006, pecan wrote:
"Eric B. Bednarz" <be*****@fahr-zur-hoelle.org> wrote... >
> In the context of HTML, the width and height attributes of any
> element types do not address inherit dimensions at all;
"inherent", I think you meant to type...
Quite. %-|
I suspect hardly anyone other than you and me has even noticed...?
I'm afraid so. Although we have noticed that here again, and again, and
again... ;-)
OK, but it'll do no real harm to specify those attributes in the HTML,
and might just stabilise the browser rendering while waiting for
images to arrive.
I agree; I do not have any objections to *any* pragmatic considerations,
BTW. I merely question the sentiment of condemning certain useful
markup of questionable origin while advocating comparable cruft.
FWIW, I have not used width and height attributes for images for at least
three years, and I have never seen anything jumping around on the screen
while the page is being rendered, even with a dial-up connection.
This might happen if the external style sheet is not available yet, but
if all other presentational aspects rely on it, *most* boxes would be
displaced when it is finally fetched, wouldn't they?
And it touches the typical subjects nobody cares about; what if I need
too replace all images with identical size in, say, a cd catalogue with
versions of a different size? It's not only about changing one line of
CSS as opposed to n times two attributes, it's about not changing the
time stamp of the document without any good reason.
--
||| hexadecimal EBB
o-o decimal 3771
--oOo--( )--oOo-- octal 7273
205 goodbye binary 111010111011 OK, but it'll do no real harm to specify those attributes in the HTML,
and might just stabilise the browser rendering while waiting for
images to arrive.
I agree; I do not have any objections to *any* pragmatic considerations,
BTW. I merely question the sentiment of condemning certain useful
markup of questionable origin while advocating comparable cruft.
FWIW, I have not used width and height attributes for images for at least
three years, and I have never seen anything jumping around on the screen
while the page is being rendered, even with a dial-up connection.
May I see one of your sites please?
This might happen if the external style sheet is not available yet, but
if all other presentational aspects rely on it, *most* boxes would be
displaced when it is finally fetched, wouldn't they?
And it touches the typical subjects nobody cares about; what if I need
too replace all images with identical size in, say, a cd catalogue with
versions of a different size? It's not only about changing one line of
CSS as opposed to n times two attributes, it's about not changing the
time stamp of the document without any good reason.
Naaa... this wasn't my thinking originally. I think I'm putting off the seo
part, and just doing stuff makes me feel as if I'm working!
Sigh. But I have done some real work on the site today - for search
engines, I mean. Now I can start playing with the CSS again.
CM
--
==Not nuts, just a little eccentric==
African Bush Tours and Safaris http://www.africanbush.co.za/
"pecan" <pe**********@iafrica.com> writes: Explain what you mean about GUI browsers? I'm not familiar with the term.
<http://en.wikipedia.org/wiki/GUI>
If you promise not to tell anybody else, I'll tell you a secret:
About 80% of the stuff I know I do know because I read things on the
Internet that I did not understand and subsequently looked up their
meaning on the Internet.
But admittedly you could argue what 'GUI browser' actually means; you
could just have a text browser that opens in its own window, or have
the menus of a terminal emulation available for a small number of
actions. What I meant is a browser that can display more than just text
in its viewport (a webpage itself can have a GUI after all).
--
||| hexadecimal EBB
o-o decimal 3771
--oOo--( )--oOo-- octal 7273
205 goodbye binary 111010111011
"Eric B. Bednarz" <be*****@fahr-zur-hoelle.org> wrote in message
news:m3************@nntp.bednarz.nl... "pecan" <pe**********@iafrica.com> writes:
Explain what you mean about GUI browsers? I'm not familiar with the
term.
<http://en.wikipedia.org/wiki/GUI>
If you promise not to tell anybody else, I'll tell you a secret:
LOL
About 80% of the stuff I know I do know because I read things on the
Internet that I did not understand and subsequently looked up their
meaning on the Internet.
I also do a lot of reading on the Internet. It's only in the last 2 months
that I've had almost unlimited access to the web, so I'm a lot newer at
this. I also have the world's worst memory, and so I print things out for
reference purposes, and I now have a ream or so of pages on my desk, but no
idea what's there.
LOL
Eventually I'll get it.
CM
To further the education of mankind, "pecan" <pe**********@iafrica.com>
vouchsafed: Hmm.... I'm not sure about the CSS dependent. I've been brainwashed
into thinking that it would help if I streamlined my code by putting
the repetitive stuff on CSS.
There is no "dependency" in the sense stated. I always put my image sizes
in css. If a user has no css, he _may_ get the jiggles. So what?
Explain what you mean about GUI browsers? I'm not familiar with the
term.
GUI actually means "Graphical User Interface" and implies a browser (or
other app) capable of displaying/rendering images.
--
Neredbojias
Infinity has its limits.
> Explain what you mean about GUI browsers? I'm not familiar with the
term.
GUI actually means "Graphical User Interface" and implies a browser (or
other app) capable of displaying/rendering images.
Thanks. Now I understand.
CM
In article <m3************@nntp.bednarz.nl>,
Eric B. Bednarz <be*****@fahr-zur-hoelle.org> wrote: Sander Tekelenburg <us**@domain.invalid> writes:
"pecan" <pe**********@iafrica.com> wrote: [...] When I run my html
code through my optimizer it throws out a warning if I don't have an image
size in the html, but I want to put that into the CSS instead
Why would you want to make a site CSS-dependant?
How would that *make* a site CSS-dependant?
The OP wants to specify width and height to avoid 'jumpy rendering'. If
he does so through CSS he relies on CSS. Thus CSS-dependancy. (I'll
grant you that this would be a very minor case. It wouldn't prevent
users access from content or meaning.)
And in return I could ask why you would make a site image-dependant;
Indeed one shouldn't. (Unless the images are actual content, not just
presentational add-ons.)
explicit dimensions for images can make all or part of the alternate
text inaccessible in popular GUI browsers when the image is not
displayed
That's a problem with the browser. It's up to the vendor to fix such
things, not to every webpublisher.
--
Sander Tekelenburg, <http://www.euronet.nl/%7Etekelenb/>
pecan wrote: >
> What's more important, having the IMG size in the html, or minimalised
code?
The difference is that with an image, the width and height are inherent
attributes of the image, not an optional presentation detail.
Not sure what the implication is of that. I am resizing all my pics to the
same size, so that I can set it up in CSS, for the right size.
In your case the image size has become more of a presentation issue
since they are all the same size. So putting the size in CSS is a benefit
here rather than misunderstanding a document's properties.
--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email) This thread has been closed and replies have been disabled. Please start a new discussion. Similar topics
by: Tjerk |
last post by:
Hello all,
I have the script below to change an image depending on the date upto
january it worked fine but then it just stopped working does anybody have an
idea how I can make it work again or...
|
by: Karl Burrows |
last post by:
I am working on a Website for a non-profit group and for some reason I have
one link that doesn't want to cooperate. All the image links work fine with
the onmouseover and onmouseout script except...
|
by: Csaba Gabor |
last post by:
Is there any way to determine the pixel
height and width of an original image?
Specifically, If I have
<IMG id=myImg src="pic.jpg" height=200 width=300>
can I figure out what the original size...
|
by: Anand Ganesh |
last post by:
HI All,
I have an Image. I want to clip a portion of it and copy to another image.
How to do this? I know the bounding rectangle to clip.
Any suggestions please.
Thanks for your time and...
|
by: abdullah1983 |
last post by:
Hi Guys,
I need some clarification regarding the problem with safari browser.
Please find my code below. I'm setting the image src, mouseover and
mouseout using javascript. The mouseover and...
|
by: tshad |
last post by:
I am trying to set up an Image authorization where you type in the value
that is in a picture to log on to our site.
I found a program that is supposed to do it, but it doesn't seem to work.
...
|
by: finecur |
last post by:
I have a <img scr="mypic.jpg"in my html. I would like to display the
image by width=200 if the image width is larger than 200. I also would
like to display the image by its real width if the image...
|
by: sravani1 |
last post by:
This code runs like when i submit the form it takes the image and displayed and top of the image a map will displayed. But actually i want that when i give the image it checks the location in the map...
|
by: premprakashbhati |
last post by:
hi, good evening..
i am going to upload an image in a web form .....for that iam using HTML input(file) control and one web control button i.e., Upload_Button()
here is the code ...its work fine...
|
by: studentofknowledge |
last post by:
For some unknown reason ie is placing images I have in a div in a weird way. One image is overlapping another but this problem is not occuring in mozilla. I have looked at my code over and over again...
|
by: taylorcarr |
last post by:
A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...
|
by: Charles Arthur |
last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
|
by: ryjfgjl |
last post by:
If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...
|
by: emmanuelkatto |
last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud.
Please let me know.
Thanks!
Emmanuel
|
by: BarryA |
last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
|
by: nemocccc |
last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
|
by: Sonnysonu |
last post by:
This is the data of csv file
1 2 3
1 2 3
1 2 3
1 2 3
2 3
2 3
3
the lengths should be different i have to store the data by column-wise with in the specific length.
suppose the i have to...
|
by: Hystou |
last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
|
by: jinu1996 |
last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
| |
