Posts Tagged ‘layout’

New Homepage Launch

Tuesday, May 4th, 2010

Snailbites – Design & Craft

I’ve been slacking on finishing this page for some time. This project got onto one of those timelines where I did 80% in 5 days, then the last 20% in 5 weeks. All you designers know how that goes.

For now, there are still some kinks to work out, and some more portfolio pieces to put up. But I think we’re good to go with what I have up as is. Hope you enjoy. Please leave me some feedback – I like to know how my work looks to the general public.

Changes, part 2

Friday, March 19th, 2010

Been working really hard on the redesign for the homepage. It’s taking way longer than I though, but the time spent is very much worth it. I’m trying to use every bit of what I’ve learned in the web development world and make it all work together. Today’s sample is taken from the new navigation.

In keeping with my whole whitespace movement, I wanted to leave things as simple as possible.  So everything is real clean with a focus on the typography. The little snail on the left is the icon for the homepage. Since I decided to not go with a traditional layout (branding logo on the upper right, navigation to the left and underneath), the little snail functions as a sort of branding and link back home.  That will help on the following pages when we get further and further away from the front page.

Hope to have the finished product for you all by next week. Don’t want to give you anything less than that, though.

Metro SHU

Saturday, January 16th, 2010

My 9-5 gig is at a magical place called Seton Hall University, at the Teaching Learning & Technology Center. The bulk of my time is spent developing on the Movable Type Enterprise system, which hosts the 100 or so odd blogs that we maintain (“we” = me and 2 others on our team). Movable Type can be a pretty rigid system, which is why I personally use WordPress for Snailbites. So when I actually get something to look relatively cool, its quite a personal victory for myself.

I have some problems with the standard, out-of-the-box template that MT slaps on your blog when you first create it. It’s only editable to an extent, and every site you create ends up looking the same. Here’s a shot of the default blue.


Click to see a sample page

Check out where the banner image is – right in the middle of the page! How are you supposed to brand or theme anything? Also, the tabs in the top navigation are gigantic, so you can’t have too many pages, or links with too many words.

To counteract this dilemma, I cooked up a new theme with a purposefully large banner image area, and smaller navigation. I call it Razor (corny, I know). Late Friday afternoon, we put up a new site for a project called Metro SHU. This site is basically supposed to provide a bridge from the SHU community in South Orange, NJ, to the not-too-distant playland that is New York City. I used my new Razor theme for it. Check it out:

Click here to visit Metro SHU

You’ll notice how instantly branded this page is now thanks to the sick banner that Truz made. Here are some of the reasons why I love this theme:

  • The navigation is tucked away in the top corner, out of the flow of the page. This helps to direct the user to the main branding of the banner, and then immediately to the content below it. When it’s time to go to another page, I’ll know to look in the same place I always look for navigation elements: the top left corner.
  • The banner is gigantic. It puts less pressure on the graphic artist to produce within the tiny constraints of the standard theme and creates instant branding. It also doesn’t get in the way like on the standard theme.
  • The bars above and below the banner tell you that this is the end of one thought, and you can move on to the content area as the beginning of another thought. In my opinion, its easier for the user to digest the information presented to them.
  • Everything is done with CSS, so the content and the framework of the actual blog doesn’t change. This minimizes the chance for any errors.

There’s plenty of other themes I’ve made for our blogging platform. I’m sure in my impending creativity-deadlocked days, I’ll post the rest. But for now, enjoy Metro SHU. I hope by the time you see it, it still looks as good as how it does in the screenshot.