Welcoming Footsteps in the Mirror 7.0

Alright, it’s released a week too early but then at least I’ll know if there are any design bugs before the big date. What can I say? Welcome to Footsteps in the Mirror Version 7.0. It’s ironic though that it has reached its 7th layout version in such a short span of time coinciding with 2007. No it’s not a superstitious thing, it’s just one of those things that happens without you looking. Taking a leaf out of Lelia’s introduction to her own layout, I’ll break down my reasons for designing the layout the way it is now. First thing first for those of you visiting for the first time, the before and after:

Footsteps in the Mirror Version 6
Footsteps in the Mirror Version 7

As you can no doubt see, there is a remarked difference between the two layouts. Not just in terms of colour, but in design as well. The reason behind this was simply because a lot of time has passed between when I first started using WordPress and its themes. I have learnt a lot and as I will tell you later, I learnt a hell lot more when designing this theme. Version 7 serves to put everything I know to use as well as expand what I can do with the layout based on what I know about you the readers.

The main focus of the new design was about bringing the content to you. A large part of my blog consist of words. As the years have passed, they accumulate and rather they be left and forgotten, I wanted to bring those past posts to you, especially if you are a first time reader. Given that the first posts wouldn’t really tell you much about this blog, maybe glimpses on previous posts will tell you if this blog is worth coming back for.

The second focus of the new design is for a faster loading time. The previous layout was loaded with background images increasing the loading time somewhat. While regular readers didn’t mind this, it did affect first time viewers. Working on the style from scratch allowed me to focus on more CSS styling rather than images. Hopefully, coupled with WordPress 2.1, it has a faster loading time than Version 6.

The Resources:

Creating a layout isn’t easy especially if you’re going full on for the first time. I’ve already established in a previous post that just because you know CSS, XHTML and PHP, it doesn’t make you a designer. That’s true. So in cases like this, it’s always good to ask actual designers on their thoughts. Lelia, Kristin and Tam did just that, mostly helping with the colour scheme which was important because I could never get it right.

While sites like Colorlovers.com and Snook’s Colour Contrast Check are helpful, you still need a good eye for it to mix and match what you have and I really don’t. So for the most part, it’s all trial and error from there and if it really bothers you, the best way is always to take a break and get out of the house. Sometimes nature can be the best source of inspiration.

The Design:

Gone are the cramped 800 by 600 resolution support. Since that effectively makes up for about 5% of my readers, I’m sorry to have to tell you that the new layout works from 1024 by 768 resolution onwards. That works well for my layout simply because there is more room to put things especially on the sidebar. That also means that you don’t have to scroll down much to read posts and can do so comfortably. Since the majority of you seem to be using 1024 by 768 resolution, it’s a pretty safe bet it would work for you.

The hardest part of this entire design was not the actual coding itself, it was the colour scheming. As I said I needed a lot of help on that simply because I have bad taste in colour. Why? Because colours set the mood and I wanted to set the mood for a more calm yet icy feeling for the blog. Calm makes comfortable to read. Icy gives it the tone which makes sense given the fact I have penguins all over the place.

The header too was constructed the way it was for a purpose. Some might argue that there isn’t any mirrors in the first place, but I left that out purposely because it was meant to be metaphorical and the gradients were meant to give the reflective feel. The polaroids on the right of the header also sets the tone for the blog. They are about my life. Whether it may be my love for penguins, my affiliation to wordpress, me in general or my relationship with Mel. It makes sense to arrange it that way and I have.

The Main Index:

Feature Posts

The heart of this blog however rests with the Feature Posts. They contain the latest posts, the asides and a brand new random posts section. If you came in through the main index, it gives you a chance to explore and read previous posts that have been written. The random post puts out 3 random posts from the archives for you to read, given the amount of posts that is in there, you’re going to be refreshing the page a lot to read it all.

For a while I dabbled with trying to highlight the main post while setting the rest of the posts as excerpts, unfortunately that would take you away from reading the older posts only concentrating on what’s new. It would work if I was a information orientated blog where the latests news are important. However, I can afford to keep things at a slack by putting my latest post as an excerpt. This is because most people visit the latest posts from direct links such as 9rules and Project Petaling Street or read it from their feeds. Putting things the way I did hopefully encourages people to subscribe to my blog so that they will come back for more. With older and random posts highlighting the main index, it might give an extra incentive to return because what I write is what my blog is all about.

Subscription:

I have taken into encouraging people to subscribe to this blog via my feeds. Unlike before, it’s become an important part of this blog and I would like to take full advantage of it. If you’re unfamiliar with feeds and subscribing to feeds, you might want to check out wikipedia for it. Alternatively, if you’re still unfamiliar about feeds or don’t use them, you can subscribe to this blog via email. It’s really that simple.

SSDD:

