Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    Banned
    Join Date
    Jan 2004
    Location
    Minneapolis, MN
    Posts
    387
    Thanks
    0
    Thanked 0 Times in 0 Posts

    do you put width and height attributes on your <img />s?

    i have gotten in the habit of not doing so, with rare exception. i fail to see the need. i have never had any problems with <img /> boxes taking on wacky proportions as a result of this practice. and especially if you need to adjust the slicing of a larger graphic, or simply the dimensions of a whole one, leaving the markup dynamic just makes the most sense to me. but i see width and height attributes all the time, so are there some advatages to using them that i'm not familiar with?

  • #2
    Senior Coder Mhtml's Avatar
    Join Date
    Jun 2002
    Location
    Sydney, Australia
    Posts
    3,531
    Thanks
    0
    Thanked 1 Time in 1 Post
    Both those attributes are depricated no? I never use them, I never set a width for any image.
    Omnis mico antequam dominus Spookster!

  • #3
    Senior Coder
    Join Date
    Jun 2002
    Location
    The Netherlands, Baarn, Ut.
    Posts
    4,252
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Helping the browser

    Back in the good ol' days, explicitly setting width and height on images was meant to help the browser reserve a space for it before the actual image was loaded, thus preventing the need for re-rendering the page every time an image finished loading.

    Since these attributes are deprecated, width and height would have to be set through a style sheet, or - and this is probably one of the rare appropriate applications of it - through an inline style on the image itself.
    Seperation of content and presentation gets fuzzy here, since the width and height of an image - when used as content - arguably are aspects of content, and not of presentation.
    Regards,
    Ronald.
    ronaldvanderwijden.com

  • #4
    Banned
    Join Date
    Jan 2004
    Location
    Minneapolis, MN
    Posts
    387
    Thanks
    0
    Thanked 0 Times in 0 Posts
    hmm. i can see your point i suppose, but it always seemed like this supposed "re-rendering" you speak of was no different than how the browser shifts content when the window itself is resized. and this doesn't involve any actual re-rendering (as far as downloading).
    Last edited by coder_seth; 02-12-2004 at 10:33 AM.

  • #5
    Senior Coder
    Join Date
    Jun 2002
    Location
    The Netherlands, Baarn, Ut.
    Posts
    4,252
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Re-rendering revisited

    The difference there is that on resizing a page already loaded, the browser has all the page elements in cache and "knows" how much room the various elements require; it only needs to shift them around a bit.

    On loading a new page, laden with images, the browser first renders the page with all the readily available elements (text, etc.), then for each image finishing loading, it has to rearrange the page to acommodate that image, which may need more space then initially acounted for.

    Try refreshing the main page or a forum main page on this site to see the effect of image placeholders being replaced by actual images.
    Regards,
    Ronald.
    ronaldvanderwijden.com

  • #6
    me'
    me' is offline
    Senior Coder
    Join Date
    Nov 2002
    Location
    Warwickshire, England
    Posts
    1,229
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Discussed previously. I hold with my argument.

    The attributes ARE NOT deprecated, by the way. Look at the XHTML Strict DTD, and do a text search for 'height' (Ctrl+F in most browsers). Should be the second item that comes up. Here's a quote if you can't be bothered:
    Code:
    <!ELEMENT img EMPTY>
    <!ATTLIST img
      %attrs;
      src         %URI;          #REQUIRED
      alt         %Text;         #REQUIRED
      longdesc    %URI;          #IMPLIED
      height      %Length;       #IMPLIED
      width       %Length;       #IMPLIED
      usemap      %URI;          #IMPLIED
      ismap       (ismap)        #IMPLIED
      >
    David House - Perfect is achieved, not when there is nothing left to add, but when there is nothing left to take away. (Antoine de St. Exupery).
    W3Schools | XHTML Validator | CSS Validator | Colours | Typography | HTML&CSS FAQ | Go get Mozilla Now | I blog!


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •