Over the next few weeks we at A Little Code will be experimenting with best ways to optimize sites for multiple devices. Here are a few initial thoughts.
Hitting the Limits of Responsive Web Design
Continue reading “Responsive Web Design vs. Mobile Site: Which is better, when?”
A 25-minute video tutorial introducing the concept of Responsive Web Design — using CSS media queries to adjust CSS design and layout to work well in variously-sized browsers across multiple devices — from Nettuts+.
Features some excellent examples of responsive designs, including:
See the original post: Responsive Web Design: A Visual Guide | Nettuts+.
A great tool for practicing your CSS3 techniques, with instant feedback:
CSS3 Please! The Cross-Browser CSS3 Rule Generator
CSS frameworks are simply a solution to problems web designers experience on a daily basis, enabling them to produce clean, agile, cross-browser code. Even though these tools have their own issues to contend with, they can serve as an excellent model to produce higher quality, more portable, and reusable CSS.
From a nice article examining the strengths of CSS frameworks such as:
- 960 Grid System
- YUI Grids
- and others
Read: The Right Frame of Mind: Applying the Lessons of CSS Frameworks » SitePoint
Best Practices for Serving Webfonts to IE9
src: url(‘webfont.eot’); /* IE9 Compat Modes */
src: url(‘webfont.eot?#iefix’) format(’embedded-opentype’), /* IE6-IE8 */
url(‘webfont.woff’) format(‘woff’), /* Modern Browsers */
url(‘webfont.ttf’) format(‘truetype’), /* Safari, Android, iOS */
url(‘webfont.svg#svgFontName’) format(‘svg’); /* Legacy iOS */
An improvement on Paul Irish’s original Bulletproof syntax and the follow-up Mo’ Bulletproofer syntax …
Today from Ethan Dunham at the Fontspring blog, a fix for troubles loading web fonts across browsers, including Android, IE 9, etc.
src: url(‘myfont-webfont.eot#’) format(’embedded-opentype’),