2008-12-14 OMG! web output finally has it's own design!

I really didn't expect this myself.

More than a year ago I already had a design idea and did a mockup in Fireworks. A working HTML Dummy was quickly done. Then I had a look into how to build Templates in Serendipity (the Software used for this blog) and instantly lost any interest in ever finishing this.

Serendipitously the old Design was so incredibly ugly and the Code so painfully invalid that the few times I had so see it myself made me being so ashamed of it that I eventually had a Sunday full of Smarty (the Template engine used in Serendipity) and tadaaaaaaaaaaa:

The new Design was actually launched!

2008-12-11 jQuery-skipnavHighlight - nicely highlighting skip link targets

[deutsche Version dieses Beitrags anzeigen]

When I read about the Skip Links of the recently relaunched Website of City of Stockholm in the "EfA-Laborbericht, Teil 7" (german) I got instantly aware that I want to use this technique from now on as well.

To avoid "jumping" of the highlighted Containers the Developers used the CSS 2 Property outline which does not add up to the width of the Element it's surrounding like border would do. Sadly this Property is only available in the newest Browser Generation which makes the effect entirely invisible in the Internet Explorers.

To work around this Issue I used another approach. My little jQuery Plugin "skipnavHighlight"created an empty DIV and uses it to draw a Border around the link target.

You can find the working Demo here and you can download the Code of skipnavHighlight.jquery here.

2008-11-19 LogFocus - handy Bookmarklet for Keyboard Accessibility testing

[deutsche Version dieses Beitrags anzeigen]

Offering usability for Users without Mouse is one of the biggest and most important Steps when building accessible Websites. While testing for Keyboard Accessibility you might find yourself very often in Situations like "Where is my Cursor?" or "What Element has the Focus right now?". Especially when Elements get moved offscreen things might end up confusing.

A Script, I've been using for a while to solve situations like this, I have now converted into a handy Bookmarklet.

LogFocus works in all Browsers that offer a Console. In Firefox you need Firebug. In Safari/WebKit you need to activate the "develop" Menue. For Internet Explorer I recommend using Companion.JS. In Opera the build in Console in Dragonfly is used.

To install the Bookmarklet simply drag the following Link into your Bookmarks.


From there you can run it on every Page by simply clicking on it.

2008-09-29 Accessible Javascript using Frameworks - Barcamp London 5

Barcamp London 5 rocked!

thanks to the excellent wifi I was able to twitter all day so here are my 2 days of twitter logs:

  1. is getting ready for Barcamp London 5 - feels very very tired and not too excited though... 07:44 AM September 27, 2008
  2. is at the beautiful ebay offices in Richmond for Barcamp London 5 and successfully entered the probably longest wifi password ever... 10:21 AM September 27, 2008
  3. just reasilzed that the 'squash' in 'fruit and squash' tastes ugly... 10:45 AM September 27, 2008
  4. welcome talk is coming up... 11:08 AM September 27, 2008
  5. 15 minutes to Noms... 11:47 AM September 27, 2008
  6. learned how to hack moo and is now getting ready for his own talk... 01:37 PM September 27, 2008
  7. is trying to figure out how to get this Display working with my MacBook... 01:55 PM September 27, 2008
  8. got it working! yay! the VGA Adaptor sucked... 01:58 PM September 27, 2008
  9. successfully finished his own talk and now learns the ancient art of stabbing people ... 03:03 PM September 27, 2008
  10. this is very funny in a very disturbing way... 03:09 PM September 27, 2008
  11. can't really decide what to see next. open gl in javascript, developing an iphone app and xul firefox extension development are on - hm... 03:52 PM September 27, 2008
  12. decided to see the xul school for firefox extension talk just because it's in the bean bag room... 04:03 PM September 27, 2008
  13. is now listening to caz to learn how to do better photographs 05:06 PM September 27, 2008
  14. is now waiting for @cbetta to show me how he does his cool HDR Photos... 06:06 PM September 27, 2008
  15. is having great fun playing mario kart on wii! 07:27 PM September 27, 2008
  16. that what she said... 08:01 PM September 27, 2008
  17. @TheMarco this sounds super awesome! have a lot of fun and show us the results! :-) 07:29 AM September 28, 2008 in reply to TheMarco
  18. is now getting ready for Barcamp London day 2 - tired... 07:32 AM September 28, 2008
  19. @georgebrock would you mind moving your session to another Slot? I'd love to see @cathyma's calligraphy session as well as your mac session. 07:58 AM September 28, 2008 in reply to georgebrock
  20. is listening to @simonwillison scaring us again with his XSS talk from @media ajax... about 23 hours ago
  21. is listening to @natbat telling us how to build nice, clean and maintainable CSS wishing he could use conditional comments again - sigh... about 22 hours ago
  22. seen a lot of lightning talks during lunch and is now fascinated by @cathyma's calligraphy... about 21 hours ago
  23. after total calligraphy relaxation it's now time for @workingwithme's talk about how to suck data out of wikipedia... about 20 hours ago
  24. last talk coming up. @georgebrock teaching web devs how to code osx apps - thanks again for moving the talk :-) about 19 hours ago
  25. had a great Barcamp London 5 and is now happy being at home :-) about 16 hours ago

The Slide of my own talk can be found here: