That old design had a good run

It’s about that time to refresh haveboard.com and get rid of the look I built at the end of 2006. I’ve learned quite a bit since then and you’re now looking at the new haveboard.com. If you are reading through an RSS reader, I suggest clicking through and checking out the new digs! I hope you like it.

[nerd paragraph] I used a lot of css3 techniques and took stab at exploring progressive enhancement with the design. You can read about why things don’t need to look the same in ever browser over at O3 World. This refresh/redesign has been in the works for months and I finally decide to work on getting it to a point where I am comfortable launching. I have a lot of plans to expand on this new look. More information in the footer as well as a better 404 page are just a few things planned for this iteration of the site but I wanted to launch something new considering the old haveboard.com had been around since the end of 2006.

You will notice that you can now vote thumbs up and thumbs down on individual comments. You don’t have to be logged in or be registered to use this feature. I’d love to see this voting get some use.

There still may be a few bugs here and there but I tested pretty thoroughly across multiple browsers so things should be pretty much in order and viewable. Internet Explorer users are definitely not getting the full range of the redesign. If this is you, I suggest trying out Chrome, Firefox, or Safari. Things should still work, it just may not work or look as well in IE.

If you find any errors, please let me know what is going on as well as what operating system and browser you are using and I’ll look into it. You can let me know in the comments below or send me an email. Feedback is greatly appreciated, whether good or bad. Constructive criticism would be preferred over plain old criticism or hatred.

The new shop will launch in the next day or so. Stay tuned for that and thanks for reading haveboard.com.

19 thoughts on “That old design had a good run

  1. Looks like I still have to style out the “name”, “mail”, and “website” input fields on the comments. I’ll get to that tomorrow.

  2. The comment input boxes are fixed.

    I encourage you all to sign up for Gravatar so you can have your own photo show up when you comment. It’s free and real simple. Your email never gets published, but when you comment with the same email associated with your Gravatar account, it will display next to your comment.

  3. I’ll second… third that. It looks good. But the screen shakes when I type! It has something to do with that preview up above. But they layout looks fab. Good work!

  4. It’s nice to see the site evolve. I hate to be the only one with criticism but the curved elements through the site are not consistent. It feels a little more busy then the last design. Perhaps you can implement the same radius on all elements that have rounded edges?

  5. Nugget, I really do appreciate the criticism.

    Let me break down all the curved element values and maybe you could suggest something slightly different.

    The main comment bubbles have a 40 degree radius in the main section and 20 degree radius in the sidebar. I like the 40 degrees in the main section but it was just too big for the sidebar.

    The textareas also have a 40 degree radius.

    The post’s blue footer boxes have a 5 degree radius in the main section.

    The date/posted by boxes have a 5 degree radius in both the main section and sidebar.

    The input boxes for comments and search as well as the select boxes have a 20 degree radius. I think the select and input boxes look a little different because they aren’t big enough to display the full radius that’s defined. Not all browsers allow the radii to be styled with css on the select boxes.

    I see what you’re saying but I’m not really sure how to remedy this. Does anyone have any suggestions of what they think might work a little better?

    I’m curious if this is something only a designer’s eye would pick up on or if the average user notices or even cares.

    If you are running Internet Explorer, you are probably asking yourself what we are all talking about with the curved elements/rounded corners/radii. This is because IE doesn’t support any border radii. Maybe one day. In the meantime, all rounded corners degrade to 90 degree angles, so IE users see a much boxier site.

  6. George, what kind of of computer, operating system, and browser are you running? If I remember correctly, you have a very old machine so I’m guessing you are also using a very outdated browser. If the only thing that happens is the site shakes because of the preview, I’m okay with that, since it apparently seems that the site still works for you, just not as well.

  7. I think the 5 degree radius used on all curves would be the best way to keep it consistent. The larger curve is distracting. Perhaps you could also crop all images and thumbs with the same radius for consistency?

    I am getting the same shaking when I type name / email / website and I am on Firefox 3.0.19.

    Lastly the spacing between letters for paragraph text seems to be too much. I understand why you would do that for legibility but the amount of space you use is more suited for small text on logos or other graphic design elements. Paragraph text traditionally uses less space. Perhaps you can add the smallest amount of space between letters as possible.

  8. I broke the comments yesterday but fixed them now. Thanks for the heads up, Nugget. You can also subscribe to a post’s comments by email, with or without commenting if you want to have a reminder set for whenever a new comment is posted.

  9. I actually upgraded to a Mac Mini last year. The screen stops shaking when the comment preview reaches a second line. Firefox on 10.6.2. The screen doesn’t shake in Safari.

Comments are closed.

Related Posts