Recent Reading (JS Natives Duke it Out, Regexp in jQuery, Performance, a New Image Format?)

by Rob Larsen

Sorry, it’s been a while. I’ve been busy at work, I’ve been wringing every last bit out of summer on my bike, and I’ve spent a lot of my free time on my upcoming CSS presentation, so I haven’t been posting as much as I would like. Fall is here. Which means I should have more time for writing. That’s cool.

Anyway, to break the ice here are a few articles that have recently caught my attention.
Read the rest of this entry »

In Case You Missed It:

by Rob Larsen

I started doing some writing for Isobar/Molecular.

My first post:

An Introduction to HTML5

HTML5 is the latest version of the language that serves as the foundation of the web. It’s the first major revision in over 10 years and as it’s gotten closer to its final form and more and more browsers begin to implement its features it’s become a source of intense interest and contention in the technology community. This article hopes to explain the realities of HTML5, dispel a couple of myths and shine some light on the future of the web.

To begin we’ll need to define what we’re talking about when we say “HTML5.” There is a specification to refer to and much of what falls under the HTML5 name lives in that spec. In addition, there are several related specifications and APIs that are lumped together and called “HTML5″ when people talk about these things informally.

So, conversationally, HTML5 consists of the following:

New Semantic Elements

HTML5 has introduced several new elements. They aim to introduce more meaning to markup and codify existing web development patterns. Some examples of these new elements are nav (for navigation), article, header and footer.

Read the rest of this entry »

I also added a few bits and bobs to our our front-end development best practices, a doc which has been making the rounds a little bit over the past week.

Check ‘em out.

getElementsByTagName Namespace Prefix Strangeness in Safari/Chrome/WebKit

by Rob Larsen

Is It Me or the Browser?

I had a Safari bug on a project I’m rushing to get out the door. We’re using a Flickr feed to populate a div with link+thumbnail to some flickr images. In Firefox/Internet Explorer I simply did the following to build the links:

flickr : function(obj) {
//get the full list of items
	var items = obj.getElementsByTagName("item");
//make sure it's not empty
	if (items.length > 0 ) {
//start the HTML block
		var blob = "<div id='flickrFeed'>";
//loop through the items (we only want 5) and build some links)
		for (var i = 0; i< 5 ; i++) {
//get the link
			var flink = items[i].getElementsByTagName("link")[0].childNodes[0].nodeValue; 
//get the thumbnail
			var flurl = items[i].getElementsByTagName("media:thumbnail")[0].getAttribute("url");
//smash them into the string
			blob+="<a href='"+flink+"'><img height='75' width='75' src='"+flurl+"' /></a>";
		};
//close the div
		blob+="</div>";
//pop it onto the shelf, for later use
		$("hyperspace").innerHTML+=blob;
	} else {
//if there's somethign wrong with the feed, go to default contentk
		social.fallBack.flickr(); 
	}
}

Read the rest of this entry »