[TYPO3-hci] <IMG> vs CSS-backgrounds

Peter Klein peter at umloud.dk
Sun Mar 22 22:04:20 CET 2009


+1

I just made a JS based config utility for TinyMCE RTE, and made a version 
with seperate images, and one using CSS, with just one big image.
And the loading speed/size improvements are VERY noticable when using the 
CSS method.

Version using single IMG tags.
http://sharemation.com/typo3test/sortable.html
 6.8K 1 HTML/Text
31.0K 2 JavaScript Files
 2.8K 1 Stylesheet File
10.6K 1 CSS Image
------------------------
51.4K Total size - 5 HTTP requests



One image version (Images done as CSS backgrounds)
http://sharemation.com/typo3test/tbe.html
  4.8K 1 HTML/Text
 36.4K 2 JavaScript Files
  1.0K 1 Stylesheet File
  0.1K 1 CSS Image
 93.7K 83 Images
------------------------
136.2K Total size - 88 HTTP requests

--
Peter Klein


"Feodor Rykhtik" <feodor.rykhtik at gmail.com> wrote in message 
news:mailman.3331.1228850731.2904.typo3-team-hci at lists.netfielders.de...
CSS-object system is much more dynamic - You could invent rules on hover, on 
click, and Your default image could be easily transformed into another 
presentation. IMG will stay image. Of course we could put an aditional cover 
of CSS on IMG, to applly another representation than default, but it would 
be better from begining make full CSS implementation.

Regards,
Feo

Georg Ringer wrote:
> why should it get easier?
> now you just need to change the directory and will get all icons from
> the new dir
> Feodor Rykhtik wrote:
>> Yes, It will ask some changes, but in the same time it gives huge
>> possibility of customization in future.
>> 




More information about the TYPO3-team-hci mailing list