Quantcast
Channel: Web Designer - Defining the internet through beautiful design » Carsonified
Viewing all articles
Browse latest Browse all 3

CSS All Stars: Carsonified

$
0
0

mike_kusURL: WWW.CARSONIFIED.COM
AUTHOR: MIKE KUS
DATE LAUNCHED: 9 JULY 2009
TECHNOLOGIES USED: PENCIL,
PEN, PAPER, SCANNER,
PHOTOSHOP, HTML, CSS

“Carsonified is a web company based in Bath, UK. We produce events/workshops for web professionals and write about the web on our blog Think Vitamin. The new Carsonified site was redesigned to clearly communicate what we do, to express our passion for the industry we work in and to reflect our company’s fun loving personality. The redesign was a tough job not least due to the simple fact it was our own site and as you know that in itself puts the pressure on. The solution is a simple two colour per page approach with hand-drawn illustrations to create a bold and colourful site that hopefully packs a punch. The layout is clean and simple so the CSS is minimal. Notable points though are the use of negative margins to enable certain illustrations to sit outside of the main content area and the styling of the email/ Twitter links on the team pages which use CSS3 rounded corners and dashed borders to great effect.”

carsonified_home

DESIGN TIP
ROUNDED CORNER DASHED BORDER LINK
“One of the challenges of this site design was working
in one colour on top of the background colour. On
the team pages there is an Email and Twitter link for
each member of the team which I wanted to highlight
without using an underline. I also needed a hover state
that didn’t require a change of colour. I could have done
this in a number of ways but the solution I opted for
was to create a dashed one pixel border around the link
and using CSS3 I gave it round corners. On hover state
I simply changed the border to make it solid. There’s
nothing complicated about this but it’s a simple and
effective way of highlighting the link without using an
underline or changing the colour on hover.
The great thing about CSS is there are always new
things you can do with it. It’s really only your imagination
that limits you.”


Viewing all articles
Browse latest Browse all 3

Latest Images

Trending Articles





Latest Images