Journal
A bit of a realign
- Posted on: May 10, 2006
- In: Design, markboulton.co.uk
- Comments closed
Maybe it’s something about spring or maybe it’s the 48 hours I spent on a plane recently, but I thought it was about time I spruced this site up. Actually, the main reason goes back to @media last year when Jeremy included in his presentation a javascript image gallery. It kind of spiralled, totally out of control, from there really.
There’s quite a few changes. I’ve gone for a wider, more flexible four column grid, which I use in more configurations than the previous site. Typography wise, I’ve ditched Helvetica in favour of a serif, in this case Georgia. There’s also a logotype. I hope you agree, more of an evolution from the previous design.
One thing I am excited about in this new design is actually the new piece in my portfolio: The International Baccalaureate Organization’s Online Curriculum Centre and Workshop Resource Centre. Bit of a mouthful, but this was a fantastic project to work on. From April to January last year, I worked with the IBO to produce web standards based templates for these great applications.
Anyway, after a couple of weeks being unable to post due to replication issues, it’s nice to be back!
Most recent entries
- Designing for the Web: Paperback available 14th April
- Drupal7UX: we need you NOW!
- The Personal Cost of Designing on Spec
- Audience Matrix: Our thoughts on the Drupal 7 audience
- Drupal 7 Redesign
- Designing for the Web: Available to buy and download now
- Managing expectations
- Dipping a toe in the book production process
- Designing and building an eBook delivery system
- Why Self Publish?
Categories
Search
Journal feeds
Books
Stuff I like
Powered by Expression Engine



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
Comments
I’m really digging this Mark. The subtle changes really have a major impact on the design.
Alex B.
Wed 10th May 2006
at 9:31 pm
Thanks Alex. It may not be to everyone’s taste as it’s quite different to the previous design. Personally I think it’s a more considered, mature design which solves some problems which had been addressed on an reactionary basis on the previous design.
Mark Boulton
Wed 10th May 2006
at 9:39 pm
What I like: Good use of white space and the green accents.
What I find confusing: The header being over the right column, and thus leaving the menu navigation kinda free-wheeling it on the left. It seems that having the header over the right column anchors the page to the right which feels unnatural considering I read left to right, and adds weight/prominence to the right side which seems to be less important than the content on the right.
TR
Wed 10th May 2006
at 9:54 pm
Thanks TR.
What I was trying to do was retain an element of visual tension which was present in the previous design. This is achieved, I feel, by the logo placement and the resulting white space surrounding the navigation.
I take your point though.
Mark Boulton
Wed 10th May 2006
at 10:01 pm
I meant “...than the content on the left.”
TR
Wed 10th May 2006
at 10:02 pm
Really, really nice! I particularly like the varying thickness of lines to demark content areas… Works very well.
There’s a little bit of trouble in your work section in FF/Mac though - the screenhosts look like they’re overlapping.
Mike Stenhouse
Wed 10th May 2006
at 11:32 pm
Looks really nice, Mark. Well done, chap.
Although, I must say that I’ve noticed the thick line look (above the sections), for use of a better term, being carried over from print design (newspapers, magazines, etc.) to web design, blogs more specifically.
I’ve seen this design element used on Jeff Croft, Subtraction and a couple others that I can’t name off the top of my head.
What are your thoughts on it and why did you decide to use it for this particular design and/or designs you’ve done in the past? I’m just curious.
kartooner
Wed 10th May 2006
at 11:38 pm
I like the visual tension you’ve created with all secondary navigation on the right. Especially, how you combined three columns for the first/index/home page into two columns (with an implied third column if one includes the Gravatars) for the entries. And, how you’ve broken the rigid structure with your choice of alignment for the “Journal Feeds” (and it’s extra large Proud Member).
Very cool.
Sean Fraser
Thu 11th May 2006
at 12:48 am
The space and positions used in the header are nice, even though doesn’t seem to align perfectly, there also seem to be some inconsistencies throughout the design in regards to spacing and use of horizontal rules. My gripe however is with the gutters being so tight and not having any margins on the page, it feels a bit too closeted, its neither severe or open.
The post info fields also feel odd being on the right, it seems to break the flow of the thread, especially on the longer posts.
I’m guessing the stroke elements highlight important sections/areas through the use of width and contrast to distinguish them (which if true means the nav doesn’t comply with this otherwise common convention). -As the content is pretty much standard across the sites mentioned and only a few elements can be used in this way in minimalist strictly grid based sites, they do seem to blend together into one cohesive whole, as opposed to individual design voices.
Inconsistencies aside, it works, but in a slightly boring way…
john
Thu 11th May 2006
at 7:21 am
I really like the subtle changes you’ve done Mark. Mirror the words of Mike the varying thickness of lines works great. The differences in size of type works great too. Love it!
Stuart Maynard-Keene
Thu 11th May 2006
at 7:46 am
getting this :
seems overlapping colours
safari 2.0.3
mike
Thu 11th May 2006
at 8:02 am
All fixed - my mistake.
Dreaded Safari cache,
Cheers Mark.
mike
Thu 11th May 2006
at 8:46 am
kartooner: I think it’s a visual convention that works in some instances. If the approach is a formal, grid based, design (such as this one), then this visual device further strengthens the visibility of the underlying grid structure.
Also, they act as clear indicators to different content areas and could arguably aid legibility. I’m sure in newspaper design, where the content is considerably more densly presented than this site, that the horizontal rules help in seperating out the different content areas.
john: You make some interesting points, especially your point about ‘individual design voices’. My aim with this design was to consciously reduce the amount of visual noise and align the design a step closer to print media in terms of some of the visual conventions used. It’s heading in that direction, and over the coming few months I’m going to be adding more to the design which my increase the noise of that ‘voice’ you talk of. Think of this as a bit of a blank canvas at the moment.
Food for thought though, thank you.
Mark Boulton
Thu 11th May 2006
at 9:15 am
I really like the ‘new’ design, Mark: it’s clean, open, and professional.
I also like the use of Georgia for headers in combination with a sans-serif body? I’m sure I’ve seen it done somewhere else but, as usual, you manage to put my efforts to shame!
Oddly enough, I was toying with the idea of a redesign for my site but it would seem that it’s pretty much identical to what you’ve done here. Oh well, back to the drawing board!
Steve Marshall
Thu 11th May 2006
at 9:21 am
Bring back the homepage portal!!!
Graham Sanders
Thu 11th May 2006
at 12:10 pm
It seems that I’ll be the first to not like the new design very much. It has lost plenty of the elegance and noble appeal that your previous version had. The typography was a lot more sophisticated in my opinion. The homepage had much more impact on me. When I first visited your site a few moons ago, I was highly impressed with the beauty of your typography, grid and layout structure, as well as the use of subtle brown tones to compliment the green. My first impression was the reason I was interested in finding out more about the works and essays of this site. Now, well, it’s not at all a bad design, but it has very little impact on me because I see less individuality here, less creativity, less intelligence (design wise) and more conformity which might be a good thing for many and less so for others. This is just my humble personal opinion and, from the comments above, it seems that I’m on a very lonely train of thought.
maleika
Thu 11th May 2006
at 1:23 pm
Like some of the other commenters I too like the logo on the right and navigation placed where it is in plenty of space, although it feels like the nav should line up with the thick stripe below the logo.
The whole layout is really quite effective, except it seems to be lacking a suitable gutter between the two major columns - althought this could be a browser glitch - the markboulton.co.uk category almost touches the right hand column (I’m using Camino).
Richard Rutter
Thu 11th May 2006
at 1:25 pm
Mark, I think this looks terrific. I llike the logic of the page a lot. One comment: I recently tried something similar over at Subtraction.com with the visual attribution of comments, colorizing the horizontal rule above the comments that I authored to help readers pick them out more easily.
The feedback I got was that it seemed to suggest an unintentional and artiificial hiearchy within the comment thread. I didn’t see it immediately, but eventually I saw what I think a lot of readers were seeing. I think you may have that effect going on here with your green lines too.
Also, I’d just like to go on record: notwithstanding the fact that I think Cameron Moll is a super-smart guy, I can’t stand the term “realign.” I know it has a grassroots origin, but I really feel like it has all the makings of a meaningless corporate buzzword. Sorry to vent there.
Khoi Vinh
Thu 11th May 2006
at 2:39 pm
Thanks Khoi, I appreciate it. I take your point about the comment hiearchy and I totally agree, I really hadn’t spotted it, but thought there was something just, well, odd about the green line. At first I thought it might just be because the thickness was the same as the column lines, but now you mention it, maybe it is the hierachy.
It’s ok to vent. At first I thought that too, but I do like the idea that a realign has it’s roots in the previous designs and doesn’t imply a complete rethink. Maybe that’s just the ‘re’ in (re)design though.
Mark Boulton
Thu 11th May 2006
at 2:52 pm
Finally, someone said it. I totally agree - every time someone says “realign” I flinch a bit… Really, did we need a new term for it?
Ryan Brill
Thu 11th May 2006
at 4:40 pm
It’s wierd. At first, the right-aligned logo made my head spin and the navigation made me feel like both it and I were dangling from a rooftop. However, I go back, and it seems right. Hmmm.
Realign does seem too much like a marketing/sales term, as well. I like to think of a “refresh,” though that may border on the same problem I’ve listed above. But I think it’s good to distinguish between tearing down the house, and slapping some new paint on some of the walls, and I want to have a term for that.
JA
John Arthur
Thu 11th May 2006
at 5:38 pm
Got to admit, I much preferred the older version as well sorry mate.
The bold black type is quite impactful whereas before it was more sophisticated in its understatedness.
The logo really bothers me with it being in uppercase and what I really liked about the old version was the portal feel to the homepage. It was something I used almost everyday :(
Also you’ve broken the grid with the work section, surely there should be a gutter space between the 2 images?
?and lastly the strapline is too near to the cliche ‘websites that work’ used by Zeldmann and Imaginet.
Still a good site though but was nicer before I’m afraid, guess I don’t changes.
Graham Sanders
Thu 11th May 2006
at 7:34 pm
You might try changing the color of your comment text to a different color. See how Ryan Irelan does it. Just an idea.
I like your reimaging. I find myself drawn to sites that display an obvious grid with lots of lines. That includes Subtraction, Jeff Croft, and yours. Of course, it helps that all three sites are quite well-done and well-written.
Michael Hessling
Thu 11th May 2006
at 8:01 pm
I read with great interest all the comments about your website, being a novice I find that your site is easy to read and very uncomplicated, the design to me looks really good, although as I said I am a novice where design is concerened, having said that, I know what looks good and have a very good eye for colour/text.
Lin @ Pulmann
Fri 12th May 2006
at 11:35 am
Really liking it Mark. A definate improvement. A lot more ‘solid’.
My feeling on the comments is that the green line makes the author’s comments stand out so much more than others that I tend to ignore the one or two comments above or below (I find this issue with a lot of sites where the author comments are highlighted). I think the thick green line is in too much contrast with the minimal grey line of everyone else’s. Simplebits carries it off well by making everyone’s comments bold enough to compete with the author’s.
Reuben Whitehouse
Fri 12th May 2006
at 11:58 am
Looks great. I always enjoy a good evolution. And I have to say I still approve highly of the green.
Wilson Miner
Fri 12th May 2006
at 9:04 pm
Hey hey, I just finished the last of my International Baccalaureate Diploma Programme exams! What a funny coincidence… it’s excellent to see the IBO moving forward with standards-compliant web work, no less by a very talented and admired designer…
Really like the new design, esp. the Georgia headlines. I also like the variance in the green, now. I was really hoping you hadn’t lost the green when I first read of your realign in my newsreader…
Anyway, congrats! It looks great!
Trevor Filter
Sun 14th May 2006
at 9:21 pm
Great redesign BTW, i just revisited your site. It look...rr..cleaner :)
Kuswanto
Tue 16th May 2006
at 12:04 am
Personally, Mark, I like the highlighting of your comments. As more of a lurker than a commenter it helps me to browse the comments quickly, seeing what you have considered important enough to reply to. After all, it is your blog :)
Peter Holloway
Tue 16th May 2006
at 8:20 am
I liked the previous version of your site a lot.
But this is even better : clean, balanced, pleasing to the eye…
Especially the new logo (top-right).
... it works allright…
Wow.
Micha?l De Meirleir
Tue 16th May 2006
at 11:36 am
I agree with JA above. I must admit that when you first showed me your new design, I wasn’t sure what to make of it as I told you. I quite liked it but it looked ‘different’. Like Linda, I’m not a design expert so I couldn’t find the right words to say to express what I thought and wasn’t really sure anyway!
Now however, looking again at it, I really like its simplicity. I think it sums up your design ‘USP’ (yes, yes, I’m a marketingy jargon person).
As a few people have commented however, I’m still not keen on that strapline. Creativity doesn’t do you justice. I’ll get my thinking cap on for something more fitting.
Nice use of white space ;0)
The Wife
Tue 16th May 2006
at 9:13 pm