flanagan.

designer, geek, renaissance man, general smart ass.

Posted

Wednesday the 12th of January in 2011

Working on a slab serif typeface. I’m getting tired of not having a good slab serif with all the features I want, so I’m making one.

Working on a slab serif typeface. I’m getting tired of not having a good slab serif with all the features I want, so I’m making one.

Posted

Wednesday the 25th of August in 2010

Title Case jQuery Plugin

For a recent project, I would be handing over control of the content to one of the site’s owners, but I had put very strict typographic controls in place for the headlines. They rely upon appropriate title case (initial capital no matter what, and context-specific capitalization), to be used, or else they don’t work properly. I know that, and I can explain it until I’m blue in the face, but people forget (and likely, so would I). So I set out to create a plugin for jQuery that would automatically turn all of the headlines into appropriate title case.

Luckily for me, a few kind folks had already done similar work in Perl and standard Javascript just a couple years ago. 

So I took David Gouch’s standard Javascript code and converted it to work on any element in the DOM, automatically. I plan on releasing it to the jQuery Plugins repository, but that’s currently way broken thanks to an overwhelming amount of spam. So look for it there when they get a new repository up and running, but in the meantime, copy and paste the following code into a file, name it “jquery.titlecase.js” and make sure to link to it in the <head> of your HTML.

/*
 * jQuery Title Case Plugin
 *
 * Copyright (c) 2010 Sean Flanagan <sean@redflannelgroup.com>
 * Based on David Gouch's To Title Case Javascript <http://individed.com/code/to-title-case/>
 * Itself based on John Gruber's Title Case Perl Script <http://daringfireball.net/2008/05/title_case, http://daringfireball.net/2008/08/title_case_update>
 *
 * To use, add .toTitleCase() to a selector. 
 * e.g. $("h1").toTitleCase();
 */
