electronicsuitcase.net

I’m completely on the fence when in comes to javascript. I like the idea of implementing extra whirly gigs that make sites more usable and behave more like desktop applications, but bloat is bloat and if poorly implemented javascript can quickly blow apart your design into something completely unusable.

To make things even more complicated, I am a bit of a javascript moron. This is well documented. I won’t regale you with stories of my idiocy - suffice to say that as a result I demand that javascript is simple, easy to use and degrades gracefully.

I find javascript particularly useful to make up for the shortcomings of IE6 and that is what this post is mostly about.

Anyhow, I’ve started to use a few bits of javascript regularly and here’s my top 3 list –

Suckerfish (CSS/js dropdowns)

by htmldog.com

I first came across Suckerfish on A List Apart, but since that post they’ve gone back and made their code even better. Now, with just a dozen lines of javascript, you can make beautiful dropdowns that work across all browsers. In case you’re wondering the javascript part is really only necessary for IE6. I’ve used this code for both Wordpress and Drupal themes with very few problems. Hint: don’t bother trying to get your menu items to text-align: center. It won’t work. Really, it won’t work.

Form validation with jQuery

by bassistance.de

Forms, how I loathe thee. Building forms is a total pain in the ass and filling out forms isn’t fun either. Still they can be a beautiful thing when they are done correctly. Luckily some very clever people have made it easier to build forms - such as pForm and with a bit of help from the folks at bassistance.de you can make filling out your forms easier for the average user with a bit of validation.

pngFix for IE with jQuery

by andreaseberhard.de

Png’s are wonderful for designers because they fully support transparency. From wikipedia, “PNG offers a variety of transparency options. With truecolor and greyscale images either a single pixel value can be declared as transparent or an alpha channel can be added.” Back in the old days you had to fudge drop-shadows, etc. by using a gif with a matte around it that was the same colour as the background.

I like pngFix because you don’t have to add special classes to your html in order for the fix to work. It also supports background-images BUT it doesn’t yet support repeating background images.

F*cked… graphically, at least.

America Is F*cked…….(Graphically at least) from Jess Gibson on Vimeo.

In the last few months I’ve finished some pretty large drupal projects and thought I would share my top five tips for getting things rolling on your next drupal site. If you want a general overview of building drupal sites smashingmagazine.com just published the definitive post that I’ve read to date.

1. Adhere to drupal best practices from the start. Look forward to your site being around for a long while and set it up correctly. Even the basics, like taking advantage of using the sites/all folder to hold your non-core modules and themes can save you a lot of time down the road.

2. Make the website accessible to a wide range of people. It is easier to plan things like text-size controls, email-to-a-friend and print buttons when you’re in the design stages. Adding them in afterwards can look amateurish.

3. Give yourself time to input content and give it some TLC with proper formatting. Nothing is more boring than the same basic text layout on every page. With CMS’s half the point is having the same frame around your content so that navigation is consistent, etc. - but that doesn’t mean your text and image content has to be the same with every node. Float an image left, float it right, pull out an important quote and give it the bold+italic treatment. Don’t rush through this “final part” of the job - it’s very important.

4. Use some kind of design/development framework. Whatever works for you, but the point is to keep it consistent so that when it comes time to fix something or add a feature you can do it quickly. For most people just starting out with the same basic theme, like Zen, is enough. Later on though you might need to start keeping a folder of your regular modules, pre-configured modules, sample configurations of certain key theme components, and anything else you might need within arms reach. A note of caution though - make sure you check drupal.org for updates of the modules once in awhile.

5. FCKeditor - is the best editor there is, period. A lot of folks swear by tinyMCE but I think they’re just plain wrong. FCK has a built in file manager (that is a pain in the ass to configure but very worth it), a default CSS XML-based stylesheet associated with user-styles that is easy to override,  but most importantly it has a feature tied into the text editor that shows block elements boundaries in your html structure which is of huge benefit to 99% of all users.

http://www.fckeditor.net/

Lately I have been busy crossing genres between Bon Iver and Fleet Foxes (which we saw just last week at Element in Victoria) and some podcasts by Erol Alkan and Tiga. Alkan’s Beyond The Wizards Sleeve (link will open up iTunes) was recorded at G-Mex in Manchester and is stuck on repeat for me at the moment. This youtube video of Alkan at Coachella 2008 is pretty unstoppable.

Another brilliant podcast is WNYC’s Radio Lab hosted by Jad Abumrad and Robert Krulwich. Each show is unique and has an amazing story to tell, but Zoe Keating’s supersonic cello magic (iTunes) is really something to hear.

Lastly, enjoy Dawn Landes playing Young Folks (bluegrass style).

I’ve been spending quite a lot of time getting to know my new acer aspire one and this weekend I finally feel like I’ve reached a major milestone. After grabbing a few scripts from userstyles.org for the firefox stylish addon my web browsing ux is now satisfactory. Among the other addons that have filled the gap left by this tiny, pain-in-the-ass-keyboard are Speed Dial (loads thumbnails of your favorite sites in newly created tabs) and Foxmarks for bookmark syncing. Mostly the tweaks were about cutting down on the amount of typing that has to be done and making the best use of the small screen space available. I’ve also turned auto-hide on, a feature I thought I would never use for any length of time, but it saves a good quarter of and inch of realestate at the bottom of the screen so it had to go.