One of the hot topics in our industry these days is the technique of Responsive Web Design via the use of CSS3 Media Queries. The term Responsive Web Design was first coined by Ethan Marcotte in A List Apart. It revolves around the use of CSS3 Media Queries to deliver different CSS properties dependent on the browser’s dimensions. This allows us to create one unified stylesheet that will deliver a unique experience to all browsers; regardless of dimension and device. It’s flawless in application because it only affects devices that understand it, those that don’t fall back to the usual CSS properties they do understand.

But don’t take my word for it. You should really read Ethan Marcotte’s article. And then read Smashing Magazine’s tutorial of how to use CSS3 Media Queries. And then maybe play around with it a bit yourself – check the source code here, I’ve started to myself. I’m not here to teach you the technicalities of using CSS3 Media Queries, so definitely check out those links if you are still confused about the nature of the properties or Responsive Web Design.

So far, there are three really great examples of Responsive Web Design out there, and each reveal a different design approach.

(more…)

“Useless” is of course, in the eye of the beholder.

Just wrote a small, dumb plugin to mimic a typewritter effect for text in jQuery.

Check the demo out here, get the plugin here, and check out the github page here.

If you’ve developed an ajax site, at some point you may have ran into the problem of not being able to make ajax requests across different domains or sub-domains. And if you haven’t run into this problem yet – don’t worry, it’s coming.

Fortunately, my buddy Kenny whom I work with at HUGE wrote a quick PHP class to solve this problem. Basically, rather than routing requests directly to the other domain, you route them to a PHP file hosted on your local domain with the ajax-proxy class instantiated. The class then visits the URL on a separate domain and saves the response text via PHP, which has no cross domain limits. This response is then returned by the PHP class, and finally to your Ajax function!

There are a few other attempts at proxies out there, but as far as I know Kenny’s ajax-proxy is the only one that also sends cookies along with the request. So if the domain you are requesting to requires a cookie which is set on your original domain – no worries. Ajax-proxy takes care of it for you!

Don’t take my word for it. Read Kenny’s blog post for better details. Or just check it out at HUGE’s github account!

(Because you don’t have to listen to me) –> Check out USTORE.js @ github, or check out the JS file itself!

Two of the cooler new features in the HTML5 spec are localStorage and sessionStorage. You might wanna think of them like cookies, but on steroids.

LocalStorage allows for data, in name value pairs, to be stored within the web browser. This data will persist past window closures and browser crashes, and will stay consistent across multiple tabs & windows of the same URL.

SessionStorage is exactly the same as localStorage with a difference – the data only lasts for the life of the browser window. If the window is closed, or the browser crashes, the data is dumped. The data will be independent across multiple tabs & windows of the same URL.

Native support for the localStorage and sessionStorage API’s can be found in the latest versions of Firefox, Chrome, Safari, and Opera, and even IE8! So as usual, the nut to crack lies in how do we get this to work in IE6 & IE7?

Well, there is a jQuery plugin out there called jStorage, among a few others, that successfully emulates localStorage across all the major browsers, including IE6+. But what of sessionStorage?

While working at HUGE, I’ve been able to put together a small javascript library that does just that. Both local and session storages are supported by USTORE.js.

Check it out @ github, or check out the JS file itself! Official docs will be coming soon.

Microsoft Word is crippling the youth of America from having a brighter future.

Sort of. In regards to the entire history of education, the computer has barely scratched the surface; only gaining significant relevancy some short 15-20 years ago. But if the “recent” pace of growing technology has shown us anything, it’s that comparisons to the past are often moot points. I mean, sometimes I just look at my iPhone and think stupidly about how impossible I would’ve thought this was only 5 years ago. 5 years ago! Most of my favorite TV shows have been running for longer than the time it’s taken for technology to amaze me.

But I digress. The plain, documented truth is that the standard of education in America is lower than just about every other relevant country in the world. And the scary thing is that America is seemingly the most sluggish to find change. Matched with the acceleration induced upon the world by technological growth (see: the internet), the potential for an American landslide in progress comes closer to reality.

I’m going to propose a pretty heavy change to the standard American education. Rather than (only) teaching students how to use “word processing” programs like Microsoft Word to write essays, let’s have them write their essays in HTML.

I’m not talking about throwing Designing with Web Standards at the kids, and having them learn about Doctypes, the w3c, etc etc etc – I’m talking about teaching them raw, nitty gritty, HTML. A simple five paragraph essay, and I don’t know how many of these I wrote throughout my middle and high school careers, could read as follows:

And that’s it! Rudimentary, fundamental, semantic HTML. Now, web development becomes an easy entry point for any kid. On top of that; being taught semantically sound HTML is something SOOO many developers take for granted – if they learned how to separate their content from their design & logic at a young age, by just focusing on their content, imagine how much better the web would be.

But mostly? All Americans will be able to language that they can develop into a skill – and this will work seamlessly into the fabric of their continuing education. And not just any skill, a skill that can easily later get them a J-O-B. That’s what the country’s educational system sorely lacks – a way for kids to grow up and get good jobs. HTML is an easy to train, easy to learn, and easy to teach skill that can become invaluable if taught on a widespread scale as an integrated portion of a student’s basic skill set.

So how to conclude? With the fact that I only editorialize in blogs tehse days, it’s hard for me to figure out what to say. My apologies to Ms. McNanny, my freshman year english teacher who taught me how to write an essay in the first place – this conclusion isn’t gonna be stellar.

What will an American student who learned HTML be saying in 20 years when they grow up?

Suck on that, china.