Today, after much thought, I decided to experiment with redesigning the front page of blackphoebe.com. Previous to today, it was a shorter variation of the Black Phoebe :: Ms. Jen blog theme, as of today, it is now one large background photo with a semi-transparent left sidebar with various navigation bits to get around.
I have been wanting for at least the last four years to find a way to feature my mobile phone photography without giving up the usual blog front page of chronological ordering of at least eight blog posts, as I like readers to see the choices available and not to pigeon hole Black Phoebe as only a photo blog. About four years ago, I solved the problem by making the blackphoebe.com entry page be the most recent post from this blog plus a set of the most important links to this blog, recent entries links, the about page, and my master’s thesis on Mobile.
Many photo blogs have one big photo with a few links to recent posts or possibly a short set of excerpts in the footer. I love this layout style, but I don’t want to prioritize image over text. This point of this blog since its inception in April of 2003 was to feature image and text equally. How to manage this goal structurally and visually?
I want to feature my passion for mobile phone & (D)SLR photography with at least one showcase for my favorite photo of the week or day or whatever. And I want to feature the text-based articles, reviews, and humorous pieces that I write. One of the things that I like about the Movable Type software is that the templating system is very robust and allows me to set up a template where just one post from a certain author with a certain tag is shown.
Today I changed around the templates for the blackphoebe.com entry page to have the most recent moblogged (mobile blogged) photo to this blog be the feature photo as the whole 100% of the page background photo. I also took out the blog post area, footer, and reduced the left hand sidebar down to the bare essentials.
I am going to try this out for awhile. I may also try adding a footer with a few recent entries summaries as well to balance out the big image, but for now I will try out image only.
Please let me know how it looks on your mobile or iPhone and if you are using an older version of IE, such as IE6, as my IE testing machine is currently out on loan.
Let me know what you think.
****
p.s. For the 100% background image, I tried a CSS only solution with no javascript for better cross-browser/cross-device rendering. Please do report how it works on your mobile and any older browser versions.
I like it! Very fresh!
One minor CSS tweak: in the sidebar, ul.footer-list has a margin and padding around it that’s causing the browser to have a horizontal scrollbar, and for that list of links to escape the box, unless you open the browser window up really wide. Not a huge deal, though.