Website Redesigns And Critiquing Yourself

Website Redesigns And Critiquing Yourself

Something new, something borrowed, something…gray

I’ve finally created my business cards. For real this time, not some home created garbage that I never liked anyway. What did I learn about myself through designing them? I freakin’ love the combination of orange and gray. This isn’t some new thing either, I thought long about this after I created the cards (which you can see below). I’ve always liked these two colors together. I used to shoot archery with my mom and step-dad a lot when I was young, and I remember loving this arrow set that had gray shafts with orange and white fletchings. It was that memory that made me look at some of my past designs. I never really noticed before, but apparently I reeeeeeeeally love gray and orange. Now I have these new cards, and my website doesn’t fit together with them…guess what that means?

The current one is probably about a year and a half old now, maybe a little more, and I want it to match my new business cards. I had to do some critiquing though of what I have now, and why I think it actually needs it. First thing, gray and orange stay. That was a given. I had to go deeper though. What did I want to do, what do I like about my current site, and what don’t I like. I also needed a starting point for the new design, and I found it. Do you ever get inspired from a list site that shows like 20+ other sites that are pure awesome? I did (which is funny because usually I hate list articles) and that is where the borrowed comes from, which you will see.

Business Card Front
Business Card Back

Here is the site I borrowed an idea from. You’ll notice the iceberg cut out below the navigation. I really liked this idea, so I incorporated something like that in my new design. Do I feel like I am being unoriginal? No, and you shouldn’t either if you are inspired by something you see. I like the idea, I am not stealing the website. I don’t really like the rest of the site, but that one part really drew my eye. Now you can take a look at what I have done. You’ll see with the cog cutout, my shout-out to the iceberg.

JC-Designs website redesign

What I like about my current site

Critiquing your own site is way harder than I thought, so I’ll start with what I like:

  • Main navigation – I really like the small descriptions under the main link name
  • The grundgy faded graphic under my logo – adds something interesting
  • Bottom left orange/purple graphic on home page – that is a collage of like 3 photos and I like how that turned out
  • Look of the bottom footer area on the interior pages

I thought there would be more, but when you are really being serious with yourself, you realize there is a lot more you dislike. I’m not sure if that is me being over critical of my own work, or if I have just learned a TON in the past two years, that it makes a lot of it seem out dated. On to what I dislike:

  • My logo – I liked it about 5 years ago…that is how long I’ve had it. I updated it here at The Web Machine, and changed it on the business cards by moving the ‘DESIGNS’ word. More modern now, and I love it.
  • The flash text – Hate it. Not because it is Flash, but because it is cheesy. That will be gone – no need for it. That was more to say “Hey, I know Flash!” I don’t need to say that anymore.
  • Portfolio slider – that is just a plugin I found at the time, and there are much better, like the Nivo Slider, or one I’ll create.
  • Contact Page – just plain f#@(ing ugly
  • Orange bar on the right side of the site – at the time I thought it would bring the orange color into the rest of the site. Now I just see a thick bar that cuts into content area. That will be a sidebar area now.
  • Main Navigation – Yes I mentioned it in what I like, but what I hate is that it is image based, instead of text like I have at The Web Machine here. NO MORE IMAGE BASED NAV’S!! Plus – no damn link to my blog in the main nav – wth is that all about?
  • Secondary Nav – What the hell was I thinking putting that at the bottom…AND just above the footer nav?? PURE STUPID – if I need more nav items they will go in the sidebar.

What technology should I use?

This one is actually tough. Here is a list of things I have been considering:

  • HTML5 Boilerplate – Pure awesome starting point
  • Sass 3 (SCSS) – Great CSS organization with variables, mixins and nested styles
  • HAML – So I’ve been researching HAML, and I get the syntax. Makes HTML creation a breeze
  • PHP – no brainer here, want to learn more, and when I do, I can add in things later
  • CSS PIE – CSS3 for IE
  • jQuery – Another no brainer. Will do a lot of the effects work
  • WordPress – Need I say more?
  • Minifier – This is really a must. Compresses CSS and Javascript files into one.
  • 960 Grid System

What didn’t make the cut

HAML. I am going to research it more, but really if I use it, it will just be to say I did. No point in making this complicated. Not that it is, but I’ll have enough to worry about. Second? WordPress will not be used. Why you ask? Good question. I love WP, but what would be the point here? I edit my own stuff, I don’t need it for that. I already have a blog…so I can’t think of any reason to actually slow development down a little to use this for my main site. If this was for someone else, then it is not even a decision for me. For this redesign, it serves no purpose. Everything else stays.

I have to say I am really excited about making a complete site using Sass. I found that I really like what it can do, and I much prefer it over LESS.js. Yes I’ll have to compile every time, but I’m willing to sac the convenience for the experience and quickness of writing it. This means no quick changes during my lunch break, but I can live with that. When I am finished, I will post my Sass code in full here so you can get a real grasp of what it looks like and what it can do.

Redesigning your site – when do you say enough is enough

Redesigning your site is very tough. Why? Because its your baby. You want the best possible for your own work, and sometimes that is not actually achievable because of how hard we judge ourselves. With me sometimes things just click, and although its a rough idea at moment (like I’m not sure what I’m going to do with the navigation), I’m happy with where I am going.

I found that my gut reaction was to tear it apart and leave it for dead. Meaning, I didn’t want to see anything I liked. What I really wanted though was to look and see if I did anything I really felt was good. There is, but I have learned so much since this version, its hard to look at anymore. Forcing yourself to really look at what you did is an eye opener. I have a more clear view of what I want, and there will be more attention to what I am doing and why I am doing it.

I’m sure in another year I’ll redo it again. I like it to continually evolve to show where I am at in my career and skills. I’ll post more images as I go along, so you can see it progress. Below are the past versions of my website. A couple of these I had to use that web archive site to find, because I don’t have the files anymore.

  1. June 2003 – Wasn’t first version but as far back as they had, and the images are not available but you can see even then – orange and gray
  2. December 2003 – Damn that is bad
  3. August 2007
  4. February 2009 and Current
  5. See above for the new look
Past website designs

Those are not all, but all that I can find. There are probably about 2 other versions that I cannot locate and the archive site didn’t have. Boy did the first two suck!

Coupon Code: webmachine

Tags: ,

Leave a Reply