Web Design Resources – November 2011

It’s been a little quiet here lately, but here’s our monthly digest of web design tools, resources, articles and inspiration for November 2011.

Kern Type

http://type.method.ac/

Learn the basics of kerning with this simple online game.

Free font from FontShop for iOS

http://www.fontshop.com/freefonts

FontShop started offering fonts that are specifically hinted and optimized for iOS devices. They’re offering one weight of Basic Gothic Mobile typeface for free.

iOS 5 on iPhone 4S GUI PSD

http://www.teehanlax.com/blog/ios-5-gui-psd-iphone-4s/

Teehan+Lax have updated their popular iPhone GUI PSD to match the new iOS5 running in the iPhone 4S.

Solo: project management

http://thrivesolo.com/

Solo is an online project management suite. The design has been carefully crafted, is very clean, comfortable and includes cool tricks like SVG rollovers.

Docpool: share documentation

http://www.docpool.co/

An online repository of documents related to web design and development with items such as contract templates, invoices, project quoting and others.

HTML 5 for web designers

http://html5forwebdesigners.com/

The popular book about HTML 5 published by A List Apart and written by Jeremy Keith, now has an online counterpart where you can read it all for free.

HTML 5 Audio Player

http://codecanyon.net/item/simple-html5-audio-player-v1/495024

This is a sleek and lightweight audio player built in HTML 5 that supports OGG and MP3 audio formats. It provides a fallback for older browsers and you can include multiple instances of the player in your page.

CSS Animation

http://daneden.me/animate/

Animate is a CSS library with several cross-browser animations to use in your projects. The animations are supported by Chrome, Safari and Firefox. Animate is distributed under the MIT license so you can use it in your commercial projects.

Dart: structured web apps

http://www.dartlang.org/

The new language to build structured web applications created by Google, Dart, was finally released and although it’s an early release, it looks really promising.

Responsive carousel for jQuery

http://tympanus.net/Development/Elastislide/

Elastislide is a lightweight and easy to implement responsive slider built as a plugin for jQuery. It implements the Touchwipe Plugin that allows to swipe the images in the slider whenever you’re visiting the site in an iOS or Android device.

WordPress

Balita: free E-Commerce theme

http://www.smashingmagazine.com/2011/10/19/free-e-commerce-wordpress-theme-balita/

Smashing Magazine released a neat e-commerce theme for WordPress packed with features such as

jQuery Product Slider
Custom Shopping Cart
Ads Banner
Search Products
Blog Integration
Related Products

and much more. E-commerce done well is probably the next step for WordPress community. Jane Wells pointed some time ago that none of the currently options were genuinely “great”.

How to create tabs in the settings page of your WordPress theme

http://wp.smashingmagazine.com/2011/10/20/create-tabs-wordpress-settings-pages/

My first article for Smashing Magazine was published and it goes through the basics of implementing tabs in the settings page of your WordPress theme.

Inspiration

Boris Pelcer: lettering, illustration and design

http://www.borispelcer.com/index.php

Jordan Metcalf: design and art

http://www.jordan-metcalf.com/

Articles

Responsive Web Design Demystified

http://www.elated.com/articles/responsive-web-design-demystified/
Matt Doyle goes through all the aspects involved in creating responsive sites, from beginning to end.

Centering in the Unknown

Chris Coyier explains how to center an element when you don’t know any dimension of the surrounding elements.
http://css-tricks.com/14745-centering-in-the-unknown/