As you may have noticed, the current WordPress theme that I have on this website (the 3D Vista Style one) was not created by myself (hence the footer). I am only using it temporarily until I can create and code my own template. Just today, I finished creating in Photoshop that new template, and all I have to do now is to code it. So I thought I would give everyone a sneak preview as to what it will look like.
First thing’s first – the header. This is my favorite part of the template, and I think you’ll see why. I used a glow technique to make the “globe” in the logo, and the same effect on the navigation link “Home”. When the user hovers their mouse over one of the links in the navigation, the link will glow, and if they click on the link, it will stay glowing. Take a look for yourself:
In the sidebar, I used the Arial font so that I could make the text dynamic once it was coded. I used another glowing element in the RSS icon at the top of the sidebar, which ties in the glowing header. Almost all of the elements in this design have some type of stripe pattern for their background, which gives it a much more high-tech feel than if they had been solid color. Here is the sidebar:
When designing the main content area of the layout, I didn’t want to have just a boring area of white, I wanted to make it more interesting. So I decided to overlay a subtle wide-stripe pattern on it, along with drop and inner shadows to make it feel more three-dimensional. I also made the horizontal rulers a blue color to tie in with the rest of the design. This is the content area:
After reading some articles on good footer design in websites, one of which is at Smashing Magazine, I wanted to do something more in my footer than a bland “Copyright by TutorialWow.com”. I thought that a good way to do this would be to place recent posts, recent comments, and About the Author sections into it, along with the copyright information. I played around for a while with the glowing headers, and bullet points (which are using the same glow style as the header and RSS icon), and finally came up with this:
I have told you about each of the individual elements of the theme, and now I will reveal the whole thing. As you can see, all of the elements tie in nicely with each other to create that cool glow effect that gives the theme its character. Here it is (click on the image to see the whole thing):
Since I’ve been really busy lately, and it doesn’t look like I’ll be getting any less busy in the near future, I probably won’t finish coding this theme for a while. This is why I wanted to give you guys a sneak preview – so that you wouldn’t get too bored. 😉
Until next time, happy designing!