Rough Groove

The new look of Binary Silver, my photoblog

If not for a surprise email that I got this weekend, two in fact, I woudn’t have redesigned my photoblog, Binary Silver in a huff! My second blog to be redesigned in three days. Well, I will just announce the surprise when the time is ripe.

Anyway, I was so busy the whole day today making a very big change to the way my photoblog looks, a major overhaul that seems to be a big leap forward. My idea was to have a clean and simple design. A minimalist approach that will highlight more the images with the overall layout not stealing the thunder from the photos. All styling is done in cascading style sheets or CSS.

First and foremost, it has lots of white space. Text is uncluttered and revolves around the images. I did away with the sidebar and opted instead to subdivide the 960px width into two with about 2/3 devoted to the content while a third is reserved for the post title and details. A 300px wide Google Adsense ad will also be placed here.

The color scheme is limited to two gradations of grays, orange and light yellow for a fresh feel to it. If you will notice, there are no other images other than the main photo and the rest is text. Horizontal lines are also predominant and the only other design element with a shape is the header menu which is a rectangle (of course, other than the photos).

The header got me some problems earlier. At first I opted for a left float so that the header title and the header menu will be at the same level but when I placed a clear below the header, there was just a very wide space underneath. I wasn’t able to resolve this problem that I opted to do away with it. To remedy the disconnect, I placed a border below the title. I think it was a good decision. However, when I get to solve this technical problem, I might change the way the header look.

As for the footer, I was at a bind on how to do it. At first, I had this dark gray block with lighter yellow links but it just doesn’t jive. Later, I replaced the dark block and opted for a white background. To separate this from the main content area, a gray line, 5px in width is used as a divider. The three columns are all widget ready.

Now, its more unified.

The new face of langyaw.com, my travel blog

For the past few months, I’ve been thinking of utilizing a magazine style theme for one of my blogs and after much search, I’ve come upon Michael Jubel’s Arthemia2 Wordpress theme via Gladita’s informative blog. She commented in one of my posts in langyaw.com and when I checked her site, I just fell in love with the theme.

Michael did a wonderful design. It is beautiful. I like it’s simplicity, the color scheme and how the different sections are arranged:

• The Headline allows me to highlight a new post
• The Featured section lets me drive readers to past posts that are interesting. Its an effective way of making them explore the blog more.
• The Categories bar is located below the two sections. Its a clever design and the number of items that can be placed here is just five. It would be difficult if you have more than that but it forced me to really do some category “cleaning” and narrowed it down to 5!

These top three sections are all above the fold and its usage is very commendable.

• The rest of the posts are located below the fold showing five at a time (but this can be customized). Much older items can be accessed through the pagination (WP-PageNavi is built in).
• The Sidebar is widget ready and can be configured through four sections
• Lastly, the Footer is dark, a contrast to the upper parts. This is divided in three columns with two widget ready. The last column seems to be fixed. I also like the placement of the admin links which is located at the bottom of the footer.

There’s a caveat, however. If you notice, there are thumbnail photos for the Headline, Featured and all other posts. This was achieved through the use of Wordpress’ custom fields. Fortunately, the designer provided a script that will automatically generate these images but you still need to place an entry in the said fields. Another thing, this theme needs some configuration and to do that will involve editing the index.php file and adding some category names. Instructions on these can be found at Michael’s blog.

I made slight customizations of the theme to suit my needs:

• I changed the header logo, unless you want one named with arthemia. You can readily replace the png file with your own but making it as text is possible and will need some styling
• got rid of the categories located at the top of post title

One of the biggest work that I did was that I manually generated the thumbnails. I did away with the script for two reasons:

• I can’t make it work at localhost where I test my posts, and
• I want to control the composition of the thumbnail images. For me, I want to pique the reader’s curiosity so that they will check the post

With just around 70 plus entries, it’s still manageable. However, to make this work, I made some changes to the theme files especially those governing the custom fields. I made three different key names for the following thumbnail images: Headline, Featured and all other posts. For upcoming posts, I need to input these three values.

With the initial changes implemented, the next few days will be spent fine tuning the theme like arranging the widgets, adding Google Adsense and work out some other customizations. After that, I will redesign the rest of my blogs, especially this one!

My domain’s email via Gmail

I was tinkering with my estancabigas.com domain’s primary email address at dreamhost.com and look at what i found: I can use this personal email via Gmail! Now, that is convenience.

Ongoing redesign of salagubang.net

I’m redesigning all the pages of salagubang.net, my dedicated beetle site that was launched around five years ago. Its quite daunting and bloody especially that this is my oldest website done in Frontpage. Now, I’m updating every page to cascading style sheets (CSS) from tables to make it more manageable and future redesigns would not be so difficult and time consuming. Now with Dreamweaver, updating it is quite easy.

Other than the redesign, I’m also overhauling all images, 1,126 all in all, to make it better visually as well as placing watermarks. The thumbnail was also enlarged to 200px from the original 100px.

As of now, I’m still not halfway into the revamp but I am just doing it slowly but surely. There will still be a lot of dead links but these will all be ironed out once done.

urbanMANILA

urbanMANILA is the website that I developed, gratis et amore, for the projects made during the workshop conducted by World Press Photo 05 awardee Peter Bialobrzesky, a program of the Goethe Institut, Manila. This was held from 31 January - 26 February 08 at the Silverlens Gallery. From the original 10 participants, eight of us finished the month long collaboration.

The workshop was free. In return, we accompanied and assisted Peter, one on one, for his current work. The learnings and new insights gained ranging from technique, approach to photography as an art, business and as a career were really priceless. I have always wanted to do urban photography and Peter’s inputs really is spot on.

I never regretted joining the workshop. Now, I can just smile and look back when I almost didn’t make it. When I first learned about it from Dennis Rito early January, it was already too late as the selection was concluded December. But when I saw that only 8 out of 10 slots were filled, I immediately contacted Paula Guevarra of Goethe Institut but was told that it was already too late. Seeing that this will be important for me, I sent an email to Jimmy Domingo of ACFJ as well as to Peter. They discussed it and luckily, the selection was reopened just a few days before the start of the workshop. And from there, it was history. It pays to be persistent!

The website is just a simple HTML and CSS based project. I was tempted to do it in flash or integrate flash elements in it but decided not to. The design is uncluttered and I opted for a black background so that the photos will look better. I also tried out a new design where the content is organized in such a way that it floats against the dark backdrop. I did not follow a top-left placement of the site name but instead, positioned it at level with the photo. The main content only holds the site name as well as the images. As for the footer, I utilized this area to hold the thumbnails, navigation and other information. One of the photographers, Tammy David requested not to include her images while I’m still awaiting the text for the About page.

The entire project was done in one sitting. Overnight.