Morisy.com

One thing I've been mildly-yet-obsessively entranced with for a number of years is how nicely Gawker plays with thumbnails:

One of the minor irritations of modern web design is that, even you HTML the hell out a blog post to make it look perfect in terms of graphical layout, by the time you trim, sanitize and otherwise disembowel that HTML for your teaser text, at best you'll have something dull, at worst you'll have something that wreaks havoc on the rest of your page. Gawker, however, automatically crops and resizes a photo as needed to create interesting, all-purpose graphic work that can be popped in wherever it pleases.

I was so jealous of the effect that I began working on my own Drupal module to copy it until I realize that, not only does such a module exist, but it's one of Drupal's most popular: ImageCache.

I'm bringing the Morisy.com design up to the latest version of Instant Design. Overall it's not too drastic a change, but some images will likely break for a bit and the front page will require some heavy lifting. I've mostly been prepping it over at Spare Change News, which has forced me to get rid of much of the Morisy-specific cruft.

Also, it'll introduce drop-down menus. Let me know if you hate it in the comments!

By day, I primarily wear the "journalist" hat, but lately I've gotten involved with Spare Change News as a volunteer on the Development Committee. I'm sure I'll be writing more about them in the future, but suffice to say Spare Change is a street newspaper that's designed to be an accessible form of self-employment for homeless or formerly homeless individuals.

I was asked to help re-design their website:

So I'm working on the re-design which is going swimmingly and forcing me to work a bit more on Instant Design, but while I've found an excellent Drupal drop-down menu tutorial, I can't get rid of the damn unordered list bullet stylings, despite using the style: blank; tag or whatever it is.

The result is not pretty:
Spot

And that's why you're getting this wonky design rant rather than a post on SEO for journalists, like I've been planning for weeks.

Updated: I removed some spelling errors and a few rather unnecessary snarky remarks.

I will always have a soft spot in my heart for one of Drupal's default themes, Chameleon, but it was time for a refresh. Sometime this morning, my own custom theme "Instant Design" will turrned on.

It's based on BlueprintCSS, which truth be told is a rather great CSS framework once you're used to it. The default fonts it provides are gorgeous -- when I can get them to work.

The front page will show the biggest differences, particularly as it now looks more like a front page to a bona fide website rather than just some blog.

The design is still very much a work in progress, but I would estimate it's 85% done and (hopefully) 100% serviceable, so I'm launching it live to work out the bugs and to slowly update the features over the next couple of weeks. This will allow me to hopefully resume my regularly scheduled blog postings.

Some known bugs/to do's:

• Weird graphical glitch on front page images
• PHP problems don't let me put HTML text beneath the list of latest Instant History posts
• Too many links are hardcoded rather than Drupal-administrator editable
• The header is kind of ugly. I have a font I want to use, but it's being tricky
• Did I include a space for ads/promotional?
• The left sidebar images will made mouse overs
• As I build out content to fit, the three columns will include more inbound links
• The analytics information on the front page is made up - and will probably be just deleted
• Site search is only available on a dedicated page
• Images should be better web optimized, for the sake of my poor server

I'm a bit worried about how this will effect Google spidering, but the update shouldn't break any links except possibly the front page RSS. Feel free to e-mail me or comment here with any other problems you notice: ANY feedback is very appreciated.

Coincidentally, I upgraded the spam blocking from manual to Mollom yesterday. It should reduce CAPTCHAs you have to deal with while providing near instant (no pun intended) joy as your comments are moderated in real time.

Further Reading:

• Comment preview removed
• Morisy.com site update feed
• DrupalEasy's BlueprintCss guide, which was an indispensable starting point for this design

Not exactly new (says it was posted May 22, but I think it's older), Andy Rutledge has a rather lengthy critique of Fox News's website. He says his critique is in no way "a viable redesign effort beyond the specifics cited."

However, he does offer a lot of free advice:

• Make sure content doesn't look like ads.
• Go for clear, not cramped.
• Keep links clearly marked and consistent.
• Use a well-kept horizontal grid to avoid clutter.

No recap does his analysis justice, especially lacking the screen shots and mock ups Rutledge includes. Get it all here.