They say that "content is king". The more love you put into what really fuels your website (be it writing, photography, portfolio materials, or something else), the better your chances are at seeing real success. When good content is paired with an attractive and usable design, this can likely become an unstoppable left-right combo that serves exactly the purpose you build it, to exactly the audience it was meant. This is, after all, why we web designers keep doing our jobs: to create the perfect website.
As you consider the quality of your content, I'd like you to take a moment to consider the quality and language of how you link your content together. Especially for blogs and news feeds with unique summary and body sections, and (if you happen to allow these) the link in your comments section.
To use myself as an example, I was tweaking the structure of how my Journal pages link to each other, and noticed a few annoying details...
After doing a bit of unofficial research, I noticed that a very large amount of websites contained similar oversights. Even cases where the blog content was very well written, and the designs were nothing short of premium quality — the consideration of the meta-information that held the whole structure together was just "there", will little attention spent on improving it.
Although my work here has only just scratched the surface, I did spend some time working on this last night, and I couldn't wait to share my results with you. Although my website is powered by Expression Engine, I'm certain you can use similar methods in whatever drives your own site. I like to call these: tweaks to a "micro context", since all I'm doing is adjusting the language used in the small, usually overlooked, cracks of the site.
First, I took care of the "Continue Reading" concern. In my opinion, if the entire length of an article is contained in the summary only, then there is technically no reason to "continue reading". You might however like to have a permalink url for the article, as short as it might be.
All that was needed was to detect if the body of the article contained any data, via a short conditional statement, like this:
{if body}
· <a href="{title_permalink={my_template_group}/article/index}">
Continue Reading</a>
{if:else}
· <a href="{title_permalink={my_template_group}/article/index}">
Article Permalink</a>
{/if}
Here's what happens: If there isn't any body, the conditional skips down to the second section, allowing me to display custom text under those circumstances. Way too easy.
Adjusting the comments link took a bit more consideration, since there were a couple of overlapping issues: the possibility of no comments, the possibility of just one comment, the possibility of several comments, and finally the possibility that I would not have comments allowed on any given article.
Before I go into my solution, let me explain quickly my reasoning for not linking to a comments page if there are no comments (because yes, you can still leave a comment to be the first).
The link needed for the comments appears above the artice. Rather than giving a link to a comment form that hasn't yet seen any action — I'd rather bring the reader into the article and present the call to action at the bottom, where it's needed most! I rhetorically ask: why link to the comment form before giving someone a chance to read the material first? I'm not sure, but it happens more than it should.
Here's what I came up with to cover these overlaps:
{if allow_comments}
{if comment_total=="0"}
<!-- no comments -->
{if:elseif comment_total=="1"}
· <a href="{title_permalink={my_template_group}/comments/index}">
{comment_total} Comment</a>
{if:else}
· <a href="{title_permalink={my_template_group}/comments/index}">
{comment_total} Comments</a>
{/if}
{/if}
The first wrapping "if" statement simply checks to see if I've allowed comments on that particular entry. Inside that, I test "comment_total" to see if there are no comments, a single comment, or more than 1, so that I may deliver a custom message for each (or no message, as when the result is "0").
To create a call to action at the bottom of the page, I just re-used the above code, but with different copy, to make it more interesting:
{if allow_comments}
<h4><a href="{title_permalink={my_template_group}/comments/index}">
Would you like to leave a comment?</a></h4>
{if comment_total=="0"}
<p>You’ll be the first intelligent person to start a conversation here!</p>
{if:elseif comment_total=="1"}
<p>{comment_total} intelligent person already has, so what are you waiting for?</p>
{if:else}
<p>{comment_total} intelligent people already have, so what are you waiting for?</p>
{/if}
{/if}
In this case, I always show the option to leave a comment, as long as the ability is enabled on the entry (as seen with my <h4> tag above). I only take advantage of the comment_total variable to display some interesting context-related text. This allows the system to feel like it makes more sense a subtle way.
So, you now have a glimpse at the thought process that I'm approaching with this site: To obsess and fuss over the content I intend on bringing to my readers, but in taking great care to manage exactly how I present that content. Because this isn't a re-design… this is an opportunity to build upon what I already have right now.
Next entry: Social Media Self-Moderating: A Discussion
Previous entry: The Best Laid Schemes