Playpen #8 – Pub Standards Logos

Thursday, January 18th, 2007 at 2:07pm

A couple of days ago, Dan threw down the gauntlet asking if anyone could come up with a logo for the pub standardistas to use on their blogs. Here’e one of my efforts, which will henceforth grace this blog.

You can see some alternatives in the Playpen #8 page.

Hopefully, some more folks will have a go at designing some logos too. When they are available, I’ll let you know – the more the merrier :-)

I’m also very pleased to have secured my place for @media 2007 europe europe this morning! I really enjoyed the 2006 conference, and look forward to all the new sessions on offer. You can read some of my past posts for @media 2006.

@media, Hot Topics Panel

Saturday, June 17th, 2006 at 1:22am

Closing panel for the conference. Just a mixture of random thoughts and questions.

  • CSS is still an undiscovered country – progressive CSS should come. IE7 is playing catchup with a lot of the other browsers.
  • Evangelising on the use of CSS is done – it should be a given (ha ha ha in some places)
  • We’re now waiting for the next leap forward in what we can depend on as far as browser support for the standards.
  • Tantek demonstrated cutting edge css in Safari – a honeycomb pattern (yes, hexagons!) with rollover change of state – done entirely with CSS and not a graphic in sight. Blimey! That man has an enormous brain…
  • Wireframing applications with XHTML/CSS is the only way to test fluid and changable size of text etc.
  • What’s missing from WebUI – Tantek would like an “undo” analagous function – plus CTL-S to save text in a form as you’re going along (how many times have forms bombed on send, much to our cussing?) Or even better, persist it in the browser so its still there when you come back next time.
  • Yahoo Libraries – no idea why I wrote this down, will have to Google for enlightenment ;-)
  • Can Ajax be made accessible? Questioner wondered whether inaccessibility was a fundamental problem of Ajax, or just how it is implemented on any given site. User Agents are not really fully Ajax capable. Refs, Derek Featherstone/Joe Clarke basecamphq.com
  • According to technorati.com ’s user stats, 15% of users have Javascript turned OFF!
  • It’s best to specialise, but be aware of the designer/developer “trench” :-)

What’s Coming Up?

  • We need real, practical solutions for web designers
  • Best practices
  • Microformats, iCal
  • OpenData – ยต-formats, mashing, GoogleMaps release API, giving us frappr.com
  • hCards hCalendars and RSS

There should be podcasts of the seminars out in due course, available from the @media website.

@media, Fine Art of Web Design

Friday, June 16th, 2006 at 11:03pm

Andy Clarke of Stuff & Nonsense / And All That Malarkey

Andy’s an odd fish! But he thinks of things in different ways, and from different viewpoints. He sees inspiration for web design all over, not just online. “Art is design without compromise” – Jeffrey Veen.

Bound By Boxes
We are hampered every which way by boxes, stemming from:

  • The environment – ie a 2D screen, which is inflexible
  • The Materials – ie the limits of Markup+CSS
  • Medium – poor CSS support in older browsers
  • Ourselves! – unlearning what we have already learned.
  • Refs: Blue Robot’s Reservior, Web Standards Awards

Grid Design
It is a fundamental skill of any designer – using the grid (see also the writeup on Good Design vs Great Design). BUT, what do we end up with?

becomes

Should we look at the web for inspiration, at places like cssreboot, or csszengarden?
Or should we look elsewhere? Maybe a right nav and vertical header could work for your site!

Keep a Scrapbook – could be magazine cuttings, etc, just to give inspiration from other areas. Showed example of page layout which was thus – just an ordered list, effectively – think how this below could be marked up with CSS?

Sometimes the juxtaposition of lines and curves can be quite interesting to think about.

Markup In The Real World
Markup needs to be technically valid but contain elements that have been chosen to convey meaning, semantically. If its tabular data – present it in a table!

Progressive Enhancement
Name given to technique were basic stuff is marked up for styling in IE, plus bells and whistles for other more capable browsers – eg Moz browsers can cope with the :hover class on any element, not just anchors; round corners on boxes are coming!

Transcendent CSS makes full use of all the most up to date CSS techniques. In CSS2.1 this could mean attribute selectors, parent/child/sibling selecctors, pseudo classes eg first/last child etc. Only use hacks to target browsers to turn things off.

Graded Browser Support
Doesn’t mean everyone gets the same thing – but so what if it works and is usable in older browsers. IE7 will level the playing field a bit more (we hope!).

Refs: Yahoo DevNet – Browser Grades
stuffandnonsense.co.uk/downloads/transcendingcss.pdf