(function($) {
$.fn.toTitleCase = function() {
	$(this).each(function(){
	var headline = $(this).text();
	$(this).text(headline.replace(/([\w&`'‘’"“.@:\/\{\(\[<>_]+-? *)/g,function(match, pl, index, title){
		if (index > 0 && title.charAt(index - 2) !== ":" && match.search(/^(a(nd?|s|t)?|b(ut|y)|en|for|i[fn]|o[fnr]|t(he|o)|vs?\.?|via)[ \-]/i) > -1)
			return match.toLowerCase();
		if (title.substring(index - 1, index + 1).search(/['"_{(\[]/) > -1)
			return match.charAt(0) + match.charAt(1).toUpperCase() + match.substr(2);
		if (match.substr(1).search(/[A-Z]+|&|[\w]+[._][\w]+/) > -1 || title.substring(index - 1, index + 1).search(/[\])}]/) > -1)
			return match;
		return match.charAt(0).toUpperCase() + match.substr(1);
	}));
	});
};
})(jQuery);

Happy coding!

Posted

Tuesday the 08th of June in 2010

We Can’t Stop Here! This is Bat Country!

Driving home from date night with Nicole, I passed 3 cops speeding the opposite direction to something important, lights on & sirens blaring, about 1 minute apart. The third one (a local cop, while the others were State Troopers) slows down, pulls u-turn and gets behind me, still with lights & sirens. I pull over, he gets right behind me as if for a traffic stop, but then crawls past me and stops about 50 feet up. So I creep up in case he just has a strange technique pulling people over. As I do, he pulls a second u-turn, stops for a second on the other side of the highway, looks at me, then speeds off again. So I left.

Posted

Tuesday the 01st of June in 2010

Posted

Wednesday the 19th of May in 2010

Guys, let’s figure out what we’re doing and do it.

suitsandboots:

I see too many dudes every day who have no idea what they’re doing: guys who  have no idea how to dress, how to drive, how to lift weights, how to eat/drink, how to sit, how to listen, how to speak, how to spell, how to write, how to think for themselves, or how to even live their lives.

I very, very rarely meet a fellow gentleman and then later think to myself, “He knows what he’s doing”. That sucks. Now, I don’t claim to know what I’m doing most of the time, but I’m trying. Please try with me.

I stole this from suitsandboots.

Posted

Thursday the 13th of May in 2010

On Flash (And Not Mentioning Apple or HTML5 Once)

(Make that only once. In the headline.)

Now that Adobe has officially made public its efforts to argue with other platform creators (see here) about the future of the Web and what should be included in it, I find it now absolutely necessary to bore you with my take.

Never before has Adobe complained that one of its products won’t run on a particular platform. As a matter of fact, in the mobile arena, Flash doesn’t exactly run on anything officially, and Adobe didn’t seem to really care at all. They couldn’t see what was coming. However, now that mobile platforms have created viable web browsing devices, Adobe wants in. They’re starting to finally develop for these platforms, and have announced plans to release Flash for Android last summer this past winter this summer sometime in the future. That’s great. Folks with Android devices will be able to install Flash (hopefully as an opt-in thing rather than a why-can’t-I-delete-this thing) and thus access a plethora of information locked inside Flash-based videos and websites that they otherwise might not have been able to before. Good on Adobe and Google, I say.

But there’s a problem.

There exist people like me. I’m a web designer (to put it briefly), and I loathe Flash. I loathe practically every aspect of it (not least of which are its authoring tools, but more on that later). I code every site I build by hand, and I am not alone. For a few years now, there have essentially been two extremist camps in the politics of web design: those who code to web standards, and those who build sites in Flash. Unfortunately for Adobe, the former camp is winning, and the latter camp is beginning to disappear.

The Benefits of Flash

There are a few reasons for this, but I infer that much of it has to do with what were perceived as benefits to creating a site in Flash. About ten years ago, these were:

  1. Authoring tools that work similar to other design software
  2. Flexibility in use of graphics
  3. Relatively nice typography controls, including built-in anti-aliasing
  4. Cross-platform compatibility
  5. Support for fairly stable scripting
  6. Animation
  7. Audio and Video

Unfortunately for the Flash camp, ten years have elapsed. That has given people more than enough time, if they were interested enough, to learn how to build sites without Flash. That takes care of benefit number one. Its also allowed the browser market to level out and move technology along so much so that 2-5 are no longer an issue with non-Flash sites. Typography on the web has gotten a huge shot in the arm with the @font-face CSS call being supported by all major browsers, and more recently, licensing being worked out by the major font houses to allow the use of virtually any typeface. Meanwhile, Flash upgrades have consisted mainly of video integration and updates to its ActionScript scripting language, while things like MooTools, Prototype.js, and jQuery have come to make Javascript much more designer-friendly.

It’s all left Flash with just two benefits over other options: Animation and A/V.

Let’s talk about audio and video first. The whole debate about the use of Flash on the web lately has been, at its core, about this very issue. Right now, lots of sites use Flash to easily serve audio and video with about as much ease as can be expected. I’ve used it for that, too, and while the interface takes some getting used to (I’m getting to it), it’s a much more straightforward process than anything else this side of YouTube.

Unfortunately, we’re reaching a point (again, 10 years later) where this benefit is slowly starting to lose traction. Consumer video tools are becoming more and more easy to use, and they all export to formats that are readily usable immediately on the web by the platforms that created them: on Windows, they export to WMV that can be seen by anyone on the web who has a Windows machine; on Mac, they export to QuickTime and/or H.264 that can be seen by anyone on the web who has a Mac. And there’s some overlap, too, as the Mac can view some WMV movies and QuickTime is installed on a lot of Windows machines. However, formats like H.264 are gaining lots of traction and are beginning to be supported not just by operating systems, but by browsers themselves. The browser makers have realized that, even though some standards haven’t been adopted yet, it’s in their best interest to be able to display video directly on a web page without the use of a plugin like QuickTime or Flash. Mircosoft itself, in fact, just announced that it will supportH.264 in the next release of Internet Explorer. Soon enough, any web designer worth his salt will be able to display a video or audio on a page with as much ease as he/she does an image right now. So there goes benefit number seven.

Which brings us to benefit number six: animation. And for this, I have some good news for Adobe.

I have to hand it to Flash; right now, it’s the only game in town for robust web-based animation. Sure, Webkit supports CSS animations, but they’re primitive and require a lot of coding for even the simplest of animations. Javascript can do animation, too, but it’s in the same boat as CSS with its complexity. And the best news for Adobe is that the standards organizations that control such things in CSS and Javascript are many years away from implementing anything like what’s available animation-wise in Flash. There are a few folks putting on a show of programming skills, using only CSS and/or Javascript to create complex-looking animations. But I challenge them to animate a cartoon using CSS and/or Javascript. I Imagine I’ll be waiting a while on that one.

So what does all of this mean? In just a short while, Flash will only have one thing left going for it. And that’s on the web, where it’s strongest. I haven’t even mentioned the drawbacks of Flash.

The Drawbacks of Flash

Hold on to your seats, because this is going to be one bumpy ride.

Ask Flash to do anything besides simple tween animation, and it chokes. On certain platforms (*cough* Mac *cough*), it’s virtually unusable. I have Flash blocked in both browsers I use regularly, on all computers I use regularly. If I really want to see something, I click on the blank space where the bit of Flash would normally be, and it loads in. This has taught me a few things:

  1. Flash isn’t nearly as ubiquitous as some would lead one to believe
  2. People use Flash for the stupidest things, like single navigation buttons
  3. It’s the biggest resource hog this side of a Hummer H2
  4. I get the Spinning Wheel of Death every time it loads
  5. Video playback (remember, one of its touted features) is horrendous
  6. Almost every use outside of cartoons and games can be done easily by something else

I’ve actually started to refuse to create anything in Flash for clients as a result. Instead, I’ve been using just a few hundred lines of Javascript (using jQuery) to accomplish even the most complex slideshows, photo transitions, menu animations, unique UI behaviors, and pretty much anything else clients have thrown at me. And the best part is that it’s all faster than it would have been were it done in Flash.

Which brings me (finally) to the authoring tools provided by Adobe for creating Flash as part of Adobe Creative Suite:

They suck.

I’ve already noted what happens when I load Flash in a browser; well, Adobe has decided that it would be great if the entire user interface of the Flash authoring desktop program were created (get this) in Flash. It has gotten to the point where it sometimes takes 3 or 4 tries to even open the program without it crashing, and once it opens, that’s when the fun really begins. What used to be fairly reasonably laid out tools have turned into a vomit of menus, panels, floating windows, and other miscellany that have virtually no consistency not just with the operating system, but with each other. It makes the whole experience of creating anything in Flash a hardship.

Which makes me wonder why anyone other than Adobe itself would be campaigning for Flash to be supported on all platforms. Who are these developers who insist on using Flash with everything that is either already in place or on its way very soon?

Me? I wouldn’t trust anyone who says they’ll build a site for you in Flash. And if they tell you they can build a cross-platform application that will run in Adobe AIR, run the other way. Fast.

Posted

Friday the 07th of May in 2010

There must be some misunderstanding

Dear everyone who is arguing about Flash,

HTML5 is a fucking text markup language, not some magical all-in-one audio/visual interactivity suite. All it does is say, “This piece of text is that kind of information.” That’s it. I swear to God if this term becomes the next “Web 2.0” marketing garbage.

Love,
Sean

Posted

Saturday the 24th of April in 2010

If you&#8217;re seeing this, I&#8217;m in Disney World with Nicole. (And yes, I did design that.)

If you’re seeing this, I’m in Disney World with Nicole. (And yes, I did design that.)