The 2011 Redesign of zastica

January 31, 2011

Today, I'm happy to launch the new redesign of my site. There were a few major motivators to doing the redesign now, and a few more minor ones.

First, I felt that my previous design was a little too limiting, and wasn't flexible enough to do everything I wanted to with the site. This new design is much more flexible, using even more CSS to provide embellishments than before.

Second, I wanted to draw on ideas some other people in the web design and dev community have come up with, and use them on my site. In a way, I'm paying homage to my elders.

Finally, my hard drive crashed twice in the last 6 months, causing me to lose all my old design files, so I needed some new assets. I could continue with minor changes, but as long as I was opening up photoshop and tweaking the images, I figured it was time to redo everything as well.

zastica has changed from this:

To this:

(Posting static images becuase this design will probably change over time and I want to archive what it looks like now, and what it used to look like)

Inspiration

The inspiration for this design comes from two primary sources. The first is Jason Santa Maria's site. I've always admired his skill as a designer, but only recently come to appreciate the simple power that his site design has. It works extraordinarily well, and I hope to use and learn from what he is doing.

The second major source of my inspiration is mozilla.org. This is another fantastic site. I like the header especially, and that's were mine came from. The nuts and bolts (HTML and CSS) of their header is actually pretty surprising, and I think I learned a thing or two about creating interesting effects from that site.

I know that these two sites are remarkably similar to my site, and that is something I can potentially see people having an issue with. To anyone that does take offense to that, I say that this design is a first step. I've set it up so that hopefully I can pull of major visual changes without much work, and continue to grow and experiment as a designer.

What's changed

Pretty much everything. The site tagline is gone, the navigation has moved down, the dragon graphic is gone from the main content area. The background is separated from the content container background with the use of a text-shadow. I have wanted to use web fonts, so the header font is League Gothic.

What's the same

The colored bars have moved up into the header. The dragon silhouette has moved from the main content area to the header, and made into a 24bit png so that it will work well with any background. I still have the ability to post hero images for special events, or to display extra bars in the header, for breast cancer awareness for example.

What's going to change

Link colors for one need to change. I'm not sure what treatment to give them yet, but I need a way to make them a little less 1990. Fonts, colors, backgrounds, and even the layout may change at any point. That's what I really like about this design -- it's very easy with my new tools.