Brand New Look

by Steve Napierski to Articles

So by now you’ve probably noticed that the blue Dueling Analogs‘ design of the past year and a half is no more. I felt it was the right time for a change and to fix a lot of problems that you, the readers, have been complaining about for very long a while now.

First off, the white text on a dark blue background is no more.
Blue vs. New
This was the biggest gripe I got from you guys about the old design. You said it was way to hard to read. Personally, I never had a problem with it but that’s me. Still, I feel the colors a calm and professional set.

Second, the design is now optimized for 1280px resolution. It’s pretty standard that most websites are built for 1024px resolution. But +80% of Dueling Analogs‘ audience have a monitor with a resolution greater than or equal to 1280px. So why not design the site with the majority of the readers in mind? Well, I did. But I also took those with a smaller resolution in mind as well. True, if you have a larger monitor you will see the site how it is intended. But if you don’t, the right column will merely become thinner and the logo with change slightly. Resize your browser window if you want to see what I mean. It works for both, just looks slightly better for one.
Navigation: New vs. Old
The comic navigation has changed. The rewind back and forward next buttons are now on the sides for a more logical navigating experience. The email this comic that was in the center has been replaced with a random comic strip button while the email this strip button itself has been moved lower into the new share section of the post.

What is old is new again. When the previous design was implemented the area for the comics was decreased from 725px wide to 671px wide. That meant that the comics that were wider than that had to be shrunk down. In the new design, the comic area has been increased to 750px wide. Which means that the larger versions of the comics will be returning. Already the first 174 comics have had their wider versions returned to the site.

There’s lots of other little things and behind the scenes programming that I implemented as well. But overall from a design point of view, what I have mentioned here are the big ones. I know that the site looks different and a lot of people get nervous when what they know changes. But in the end I think you’ll appreciate the brighter design and cleaner layout. And the fact that text can actually breathe now, as well.

Discussion (18)¬

  1. David
    David says:
    June 23, 2010 at 2:03 am #

    I didn’t actually mind the old design, or the white text on blue, but the new site looks nice.

  2. Chris Smedley
    Chris Smedley says:
    June 23, 2010 at 2:34 am #

    I have to agree, I’m not sure how the white on blue was a difficulty, I’m sure I’ll get used to this new format sooner or later.
    The only thing I need to remember is that the content is no longer in the middle, instead it’s on the left, that’s the only big thing that’s change (apart from the colour scheme…)

  3. Lizsu
    Lizsu says:
    June 23, 2010 at 3:00 am #

    is this a wordpress cms blog? you can setup a seperate plugin for users to browse through different themes. meh.

  4. Mini0n
    Mini0n says:
    June 23, 2010 at 5:48 am #

    Nice new look. =)

  5. Bernardo
    Bernardo says:
    June 23, 2010 at 5:53 am #

    It looks great – just testing out the resolution thing now. Much cleaner.

    About your footer – you are giving a few years in sequence as copyright – why not just make it 2005-2010 instead of counting them?

    • Steve Napierski
      Steve Napierski says:
      June 23, 2010 at 8:49 am #

      My script is automatically set to do that and it never really bothered me. Plus, seeing all the years numbered out puts how long I’ve actually worked on this comic in perspective for me.

  6. Zach
    Zach says:
    June 23, 2010 at 10:56 am #

    I’d love to know how you pulled off the resolution stretching. It’s really clean.

  7. EC
    EC says:
    June 23, 2010 at 12:27 pm #

    Loving the new site design, although old one was nice as well. Good job!

  8. David
    David says:
    June 23, 2010 at 11:48 pm #

    I never had a problem with the old layout, but I’m quite happy with this new one. Helps keep things fresh. I’ve got a few random observations you might be interested in.
    I don’t really know Twitter/Facebook that well, but aren’t the buttons at the top of the post already at the bottom? They look a little odd up there by themselves so you might be better off sticking with just the ones at the bottom or embedding them into the top of the post a little better (frame them off with a table or something?).
    The ‘Brand New Look’ title for the blog entry looks a bit odd up there as just text directly on top of the background colour. That said I can’t really think of any way to change it because it works perfectly on the normal strip posts.
    The colours you’ve chosen are a bit simple but they work very well. I just think you might need to make the header bar DA banner up top a little larger or something to compensate.

    Lastly, don’t forget to update the little URL icon up the top to suit the new background colour.

    Anyway, that’s my two cents.

  9. Wonderer
    Wonderer says:
    June 24, 2010 at 2:54 am #

    Kinda too bright, imo.
    Everything else is fine – at least no more inversion ;)

  10. f0qnax
    f0qnax says:
    June 24, 2010 at 12:30 pm #

    Holy shit, I didn’t even notice the new design until i finished reading the comic.

  11. Pierre Lebeaupin
    Pierre Lebeaupin says:
    June 24, 2010 at 2:32 pm #

    Well… the fact I have a 1680 pix wide screen doesn’t mean my browser window is 1680 pixels wide: I find it wasteful to browse fullscreen (even if I’m on a 1280 pixels wide screen). And this has little to do with my using a Mac, I do the same thing on my PC at work; so screen resolution is hardly a good indicator of the space a website can take. So thank you for having a somewhat flexible width. I find the design a bit wasteful of vertical space (just look at all the space a single-line comment takes!) and the font is a little on the big side, but other than that, no complaint.

  12. Imhuge
    Imhuge says:
    June 24, 2010 at 2:58 pm #

    Comic should stay in the middle, IMO. Overall it’s a sweet-ass design, but the comic panel on the left spoils everything.

    • Steve Napierski
      Steve Napierski says:
      June 24, 2010 at 3:08 pm #

      What are you talking about? The comic was on the left in the old design as well. The content is centered on the page and the comic was in the left column. That’s been the standard Dueling Analogs design format for over 3 years now. That didn’t change. The design is just wider now.

  13. Dachaz
    Dachaz says:
    June 24, 2010 at 5:04 pm #

    Like many commenting here, I never found it hard to read in previous design. As the matter of fact, it emitted less light towards me than current design does, which, in a lightly lit room, was more enjoyable.
    Overall, I like some bits (like navigation) but I’m not all that mad about the rather sterile, bland, kinda generic, washed-out experience that the new layout brings.
    But all in all, as long as there’s RSS, I’m not bothered that much :)

  14. TheLupineOne
    TheLupineOne says:
    June 25, 2010 at 9:11 am #

    Change it, and they will complain.

  15. Tustin2121
    Tustin2121 says:
    June 25, 2010 at 11:24 am #

    I love the changing width thing! I’m gonna have to steal that idea for one of my sites or something. :D :D

  16. evantrees
    evantrees says:
    June 27, 2010 at 5:32 pm #

    I miss the blue but oh well, the blank advertise here things amuse me and keep up the great work.