Last update at 12 · 09 · by milo

‧‧‧ One of 807

In terms of responsive design, instead of having the entire presentation be fluid throughout, we had the infographic stay in place until a breakpoint, and then moved elements to different positions, allowing the main SVG to respond fluidly at that juncture. Even though we designed desktop first, our media queries are a mobile-first implementation. I used an SVG which is very easy to make fluid, adjusting the viewport slightly on mobile with javascript.

Read more at Rethinking Information Presentation

Responsive Animated Infographics

Boosting energy efficiency: The energy used to power, heat, and cool our homes, businesses, and industries is the single largest contributor to global warming. Energy efficiency technologies allow us to use less energy to get the same—or higher—level of production, service, and comfort. This approach has vast potential to save both energy and money, and can be deployed quickly.

CSS, Cascading Style Sheets describes the presentation semantics of a document written in markup language. CSS is designed primarily to enable the separation of document content from document presentation, including aspects such as the layout, colors, and fonts.


Home CSS & UX/UI > DesignResponsive Animated Infographic