Responsive Design with CSS3 Media Queries

Media Queries continues to frustrate web developers just as much as they are exited. CSS3 brings tons possibilities, and solves many many problems, but it comes with a lack of support in old browsers, specially in Internet Explorer.

The V3C definition of the media query is:

A media query consists of a media type and zero or more expressions that check for the conditions of particular media features. Among the media features that can be used in media queries are ‘width’, ‘height’, and ‘color’. By using media queries, presentations can be tailored to a specific range of output devices without changing the content itself.

Continue reading “Responsive Design with CSS3 Media Queries”

2.0 Websites – design ideas using HTML5

The hew HTML 5 is already out there. Some are using it for a while, some are waiting for more browser suppor. For all of them and for thous that doesn’t know know HTML 5, we have publish here a series of website builded on top of the new HTML 5. If you kow more websites build in HTML 5 just submit them in the comment area.

Continue reading “2.0 Websites — design ideas using HTML5”

CSS3 @font-face solucions. Typekit vs Google Web Fonts

Not exactly  new to CSS3, @font-face was first proposed for CSS2 and has been implemented in Internet Explorer 5! However, their implementation relied on the proprietary Embedded Open Type (.eot) format, and no other browsers decided to use this format. With the release of Safari 3.1, however, website makers can use any licensed TrueType (.ttf) or OpenType (.otf) font in their pages.

To use web fonts, each form of the font family must be declared using the @font-face rule.

Here is a quick example, to use both regular and italic forms of “MyCoolFont”, you would put the following in your stylesheet:
Continue reading “CSS3 @font-face solucions. Typekit vs Google Web Fonts”

Use Google Font API to import fancy fonts

Google’s introduction of their new Font API and Font Directory is a godsend to developers and designers everywhere.Want to use something a little nicer than Arial, but without the overhead of Cufon, Sifr, or worse? To enjoy the visual richness of diverse fonts, webmasters have resorted to workarounds such as baking text into images.

  • Natural font rendering with all of it’s advantages – selectable, zoomable, indexable, and accessible text.
  • Compatible with IE6 and up – no differences between browsers
  • No copyright issues – you can use is for printing, you can modify and use it as you wish

Continue reading “Use Google Font API to import fancy fonts”