August 24, 2004
This site has been put up on Stylegala and is currently number 4 in the voting. Nice one.
Not the best write up i’ve ever had, but the comments back are good and has made me think about altering a couple of things.
- The write up is right in that the menu is a little old-hat. I think this needs to change. Maybe into tabs. Not sure yet.
- The design needs some finesse. Some spit and polish. But i’ve got a solid base now on which to add that - I know I won’t be polishing a turd.
- There are some issues, as highlighted, with navigating within the portfolio section. This section has a linear navigational model rather than multi-level, like the rest of the site. Needs some work to make it more usable I guess. I’ll have a think about that.
May 24, 2004
A few new CSS things to look at this fine morning (all courtesy of email being down - I like monday mornings like this one)
http://www.webstandardsawards.com/
Some nice new sites, some of which are minging though. I really don’t get the whole rich, wallpaper background image, looks like the smoking room in ‘The Butchers’, design thing. It’s not big or clever. I’m talking about http://www.alazanto.org/
It turns out CSS Vault is either a. Not going to be here soon or b. Going to be run by people outside of the 9rules network. Shame. Although I can see his point.
Version 2 is a great idea. I think after the wedding i’m going to enter this competition, I think i’d have a good chance of getting somewhere.
http://www.cssbeauty.com/
Similar to CSS Vault. highlights for me - http://www.instablog.org/. This is great. Purely typographic. Design like a newspaper. I bit down and dirty with the CSS, with a few bugs, but otherwise really nice.
May 11, 2004
Yesterday saw the relaunch of Blogger. All the “Web Standards” blogs out there were thick with praise for this redesign (I guess most of them don’t actually see beyond Doug’s great design and the Standards implementation). Doug has documented the process which has some great insights into this new launch.
I think the real success here is the Usability work done (and Dougs interpretation of the required “Ease-of-use"). The work Adaptive Path have done is fantastically elegant.
Good design shouldn’t be noticed. A very well design book, or newspaper, just works. The design doesn;t get in the way of the message. The new Blogger site is a wonderful example of this. Ease of use was of upmost importance, Jeff Veen points out that the Blogger wanted to be able to set up a blog, in three steps, in less than five minutes. Quite an undertaking.
The registration process is superb, one of the best i’ve used. Ever. It’s so simple even my mother could use it (and that’s saying something). Here’s some grabs of the process. What’s nice to see is contextual help links next to items that you may want help with.
The new Blogger logo is a good step on from the previous version and it ties in very well to the overall “curved” look of the site. I’m not over familiar with the original version of the logo, but I do know it was square, orange and blue. It’s a great logotype though. It carries a lot of the brand values - ease of use, approachable etc.
There are plenty of new templates available with the new Blogger, and all of them configurable from within the Blogger web-based interface.
The templates can be seen in full here. Some great designs from Zeldman, Bowman and Dan Cederhome (although there are a couple of lemons in there too, but maybe that’s just me).All of the templates are XHTML, with CSS driven presentation (as you’d expect from authors like this).
March 04, 2004
Have a look at the Web Standards Awards. Nice looking site in itself but previews some really good standards compliant sites globally.
January 13, 2004
Some interesting articles around at the moment.
ALA as always delivers the goods this week with two great articles. Faux Columns answers some questions in my mind about vertically stretching divs etc. Elastic Design adds some thoughts surrounding the whole fixed/liquid thing.
Max design has a great “how to” guide on building a full CSS site. It takes you through the simple building blocks of writing semantic code and useful CSS. There’s a great section on print stylesheets too.
Found this site of an agency called 37signals which has a good balance of design and usability. They have some really good visuals of usability reports and that kind of thing (i’m finding this sort of thing with a brand guide I need to write soon). Some good resources and writing too.
Zeldman’s done a redesign which is cool although I find the tabs a little odd.
December 17, 2003
A lot has been said over the do’s and don’t’s of layout on screen. Designers who have a traditional design background, advocate a fixed column width is the way to go. Designers who have spent most of their working life designing for screen will be a little less retesent to go for a flexible layout (aka. Amazon). Of course the likes of Jakob Nielson will advocate that a flexible layout is more appropriate for browser window for usability purposes.
I kind of sit in the middle. The typographer in me screams “NO! Em’s are there for a reason, you can take advantage of them in CSS, so do it!” But the usability half of me see’s the advantages of a flexible layout and Doug’s site Stop Design proved this point well with one of the best flexible layouts i’ve seen. I say “proved” because he’s recently changed it to a fixed width which has prompted my post here.
There’s been some arguments about the “death of flexible width designs”. Personally the type of flexible width designs we’ve seen (amazon etc) should go simply because they degrade legibility by having no control over the line length of text.
“Hold on a minute! You can’t get rid of them all together” I hear you cry. No, we shouldn’t. We should replace them. True, the Snooch site is currently flexible, but i’m going to move it over to a fixed width BUT instead of the fixed width being based upon a pixel width, it will be based upon a em measurement.
So, how is this done? Well, first of all for those who don’t know, an “em” is a measurement in typesetting which is the width of the capital M of the font and size you are using. The “em” is a relational measurement, unlike a pixel which is a fixed measurement. Relationships like this are all important in “proper” typography. Line widths are related to the width of the font you are using. So, what i’m planning to do is have a “fixed” column width based on em’s BUT, this is the clever bit, If the users font size is a different size to the one specified in the stylesheet the column width would change accordingly ensuring legibility is retained. This is different to pixel width columns which retain that set width regardless of the size of the font.
Watch this site over the next few days for a change…
December 08, 2003
Imaginet launched the Arriva Trains Wales website yesterday using Standards Based design for markup and layout. all credit to them, it looks good, works well cross browser. There’s a few bugs, the pages don’t validate as XHTML Strict although content or the odd tag is producing the errors - nothing major.
It’s good to see a major player such as Imaginet here in Cardiff launching a site like this. All credit to them.
December 05, 2003
How many times have you heard “I’m sick of websites looking boxy”, no? Well, I get it almost every week. Once again ALA come up with the goods with a fantastic article of creating rounded corners using css and semantic markup.
What’s really interesting here is when the user’s font size is increased, the thing doesn’t break at all! I had to get up to about 300% of the original specified font size for the corners to start degrading. Thing is, it wasn’t the corners that degraded - it was the type within the div (breaking out of the div). Very nice.
I'm a graphic designer from near Cardiff in the UK. I've been a designer for over ten years now and primarily work on the web. I'm still partial to a bit of print every now and then though. I used to work for