Same Stuff Different Design. Version 6 of the layout helped establish the practicality in designing the layout. While the differences of aesthetics is obvious from plain sight, Version 7 doesn’t lose any of what made the previous layout workable. The Most Read Posts, Recent Comments and Recent Readers are still highlighted on the sidebar just as before.

The links however have changed slightly to reflect what this blog has become. Before, I was heavily affiliated with WordPress as an alpha and beta tester. While I still do that now and keep track of what goes on behind the scenes, my role in it has severely diminished. Instead, I’ve begun to highlight 9rules members in random order as a testament to my being part of the community.

The pages are still the same, except that in order to clearly state the obvious, I have shifted the Disclaimers and Policies in plain view rather than being a part of the About Page, obscuring it from everyone. The list of plugins, while just a geeky part of the blog, isn’t really important and has been moved to be a subpage under the About section.

Wrapping Up

I’m not the most artsy person you have ever met, neither am I fluent in programming. What you see here is done by pushing my capabilities slightly beyond my limits and because of that, I might need a little help. If there are any bugs that show up on your browsers could you please report them to me? If you know how to fix it as well, that might even be quite helpful.

I’ll be working on any bugs I see for the week leading up to my 4th blog anniversary so there might be some tweaks during that time. Please feel free to take full advantage of what my blog has so that we don’t overlook anything. The previous layout took 2 years to master, I did this in a month and a half, so it might not be my best work, but its the best that I can do within the time frame.

Also a big thank you to Lelia, Kristin, Ivette, Tam, Danny, Josh and Lisa for constantly going through my initial designs and giving me ideas. This new layout couldn’t have happened the way it was if it weren’t for you guys helping.

I hope you enjoy the new Footsteps in the Mirror. I hope I can share with you the journey, thoughts and perspective which is my life, no matter how unusual or mundane it can be. Here’s hoping to a brand new leaf for this blog and assumingly my life. After all, the world is but the canvas in which I paint on. This blog is just the reflection of the small parts of it in which I step on. Welcome to my footsteps in the mirror.

15 thoughts on “Welcoming Footsteps in the Mirror 7.0

  1. Very nice, very nice… one thing, though (maybe this is just me) but your tabs at the top don’t align, but are displayed step-ladder cascading fashion – Main, then About… next to it, but down about a tab’s height. Did a screen dump (which you can find here. I’m using IE 7, by the way…

    It’s probably one of those things that works great in Firefox but not IE… Thought I should let u know.

  2. Sharina: Thanks a lot.

    Ah Pek: No this theme is not a public release. I might be doing a public release version of this theme later on. But it’ll be toned down and slightly different from this theme.

    Walski: Whoops, I found the problem. When I ported the theme over from my sandbox, I changed the name of the folder but the IE specific stylesheet redirect. It should be properly fixed by now. Tell me if there are any more problems. Thanks for that. 🙂

  3. hmmm…..the colour looks different to the lst time I viewed it, but its nice. generally this is better than the green 😛

  4. Detailed write up here.
    Btw, light css prove to be helpful in loading time.
    Loading time is obviously faster than previous theme.

  5. The move to make the layout first-time visitor friendly are awesome. I love the old layout because it’s straight to the posts but then I’m a frequent visitor and also your feed subscriber. No worries about latest posts!
    Btw, I still love the green kaler. Can’t help it. 😛

  6. Great stuff. It looks really sweet. I especially dig the header (but see club house for more on that). Glad you made it, mate.

  7. Thank you for all the kind words and especially some of you for emailing me the bugs that I missed out. You certainly made a month and half of designing worth it. 🙂

    Kris: No better place for penguins than in cool ice. 🙂

    Undertypo: You mean a lighter stylesheet? Yeah, I did clear out a lot of gunk. I also divided the stylesheet into an IE version and for other browsers so I didn’t have to clutter it with IE hacks.

    ChickyBabe: Haha, I know you certainly do. 🙂

    Ivette: You most definitely deserve it since it was you that gave me pointers for the top navigation bar.

    Chapree: Haha, see…you don’t really have to bother navigating much. Everything is in your feeds in the first place. 🙂 Hope it does work for first time users to begin with. 🙂

    Nils: Yup, I read what you had to say in the clubhouse. Thanks a lot for the kudos. 🙂

    AndrewE: Fresh and icy. 🙂 Thanks. 🙂

  8. A bit too “busy” for my tastes by aesthetically pleasing 🙂

    However, I think you overlooked your <title> tag a bit. All of your pages are titled as Footsteps in the Mirror. Aren’t pages and posts supposed to have its title in it as well?

  9. Azmeen: Haha, touche. Then again I built it with what readers normally go through on my blog in mind after combing through the stats and checking crazyegg for what readers usually look at. Its optimized essentially for what most of my regular readers like.

    Yeah, thanks for noticing the title bit. I’ll fix that up soon enough. 🙂

Leave a Reply

Your email address will not be published. Required fields are marked *