25. CSS blocks rendering
• The worst component type
• Place way at the top
• Inline all @media print, etc
http://www.phpied.com/delay-loading-your-print-css/
http://www.phpied.com/rendering-styles/
26. Same domain
• If you split across domains,
keep CSS on the same
domain as HTML
40. MHTML
• MIME HTML
• Works in IE 6,7
• Indeed it actually absolutely
does work in IE7/Vista too
41. MHTML - one part
Content-Location: myimage
Content-Transfer-Encoding: base64
iVBORw0KGgoAAAANSU....U5ErkJggg==
42. MHTML - multi parts
Content-Type: multipart/related; boundary="MYSEPARATOR"
--MYSEPARATOR
[here comes part one] The
double-
--MYSEPARATOR dash of
doom
[here's part two]
--MYSEPARATOR--
62. Study of the images on the top
1000 sites
Q: How many GIFs are out
there?
Q: What if we make them PNG?
Q: Are PNGs optimized?
Q: Are JPEGs optimized?
63. Top 1000 – how?
• URLs from Alexa top sites
• open Fiddler
• php script that opens/closes
Explorer with each URL
• enjoy!
• Export images from Fiddler
64. Top 1000 – GIF vs. PNG?
Animated
GIF
3%
PNG
24%
GIF
73%
65. Top 1000 – GIF vs. PNG vs.
JPG?
GIF
40%
JPEG
46%
PNG Animated GIF
13% 1%
66. Top 1000 – GIF to PNG
$ optipng *.gif
$ pngoptimizercl –
file:"*.png”
(1 min/1000 files)
23.79%
savings