December 2011
1 post
3 tags
October 2011
3 posts
“Those who are willing to educate themselves and commit to improving their craft...”
– The Importance of Compass & Sass: An Interview With Brandon Mathis
3 tags
YAML for Ruby documentation →
Lately I have been working a lot with YAML data in my HAML templates via Middleman. YAML is great for providing data to display on your site. It allows for easy modification and addition trough separate .yml files instead of having to copy-paste HTML/HAML. YAML is very intuitive to write and work with from Ruby (and templates). But if you are in need of some good documentation, check out this YAML...
2 tags
Scalable and Modular Architecture for CSS →
Jonathan Snook shares his vision and some good tips and techniques on how to organize your CSS code.
September 2011
2 posts
5 tags
Static site development with Middleman
It’s great to use innovations such as CoffeeScript, Sass/Less and templating engines like Haml and Slim but they all need to be compiled in order to be understood by browsers. Command-line tools are provided but it can get tedious when working with multiple of these tools at a time. Building a huge rakefile might be a solution but it would be nice to have a flexible and ready to use...
2 tags
Responsive Video Embeds with FitVids →
I am currently working on a responsive design which contains an embedded Vimeo video. After spending an hour trying to get the damn video to scale (while maintaining aspect ratio) I found this wonderful jQuery plugin called FitVids. It handles it all in just one line:
($ '#videoContainer').fitVids()
Check it out!
August 2011
6 posts
1 tag
HOWTO Use UTF-8 Throughout Your Web Stack →
rentzsch:
Good is the enemy of Great
Latin-1 is the enemy of UTF-8
You write web apps. You understand the web is global, and want to support internationalization. You want UTF-8.
UTF-8 is extremely sane. Well, as sane as an encoding can be that features backwards-compatibility with ASCII.
Everything…
2 tags
Android GUI PSD (High-Density) →
It came to my attention that teehan+lax, the team behind the excellent iPhone GUI PSD did an Android GUI PSD too. This PSD contains all Android interface elements so you can use them in your Photoshop mockups. Check out their downloads page too, sweet!
7 tags
Automated Jasmine Javascript testing
Last week I went on a bootcamp with my team to build a prototype for an upcoming web app. We decided on a test-driven approach to the project. I feel like this is one of the best decisions we’ve ever made. It might be slow to get into, but once you are you never want to go back to regular ‘ol programming style. Never I’ve had so much faith in the code I’ve written. It also really is a huge step...
1 tag
Content-Aware Fill watermarks
Just discovered a great use for Photoshop’s Content-Aware Fill function: hiding watermarks in stock images!
For a design I’m working on I needed a soil background. I was planning on just trying different ones but I didn’t want to buy them all. E.g. this photo on Dreamstime has this big Dreamstime logo in the center. Content-Aware Fill-ing this section hid the watermark...
1 tag
WhatFont Tool →
Fantastic browser extension (Safari, Chrome) to identify fonts. Works by hovering text, clicking reveals detailed info such as font-size and line-height.
4 tags
Photoshop New Doc iOS & Android presets
Photoshop gives you the ability to create custom “New Document” presets. These come in quite handy when you’re designing for multiple (mobile) screen resolutions. From the “New Document” dialog you can create and delete presets, but for some reason there are no edit or export options. Fortunately we can add and edit these presets by editing a specific TXT file.
The default New Document...