Responsive Images in Practice

62% of the weight of the web is images and that’s growing every day. On small or low-resolution screens, most of that data is waste. This article by Eric Portis gives you the low down on how you can do your part for making the web faster…

VN:F [1.9.22_1171]
Rating: +1 (from 1 vote)

The Anti-hero of CSS Layout – “display:table”

The topic of table usage in layouts is a sensitive one. In general, web developers consider table-based layout a taboo. Although the reasons against it are well-documented, most developers are unable to provide a sound background for decrying table-base layout except for, “tables are bad”…

VN:F [1.9.22_1171]
Rating: 0 (from 0 votes)

Responsive Images: If you’re just changing resolutions, use srcset

If you’re implementing responsive images (different images in HTML for different situations) and all you are doing is switching between different versions of the same image (the vast majority of usage), all you need is the srcset attribute on the img tag…

VN:F [1.9.22_1171]
Rating: 0 (from 0 votes)

Making SVGs Responsive with CSS

SVGs are pretty great when it comes to creating responsive resolution-independent logos (and other graphics, for the matter). Of course, using media queries to adapt the SVG to different media conditions goes beyond customizing logos. You can animate shapes into other shapes (you might need JavaScript to help with this in some cases), customize colors, change fonts, show and hide items, and much more…

VN:F [1.9.22_1171]
Rating: 0 (from 0 votes)