One of the key steps in creating a responsive web layout is defining how it will look on mobile devices. While media-queries allow us to define alternate CSS for the positioning and scaling of elements, the viewport meta tag defines the width and scale of the “page” itself.

Here’s an example of a tag that will force the browser to resize a website based on the device’s viewport:

<meta name=”viewport” content=”width=device-width”>

So, what does this mean?

Most mobile web browsers will scale web pages down so the entire width of a page fits neatly. Which is great, especially for sites that haven’t been optimized for small displays. The caveat is, the browser doesn’t scale pages up in size to fit the screen, even if the width of the page is set to device’s resolution. Enter the meta tag.

By adding the viewport meta tag we can force the browser to use its display resolution (or any specified number) as the base width for a website. A few other parameters can be added as well to further handle user/browser scaling.

Here are a couple articles to add to your Instapaper:

• Using the viewport meta tag to control layout on mobile browsers
• Configuring the Viewport

Facebook has made it easier than ever to create a custom page tab. No more installing Static FBML apps, now it’s as easy creating an app as a developer.

I built this childish Facebook page tab as an example, and I have to say it’s probably the dumbest tab I’ve ever seen. I love it.

Install the Pull My FInger page tab.

The holidays serve as an annual reminder of what’s important. And it isn’t the mountains of gifts piled high under the tree. Sorry, Big-box-store, it’s that time of year to focus on what really matters.

Having trouble viewing posts from a new custom post type? Are you only seeing “Nothing found” or your 404 page?

Try re-saving your Permalinks structure.

This has come up a few times when I’ve used a custom structure for my permalinks (/%postname%). For whatever reason, re-saving your permalinks settings allows posts from all post types to show up at their proper urls.

Need help setting up custom post types? This article from Smashing Magazine will get you started: How To Build A Media Site On WordPress

These images were created in Cinema4D using platonics and an x-ray shader.

While prepping a bunch of videos for HTML5, I found that my go-to video conversion software didn’t offer OGG support, which is essential for cross browser playability. After searching the googs and trying a bunch of different options I found (using John Gruber’s article as a solid recommendation) ffmpeg2theora.

It’s great. Not only does it work on Mac/PC/Linux, it’s really easy to use. I was able to crank out some great looking OGG videos in no time, even with my limited exposure to command-line computing.

Here’s a quick and simplified overview of how to get started with ffmpeg2theora on a mac, from a non-expert. OK, let’s go!

Getting started with ffmpeg2theora

Now go ahead and change a few more of the options until your video is the size and quality you like. And since we’re working in Terminal, you can open up multiple windows and convert multiple videos at the same time.

&#38; is the ascii equivalent of the ampersand, which is the perfect symbol to describe the devigner. Someone who does this & that, someone who is both creative and analytical.

Above is a first round execution exploring one possibility for a mark that sums up the designer/developer types.

Dual perspective poster based on the words from ee cummings’ poem, i carry your heart with me. Below is a test model in 3D as a proof of concept before I begin building this out of wood and paint.

I’ll post an updated version after it’s completed.