mahara-contributors team mailing list archive

[Aaron Wells <1419532@xxxxxxxxxxxxxxxxxx>]

That's fine, adding the "width" and "height" attributes to the "img" tag
doesn't mean the final display has to be at that size.

What I'm saying is, if you know "this is a 200x100 pixel image", and you
put <img width="100" height="200" src="foo.png">, then the browser knows
at the outset that it's dealing with a 200x100 pixel image, and it'll be
able to apportion space for it on the page from the outset. This may
include scaling the image to a different size, depending on the CSS.

But if you don't include that "width=100 height=200", then the browser
doesn't know what size the image is until after it makes its request for
foo.png and gets the results back. This can result in the layout of the
page taking longer to finalize, and getting that annoying effect where
parts of the page "shift" around as the browser realizes that it needs
to reposition things to make sense.

-- 
You received this bug notification because you are a member of Mahara
Contributors, which is subscribed to Mahara.
Matching subscriptions: Subscription for all Mahara Contributors -- please ask on #mahara-dev or mahara.org forum before editing or unsubscribing it!
https://bugs.launchpad.net/bugs/1419532

Title:
  Add "width" and "Height" attributes to <img> tag in image blocks so
  they'll flow to the right size immediately

Status in Mahara ePortfolio:
  In Progress

Bug description:
  We should add "width" and "Height" attributes to the <img> tags
  generated by image blocks, so that the browser will render the image
  placeholder as the correct size even before the image finishes
  loading. This should help the page to feel like it's loading up more
  quickly.

To manage notifications about this bug go to:
https://bugs.launchpad.net/mahara/+bug/1419532/+subscriptions