3

I recently launched a comics website, www.hittingtreeswithsticks.com, which I created from scratch. I created my own design because I wanted to keep it unique, and used no templates.

Unfortunately, people who've looked at it says it appears "outdated" and "from the 90s", but haven't really been able to pinpoint how so. I was wondering if people could help me "modernize" my site without presenting me with downloadable templates. I'd still like to keep this my design, but I guess I need some artistic/design pointers.


DESIGN EDIT:

Okay, I've spent some time redesigning the template given your feedback, and found some great ideas on http://designshack.net/articles/layouts/10-rock-solid-website-layout-examples/.

I have two main templates I'm going to go for: (keep in mind this is just for layout... so none of the fonts, colors, images, or dimensions are set yet)...

Either:

A) Two column template

  • Search is on top and will expand down a bit with search results

  • In effort to get people to my artwork sub site, I'll include latest artwork on top right

enter image description here

Or

B) 3 Column template

  • Search is on the right and will expand downward as such with results

  • Gives more room for advertisements and other links

enter image description here

And this is the proposed, although minor, redesign for the View All and View Image templates:

View All: displays all images with archive-able dates

enter image description here

View Image: displays single full size comic

enter image description here

Any thoughts would be great!


9
  • 1
    Huge drop shadows and image borders are big contributors.
    – Brendan
    Jan 10, 2013 at 20:06
  • It looks amateurish. A lot of the web was still amateur back in the 90s. That's not meant as an insult, just an observation. It'd not really 'thoughtfully designed' as much as it is 'decorated with dated effects'.
    – DA01
    Jan 10, 2013 at 22:48
  • Hire a web designer. You're obviously doing other things, don't try to do this too. Jan 10, 2013 at 23:20
  • 3
    @Growler you're an ambitious man. If you're up for the long nights chasing bugs and you don't mind your site looking like a learning exercise until you get it, I say go for it. Personally, I think you'd be better served to focus on your comics and find partners who want to grow their development and design talents. They can focus on getting their jobs right and probably are already a few steps ahead of you. Jan 11, 2013 at 8:21
  • 1
    @KMSTR ha! Oops. Meant to link to UX where the same question has been posted: ux.stackexchange.com/questions/31704/…
    – DA01
    Jan 16, 2013 at 2:28

2 Answers 2

9

Factors which may contribute to a "dated' feeling:

  • Large text in Comic Sans (or similar)
  • Comic sans use at all
  • Canned drop shadows
  • large image borders
  • uneven spacing in navigation
  • pushing everything to the absolute edge of the window

Things which may assist in creating a more modern feeling:

  • smaller text for navigation
  • a larger header banner with smaller text links
  • subtle gradients for backgrounds
  • no image borders
  • more white space or "air" between the browser window and content
  • An in-page comic viewer such as Lightbox or Thickbox rather than one page per comic
  • rounded corners
  • smaller comic links -- I'd go about 50% smaller than the boxes currently are. Ideally I'd use non-square links in favor of more horizontal banners. But that's my preference. I dislike a page full of squares, there's no visual interest in that.
  • feature the artwork in the comic links rather than placing text over the images. Use the thumbnail as a thumbnail... an image.. then use the caption below to place your text description. Images are much more intriguing than text.
16
  • 1
    I agree with all of these, but one other thing that really stood out to me was the jpeg artifacts on some of the images. Saving the images as png or just with less compression would help them look less aged
    – JohnB
    Jan 10, 2013 at 20:20
  • 1
    @Growler, regarding the keyboard buttons in the view, they come across as very 90s-ish as well. You could achieve a similar style of button using CSS3, I think it would help modernize it. Take a look at the "Punch" button here: hellohappy.org/css3-buttons
    – JohnB
    Jan 10, 2013 at 20:22
  • 1
    You're going to "have to take away from the design" if you want it to appear more modern.
    – Scott
    Jan 10, 2013 at 20:27
  • 1
    You're already using jquery so you can load a jquery modal window... even have it bounce in or something to retain the "comic" aspect. Witha modal you can include text and links as well as an image.
    – Scott
    Jan 10, 2013 at 20:32
  • 2
    @Growler a 'homegrown' look is a fine design decision, but if you go that route, you have to commit fully to it. Right now it seems to be a mish-mash of themes.
    – DA01
    Jan 10, 2013 at 22:53
4

I think you just need to sit down and put some more thought into some of the decisions made.

Some things to consider:

  • why is your top navigation larger than your logo?

  • why is the spacing between navigation uneven?

  • why does your home page have a breadcrumb trail 6 levels deep? (comics > homepage > all categories > newest post > page 1)

  • what were the reasons for choosing that typographic style?

  • do the 3-d frames add to the design or distract?

Etc.

Basically, just have reasons for each decision and try to bring them together under some common framework...be it typography system, a grid layout, colors, etc.

Right now it feels very haphazard and amateurish--which is what the web mostly was back in the 90s.

4
  • I added the breadcrumbs because I couldn't get the current page to stay highlighted, so that was a quick fix to let users know where they are. 3D frame as I am now thinking definitely distract, but it'd be cool to have some sort of background. I may put a category color (similar to theoatmeal.com) for each individual category. I chose that typographic style because I liked the font "Stanberry", but I guess it's childish. Thank you for your comments!
    – user3871
    Jan 10, 2013 at 22:56
  • Make your breadcrumbs be links at least. Some people (myself included) use them for navigation.
    – Hanna
    Jan 11, 2013 at 1:54
  • Well, if they are truly breadcrumbs, then they shouldn't be on the home page (since that is the top level). My point was that they seem way out of place on the home page.
    – DA01
    Jan 11, 2013 at 2:00
  • Oh, they definitely do.
    – Hanna
    Jan 11, 2013 at 6:58

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.