Category Archives: design

Background Alignment Bug Fix

1 Reply

I have recently been working on sites which have had the need for pixel perfect alignment, and I came across an alignment anomaly among the major browsers.

Previously, I have used IE7/ IE6 specific style sheets with completely new backgrounds, each 1px to the left or right of the original to compensate, but I decided to do some digging and found this blog post:

http://www.sohtanaka.com/web-design/1px-background-alignment-bug/

One of the comments I came across suggested a very simple alternative to multiple stylesheets and images, and is the version I used in my recent design:

html{background: #242424 url('../img/background.gif') repeat-y center; margin-left: -.1px; /*1px shifting hack*/}

A simple use of a margin allows the same image to be used for all browsers. What’s even better is that, although technically a hack, it is valid.

The One Song Sketch

Leave a reply

One song, one piece of paper. Just doodle.

one-song-one-sketch

The point of this exercise was to see what kind of things I created when listening to different types of music; trying not to think about anything too much – just to have a doodle to see if what you listen to affects your creativity.

I just sat down and had a list of shuffle songs playing straight after the other. Occasionally lyrics made me draw certain objects, but usually I started on one main drawing and added parts to it as the song went on.

Continue reading →

If you make everything bold, nothing is bold

Leave a reply

If you make everything bold, nothing is bold

Art Webb

A quote that resonated with me so much. I can’t count the number of times I have seen things put in Red, Bold and Italic and on occasion adding a yellow background, just to attract the visitor even more!

When somebody wants to attract visitors to a particular piece of text, make sure that only a couple things are subtly highlighted. By making everything bold, italic and red there is no more contrast to the text than was there before. Try experimenting with spacing, the addition of headings and putting your content into smaller chunks.

What has been the worst example of this you have seen on the web? I’m interested to see the most ludicrous example on the Internet!

Design Work on FootyTweets

6 Replies

A site I have recently done some design work on has been launched by Ollie Parsley this week. FootyTweets allow you to follow your favourite football team and get tweets of news and goal updates as they happen.

Ollie has also been working on a Rugby and Cricket version and I think there are plans for a Motorsport version too.

I thought the project was a really good idea, and so volunteered my services to produce a quick PhotoShop mockup and XHTML design, from which Ollie could base the sites on. I initially based the site around a 12 column grid design, with each team crest taking up column and used a template from the extremely useful 960.gs site.

footy tweets grid design

Continue reading →