There it comes. It took a while since the firsts layouts but we finally published it tonight. The 2012 folio of my agency.
The whole site is responsive in both a fixed and fluid way. This means that there are 3 main breaking points, one for the ipad at 1024px; another at 1280px for the average laptop/desktop and an extra large at 1680px for the huge screens. Personaly my favorite resolution on this project. Fluid as when you get under 1024px wide, it all adapts itself without breaking point but percentages. Confused? Give it a try: http://netbureau.com.br/en
The site is not WordPress based, well except for the blog. It has two languages for each page and is built with two fonts: Lora and Lato. Thanks Typo Popote for the idea. Both served by Google fonts. I’m using a home made grid to support the structure and Sass to code the css. One of the last additions was the logo being transfered from an image to an svg graphic. No retina display problem with this. Well except if the os version on the mobile supports svg of course (thanks Galaxy SII lite…). Anyway in that case there’s a png fallback.
Oh, something new for me: i’ve shot all the pictures on the site. And that wasn’t the easy part, as i’m not really an expert with a camera. But i think it went well.
The contact page displays a custom map using the Google api. It allowed me to have a map rendering the graphic style i had created in Photoshop. It even plays super nice on Ipad. Try to scroll down with one finger and to scroll the map left or right. Funky uh?
The blog is portuguese only and as said, WordPress based. It loads the same css as the site and uses an infinite scroll plugin. Nothing really fancy here, posts, search box and categories. Less is more. We’ll have to focus on the content now.
I think it sums up the whole thing pretty much. Needless to say that it’s my best work so far. Now i’ll get back to my mobile eCommerce site.