I’m sure many of you noticed that The Art of Manliness was down for maintenance this weekend. In between scarfing down burgers and watching fireworks, we were busy rolling out the redesign of the site. Welcome to AoM 2.o.
I’ve been wanting to redesign the site for awhile now. When I first started AoM back in 2008, I did the design myself. I thought it was pretty good for a law student who had a few months of HTML under his belt, but I knew it could have been better. So I decided to call in long time AoM reader and bad-a web designer, Eric Granata to help me give Art of Manliness a facelift. Eric did a fantastic job. He’s a talented and smart designer who had the ethos and feel of Art of Manliness down pat and was able to deliver us a redesign that knocked our socks off. If you’re looking for a graphic/web designer, definitely check out Eric. I wholeheartedly recommend him. Thanks, Eric!
So, what’s new? Here’s a quick rundown:
- Simplified layout. We tried to make things simpler and cleaner looking. We got rid of the magazine style layout and replaced it with a simple chronological layout like you see on most blogs. At the top we put a featured post rotator where we can put some of our favorite posts front and center. Underneath that you’ll find a list of posts in chronological order. Much easier on the eyes, if I do say so myself. We’ve also moved to just one sidebar column instead of two to further clean up the design.
- Better Navigation. We’ve done some things to improve navigation on the site. At the top we’ve added a nav bar with all our main categories. If you’re just interested in a particular subject, just click on a corresponding link at the top and enjoy the archives from that category. We’ve also included a tab box in the sidebar where you can easily see our most popular and most recent articles. Finally, on each individual post, we’ve included links at the bottom that easily let you navigate to the previous or next post and also related posts.
- Vintage design. Art of Manliness is known for it’s old timey manliness vibe. We upped it a bit with some nice visual flourishes like the manly wood paneling on the sides and top and the cool vintage engravings in the sidebar.
- Barbershop Locator and Community Buttons. We wanted to make our famous Barbershop locator easier to find, so we had Eric whip up a cool looking button for the sidebar. Also, he made a nice looking button for our manly community section on the site. Just one click and you’re interacting with thousands of men who are interested in manning up.
- Featured Video. We’ve been doing more how-to videos, and we wanted a place where readers could have easy access to them, so we made a featured video square in the sidebar. Anytime we put out a new video, look for it there.
- Gravatars in the comments. These were added to give more of a community feel to the comments. Basically, it’s just a little photo or picture next to each comment. You can go to Gravatar.com to sign up for a free account (you just give them your email, not anything personal) and add a simple photo. You don’t have to sign up for a Gravatar in order to leave a comment. If you leave a comment without a gravatar, a default John Sullivan icon will be left.
For those of you who blog, we’re now using the Thesis WordPress Theme. Check it out. Very easy to use and customize and it’s great for SEO.
That’s pretty much it. We’ll be tweaking stuff over the next few days and adding some finishing touches. Let us know what you think!







{ 38 comments… read them below or add one }
Hey Brett,
Love the design!! It’s so much cleaner and easier to navigate.
Congrats on it!
-Andrew
Looks good…now let’s see if this Gravatar thing works…
Yay it works! Great job guys!
Looks great!
Great job on the site overhaul. I like the wooden paneling in the background, gives it a nice manly vibe.
The site looks killer!
It’s probably just my computer, but the new design appears a bit wonky. The right column with all the ads and whatnot kind of dominates each page by overflowing the edge into the red and also overflowing on top of the content to the left.
I can however comment on the only thing that appears correct, and that’s the new banner/link list, which both look swell.
Wow great redesign… keep up the good work! Thesis is really a great Wordpress theme, I use it on my blog as well.
Great redesign guys. Looks and functions a lot better than the last one. It’s a helluva lot easier to navigate as well!
Looks great Brett, keep up the great work.
I am new to AoM and I love the new design.I am still checking it out and find it easier to navigate.My only problem is that I can’t view pictures.All I see is the frame with the red ‘x’.Can anyone offer some help here?I’d appreciate it.
Hey Brett,
I’m using the new firefox 3.5 and there seems to be lots of stuff missing. It could be my java (which would be a shame, it’s a company machine and I can’t upgrade the java on it). The banner at the top is gone. I like the idea of “simplified” (I’m always a fan of K.I.S.S – Keep it simple stupid). Internet explorer 6 seems to have problems also (lot’s of little white boxes with red x’s in them).
Yeah, we had a mishap with the images this morning, but things should be back online.
Brett,
The new site looks fantastic!!!
Way to go on the new look. Much easier to navigate. Thanks and look forward to more “manliness”!
Love the simplified look and feel! Thanks for making it easier on us. :)
Thumbs up on the new design. Everything looks great.
New design is cool. Just 2 things though:
1. The top logo banner is too tall. You can shrink that a bit and bring the content up more instead of having such a large masthead/header (consider it since you have that large 728×90 banner above it, it pushes your content down too much in my opinion).
2. The main featured glider is too tall as well. I know you want to display the featured content as prominently as possible, but it’s just too massive. Shortening it and the masthead will allow folks to see a few more of your articles and content (unless your analytics reports tell you that most of your readers have a screen resolution size that makes all this mute). It’s also hard to tell or see the arrows on the featured content glider. Maybe make them stand out a bit more.
Now, if the above impressions were what you intended then perfect. Otherwise, I think it would be less IN YOUR FACE (unless that’s what you want).
The manliness meter just rose several points. Great work on the new design Eric.
Nice work Brett & Eric. I like the new site, though I miss the old look a little bit – call me nostalgic.
Brett – I’ve been reading via RSS reader for a while. Have you thought of adding RSS ads for monetization?
Hate to be a buzzkill but the Barbershop Locator button doesn’t seem to work. Leads to a broken link. Visually the new looks is awesome. Great work!
Looking good, guys!
The redesign looks great … and manly. Nice work.
I like the redesign, but want to suggest that eliminating autoplay on video ads on the site will make me a lot more interested in clicking through instead of just reading the RSS feed. I opened two or three tabs and got simultaneous audio from three different commercials.
This new design doesn’t scale well to widescreens – http://gear.dyndns.org/~paulgear/images/art-of-manliness.png
Kudos on a simple, well designed layout and re-design! I especially like the vintage art throughout, it adds to the overall character of your site without being a distraction.
Loving the new layout, and good to see the vintage photos stuck around. I can’t put my finger on why, but I just really like it.
Looks excellent. Well done.
are you not going to change the favicon?…I believe the one up now is some kind of default one.
Thanks for the feedback everyone!
@ Paul- I’ll take a look into the widescreen problem.
Very nice!
@Ted-
The autoplaying ads only appear the first time you visit the site and then you’ll never see them again.
nice job keep up the excellent work!
Brett & Kate (and Eric),
The “re-design” is getting better all the time!
Thank you!
Funny that this was the 200th AOM email I received, too!
Thank you so much also for putting the subject in the subject line. It’s been bugging me for months and I’ve been meaning to say something. It always says the subject is The Art of Manliness. Duh. Now it’s going to be MUCH easier to find a specific article to go back to. Very pleased!
Shortening it and the masthead will allow folks to see a few more of your articles and content
Looks great, but I have one word to say about the audio/video ads: No.
While in the Army in the 60′s the sargeants in basic training told us that Patton was set up by his own troops and killed in a jeep accident.