Wednesday, February 8, 2017

Blog Redesign: Visual Composites

After a lengthy post relating to the treatment of the typography in my blog redesign, I got to work on breathing some life into the original wireframe designs. There were many things to consider, even down to the treatment of the drop-cap (or alternative styling) in the first line of each post.

Twelve options here, and these were only the ones I screenshotted!

As for specific typefaces, I decided to go with Montserrat for my headings. It's clean and bold, with just the right amount of personality not to be overbearing. And to be honest, the ampersand grew on me. For the body copy, I'm still torn between Vollkorn and Domine. Check them out:

1) Homepage


The real defining factor here is the navigation. The first thing you see at the top of the page is the most recent posts of all topics, but how do you filter by topic? On the left, you can select a topics from the dropdown menu while on the right side, you select a topic along the nav bar. This will get messy if there are more than five topics or on a smaller screen, so the dropdown seems better. Under that, the right side actually has a featured little area for topics, which is arguably unnecessary.

The other difference is the treatment of the archive. The right side depicts your normal archive separated by month, but the left side is more of a timeline format in order to see the frequency and topics of posts over time. I'll obviously be going with this method if I can get the coding to work properly.

And lastly, I was experimenting with a word cloud of all my posts at the bottom of the homepage, to determine how often a word is used. This can give users a snapshot into what the blog is generally about. Again, I need to see if this is actually technologically possible for me to code.

2) Post Page

As I mentioned before, the drop cap caused me some issues, but I think I've got it mostly sorted out now. Also, I need to figure out some jQuery for some simple interaction on the post page, such as a photo selector, photo viewer, and sharing to Facebook or Twitter with preloaded content, as well as a commenting section. 

A friend mentioned that he doesn't feel comments are necessary on a blog these days, with the advent of social media. There really are better ways to get in touch with me than through a barren comments section at the bottom of a post, but on the other hand it lacks the forum in which readers may interact with each other. Though that has rarely happened in the lifetime of my blog. Perhaps I should disable commenting altogether? I haven't decided yet.

In our next episode: we discuss the perils of coding this bad boy and making everything functional.

No comments:

Post a Comment