2011 was a very interesting year for the web. The App Internet continues to march on while web consumption continues to fragment into a myriad of devices with different browsers and form factors.

Out with the old

As Jeffrey Zeldman recently pointed out, the days of a single fixed width layout are over and web designers once again find themselves in uncharted territory with few standards to guide them. What is the new ‘best practice’ in web design? Responsive design? Adaptive? A return to fluid layouts?

It’s easy to complain about the lack of guidelines and the seemingly daunting task of crafting a great user experience across so many devices. It’s a lot more fun to start experimenting in search of a solution.

It was with that spirit I set out to redesign my personal site a few months ago. I wanted to create a proof of concept for a mobile-first, adaptive design where every page looked great no matter what device you happened to be using.

Simplicity

My first goal was to keep things as simple and lightweight as possible. Mobile-first design treats mobile and desktop as equals, so pages had to be small enough to load quickly, even at 3G speeds. Frills were cut, and a minimalist style was adopted.

Hot tools

I looked at many responsive and adaptive grid systems before settling on Joni Korpi’s excellent Frameless. The Frameless grid frees you of pixel-based thinking by using LESS to calculate em based columns that give you more control over which elements adapt and which do not.

FitVids, a jquery plugin for adaptive video players, works flawlessly for scaling videos.

Results

I’m very happy with the results of this first step into full-scale adaptive design.

The site adapts well to every smartphone, tablet, and desktop display out there, while remaining very lightweight. Grab the corner of your browser and resize away. The content will scale to fit any size.

The future

So, what’s next for the web?

Will standards start to emerge? Will the app internet make the web irrelevant?

Who can say. As always, the only consistence is change. I’ll just continue to have fun navigating it.

Mortal Kombat Mobile Moves List is an MK9 moves list for your phone or tablet.

It’s a free web app, optimized for iPhone, iPod touch, iPad, and Android.

Features:

• Fatalities, Stage Fatalities, and Babalities for all characters.

• Console specific buttons.

• ‘Add to Home Screen’ on iOS devices for a full screen view, and offline access.

The app was built using Mobile Boilerplate, jQuery, and HTML5.

Visit bit.ly/mk9moves on your mobile device to check it out.

Toasty!

Yes, barackobama.com has both HTML5 Boilerplate and Pokemon.

The Pulitzer Prize-winning journalist, author, and tech-pessimist, recently gave a lecture at the University of Mississippi about the decline of newspapers. Which, in his view, inevitably leads to the death of journalism, literacy, and even democracy. You can read or watch the lecture on the University’s blog.

Talk about a slippery slope.  Yes, the medium, business model, and definition of “news” is changing rapidly, but I fail to see how this signals the journalistic apocalypse.

Some of his views seem to be based on misconceptions about the internet. Here are a few:

“No internet site will ever bring in the kind of revenue that allows a large newspaper to field a newsroom staff”

I don’t understand why this is an impossibility in his mind.

“The internet is not configured for reading, and like television, it shapes and can distort news content.”

The last time I checked, the web was a pretty good format for reading, and as for distorting news, print media could never do that, right?

“Bloggers, unlike most established reporters, rarely admit errors. They cannot get fired. Facts, for many bloggers, are interchangeable with opinions.”

Seriously? Stereotyping bloggers like this is not only insulting to bloggers and blog readers, but shows a serious lack of faith in people’s ability to distinguish quality content for themselves.

Here’s what I think. Instead of reaching for the panic button, newspapers need to evaluate WHY they’re failing and use their resources to focus on SOLUTIONS. If newspapers don’t, someone else will. High quality journalists will end up working for whoever figures out how to monazite high quality journalism in the new-media age, simple as that. Educated people will always demand quality news.

That said, I think what Hedges is really expressing is a deeper lack of faith in our ability to teach future generations to recognize and value high quality journalism in a world where information is free and opinion runs wild. That aspect is a bit more troubling, but if we are smart, we’ll continue to invest in education and avoid the slide into Idiocracy.

If you ask me, Mozilla couldn’t have picked a better name for their new experimental web-based IDE.

The idea behind Bespin is also pretty cool.  Since most web projects don’t require a huge codebase, why not use a simple IDE in the cloud?

The project has a long way to go to be sure, but I’d say it’s off to a great start. Try it out for youreslf at bespin.mozilla.com.

Aesthetically, I was going for a look with bold typography, clear separation of content, and simple, easy to navigate layout.  I mixed a tech theme (circuit board and sharp edges) with an arts & crafts feel (large type and cut-out borders) to reflect my work as a web developer, and my interest in all things creative.  I decided on a green color scheme to stand out from the typical blog, and because I’m a fan of Kermit the Frog.  Emphasis is still on the content, but I think the new theme gives the site the extra flavor I was looking for.

I’ll be using this personal blog to post quick thoughts, cool videos and links, and the occasional music or film review.  Enjoy!