<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>farfromfearless &#187; Design</title>
	<atom:link href="http://www.farfromfearless.com/category/design/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.farfromfearless.com</link>
	<description>Personal blog of Chris Murphy</description>
	<lastBuildDate>Thu, 11 Mar 2010 12:11:12 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.9.2</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>How to Fix Your Broken CMS: Part 2</title>
		<link>http://www.farfromfearless.com/2010/03/05/how-to-fix-your-broken-cms-part-2/</link>
		<comments>http://www.farfromfearless.com/2010/03/05/how-to-fix-your-broken-cms-part-2/#comments</comments>
		<pubDate>Fri, 05 Mar 2010 14:32:40 +0000</pubDate>
		<dc:creator>Chris Murphy</dc:creator>
				<category><![CDATA[Content Management]]></category>
		<category><![CDATA[Design]]></category>
		<category><![CDATA[Developement]]></category>
		<category><![CDATA[General]]></category>
		<category><![CDATA[User Experience]]></category>
		<category><![CDATA[CMS]]></category>
		<category><![CDATA[Content Management System]]></category>
		<category><![CDATA[Content Strategy]]></category>
		<category><![CDATA[Process]]></category>
		<category><![CDATA[Publication]]></category>

		<guid isPermaLink="false">http://www.farfromfearless.com/?p=502</guid>
		<description><![CDATA[Sometimes the "quick wins" on a project can turn out to be long-term losses. Has your CMS project turned into a win or loss for your organization? Perhaps it's time to take a step back and re-evaluate your CMS strategy or development roadmap.]]></description>
			<content:encoded><![CDATA[<div class="notice">
<p><strong>Author’s Note:</strong> Considering the subject matter and length of this particular article, I’ve decided to split it into two separate articles.</p>
</div>
<p><strong>Related Articles:</strong></p>
<ol>
<li><a title="How to Fix Your Broken CMS: Part 1" href="http://www.farfromfearless.com/2010/03/04/how-to-fix-your-broken-cms-part-1">How to Fix Your Broken CMS: Part 1</a></li>
<li><a title="How to Fix Your Broken CMS: Part 2" href="http://www.farfromfearless.com/2010/03/04/how-to-fix-your-broken-cms-part-2">How to Fix Your Broken CMS: Part 2</a></li>
</ol>
<h2>Background</h2>
<p>In <a title="How to Fix Your Broken CMS: Part 1" href="http://www.farfromfearless.com/2010/03/04/how-to-fix-your-broken-cms-part-1">Part 1</a> of this series, I wrote at length about the current state of CMS software in general, and proposed a dramatic shift in our attention from <em>features </em>to <em>user experience</em>. At the end of the article, I offered a possible direction in terms of how to build a better CMS, and how we might better fulfill end user expectations (needs vs. wants).</p>
<p>In Part 2 of this series, I’ll be addressing the elements of what I feel would make a truly effective CMS.</p>
<p>Read on…</p>
<h2>A Recipe For a Truly Effective CMS</h2>
<p>Rather than approach a CMS as the alpha and omega of managing content, we need to approach it fundamentally: as tools to support <em><strong>people </strong></em>(and their myriad flavours of an editorial process).</p>
<p>Keep it simple. Keep it lean. Keep it efficient.</p>
<h3>Ingredients</h3>
<p>We need a few ingredients:</p>
<ol>
<li>A system to facilitate the editorial workflow</li>
<li>A system to act as the delivery mechanism (loosely coupled with the presentation layer)</li>
<li>Enhanced user-profiles to determine access levels and the end user experience</li>
</ol>
<h3>Profiles</h3>
<p>Let’s begin with the last ingredient (the element that binds all others together): the user profile.</p>
<p>The fundamental need here is to deliver a user-experience designed for a wide range of end users without becoming homogenous, meaning that the interface with which an editor performs her job can differ dramatically from that of an content author.</p>
<p>Generally speaking, a single individual can act in one or all of the following capacities:</p>
<ol>
<li>The physical author of a piece of content</li>
<li>The reviewer of a body of content</li>
<li>The one delegated with the authority to promote content into another process</li>
</ol>
<p>Note: these are fairly general roles, and granular capabilities/responsibilities/access rights should be introduced to reflect the organization’s needs.</p>
<p>The goal of a profile is to allow users (and those governing the process) to determine their desired user-experience based on both their role in the workflow, including selecting or customizing the interface that is ideally suited for their job function.</p>
<p>Everything else can be considered excess unless it promotes efficiency or enables productivity.</p>
<p><strong>Example:</strong></p>
<p>For simplicity’s sake, let’s assume that we’re talking about a content author—we’ll use Karen McNally as our archetype—whose only responsibility is to <em>craft a piece of information</em> and then <em>promote it</em> into the workflow.</p>
<p>Karen’s profile grants her access to a collection of her work (material that is still considered a work-in-progress, e.g. a “draft”), which she can edit or revise as necessary. When the piece of content is crafted and ready for review, she promotes it into the workflow.</p>
<p>Karen Smith has now fulfilled her fundamental role and responsibility as a content author. It is now up to another person—Michael Bloor, our ‘editor’ archetype—to review and make suggestions that she can implement.</p>
<p>Michael will then review Karen’s recent draft, suggest changes, contribute to the subject matter, and later promote it back into the system where it is then promoted further into the production chain.</p>
<p><strong>What Karen likely sees in terms of an interface is a streamlined set of screens that:</strong></p>
<ul>
<li>Allows her to quickly access her work</li>
<li>Allows her to manipulate and edit her work, likely including suggestions for supporting material and media</li>
<li>Allows her to “check-in” her work into the editorial workflow</li>
</ul>
<p>In the example above, we know that Karen only needs a certain set of screens and features in order for her to fulfill her responsibility as a content author. At this point, the material is then subject to an editorial process that might repeat once or several times before it is then delegated to someone else in the workflow.</p>
<p>In her role, Karen has little interest in formatting for final presentation—that is someone else’s responsibility. She does care about ensuring some basic formatting to communicate the subject matter, and it’s likely that she does have an interest in providing other source material to support her work.</p>
<p><strong>As for Michael, he likely sees a set of of screens that:</strong></p>
<ul>
<li>Allows him to quickly access one or several drafts submitted to the editorial workflow</li>
<li>Allows him to make modifications and re-assign the draft back to the original author</li>
<li>Allows him to promote the draft into the production chain</li>
</ul>
<p>In Michael’s case, he has a narrow set of responsibilities; however, his profile provides him with similar screens as Karen along with a series of screens that she would not otherwise see. On top of this fundamental difference, Michael has enhanced privileges that allow him to promote content or delegate content for other systems/processes.</p>
<h3>The Delivery Mechanism</h3>
<p>It’s a fundamental truth that a website will undergo change at some point—it might not be today or tomorrow—but it will likely evolve either through the introduction of new content or other factors like a redesign.</p>
<p>In the case of a redesign, many aspects of a website are affected: the underlying architecture, the look and feel, and in all likely hood—the content.</p>
<p><strong>Considerations:</strong></p>
<ul>
<li>Most CMSs tend to be focused on short-term execution, e.g. getting a website developed and running</li>
<li>Most CMSs promote data-warehousing—a concept that is both dangerous in terms of potential liabilities for the organization, and inefficient in terms of productivity for the long-term users</li>
<li>Most CMSs are developer-centric and unfriendly to those who are not familiar with the developer’s philosophy around content management and the resulting methodology applied to the system in question</li>
</ul>
<p>What we’ve experienced are systems that are designed for short-terms success for a small group of users and long-term frustration for the intended users (Karen McNally and Michael Bloor in our previous example).</p>
<p>What we want is is a system that is still intended to facilitate the production of a website, but is a process that is <em>loosely coupled with the task of managing content</em>. This means that our once feature-bloated CMS should now be an efficient tool for <strong>developers</strong> and <strong>web-designers </strong>to execute the website’s look and feel and features without having to juggle data-entry at the same time.</p>
<p><strong>Essentials:</strong></p>
<ul>
<li>Integration with the editorial workflow</li>
<li>Light replication of data in the form of <em>content instances</em> that can be modified according to the rules of the presentation layer (the website)</li>
<li>A role-based interface for web-designers to execute the Information Architecture (IA) and Interaction Design (IxD) of the website, and apply presentation rules to content instances</li>
<li>A role-based interface for developers to visually access an manipulate data specifically related to the features and functionality of the website</li>
<li>An API for developers (font-end and back-end) to interact with content for enhanced presentation purposes or develop features for content dissemination</li>
</ul>
<p>The marketers behind most CMSs tend to advertise the ability to manage all of a site’s information in one place, but they forget that information does not begin and end with the CMS. Content needs to live on in a universally accessible and secure location and should in all likelihood be subject to both the organization’s <em><a title="Information Governance - Wikipedia" href="http://en.wikipedia.org/wiki/Information_governance" onclick="urchinTracker('/outgoing/en.wikipedia.org/wiki/Information_governance?referer=');">information governance</a></em> policies and <em><a title="Content Strategy - Kristina Halvorson, New Riders 2009" href="http://www.contentstrategy.com/" onclick="urchinTracker('/outgoing/www.contentstrategy.com/?referer=');">content strategy</a></em>.</p>
<p>Given the above, we must now assert that a website should not to be used as an organization’s information warehouse, and that the concept of a <em>content management system</em> is most definitely a misnomer.</p>
<p>The solution that manages the nuts and bolts of a website is a system designed to do exactly that (and perhaps a little bit more if you need it to), but it should not be responsible for the long-term management of content.</p>
<p>This now leaves us with answering the workflow issue.</p>
<h3>The Editorial Workflow</h3>
<p>The editorial workflow is a system designed to support the creation and governance of content. All of the objects that comprise content (subject matter, media, resources, etc) are managed and governed by this system.</p>
<p>We can expect that a system like this can get convoluted and complex very quickly, but let’s distil things down to essentials before we start thinking about the additional requirements that are needed to support the essentials.</p>
<p><strong>Essentials:</strong></p>
<ul>
<li>Integration with desktop systems/software (e.g. minimum: importing documents into the workflow; ideal: leveraging existing software like word processors to provide a familiar interface)</li>
<li>Version control and revision history to track the changes that are applied to a single unit of content</li>
<li>The ability to apply a strong taxonomy with support for folksonomy</li>
<li>The ability to link a unit of content with a collection of [supporting] source material (resource management)</li>
<li>The ability to promote a unit or collection of content from one user to another</li>
<li>Ensure access to the workflow is governed by user-profiles</li>
<li>Ensure that interfaces for the workflow customized according to roles and preferences</li>
<li>The ability to audit the collective content inventory (reporting)</li>
<li>The ability to provide data mappings</li>
</ul>
<p>The above list address both process and the need for flexibility for organizations that might have a strict or collaborative workflow.</p>
<p><strong>Some considerations:</strong></p>
<ul>
<li><strong>Not all content is created equal</strong>, meaning that while text is the easiest to manipulate and consume, the method of presentation for the subject matter is what people experience; organizations will produce content in many forms—text being the most common—and the workflow is there to track and move it along from one process to the next. Assembly and integration into the presentation layer should handled elsewhere, e.g. promoted to another process.</li>
<li><strong>The workflow overlays the repository and it’s complexity</strong>, meaning that while content is still created by people it needs to reside somewhere and in some mutable form—a database for all intents and purposes; however, that does not mean that the complexity of the database be reflected in the user-experience. Quite the opposite is needed.</li>
</ul>
<p>Sounds like a tall order? It’s not—the only thing that makes software complex is our unrealistic expectations. But we still need something to bridge the gap between the delivery mechanism and the editorial process.</p>
<h3>The Secret Sauce: Data-mapping (aka, our “bridge”)</h3>
<p>What is it?</p>
<p><a title="Data-mapping - Wikipedia" href="http://en.wikipedia.org/wiki/Data_mapping" onclick="urchinTracker('/outgoing/en.wikipedia.org/wiki/Data_mapping?referer=');">Data mapping</a>* is the process of creating data element mappings between two distinct data models. Data mapping is used as a first step for a wide variety of data integration tasks including:</p>
<ul>
<li>Data transformation or data mediation between a data source and a destination</li>
<li>Identification of data relationships as part of data lineage analysis</li>
<li>Discovery of hidden sensitive data such as the last four digits social security number hidden in another user id as part of a data masking or de-identification project</li>
<li>Consolidation of multiple databases into a single data base and identifying redundant columns of data for consolidation or elimination</li>
</ul>
<p>* Source: <a title="Data Mapping - Wikipedia" href="http://en.wikipedia.org/wiki/Data_mapping" onclick="urchinTracker('/outgoing/en.wikipedia.org/wiki/Data_mapping?referer=');">Wikipedia: Data Mapping</a></p>
<p>The point that we’re most interested in here is: <em>“Data transformation or data mediation between a data source and a destination”</em></p>
<p>What we want to do is map content that resides in the <em>editorial workflow</em> to areas in the <em>presentation layer</em> (the website templates, pages, parts, elements, what-have-you). This means that we are only referencing the source content, storing an <em>instance </em>of that content, and applying presentation rules derived from the presentation layer (the website).</p>
<p>Let me re-iterate that: <em>the intent is to avoid directly handling and manipulating the source material</em>.</p>
<p><strong>Further considerations:</strong></p>
<ul>
<li><strong>Instances of content are loosely-coupled</strong>, such that changes made to the source content do not necessarily affect the instance in the presentation layer until explicitly updated—we do this to preserve workflow and ensure governance</li>
<li><strong>Content changes are one-way</strong>, meaning that instances of content are just that—modification of the instances, such as formatting, do not necessarily affect the source content—we do this to maintain the integrity of the source content and ensure compliance with governance policies</li>
<li><strong>Instances are disposable</strong>, meaning that an instance of content might have a limited shelf-life; once decommissioned, the instance does not disappear completely. It still exists in it’s raw form in the editorial workflow</li>
</ul>
<p>The reason we implement data mapping is simple: A CMS is a <em>tactical system</em> and should be decoupled as much as possible from the workflow, which is an <em>operational system</em>.</p>
<h2>Effecting Change</h2>
<p>For the record, <em>this is why I think this approach would work</em>:</p>
<ol>
<li>The approach aligns with user’s needs (not wants)—we focus only on what the end user needs, and build only the features and systems that will help that end user be productive and efficient.</li>
<li>The approach bridges a fundamental gap between software and process—that is, it brings people back into the equation.</li>
<li>We are not re-inventing the wheel—that is to say that traditional models and workflows have continuously proven to work, and we can learn a lot from the hard lessons others have had to struggle through.</li>
</ol>
<p>I originally wrote this segment of the article to reflect the top <em>three reasons why this approach would work</em>. Instead, I changed my mind half-way through to reflect the crux of my argument: <strong>Content begins with <em>people </em>and ends with <em>people</em>.</strong></p>
<p>That is the single fundamental that we need to understand.</p>
<p>I wish I could simply say that the only reason why this approach would work is that, “<em>We need it to,” </em>but that would be pure fantasy. In the real world we’re faced with an infuriating mess of business requirements, politics, and budget constraints.</p>
<p>If we’re going to effect change, we need to build an effective business case that brings people back into focus, and only you—yes, you—can do that. If you’re a consumer, developer, or in a position to make these kinds of critical decisions, you have an opportunity (and responsibility to yourself and the people who work with you) to choose a better way.</p>
<h2>What’s Left?</h2>
<p>I’ll round this off with a challenge to the industry and to consumers. My hope is that someone with enough patience to have read through this rather long-winded series of articles, will embrace the fundamentals and concepts proposed here and evangelize them.</p>
<h3>A Message for CMS Developers &amp; Marketers</h3>
<p>I am not alone in feeling that software falls short of our expectations when it comes to managing content; after all, we see content published everyday and in all manner of forms.</p>
<p>It should not be this painful.</p>
<p>As a response to the <a title="CMS Matrix" href="http://www.cmsmatrix.org/" onclick="urchinTracker('/outgoing/www.cmsmatrix.org/?referer=');">overwhelming volume of poor implementations of content management software currently being marketed</a>, I say this:</p>
<p>Forget the bloated features. Forget about development paths and methodologies; spare us the complexity. The act of managing content should not be obfuscated by deep click-paths or radical dependencies upon development skills or fanatic devotion to technology—it should begin and end with the end user (we, your <em>true customers</em>) in mind.</p>
<p>We want software that helps us do our jobs better, not by imposing what <em>you</em> feel should be our workflow and methodology—we’ll determine that, thank you very much—but by supporting our processes with tools designed to promote efficiency and with productivity in mind.</p>
<h3>A Message for CMS Users</h3>
<p>We <em>are</em> part of the problem and we need to make a full stop. We need to re-assess our current expectations of a CMS are and what is realistic.</p>
<p>Forget the marketing crap. You’ve been misled.</p>
<p>Your CMS is broken. You know it. I know it. But does your company’s leadership—the decision-makers who bought into the CMS know it? Does your IT group resent you for having to do your job on top of dealing with their own?</p>
<p>You need to speak up.</p>
<p>You need to find a way to <em>clearly articulate </em>why your CMS is broken, and influence your decision makers to move in the right direction: not by wasting more time and money on trying to fix what was broken from the beginning, but by stepping back and re-evaluating expectations.</p>
<p>You know that you hate wasting time and feeling incompetent and frustrated—its especially frustrating when you see it done so well in other forms. You want <em><span style="text-decoration: underline;">that</span></em>. And by ‘<em>that</em>’ you mean the process(es) that help traditional media get their content from concept to publication.</p>
<p>Adopting a better approach begins with knowing what you really need and tempering your expectations with pragmatism. You need to build a compelling business case for change.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.farfromfearless.com/2010/03/05/how-to-fix-your-broken-cms-part-2/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>How to Fix Your Broken CMS: Part 1</title>
		<link>http://www.farfromfearless.com/2010/03/05/how-to-fix-your-broken-cms-part-1/</link>
		<comments>http://www.farfromfearless.com/2010/03/05/how-to-fix-your-broken-cms-part-1/#comments</comments>
		<pubDate>Fri, 05 Mar 2010 14:30:35 +0000</pubDate>
		<dc:creator>Chris Murphy</dc:creator>
				<category><![CDATA[Content Management]]></category>
		<category><![CDATA[Design]]></category>
		<category><![CDATA[Developement]]></category>
		<category><![CDATA[User Experience]]></category>
		<category><![CDATA[CMS]]></category>
		<category><![CDATA[Content Management System]]></category>
		<category><![CDATA[Content Strategy]]></category>
		<category><![CDATA[Process]]></category>
		<category><![CDATA[Publication]]></category>

		<guid isPermaLink="false">http://www.farfromfearless.com/?p=503</guid>
		<description><![CDATA[Are you or your organization considering implementing a CMS? Do you have one in place already? Before you move ahead with your CMS project, you may want to take a few minutes to consider your expectations of a CMS before you commit your resources to the project.]]></description>
			<content:encoded><![CDATA[<div class="notice">
<p><strong>Author’s Note:</strong> Considering the subject matter and length of this particular article, I’ve decided to split it into two separate articles.</p>
</div>
<p><strong>Related Articles:</strong></p>
<ol>
<li><a title="How to Fix Your Broken CMS: Part 1" href="http://www.farfromfearless.com/2010/03/04/how-to-fix-your-broken-cms-part-1">How to Fix Your Broken CMS: Part 1</a></li>
<li><a title="How to Fix Your Broken CMS: Part 2" href="http://www.farfromfearless.com/2010/03/04/how-to-fix-your-broken-cms-part-2">How to Fix Your Broken CMS: Part 2</a></li>
</ol>
<p>In recent weeks I’ve been fielding a number of questions from prospective clients and visitors to my site regarding criterion for selecting the right CMS for their website. More often than not, I tend to direct them to an article I wrote previously on this particular subject: <a title="Top 3 Myths of Content Management Systems" href="http://www.farfromfearless.com/2009/02/06/top-3-myths-of-content-management-systems/">Top 3 Myths of Content Management Systems &#8211; Feb. 6th, 2009</a></p>
<p>The article offers some recommendations on selecting the right CMS for your organization, and some insights into common myths surrounding CMSs in general; however, the article does not necessarily provide the desired criterion for determining what makes a good CMS (or not).</p>
<p>The reality is that they are all pretty much the same—big (and getting bigger), feature-bloated, and a serious impediment for efficiency.</p>
<p>In short: your CMS can most certainly be considered a serious productivity killer.</p>
<p>From my perspective, the issues I’ve mentioned above stem from a series of false expectations on the part of CMS consumers that exploited by CMS developers by and large.</p>
<p>Read on…</p>
<h2>Background</h2>
<p>In my previous article I ranked the following as the <em>number one</em> myth surrounding CMSs:</p>
<blockquote><p>“Myth No. 1: A CMS Should Manage <em>Everything</em>”</p></blockquote>
<p>The statement asserts what I feel to be one of the most misleading notions of CMSs—the ability of a single software solution to <em>manage every aspect</em> of a website. After further consideration on this particular myth’s origins, I’ve come to realize that most of this stems from aggressive and misleading software marketing. And we—the consumers—are partially to blame for this.</p>
<p>Why?</p>
<p>For some absurd reason, we have this strange notion that a <em>single solution</em> is all we need, and in response, software vendors develop and market to that notion. The current market is saturated by systems both open-source and licensed and all of them tend to suffer from the same problem: feature-bloating.</p>
<p>Feature-boating is one of the tell-tale signs—to me—that a solution is trying to be too many things for too many people. The solution in question is trying hard to manage too many things when really it should only manage a handful of tasks or better: support a well thought out workflow that is tailored to the organization.</p>
<p>It seems to me that the software vendors—CMS developers in this case—tend to forget the end user and <em>their experience</em>.</p>
<h3>The Tired Debate(s)</h3>
<p>There are several ongoing debates about the merits and flaws of content management systems and content management in general. Chief amongst these debates are the following:</p>
<ul>
<li>Content Management Systems are for IT <em>only</em>:<br />
The notion of managing the assets and objects of a website are the sole responsibility of IT for the simple fact that it is seen as a <strong>technical task</strong> and not an <strong>operational responsibility</strong>.</li>
<li><em>Distribute</em> the responsibility of managing content:<br />
The notion of <strong>decentralizing</strong> content management and enabling “content owners”—those seen to be subject matter experts or authors—to take responsibility of conceptualizing and publishing their content.</li>
</ul>
<p>These are diametrically opposing views serve to illustrate the chasm dividing opinion as to how to circumvent the issue of poorly implemented CMSs. There are strong advocates of better practices and better approaches to managing content, with some strong arguments and <a title="Why content management fails - adaptive path - April 1, 2004" href="http://www.adaptivepath.com/ideas/essays/archives/000315.php" onclick="urchinTracker('/outgoing/www.adaptivepath.com/ideas/essays/archives/000315.php?referer=');">proposals</a> in favour of better processes.</p>
<h3>The Perspective</h3>
<p>For the most part these debates only touch the surface of the issue. The typical approach/solution is to look at the the type and makeup of the organization, its stakeholders, and their particular roles/responsibilities as it applies to the website’s business requirements. At that point, whomever is in charge of making the ‘big decision’ then selects a solution with enough features to address 80-90% of these business requirements.</p>
<p>The selection of a CMS is almost as politically driven as the content that it is supposed to manage.</p>
<p>The resulting solutions places the organization back into the same vicious cycle created by lack of infrastructure, inhuman methodologies, and an understandable fear of technology. As a result, expectations are not met and the organization falls prey to its old habits, falling back into old patterns.</p>
<p>And the familiar debate begins anew.</p>
<h2>A Different Approach to The Problem</h2>
<p>What if we’re looking at the issue from the wrong perspective? What if it’s not enough to simply circumvent the issue with more systems and software?</p>
<p>It seems to me that given the emphasis on trying to become software agnostic by re-focusing on process alone, or attempting to become software-gnostic by relying exclusively on the software, we overlook the fundamental problem: <em>the software we choose is still broken</em>.</p>
<p>What we should be doing is focus on the following:</p>
<ol>
<li><strong>A sound editorial process</strong>—a tailored (read: organization specific) workflow for getting content from concept to creation and eventually online.</li>
<li><strong>A better understanding of what is content vs. resources</strong>—the difference between the subject matter of a website and the assets and objects that help to communicate the subject matter.</li>
<li><strong>A shift in software development from <em>Features</em> to <em>User Experience informed by Content Strategy</em></strong>—a fundamental movement by software vendors to move away from creating <em>yet-another-CMS-with-identical-features-as-it’s-predecessors</em> (accepting that the market <em>will</em> buy into software that addresses a fundamental <em>need</em> rather than a <em>perceived</em> notion).</li>
</ol>
<p>The last two points—previously mentioned—are perhaps the two most underappreciated facets of building a better solution.</p>
<h2>Resources vs. Content</h2>
<p>In 2005 <a title="Adam Mathes" href="http://www.adammathes.com/" onclick="urchinTracker('/outgoing/www.adammathes.com/?referer=');">Adam Mathes</a> published an interesting paper titled, “<a title="Source vs. Resource Ontology - Adam Mathes, 2005" href="http://www.adammathes.com/academic/krfo/sourceresource.html" onclick="urchinTracker('/outgoing/www.adammathes.com/academic/krfo/sourceresource.html?referer=');">Source vs. Resource Ontology</a>”. In his paper, Mathes attempts to present a better definition of <em>resources</em> in the context of electronic documents on the web.</p>
<p>There are some interesting insights in his work, and I particularly appreciate his pragmatic view of what resources are perceived to be in the real world.</p>
<blockquote><p>A significant issue is that even pages we often refer to as being static are not in a strict sense, static, complicating things. &#8220;Small&#8221; edits over time, for example spelling corrections, change the resource content depending on your perspective. In many cases a &#8220;base&#8221; of static content is surrounded by dynamic content. For example, a news article that contains advertising. The &#8220;article&#8221; in one sense doesn&#8217;t change, but it is a dynamic resource in an important sense as the advertisements change. Other examples of small amounts of dynamic content in generally static resource include having the current day and time displayed on a page, even if the rest of the page is unchanged. <cite>Adam Mathes, 2005</cite></p></blockquote>
<p>This brings me to my point: we’ve been led to believe—through pervasive feature-focused marketing—that CMSs are able to effectively manage all aspects, assets, and objects of a website, e.g. “the content”. Resource are not <span style="text-decoration: underline;"><em>Content</em></span>. Resources are <em><span style="text-decoration: underline;">resources</span></em>, and a CMS is little better than a crippled operating system sitting on top of a very complex database.</p>
<p>“Content” in the context of a CMS is both erroneous and problematic. It is erroneous for the fact that the fundamental experience of web is still text-based, and this is evidenced by:</p>
<ol>
<li>Continued emphasis on producing text-based content first and media later;</li>
<li>Reliance on text-based search</li>
<li>Ease of access</li>
</ol>
<p>The notion is problematic for the following reasons:</p>
<ol>
<li>Content is abstracted to the point that a single piece of information cannot be distinguished from another by the fact that the “system” sees all as being equal. And often we see CMSs without strong implementations of a Taxonomy or Folksonomy solution to give the resources any meaning.<br />
<strong> </strong><strong>Note:</strong> abstraction is necessary where software is concerned—after all, defining meaning and purpose is a human’s task and not the sole province of the the software; however, you still need your software to support that fundamental task.</li>
<li>As we incorporate more resources to communicate the subject matter of our content, the software intended to manage the resources requires a proportionate amount of systems or features to “connect-the-dots”—meaning that a a software’s complexity can be directly linked to the degree of abstraction as previously described. What we end up with is more “power tools for developers” and less productivity for those responsible for the long-term management of content (read: real people).<br />
Victor Lombardi’s article on Boxes and Arrows is an excellent resource that presents a good case for <a title="Managing the Complexity of Content Management Systems - Victor Lombardi, 2004/02/09" href="http://www.boxesandarrows.com/view/managing_the_complexity_of_content_management" onclick="urchinTracker('/outgoing/www.boxesandarrows.com/view/managing_the_complexity_of_content_management?referer=');">managing the complexity of content management systems</a>.</li>
<li>CMSs emerge on the market with nearly identical features and with only small variations on their approach—and yet again, we still experience the emphasis on short-term development and less on long-term strategy and governance.</li>
</ol>
<h2>Emphasise “User Experience &amp; Content Strategy” vs. “Software Features”</h2>
<p>So far, I’ve made reference to several sources that go back as far as 2004—what that simply indicates is that serious issues with CMSs are not an emerging trend. They are in my observation, a continuing trend. And we continue to support that trend.</p>
<p>We the consumers—being a fundamental contributor to the problem of CMSs—have made it acceptable for software vendors to saturate the market with products that miss the mark completely when it comes to addressing a fundamental aspect of content management: <strong>Content begins with <em>people</em> and ends with <em>people</em>.</strong></p>
<h3>The Impact of Poor CMS implementations</h3>
<p>If I am to sum up the impact of a poor CMS implementation it would be, quite simply: <strong>Frustration</strong> and <strong>Abandonment</strong>.</p>
<p>Both <a title="In Defense of the CMS - Erin Kissane 2010" href="http://incisive.nu/2010/in-defense-of-the-cms/" onclick="urchinTracker('/outgoing/incisive.nu/2010/in-defense-of-the-cms/?referer=');">Erin Kissane</a>, and <a title="Stop Letting People Use Your CMS - Jeff Cram, 2010" href="http://www.cmsmyth.com/2010/02/stop-letting-people-use-your-cms/" onclick="urchinTracker('/outgoing/www.cmsmyth.com/2010/02/stop-letting-people-use-your-cms/?referer=');">Jeff Cram</a> blogged about their particular frustrations and perspectives on CMSs and CMS implementations and their impacts on the organization. What’s interesting in both articles is that we see the continuing trend of the CMS getting in the way of efficiency and productivity. While Cram’s article nicely illustrates the frustrations of a poor CMS implementation (are there any good ones?), Kissane urges us to refocus on workflow.</p>
<blockquote><p>…Create a workflow that works for your organization. Make sure your CMS supports that workflow. <cite>Erin Kissane</cite></p></blockquote>
<p>Users don’t care about the technology; they take it for granted that the technology will be there to support their jobs, but the sad reality is that the technology gets in the way. Again.</p>
<p>What users do care about is their <em>experience</em> with the CMS. Was it a good experience? Was it a bad experience? These are questions that influence decisions as to whether or not they will repeat the experience or abandon it.</p>
<p>When we talk about “user experience” in the context of a CMS, we’re talking about aspects like productivity, efficiency, and overall comfort level with the system in question. It is pretty clear to me that the vast majority of CMS developers take it for granted that their particular methodology of working with content (ahem, <em>resources</em>) is The Way To Go with little consideration for reality. And reality in this case is the end-user’s experience.</p>
<h3>On Software Features</h3>
<p>Software developers have proven that their ability to build pretty much anything in terms of systems to facilitate getting data into and out of a database. The feature lists of many of the available CMSs alone are enough to illustrate that point. But features alone do not make one CMS better than the next.</p>
<p>Unfortunately for the rest of us, those feature-bloated systems fall short in fulfilling expectations—one expectation in particular is that:<em> I as a subject matter expert or content author should be able contribute to the creation of a body of information, without getting lost in the nuts and bolts of my CMS or without fear of liability (read: breaking the system).</em></p>
<p>Packing more features into the CMS compounds the issue.<em> </em>Stop. Take a good look at the audience—the <em><strong>people</strong></em>—who end up with the task of actually using the CMS after the development team has implemented it.</p>
<p>When it comes to audiences, it doesn’t matter if it’s an individual, a small business, or an enterprise-level organization that is using the CMS—they all have at least one thing in common: the end users are <em><strong>people</strong> </em>who have jobs to do, not a heck of a lot of time to do it, and likely don’t have the patience to tackle the learning curb for that nifty new Cadillac of CMS [that is supposed to make their lives easier].</p>
<p>And when it comes to enterprise—there’s just a whole heck of a lot more of the same folks who share those same traits.</p>
<h3>On Content Strategy</h3>
<p>When it comes to the user experience with Content Management Systems, it has become increasingly difficult to discuss the topic without bringing <em><strong>Content Strategy</strong></em> into the conversation. And for good reason.</p>
<p>You cannot effectively implement a CMS solution without the Content Strategy to inform its use or role in the process.</p>
<p>There are some refreshing forward-thinkers out there like <a title="Kristina Halvorson - Brain Traffic" href="http://www.braintraffic.com/our-people/kristina-halvorson/" onclick="urchinTracker('/outgoing/www.braintraffic.com/our-people/kristina-halvorson/?referer=');">Kristina Halvorson</a>, who make a compelling case for the necessity of a Content Strategy to help organizations effectively define and identify their priorities for content, and to teach better/pragmatic ways of approaching <a title="Content Strategy for the web - Kristina Halvorson, New Riders 2009" href="http://www.contentstrategy.com/" onclick="urchinTracker('/outgoing/www.contentstrategy.com/?referer=');">content for the web</a>. In her book, Halvorson addresses the concept of a strong workflow to audit, capture, and produce better content through several phases.</p>
<p>What is compelling about her argument is that it is once again focused on <strong><em>people</em></strong>, not software.</p>
<p>Halvorson’s book, <em>Content Strategy for the Web</em>, does not cover—in full—CMS strategy (Software selection, design, and implementation)*</p>
<p class="small">* Content Strategy for the Web, Kristina Halvorson, 2010, <em>“What this Book Is Not”</em></p>
<h2>Fundamentals First</h2>
<p>Before we can start to improve the software we must also examine other models that have implemented a solid combination of software and process to provide a productive and efficient workflow that, well, works.</p>
<p><strong>Case Study: The Traditional Editorial Process (aka Publication Production):</strong></p>
<p>In an traditional news publication, the responsibility of conceptualizing/determining what is news worthy is left in the hands of the editors and may also be subject to a schedule [in the case of features].</p>
<p>It is the responsibility of the writing staff to develop the stories and craft them into something appropriate for the readership. Stories are then subject to editorial review and approvals, after which, it is promoted to the production cycle.</p>
<p>It is the responsibility of the production team to format the content into a presentable form—ready for mass consumption.</p>
<p>In the above example, we might see a single story evolve from concept to creation, and further evolution through review, contribution, and editing until it’s ready for publication. This is one flavour of the traditional editorial process, and may be present in more intricate or rudimentary forms in other organizations.</p>
<p><strong>What’s notable about this example:</strong></p>
<ul>
<li>A single story goes through a process and is handled by more than just one person (editorial process)</li>
<li>A single story is always subject to a form of governance (editorial responsibility)</li>
<li>The resulting story is then <em>delegated to another process</em> that shapes it according to the requirements of the medium (presentation)</li>
<li>The system described above is a collection of several processes—the system of <strong><em>Publication Production</em></strong>.</li>
</ul>
<p>What is still amazing to me is the fact that despite the evolution of software and the emergence of technology, <em>the editorial process is still relevant</em>. And they’ve been doing this every single day for decades without pause.</p>
<p><strong>That begs the question:</strong> why—with all of the technology and knowledge at our disposal—are the content management systems unable to effectively replicate the efficiency and scalability of a traditional publication system?</p>
<p><strong>The answer:</strong> software is the impediment—we the consumers and developers—expect software to do anything and everything with our content, forgetting that first and foremost that <strong>content begins with <em>people</em> and ends with <em>people</em>.</strong></p>
<p>What we want is a solution (or set of solutions) that enables <strong><em>people</em></strong> to contribute to an organization’s <strong><em>collective knowledge</em></strong>, and ensure that the responsibility of disseminating content is left in the hands of <strong><em>people</em></strong> who [should] know where it goes and how best to present it.</p>
<h2>A Little About the End Users</h2>
<p>We need to recognize a few things about the typical end user:</p>
<ol>
<li>Software developers have proven—<em>ad nauseum—</em>their ability to manipulate data in all kinds of interesting ways—the typical end user <strong><span style="text-decoration: underline;"><em>doesn’t care</em></span></strong>.</li>
<li>The typical end user <strong><span style="text-decoration: underline;"><em>doesn’t care</em></span></strong> about the fact that your CMS uses stored procedures or that you’re using ORM for database modeling.</li>
<li>The typical end user <strong><span style="text-decoration: underline;"><em>doesn’t care</em></span></strong> a wit about the technical marvels you—the software developer—have pulled off in order to make your CMS function the way it does.</li>
<li>The typical end <strong><span style="text-decoration: underline;"><em>user is concerned largely</em></span></strong> with the fact that they have a job to do and very little time to do it, but instead are starring dumbfounded at a screen loaded with all kinds of strange and confusing doodads that require a user-manuals thick enough to break windows.</li>
<li>Lastly, [most] <strong><em><span style="text-decoration: underline;">people care about people</span></em></strong>—human interaction is essential in organizations, and the reason workflows, work, is due to human interaction that drives the workflow.</li>
</ol>
<h3>Considerations</h3>
<p>This leaves us with a fundamental question to answer:</p>
<p><strong>Q: </strong>If the goal is to de-emphasise <em>feature development</em> and emphasise developing <em>better user-experiences </em>for the end user, how do we do that?</p>
<p><strong>A:</strong> We start by <em>clearly establishing expectations (wants vs. needs) </em>of what a CMS is and what it should do for us—the end users, and stop letting the software dictate our limitations.</p>
<h2>A Unifying Concept</h2>
<p>All of this talk about state-of-the-market and fundamentals is all well and good, but putting it to practice—truly developing and empowering CMS—is another thing altogether.</p>
<p>What we need is a unifying concept: the flux-capacitor to transcend the barrier of… well, you get the picture.</p>
<p><strong>What this means is:</strong></p>
<ol>
<li>If we’re going to start with the user, we need to ensure we address the end user’s fundamental expectations by providing an experience that is designed for <em>them, </em>and not a homogenized user experience that is meaningless—one size does not fit all.</li>
<li>Content should not be managed in a silo but as part of a <em>collaborative workflow</em>—informed by strategy*, regulated through governance, and supported by technology.</li>
<li>The system should <em>not enforce workflow </em>through strict methodology or present technical barriers but provide <em>flexibility</em>—allowing greater access to the process/system to effect productivity and promote efficiency.<strong> </strong></li>
</ol>
<p><strong>* I</strong> wrote earlier about the necessity of a CMS being driven by  strategy—forgive the double-speak—but when I talk about strategy in the  context of a CMS, I do mean both the Operational Strategy (the workflow,  logistics, etc) and the Content Strategy (the heart and soul of  Content).</p>
<p><strong>Let’s summarize what we’ve been talking about so far into a set of actionable principles:</strong></p>
<ol>
<li>A CMS should not be the start-point and end-point of a content creation process (the editorial workflow), in fact managing content should be considered an on-going process.</li>
<li>A CMS should be a system that allows <em>instances </em>of content to be formatted and manipulated according to the requirements of the presentation layer (the website). Instances by nature can be disposable.</li>
<li>A CMS should be—at the very least—a <em><strong>set</strong></em> of <em>loosely coupled systems</em>: the first to facilitate the editorial workflow; and the second to facilitate production/publication for the presentation layer</li>
</ol>
<p>With these concepts in mind, let’s focus on what’s needed executing the concept…</p>
<p><em>Cont’d,</em> <a title="How to Fix Your Broken CMS: Part 2" href="http://www.farfromfearless.com/2010/03/04/how-to-fix-your-broken-cms-part-2">How to Fix Your Broken CMS: Part 2</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.farfromfearless.com/2010/03/05/how-to-fix-your-broken-cms-part-1/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Out with the Old and in with Something Dramatically Different.</title>
		<link>http://www.farfromfearless.com/2009/04/06/out-with-the-old-and-in-with-something-dramatically-different/</link>
		<comments>http://www.farfromfearless.com/2009/04/06/out-with-the-old-and-in-with-something-dramatically-different/#comments</comments>
		<pubDate>Mon, 06 Apr 2009 13:00:00 +0000</pubDate>
		<dc:creator>Chris Murphy</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Developement]]></category>
		<category><![CDATA[General]]></category>
		<category><![CDATA[WordPress Themes]]></category>

		<guid isPermaLink="false">http://www.farfromfearless.com/?p=399</guid>
		<description><![CDATA[<p>As some of you may have noticed by now, I’ve updated <strong>farfromfearless</strong>. I suppose “update” is a bit of an understatement. If you’re reading this post, it’ll be in the context of a dramatically new theme and structure.</p>
<p><a href="http://www.farfromfearless.com/wp-content/uploads/2009/04/dusk-3.jpg"><img style="display: inline" title="WordPress Theme - Dusk - About" src="http://www.farfromfearless.com/wp-content/uploads/2009/04/dusk-3-thumb.jpg" alt="WordPress Theme - Dusk - About" width="550" height="397" /></a></p>
<p>Change&#8230;</p>]]></description>
			<content:encoded><![CDATA[<p>As some of you may have noticed by now, I’ve updated <strong>farfromfearless</strong>. I suppose “update” is a bit of an understatement. If you’re reading this post, it’ll be in the context of a dramatically new theme and structure.</p>
<p><a href="http://www.farfromfearless.com/wp-content/uploads/2009/04/dusk-3.jpg"><img style="display: inline" title="WordPress Theme - Dusk - About" src="http://www.farfromfearless.com/wp-content/uploads/2009/04/dusk-3-thumb.jpg" alt="WordPress Theme - Dusk - About" width="550" height="397" /></a></p>
<p>Change is good.</p>
<h2>What’s New?</h2>
<p>A number of things have changed over the past few months &#8212; my current circumstances not withstanding &#8212; I’m now in the position where <a href="http://www.farfromfearless.com/about/">I&#8217;m able to take on consulting work</a> and wanted to communicate that fundamental change on many levels (the most obvious place to start being my blog, of course).</p>
<p>I’ve talked about shifting focuses on this site for the last couple of years, but never had the time or need to push the change forward. I do now and what you’re looking at is the result. Where before my blog mostly concentrated on the things that interest me (it still does), it’s taken second stage to the need to <a href="http://www.farfromfearless.com/portfolio/">showcase my work</a> in a meaningful way.</p>
<p>You can learn more about <a title="Chris Murphy - UxD/IxD Consultant" href="http://www.farfromfearless.com/about/">what I offer as a consultant here</a>, but if you’re more interested in the work I’ve done, you can take a look at <a title="Chris Murphy - Portfolio" href="http://www.farfromfearless.com/portfolio/">a cross section of that material here</a>.</p>
<h3>What To Expect</h3>
<p>I’ll still be continuing my series on WordPress Theme Development and the ongoing updates to some of the other minor series, but I will also be posting about the work I’ve completed in the form of case studies. My hope is that I can share some of my experience in a way that is meaningful (without putting me out of work <img src='http://www.farfromfearless.com/wp-includes/images/smilies/icon_wink.gif' alt=';-)' class='wp-smiley' />  ).</p>
<h2>About This Theme</h2>
<p>This new WordPress theme is called <strong>“Dusk”</strong>, currently at version 0.5, as I’m quite sure there will be a number of tweaks to the design and features over the coming weeks.</p>
<p><a href="http://www.farfromfearless.com/wp-content/uploads/2009/04/dusk-0.jpg"><img style="display: inline" title="WordPress Theme - Dusk - Home" src="http://www.farfromfearless.com/wp-content/uploads/2009/04/dusk-0-thumb.jpg" alt="WordPress Theme - Dusk - Home" width="274" height="198" /></a><a href="http://www.farfromfearless.com/wp-content/uploads/2009/04/dusk-2.jpg"><img style="display: inline" title="WordPress Theme - Dusk - Single" src="http://www.farfromfearless.com/wp-content/uploads/2009/04/dusk-2-thumb.jpg" alt="WordPress Theme - Dusk - Single" width="274" height="198" /></a></p>
<p>It’s possible that I will release this theme to the public in a year or so when I’m ready to re-design – or perhaps I’ll market it as a premium theme (who knows). But I do plan to release it at some point as I have with my other themes.</p>
<h3>The Design Concept</h3>
<p>The inspiration for this new theme came largely from watercolour paintings – mostly the texture and the vibrancy of colours, but also the techniques involved in working with the medium.</p>
<p><a href="http://www.farfromfearless.com/wp-content/uploads/2009/04/dusk-1.jpg"><img style="display: inline" title="WordPress Theme - Dusk - Footer" src="http://www.farfromfearless.com/wp-content/uploads/2009/04/dusk-1-thumb.jpg" alt="WordPress Theme - Dusk - Footer" width="274" height="198" /></a><a href="http://www.farfromfearless.com/wp-content/uploads/2009/04/dusk-4.jpg"><img style="display: inline" title="WordPress Theme - Dusk - Comments" src="http://www.farfromfearless.com/wp-content/uploads/2009/04/dusk-4-thumb.jpg" alt="WordPress Theme - Dusk - Comments" width="275" height="198" /></a></p>
<p>I felt that it would be a strong juxtaposition to the more technical and rigid structure of the content – one balancing the other. The primary focus of this theme is showcasing my work first and my writing second. The layout for the main page was given a unique structure most appropriate to the type of blended content without overpower the other.</p>
<h3>Behind The Design</h3>
<p><strong>“Dusk”</strong> is based on the 960px grid concept and implemented using <a title="Blueprint: A CSS Framework | Spend your time innovating, not replicating" href="http://www.blueprintcss.org/" onclick="urchinTracker('/outgoing/www.blueprintcss.org/?referer=');">Blueprint CSS</a>. I’ve been focusing on <a title="Blueprint: A CSS Framework | Spend your time innovating, not replicating" href="http://www.blueprintcss.org/" onclick="urchinTracker('/outgoing/www.blueprintcss.org/?referer=');">Blueprint CSS</a> lately as it (amongst others) expedites some of the common CSS development tasks, allowing me to focus on ensuring the creative aspects of a design aren’t compromised. This of course assumes that the design adheres to the 960px grid concept (and this one does).</p>
<h2>Final Thoughts</h2>
<p>If you’re interested in how I might help your project succeed, <a href="http://www.farfromfearless.com/about/#services">I can help you in one capacity or another</a>. Don’t hesitate to ask <img src='http://www.farfromfearless.com/wp-includes/images/smilies/icon_wink.gif' alt=';)' class='wp-smiley' /> </p>
]]></content:encoded>
			<wfw:commentRss>http://www.farfromfearless.com/2009/04/06/out-with-the-old-and-in-with-something-dramatically-different/feed/</wfw:commentRss>
		<slash:comments>12</slash:comments>
		</item>
		<item>
		<title>WordPress Theme Design Part 4: Visual Texture</title>
		<link>http://www.farfromfearless.com/2009/02/25/wordpress-theme-design-part-4-visual-texture/</link>
		<comments>http://www.farfromfearless.com/2009/02/25/wordpress-theme-design-part-4-visual-texture/#comments</comments>
		<pubDate>Wed, 25 Feb 2009 22:08:43 +0000</pubDate>
		<dc:creator>Chris Murphy</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[How To]]></category>
		<category><![CDATA[Tutorial]]></category>
		<category><![CDATA[WordPress]]></category>
		<category><![CDATA[WordPress Themes]]></category>
		<category><![CDATA[Grunge]]></category>
		<category><![CDATA[Industrial]]></category>
		<category><![CDATA[Textiles]]></category>
		<category><![CDATA[Textures]]></category>
		<category><![CDATA[Theme Design]]></category>
		<category><![CDATA[Watercolor]]></category>

		<guid isPermaLink="false">http://www.farfromfearless.com/?p=237</guid>
		<description><![CDATA[It’s been some time since my last posting on my “WordPress Theme Design” series (a year and change), and so I thought it was well past time that I got on with the series. In previous installments, I’ve covered topics such as layout, typography, and color &#038; contrast. This time around, I’ll be covering “texture”.]]></description>
			<content:encoded><![CDATA[<p>Visual texture plays a large role in design: the lack of and the addition of texture are all part of visual communication. It is one of the ways a designer can appeal to the users’ senses through a medium that is not tactile by nature.</p>
<p>Strategic use of texture can help to shape the perception of a design; it can turn a simple website layout into something evocative; when delivered in context with the subject matter of the site (articles, information, etc), texture can help to communicate tone and attitude.</p>
<h3>Texture In Web Design</h3>
<p>Visual textures can be lumped into three relative categories:</p>
<ol>
<li>Patterns</li>
<li>Photographic</li>
<li>Illustrated</li>
</ol>
<h4>Patterns as Texture</h4>
<p>Patterns are the most common type of texture that you encounter on the web. In many cases they are tileable images that are rendered as background images in a page, or appear as textured design accents. Patterns can range from illustrated elements that can repeat endlessly, or as three dimensional (often photographic) textures that can evoke a sense of depth and dimension.</p>
<p><strong>Example:</strong></p>
<p><a href="http://www.farfromfearless.com/wp-content/uploads/2009/02/patterns.png"><img style="display: inline" title="patterns" src="http://www.farfromfearless.com/wp-content/uploads/2009/02/patterns-thumb.png" alt="patterns" width="414" height="138" /></a></p>
<p><strong>Fig. 1</strong> – Tileable Patterns.</p>
<p><strong>Resources:</strong></p>
<ul>
<li><a title="K10K Pixel Patterns" href="http://www.k10k.net/sections/pixelpatterns/" onclick="urchinTracker('/outgoing/www.k10k.net/sections/pixelpatterns/?referer=');">K10K Pixel Patterns</a></li>
<li><a title="SquidFingers Patterns" href="http://www.squidfingers.com/patterns/" onclick="urchinTracker('/outgoing/www.squidfingers.com/patterns/?referer=');">SquidFingers Patterns</a></li>
<li><a title="BgPatterns.com Patterns" href="http://bgpatterns.com/" onclick="urchinTracker('/outgoing/bgpatterns.com/?referer=');">BgPatterns</a></li>
</ul>
<h4>Photographs as Texture</h4>
<p>It would be more appropriate to consider photographic texture as singular instances of texture applied to the design, rather than something that is explicitly tiled as in the case of patterns. Photographic textures tend to range in subject matter, but the most common example of photographic texture are images that can be used as backgrounds, such as walls (brick, cement, etc).</p>
<p><strong>Example:</strong></p>
<p><a href="http://www.farfromfearless.com/wp-content/uploads/2009/02/b19light-fx111.jpg"><img style="display: inline" title="b19light_fx111" src="http://www.farfromfearless.com/wp-content/uploads/2009/02/b19light-fx111-thumb.jpg" alt="b19light_fx111" width="176" height="132" /></a> <a href="http://www.farfromfearless.com/wp-content/uploads/2009/02/b17dario284.jpg"><img style="display: inline" title="b17dario284" src="http://www.farfromfearless.com/wp-content/uploads/2009/02/b17dario284-thumb.jpg" alt="b17dario284" width="176" height="132" /></a> <a href="http://www.farfromfearless.com/wp-content/uploads/2009/02/47d966867f354grungetexture.png"><img style="display: inline" title="47d966867f354,Grunge-Texture" src="http://www.farfromfearless.com/wp-content/uploads/2009/02/47d966867f354grungetexture-thumb.png" alt="47d966867f354,Grunge-Texture" width="176" height="132" /></a></p>
<p><strong>Fig. 2-4 – </strong>Light, textiles and other industrial textures.</p>
<p><strong>Resources:</strong></p>
<ul>
<li><a title="ImageAfter - The Raw Base for Your Creativity" href="http://www.imageafter.com/" onclick="urchinTracker('/outgoing/www.imageafter.com/?referer=');">ImageAfter</a></li>
<li><a title="iStockPhoto: Search Royalty Free Images &amp; Photos" href="http://www.istockphoto.com/index.php" onclick="urchinTracker('/outgoing/www.istockphoto.com/index.php?referer=');">iStockPhoto</a></li>
</ul>
<h4>Illustration as Texture</h4>
<p>Illustrated texture is something of a trend over the past few years, where artists and designers mix various sources such as photographs, tileable patterns, and light to create unique textures.</p>
<p><strong>Examples:</strong></p>
<p><a href="http://www.farfromfearless.com/wp-content/uploads/2009/02/ist2-2429487greenstreakwatercolorbackground.jpg"><img style="display: inline" title="ist2_2429487-green-streak-watercolor-background" src="http://www.farfromfearless.com/wp-content/uploads/2009/02/ist2-2429487greenstreakwatercolorbackground-thumb.jpg" alt="ist2_2429487-green-streak-watercolor-background" width="176" height="139" /></a> <a href="http://www.farfromfearless.com/wp-content/uploads/2009/02/ist2-1744256bluewatercolorwash2.jpg"><img style="display: inline" title="ist2_1744256-blue-watercolor-wash-2" src="http://www.farfromfearless.com/wp-content/uploads/2009/02/ist2-1744256bluewatercolorwash2-thumb.jpg" alt="ist2_1744256-blue-watercolor-wash-2" width="176" height="106" /></a> <a href="http://www.farfromfearless.com/wp-content/uploads/2009/02/ist2-1977280yellowandorangewatercolorbackground.jpg"><img style="display: inline" title="ist2_1977280-yellow-and-orange-watercolor-background" src="http://www.farfromfearless.com/wp-content/uploads/2009/02/ist2-1977280yellowandorangewatercolorbackground-thumb.jpg" alt="ist2_1977280-yellow-and-orange-watercolor-background" width="176" height="128" /></a></p>
<p><strong>Fig. 5-7</strong> – Mixed water color backgrounds.</p>
<p><strong>Resources:</strong></p>
<ul>
<li><a title="iStockPhoto: Search Royalty Free Images &amp; Photos" href="http://www.istockphoto.com/index.php" onclick="urchinTracker('/outgoing/www.istockphoto.com/index.php?referer=');">iStockPhoto</a></li>
<li><a title="Free Photoshop Brushes at Brusheezy!" href="http://www.brusheezy.com/" onclick="urchinTracker('/outgoing/www.brusheezy.com/?referer=');">Brusheezy</a></li>
</ul>
<h3>Texture in WordPress Themes</h3>
<p>Texture as a design element contributes to the overall personality of the design. When it comes to WordPress Themes, authors tend to exhibit a need to communicate an aspect of their personality through the theme they choose to employ on their blog.</p>
<p>If you’re thinking about using texture as part of your design, consider the following:</p>
<ol>
<li><strong>Theme:</strong> What is the <em>theme</em> of your theme?</li>
<li><strong>Prominence:</strong> How prominent are the textures going to be in your design?</li>
<li><strong>Repetition:</strong> How often and how many repeatable textures are you planning to use in the design?</li>
</ol>
<h3>Bringing it Together</h3>
<p>Designing a successful WordPress theme is no different from designing a compelling website layout – both need to illustrate an artistic (and practical) balance of many design concept where texture may be one fundamental aspect of that balance.</p>
<p>When you’re considering the design of your WordPress theme, think about how your chosen texture(s) will work together with your other design elements to communicate the overall theme.</p>
<p>For example, if you’re out to create a theme that needs to communicate and “outdoors lifestyle” or “nature”, you may want to consider using textures that are organic. In a case like this could could mix various types of textures (tileable, photographic and illustrated).</p>
<p><a href="http://www.farfromfearless.com/wp-content/uploads/2009/02/outdooritaliaofficialsite.png"><img style="display: inline" title="Outdoor Italia official site" src="http://www.farfromfearless.com/wp-content/uploads/2009/02/outdooritaliaofficialsite-thumb.png" alt="Outdoor Italia official site" width="540" height="369" /></a></p>
<p><strong>Fig. 8</strong> – <a title="Outdoor Italia" href="http://www.outdooritalia.it/" onclick="urchinTracker('/outgoing/www.outdooritalia.it/?referer=');">Outdoor Italia</a></p>
<p>The Outdoor Italia site is a great example of how various types of tileable and photographic texture can be used in a design to communicate a theme. The site makes great use of photographic textures in the form of leaves, paper, and the occasional physical item to deliver a sense of depth.</p>
<p><a href="http://www.farfromfearless.com/wp-content/uploads/2009/02/wildaboutgardening.png"><img style="display: inline" title="Wild About Gardening" src="http://www.farfromfearless.com/wp-content/uploads/2009/02/wildaboutgardening-thumb.png" alt="Wild About Gardening" width="540" height="441" /></a></p>
<p><strong>Fig. 9</strong> – <a title="Canadian Wildlife Federation - Wild About Gardening" href="http://www.wildaboutgardening.org/" onclick="urchinTracker('/outgoing/www.wildaboutgardening.org/?referer=');">Wild About Gardening</a></p>
<p>The Wild About Gardening is one of my favourite sites for two reasons: the illustration work makes subtle use of &#8212; and reference to &#8212; watercolor art, and it blends well with photographic texture. This site is a great example of Photographic and Illustrated texture working naturally together to communicate a sense of unity in the design.</p>
<p>The above examples aren’t WordPress themes, but the leap from content to editorial layout isn’t difficult to make.</p>
<p>Remember that not every WordPress design you create has to have shiny buttons and glossy blocks. Take time to experiment with texture in your design, and discover how different textures can dramatically change the tone and style of your design.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.farfromfearless.com/2009/02/25/wordpress-theme-design-part-4-visual-texture/feed/</wfw:commentRss>
		<slash:comments>11</slash:comments>
		</item>
		<item>
		<title>WordPress Theme Design Contests &#8212; What Are You Really Getting Involved In?</title>
		<link>http://www.farfromfearless.com/2009/01/19/wordpress-theme-design-contests-what-are-you-really-getting-involved-in/</link>
		<comments>http://www.farfromfearless.com/2009/01/19/wordpress-theme-design-contests-what-are-you-really-getting-involved-in/#comments</comments>
		<pubDate>Tue, 20 Jan 2009 03:00:57 +0000</pubDate>
		<dc:creator>Chris Murphy</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[General]]></category>
		<category><![CDATA[Grrr]]></category>
		<category><![CDATA[WordPress]]></category>
		<category><![CDATA[WordPress Themes]]></category>
		<category><![CDATA[Artist Rights]]></category>
		<category><![CDATA[Design Contest]]></category>
		<category><![CDATA[Ethics]]></category>
		<category><![CDATA[Rules and Regulations]]></category>

		<guid isPermaLink="false">http://www.farfromfearless.com/?p=196</guid>
		<description><![CDATA[I recently stumbled upon a WordPress theme design contest being hosted by colorlabsproject.com and was pleasantly surprised at the prizes that were being offered -- quite generous for a theme design contest; and the fact that are few really compelling ones going on right now makes it a perfect motivator for me to submit something. In fact I think I would have registered for the contest immediately, but I decided to read some of the rules and regs (mostly because I'm a Canadian citizen and there are often stricter rules surrounding international participation).]]></description>
			<content:encoded><![CDATA[<p><strong>To be clear: </strong>this post is not announcing a <a href="http://colorlabsproject.com/blog/contest/" title="ColorlabsProject.com - Design Contest" onclick="urchinTracker('/outgoing/colorlabsproject.com/blog/contest/?referer=');">new contest</a>.</p>
<p>While I&#8217;m an ardent supporter of promoting the <a title="WordPress" href="http://www.wordpress.org" onclick="urchinTracker('/outgoing/www.wordpress.org?referer=');">WordPress</a> platform any way I can, the contest documentation sent up red flags after the first and second read through:</p>
<ol>
<li>The rules for entry had been modified once (noted by the site owners) ;</li>
<li>The foundation of the contest is rooted in the participant submitting a &#8220;concept&#8221; but later defines a concept as being a production comp.</li>
<li>There&#8217;s a fairly ambiguous panel of judges as implied by, &#8220;Designs are assessed by a special team from ColorLabs Project&#8230;&#8221;  &#8212; who are these people?</li>
<li>Lastly, this: &#8220;You understand that by participating in this contest, your theme concept is possibly used by ColorLabs Project and may be made available for purchase on our site. Winners will be awarded a cash prize for their work. Any other theme concept will only be made available for purchase after a once-off fee agreed by both parties. Sales generated off the theme will be kept by the company.&#8221;</li>
</ol>
<h3>Get Your Story Straight:</h3>
<p>First off, if you&#8217;re going to launch a contest, make damn sure that the language surrounding the rules and regulations, as well as the terms and conditions are as clear as you can possibly be. I say this as a a Creative Director and planner who has been involved in advertising campaigns that were build around some hefty prizes. Nothing makes a contest go south faster than poorly written contest literature. Once you post those rules, you had better ensure they are final. I can&#8217;t speak for the legal ramifications of changing contest details mid-way through, but I can say there&#8217;s a significat level of trust that is lost in having to do so.</p>
<h3>Concept vs. Concept Art</h3>
<p>Second, a Concept is quite different from Concept Art. Be sure what you&#8217;re asking participants for. A Concept, e.g. an idea &#8212; is typically something you solicit in written form. Concept Art is visual. In a design contest like this (and considering the last condition in the T&amp;C), asking for a visual concept without providing appropriate conditions to protect the artist&#8217;s work is borderline unethical. There is nothing to prevent the contest hosts from turning around and re-creating the concept art into production-ready source files. Participants should be well aware of this possibility.</p>
<h3>Industry Peers/Professionals or Your Grandmother?</h3>
<p>Third, who the heck are the judges? While there is nothing wrong with not disclosing the judging panel to the general public &#8212; to me, there&#8217;s a level of trust that a contest host can provide through disclosure. Quite frankly, are the members of the judging panel qualified to act as judges given the criteria? This is pretty grey-area from my experience.</p>
<h3>Exactly How Are You Planning To Use My Work?</h3>
<p>Lastly, the final condition on the T&amp;C is loosely worded, and relinquishes &#8212; as I understand it &#8212; a considerable amount of the artist&#8217;s rights to the contest host. While on the surface, there is nothing essentially wrong with this practice, but it leaves me questioning the ethics of amassing a royalties-free library of design for resale. On one hand, it may be quite alright to capitalize on the award-winning themes as well as the runners-up, but what of the rest? Are the remaining &#8220;unqualified&#8221; designs to be saved for later resale or are they to be destroyed? What about compensation for artist? The language surrounding this particular conditions is a little vague.</p>
<p>In any case, I&#8217;m not a lawyer &#8212; just someone who really wanted to participate in a contest, but unfortunately this one comes off as a scam poorly disguised as a contest. What&#8217;s next: timeshares in the Bahamas?</p>
<p>Seriously though, if you are considering participation in any contest of this kind &#8212; take the time to educate yourself on your rights as an artist/designer and pay particular attention to the organizers of the contest. At the end of the day you&#8217;ll need to judge for yourself whether or not a contest is legitimate and what your work is worth.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.farfromfearless.com/2009/01/19/wordpress-theme-design-contests-what-are-you-really-getting-involved-in/feed/</wfw:commentRss>
		<slash:comments>4</slash:comments>
		</item>
		<item>
		<title>Sites That Inspire &#8211; 2.</title>
		<link>http://www.farfromfearless.com/2009/01/17/sites-that-inspire-2/</link>
		<comments>http://www.farfromfearless.com/2009/01/17/sites-that-inspire-2/#comments</comments>
		<pubDate>Sun, 18 Jan 2009 02:42:14 +0000</pubDate>
		<dc:creator>Chris Murphy</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Inspiration]]></category>
		<category><![CDATA[Biola Undergrad]]></category>
		<category><![CDATA[Edit Studios]]></category>
		<category><![CDATA[Redbrick Health]]></category>

		<guid isPermaLink="false">http://www.farfromfearless.com/?p=192</guid>
		<description><![CDATA[Having spent the better part of December otherwise indisposed, I had a lot of time on my hands to do nothing but surf around the web. Seeing as this is the start of a new year, I thought I would usher it in (belatedly) with a handful of the sites that survived a recent purging.]]></description>
			<content:encoded><![CDATA[<p>One of the trends that seems to be re-emerging lately in design (regardless of industry) is a more illustrative approach to some of the graphical aspects of a design. In the past, most illustrative elements tended to be small details such as arrows or buttons (minus of course those fully-illustrated sites that crop up), but now I think we’re going to be seeing a lot more illustrative elements in websites going forward. It’s a nice departure from the super-glossy websites of the last couple of years.</p>
<h3>Biola Undergrad</h3>
<p>I liked this site for its particular blend of graphical styles (hand-drawn illustration, vector and photography). The design successfully delivers on style while still respecting the need to remain usable.</p>
<p><a href="http://www.farfromfearless.com/wp-content/uploads/SitesThatInspire2_118B7/biola.png"><img style="display: inline" title="biola" src="http://www.farfromfearless.com/wp-content/uploads/SitesThatInspire2_118B7/biola_thumb.png" alt="biola" width="540" height="534" /></a></p>
<p>Visit them <a title="Biola Undergrad" href="http://www.biola.edu/undergrad/" onclick="urchinTracker('/outgoing/www.biola.edu/undergrad/?referer=');">here</a>.</p>
<h3>Redbrick Health</h3>
<p>This is a fairly dramatic departure for a health insurance provider in that they’ve done away with the typical corporate look and feel in favour of a more consumer-oriented aesthetic. Browse though the various sections and you’ll see that the designer carried the theme consistently throughout the experience. one feature you might want to check out is the parallax scrolling effect you get when you resize the browser window (pay close attention to the clouds).</p>
<p><a href="http://www.farfromfearless.com/wp-content/uploads/SitesThatInspire2_118B7/redbrickhealth.png"><img style="display: inline" title="redbrick-health" src="http://www.farfromfearless.com/wp-content/uploads/SitesThatInspire2_118B7/redbrickhealth_thumb.png" alt="redbrick-health" width="540" height="539" /></a></p>
<p>Visit them <a title="Redbrick Healthcare" href="https://www.redbrickhealth.com/" onclick="urchinTracker('/outgoing/www.redbrickhealth.com/?referer=');">here</a>.</p>
<h3>Edit Studios</h3>
<p>A UK based web company, Edit Studios’ website offers some interesting features that caught my attention. I particularly liked the rotating portfolio that breaks up the standard grid, as well as the playful hand-drawn details peppered sparingly though the design. While this isn’t the most ground breaking of sites, I do like it for the fact that I get almost everything I need to know about the company right from the get go.</p>
<p><a href="http://www.farfromfearless.com/wp-content/uploads/SitesThatInspire2_118B7/editstudios.png"><img style="display: inline" title="edit-studios" src="http://www.farfromfearless.com/wp-content/uploads/SitesThatInspire2_118B7/editstudios_thumb.png" alt="edit-studios" width="540" height="545" /></a></p>
<p>Visit them <a title="Edit Studios" href="http://www.edit-studios.com/" onclick="urchinTracker('/outgoing/www.edit-studios.com/?referer=');">here</a>.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.farfromfearless.com/2009/01/17/sites-that-inspire-2/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>FrogCMS &#8211; Content Management Simplified.</title>
		<link>http://www.farfromfearless.com/2008/11/10/frogcms-content-manage-simplified/</link>
		<comments>http://www.farfromfearless.com/2008/11/10/frogcms-content-manage-simplified/#comments</comments>
		<pubDate>Mon, 10 Nov 2008 21:57:30 +0000</pubDate>
		<dc:creator>Chris Murphy</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Developement]]></category>
		<category><![CDATA[Software]]></category>
		<category><![CDATA[CMS]]></category>
		<category><![CDATA[Content Management System]]></category>
		<category><![CDATA[RadiantCMS]]></category>

		<guid isPermaLink="false">http://www.farfromfearless.com/2008/11/10/frogcms-content-manage-simplified/</guid>
		<description><![CDATA[I don't normally blog about content management systems as these kinds of posts tend to degenerate into a my-cms-is-better-than-yours-palooza, but I wanted to give a shout out to a project that has been in the works for almost two years and has finally matured into something worth talking about.]]></description>
			<content:encoded><![CDATA[<p>Content Management Systems come in so many flavours, and while I don&#8217;t advocate any one system over another, I have no hesitation in saying that this product is one to keep an eye out for. Created by Quebec-based developer, <a title="Philippe Archambault" href="http://www.philworks.com/" onclick="urchinTracker('/outgoing/www.philworks.com/?referer=');">Philippe Archambault</a> , FrogCMS is one of the few I would include in my web-designer&#8217;s toolbox. The system is not inherently original in it&#8217;s approach, being a derivative/port of another popular system called RadianCMS (developed on the Ruby Framework), but like RadiantCMS, it&#8217;s approach does appear to live up to it&#8217;s promise in simplifying the task of developing a scalable website by abstracting the components of a website into simple concepts: &#8220;pages&#8221;, &#8220;snippets&#8221;, &#8220;layouts&#8221;, &#8220;files&#8221;, and &#8220;comments&#8221;.</p>
<p>Here are a few screenshots of the product:</p>
<p><a href="http://www.farfromfearless.com/wp-content/uploads/FrogCMSContentManageSimplified_E103/frogcms_01.jpg"><img src="http://www.farfromfearless.com/wp-content/uploads/FrogCMSContentManageSimplified_E103/frogcms_01_thumb.jpg" alt="Pages" width="540" height="322" /></a> <a href="http://www.farfromfearless.com/wp-content/uploads/FrogCMSContentManageSimplified_E103/frogcms_02.jpg"><img src="http://www.farfromfearless.com/wp-content/uploads/FrogCMSContentManageSimplified_E103/frogcms_02_thumb.jpg" alt="Snippets" width="540" height="322" /></a> <a href="http://www.farfromfearless.com/wp-content/uploads/FrogCMSContentManageSimplified_E103/frogcms_03.jpg"><img src="http://www.farfromfearless.com/wp-content/uploads/FrogCMSContentManageSimplified_E103/frogcms_03_thumb.jpg" alt="Layouts" width="540" height="322" /></a> <a href="http://www.farfromfearless.com/wp-content/uploads/FrogCMSContentManageSimplified_E103/frogcms_04.jpg"><img src="http://www.farfromfearless.com/wp-content/uploads/FrogCMSContentManageSimplified_E103/frogcms_04_thumb.jpg" alt="Files" width="540" height="322" /></a></p>
<h2>Features</h2>
<p>Here are some of the features from the website:</p>
<p><strong>Unlimited hierarchically structured page navigation menu</strong><br />
The page navigation menu provides critical information and functions. It allows you to perform quickly common actions on pages and shows how information has been organized.</p>
<p><strong>Drag and drop page ordering</strong><br />
This function simplifies the organization of your site’s pages. It makes new sorting arrangements of pages possible.</p>
<p><strong>Flexible page content: body, sidebar, extended, summary</strong><br />
Each page can have its own customized parts (divisions). It can be ‘extended’ text for news, or ‘summary’ for article: you can define whatever you want, whenever you want. These can even be used for extended metadata fields.</p>
<p><strong>Per page layout customization</strong><br />
Pages can have their own layout, or can inherit the layout of the parent page, or they can reuse another page layout. This allows the site owner to make every page look exactly as desired.</p>
<p><strong>Simple and reusable content snippets</strong><br />
You can define ‘snippets’: small pieces of content used across several pages, like page headers or footers, or contact info, etc. This means less cut-and-paste text in your pages. This will reduce your modification time when you need to add, remove or change the text in it.</p>
<h2>Other</h2>
<ul>
<li>Password protected administration.</li>
<li>Simple user and permission management.</li>
<li>File manager (plugin) allows you to upload, browse and edit files.</li>
</ul>
]]></content:encoded>
			<wfw:commentRss>http://www.farfromfearless.com/2008/11/10/frogcms-content-manage-simplified/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Best Practices for Determining Content Density for Websites.</title>
		<link>http://www.farfromfearless.com/2008/11/09/best-practices-for-determining-content-density-for-websites/</link>
		<comments>http://www.farfromfearless.com/2008/11/09/best-practices-for-determining-content-density-for-websites/#comments</comments>
		<pubDate>Mon, 10 Nov 2008 04:55:47 +0000</pubDate>
		<dc:creator>Chris Murphy</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Web Strategy]]></category>
		<category><![CDATA[Writing]]></category>
		<category><![CDATA[best practices]]></category>
		<category><![CDATA[copywriting]]></category>

		<guid isPermaLink="false">http://www.farfromfearless.com/2008/11/09/best-practices-for-determining-content-density-for-websites/</guid>
		<description><![CDATA[In a recent project I was asked to conceptualize a series of landing pages/micro sites for a product targeted at several verticals with two specific audiences. The ultimate goal behind the various landing pages was to gather metrics from A&#124;B testing of design and messaging with "conversion" as the definitive metric (don't get me started on that). The business goals and the project requirements aside, I hit one of those fundamental brick walls in web design: "Copy Overkill".]]></description>
			<content:encoded><![CDATA[<p>Well written content is an integral part of web-design as much as the actual design and code around and behind it. Good copy writing can better help a user determine the context of the page, find information quickly, and ultimately influence the decision-making process.</p>
<h2>Too Much of a Good Thing</h2>
<p>&#8220;Copy Overkill&#8221; is essentially the tendency to overload a single page with too much copy &#8212; too much information, and in some cases too much of the wrong type of information. In the landing page project I described, one of the elements required as part of the A|B testing was a series of marketing messages and follow-up content that were to be finely tuned for specific verticals.</p>
<p>The writer was given a set of wireframes with a series of &#8220;blocks&#8221; in which copy was to appear. What the web-designer received was a content deck overflowing with copy and precious little screen real estate to contain it all (including all other design elements).</p>
<p>Now, the typical first reaction of a writer who is unfamiliar with how copy works online is to say, &#8220;Well that&#8217;s your job as a designer &#8212; you go make it work&#8221;. The second is to vehemently argue the validity and importance of keeping every word that was written in the content deck.</p>
<p>You can likely imagine the reaction and the ensuing conflict between teams. This can quickly turn into a project manager&#8217;s headache.</p>
<h2>How Much is Too Much?</h2>
<p>It seems that nearly every project I have been involved with suffers from this tendency. I&#8217;m hoping that one day I&#8217;ll luck out and not have to deal with this again (one can dream); in the mean time, it is difficult for a designer to argue with a writer about how much is too much or the validity of their words on screen. To make things easier for both sides, here are some ABCs that can help to determine the copy density for a given page:</p>
<h3>Audience</h3>
<p>Who is the target audience?</p>
<p>This is a fundamental question that needs to be answered before a single line of copy is committed &#8212; a good communication brief (sometimes known as the &#8220;strategic brief&#8221;) should answer this, as it is likely one of the key bits of information that was gathered at the outset of the project.</p>
<p>Without getting into too much detail about demographics and psychographics, etc. there is a significant difference between how much information one group prefers in contrast to the other. Understanding the target audience is key in determining the amount and type of information <strong>they</strong> prefer when reading a page.</p>
<p>Remember, we&#8217;re writing for the web, not a novel &#8212; and since we&#8217;re on the topic writing for the web, remember to that each word is worth pennies.</p>
<p>I know of one writer who would throttle me for seemingly diminishing the value of his fine words; however, the fact is that every word that appears in strategic areas of a page is worth something, especially if the site is part of a campaign leveraging SEM (search engine marketing) as a traffic driver. Consider too that the right verb can spur a user to action and direct them into the process of converting from a prospect to a customer (aka &#8220;conversion&#8221;).</p>
<h3>Balance</h3>
<p>What is the best balance between Design and Copy?</p>
<p>Typography is a discipline in design that copywriters tend not to observe &#8212; for most, it&#8217;s not a part of their job function; however, it is something that writers who are developing copy for a web-audience should attempt to appreciate, since good typography can help form a strong visual path to the desired action.</p>
<p>Web Typography is not necessarily the same as Print Typography &#8212; the principles are similar, but the application is where there are glaring differences. Writers should also consider the other elements and features that make up a given page (branding, navigation, visuals, etc). These elements when combined, dramatically reduce the amount of space in which to work.</p>
<p>The issue of real estate is compounded by the fact that unlike print, the visible real estate on screen can vary wildly, and so a web-designer has to look at a page in terms of segments:</p>
<ol>
<li>33% for initial messaging and brand exposure.</li>
<li>33% for context and call to action.</li>
<li>33% for the granular details.</li>
</ol>
<p>The closest comparison would be that of daily news publications &#8212; there is only so much only so much space to identify the publication itself; only so much of the font page that can be devoted to the headline and visual; and only so much column space to deliver the story. On a newsstand this defines which paper a reader will choose.</p>
<p>I tend to invoke one rule that I carry over from my days in designing for editorial: &#8220;Write to fit&#8221;.</p>
<p>This rule shouldn&#8217;t be invoked frivolously. Editors invoke this as a measure of last resort when there is quite simply not enough room for all the words to work effectively. When it comes to the web, screen real estate is at a premium.</p>
<p><strong>Be prepared:</strong> This will sound cliché, but<em> </em>as a designer you need to <strong>show</strong> the writer why his copy is not working rather than <strong>tell</strong> him it is not working. The proof is almost always on screen, and no &#8212; 7px type is not an acceptable solution.</p>
<p><strong>Be sensitive:</strong> As with design, coming up with compelling copy is not an easy task &#8212; appreciate that a writer spends as much time agonizing over verbs as a designer spends over grids.</p>
<h3>Context</h3>
<p>Why is the user viewing your page, and how did they get there?</p>
<p>I&#8217;d like to think that every website is unique in some small way but the reality is often the opposite. The sheer volume of websites online today is staggering. Within a particular industry you might find thousands of similar sites, and within those sites a myriad of identical pages with each one saying the same thing as their competitor.</p>
<p>However your visitor (aka &#8220;prospect&#8221;) finds you, you need to understand the context around their visit.</p>
<p>If the particular page is part of a targeted campaign with an SEM strategy, you can expect that they&#8217;ve found your page through results or other traffic drivers purchased for that reason. This is a pre-defined path with an expected purpose and resulting set of actions (abandon or convert).</p>
<p>If a visitor comes to your site cold (e.g. no identifiable referral or metric), you can assume they are searching for &#8220;something&#8221;. You need to help the visitor determine what that &#8220;something&#8221; is &#8212; and quickly.</p>
<p>This is where copywriting comes into play. The behaviour for most users (especially if they&#8217;ve only stumbled onto your page), is to start scanning for key words and phrases that might help them orient themselves. I&#8217;m treading pretty close to talking about SEO here, but it&#8217;s unavoidable given the current topic.</p>
<p><strong>Some key considerations:</strong></p>
<ol>
<li>Your positioning statement or value proposition should answer their need &#8212; they came searching for something, so your content needs to address their query with an appropriate response.</li>
<li>Lighten up &#8212; dense blocks of copy are intimidating and visitors shy away from these in favour of bite-sized phrases and sentences. In web as with print, readers tend to &#8220;see&#8221; blocks of grey rather than areas with &#8220;lots of copy&#8221;.</li>
<li>Draw clear relationships between copy on page &#8212; clear communication builds trust, and showing strong relationships between blocks of information tells a user that your content is well thought out and authoritative. You&#8217;re not attempting to over-sell the subject of the page.</li>
</ol>
<p>There are at least half a dozen other factors that will help to determine if you resonate with the unknown visitor or not, but having the right amount of copy will help to make that task easier.</p>
<h2>Conclusion</h2>
<p>Finding the right balance between copy and design for a website is never going to be easy, and there will be  struggles between both, but it doesn&#8217;t have to always have to be this way. Consider how you can work with your writing to team to create an effective balance, and when push comes to shove, remember who it is you are writing for.</p>
<p>Here are some additional articles that I&#8217;ve found useful:</p>
<p><a title="The Elements of Style - by Christina Wodtke" href="http://www.boxesandarrows.com/view/the_elements_of" onclick="urchinTracker('/outgoing/www.boxesandarrows.com/view/the_elements_of?referer=');">The Elements of Style for Designers by Christina Wodtke</a></p>
<p><a title="Writing Content that Works for a Living" href="http://www.alistapart.com/articles/writingcontentthatworksforaliving" onclick="urchinTracker('/outgoing/www.alistapart.com/articles/writingcontentthatworksforaliving?referer=');">Writing Content that Works for a Living by Erin Kissane</a></p>
<p><a title="Reviving Anorexic Web Writing" href="http://www.alistapart.com/articles/revivinganorexicwebwriting" onclick="urchinTracker('/outgoing/www.alistapart.com/articles/revivinganorexicwebwriting?referer=');">Reviving Anorexic Web Writing</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.farfromfearless.com/2008/11/09/best-practices-for-determining-content-density-for-websites/feed/</wfw:commentRss>
		<slash:comments>9</slash:comments>
		</item>
		<item>
		<title>Sites That Inspire.</title>
		<link>http://www.farfromfearless.com/2008/11/06/sites-that-inspire/</link>
		<comments>http://www.farfromfearless.com/2008/11/06/sites-that-inspire/#comments</comments>
		<pubDate>Thu, 06 Nov 2008 22:10:09 +0000</pubDate>
		<dc:creator>Chris Murphy</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Inspiration]]></category>
		<category><![CDATA[WordPress]]></category>
		<category><![CDATA[concept art]]></category>
		<category><![CDATA[conceptartworld]]></category>
		<category><![CDATA[designsensory]]></category>
		<category><![CDATA[vewzi]]></category>
		<category><![CDATA[websites]]></category>

		<guid isPermaLink="false">http://www.farfromfearless.com/2008/11/06/sites-that-inspire/</guid>
		<description><![CDATA[<p>Like many folks in the advertising/creative industry, I&#8217;m experiencing what amounts to the Christmas rush &#8212; that fourth quarter (for my agency anyway) race to wrap up projects and get as much done before the end of the year as&#8230;</p>]]></description>
			<content:encoded><![CDATA[<p>Like many folks in the advertising/creative industry, I&#8217;m experiencing what amounts to the Christmas rush &#8212; that fourth quarter (for my agency anyway) race to wrap up projects and get as much done before the end of the year as possible.</p>
<p>It&#8217;s also about the same time each year that I start to feel a little burned out.</p>
<p>One of the things I like to do at the end of every year to keep a little spark of inspiration alive so this burn out doesn&#8217;t carry over into the next year is revisit my bookmarks. I collect a lot of sites, and half the time I never recall that I&#8217;ve come across it (or revisited it). Some of what I&#8217;ve collected no longer appeals to me, but there are a few gems in there that make me glad I hoard bookmarks.</p>
<h2>Here are a few:</h2>
<h3>ConceptArtWorld.com</h3>
<p>ConceptArtWorld is a collection of the industry&#8217;s leading concept artists from around the world. The site is a great example of of WordPress&#8217; publishing capabilities can be extended to create sites such as this. The overall design is understated to give prominence to the high-quality work of their featured artists.</p>
<p><a href="http://www.farfromfearless.com/wp-content/uploads/SitesThatInspire_D8C4/conceptartworld.jpg"><img src="http://www.farfromfearless.com/wp-content/uploads/SitesThatInspire_D8C4/conceptartworld_thumb.jpg" alt="conceptartworld" width="540" height="405" /></a></p>
<p>Visit it <a title="ConceptArtWorld.com" href="http://www.conceptartworld.com" onclick="urchinTracker('/outgoing/www.conceptartworld.com?referer=');">here</a>.</p>
<h3>Designsensory.com</h3>
<p>From their profile page: &#8220;The Designsensory team comprises well-rounded, imaginative and meticulous individuals practicing across a wide range of disciplines&#8230;&#8221;. This is the blog of an agency located in Knoxville, Tennessee. The rest of their site follows the same aesthetic; however, what attracted me to their blog in particular was just the sheer, unadorned simplicity of it all. The reliance on blocks of solid color, coupled with great use of white-space really makes this layout attractive for me.</p>
<p><a href="http://www.farfromfearless.com/wp-content/uploads/SitesThatInspire_D8C4/designsensory.jpg"><img src="http://www.farfromfearless.com/wp-content/uploads/SitesThatInspire_D8C4/designsensory_thumb.jpg" alt="designsensory" width="540" height="405" /></a></p>
<p>Visit them <a title="Designsensory.com" href="http://www.designsensory.com" onclick="urchinTracker('/outgoing/www.designsensory.com?referer=');">here</a>.</p>
<h3>Viewzi.com</h3>
<p>From their homepage: &#8220;Viewzi is a whole new way to experience search. Instead of one big list, you get nice visual <strong>Views</strong> tailored for the content you are looking for&#8230;&#8221;. Innovation is always fun to watch (and be a part of if you&#8217;re lucky). What I like about this site is that it immediately convey&#8217;s their message, &#8220;It&#8217;s all about the views!&#8221; &#8212; while not really wanting to jump on the Web 2.0 bandwagon, this site has some wonderful layouts such as their <a title="Viewzi Blog" href="http://corp.viewzi.com/index.php/v2/blog" onclick="urchinTracker('/outgoing/corp.viewzi.com/index.php/v2/blog?referer=');">blog</a> and <a title="About Viewzi" href="http://corp.viewzi.com/index.php/v2/about" onclick="urchinTracker('/outgoing/corp.viewzi.com/index.php/v2/about?referer=');">about</a> page.</p>
<p><a href="http://www.farfromfearless.com/wp-content/uploads/SitesThatInspire_D8C4/viewzi.jpg"><img src="http://www.farfromfearless.com/wp-content/uploads/SitesThatInspire_D8C4/viewzi_thumb.jpg" alt="viewzi" width="540" height="405" /></a></p>
<p>Visit them <a title="Viewzi.com" href="http://corp.viewzi.com/index.php/v2/about" onclick="urchinTracker('/outgoing/corp.viewzi.com/index.php/v2/about?referer=');">here</a>.</p>
<p>That&#8217;s it for now. I&#8217;m working on a nice little Christmas present for visitors this year &#8212; keep checking back.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.farfromfearless.com/2008/11/06/sites-that-inspire/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>How to BETTER Communicate Design Decisions to Clients</title>
		<link>http://www.farfromfearless.com/2008/07/23/how-to-better-communicate-design-decisions-to-clients/</link>
		<comments>http://www.farfromfearless.com/2008/07/23/how-to-better-communicate-design-decisions-to-clients/#comments</comments>
		<pubDate>Wed, 23 Jul 2008 20:27:39 +0000</pubDate>
		<dc:creator>Chris Murphy</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Developement]]></category>
		<category><![CDATA[Grrr]]></category>
		<category><![CDATA[Web Strategy]]></category>
		<category><![CDATA[Analytics]]></category>
		<category><![CDATA[guidelines]]></category>
		<category><![CDATA[Strategy]]></category>
		<category><![CDATA[Website Metrics]]></category>

		<guid isPermaLink="false">http://www.farfromfearless.com/?p=137</guid>
		<description><![CDATA[Communication is the cornerstone of building effective relationships. This is invariably true in business and when it comes to the business of website design and strategy, communication is critical.]]></description>
			<content:encoded><![CDATA[<p>In a recent recent article on Smashing Magazine, &#8220;<a title="How to communicate design decisions to clients" href="http://www.smashingmagazine.com/2008/07/22/how-to-communicate-design-decisions-to-clients/" onclick="urchinTracker('/outgoing/www.smashingmagazine.com/2008/07/22/how-to-communicate-design-decisions-to-clients/?referer=');">How to communicate design decisions to clients</a>&#8220;, writer <a title="Brian D. Armstrong" href="http://www.startbreakingfree.com/" onclick="urchinTracker('/outgoing/www.startbreakingfree.com/?referer=');">Brian D. Armstrong</a> laid out a five-point guideline on how to rationalize and present design for web-projects.</p>
<p>Mr. Armstrong opens with a fairly provocative statement:</p>
<blockquote><p>You may have noticed that in certain business and marketing circles there exists a <strong>“backlash” against the design community</strong>. Despite the rise of attractive, user-friendly solutions, in such circles unattractive designs have somehow managed to remain at the verge of acceptance.</p></blockquote>
<p>There are two things I would like to note about this broad-reaching statement: the backlash is not against the <strong>design community</strong>, but rather the <strong>agencies</strong>, <strong>vendors</strong>, and <strong>consultants</strong>. More specifically the backlash is a direct response to service-providers who are unable to provide solid end-to-end solutions to answer key business and marketing requirements.</p>
<p>Good or bad aesthetics aside, a business to business (B2B) or business to consumer (B2C) website that provides leads or successfully converts a prospect to a customer is more valuable by the simple fact that it does what it was intended to do: to market or to convert.</p>
<p>No amount of &#8220;business speak&#8221; by a <span style="text-decoration: line-through;">designer</span> agency/vendor/consultant can compensate for a poorly conceived product.</p>
<h2>&#8220;Pretty doesn’t mean effective: statistics are your friend!&#8221;</h2>
<p>Mr. Armstrong makes some good points in the article, the most notable &#8212; I believe &#8212; is this first guideline.</p>
<p>It is true that statistics are definitely your friend, but you have to be very careful on how you interpret the statistics.</p>
<p>The example given compares two websites from dramatically different industries. The first, <a title="2Advanced Studios" href="http://www.2advanced.com/" onclick="urchinTracker('/outgoing/www.2advanced.com/?referer=');">2Advanced Studios</a>, is a design firm while the second, <a title="Perry Marshall" href="http://www.perrymarshall.com/google/index.htm" onclick="urchinTracker('/outgoing/www.perrymarshall.com/google/index.htm?referer=');">Perry Marshall</a> is an author&#8217;s site. You might argue that they have similar business goals in mind, but the reality is that you cannot effectively compare these two businesses and glean true insight into what works and what does not.</p>
<p>Comparative statistics should be taken from competitor websites within the client&#8217;s industry or a related industry.</p>
<p>The adage: &#8220;What&#8217;s good for the goose&#8230;&#8221; does not apply here.</p>
<p>When refreshing an existing business website, your client will usually have a number of pre-conceived goals in mind.</p>
<p>The most typical goals are:</p>
<ul>
<li>Improve sales</li>
<li>Capture more leads</li>
<li>Build awareness (brand, industry issues, products &amp; solutions, etc).</li>
<li>Foster brand trust and build brand equity.</li>
</ul>
<p>Your client&#8217;s business goals should be your Rosetta Stone when interpreting and establishing your baseline metrics for success, and at this point aesthetics are a non-issue. This segues into Mr. Armstrong&#8217;s second guideline&#8230;</p>
<h2>&#8220;Every design should have a measurable goal&#8221;</h2>
<p>I have a particular issue with this statement:</p>
<blockquote><p>Saying that the goal is to “build the brand of XYZ” or “create an online presence” is basically meaningless to a business-minded person. <strong>A goal is only a goal if it is measurable</strong>.</p></blockquote>
<p>I agree that brand building might seem ephemeral and subjective, but there are quantifiable metrics for this &#8212; it <strong>does </strong>have meaning for a client.</p>
<p>A smart business will have clearly defined what constitutes effective brand recognition and build their brand&#8217;s equity on these definitions. The brand-building activities and their results are quantifiable (see &#8220;build brand awareness, Foster brand trust&#8230;&#8221;) &#8212; &#8220;Build the brand of XYZ&#8221; <strong>is</strong> a legitimate business goal.</p>
<p>That aside, &#8220;measurable goals&#8221; should be a reflection of the business goals, and if you can answer the challenge from a design perspective, and provide insight through incremental testing, etc. you will have built a stronger foundation for the client to determine their success metrics.</p>
<h2>&#8220;Your site should have one clear path&#8221;</h2>
<p>Mr. Armstrong suggests that:</p>
<blockquote><p>As a customer comes to your site, you want to be in complete control of the 1st thing they see, the 2nd, the 3rd, and all the way down until they accomplish your goal that you’ve set. In other words, they have entered your sites “funnel” or “chute”.</p></blockquote>
<p>In a perfect world we would all build sites that work on this principle. The reality is that entry points into a website vary from user to user, campaign to campaign, and search engine to search engine. The notion of strictly engineering the site to control your users and their behaviour is akin to trying to catch the wind.</p>
<p>On a business site, the most overlooked exercise is to determining what the audience wants from the website and compare it to what the website actually offers. What you should expect is a handful of common use-cases which illustrate the behaviour of the target audience and how they truly interact with the website.</p>
<p>If your client&#8217;s website offers only one service or product, then the primary audience will likely follow one common path, and Mr. Armstrong&#8217;s proposition can ring true; however, if your client&#8217;s website offer&#8217;s multiple products and solutions to several key audiences, the most effective thing you can do is develop a user-interaction strategy to help users qualify themselves quickly and funnel them to the right place regardless of their entry-point into the website.</p>
<p>E.g. from a user&#8217;s perspective: &#8220;I am this type of user, and I am looking for this type of content.&#8221;</p>
<p>Whatever strategy you take, the execution should remain simple, effectively changing the principle to : &#8220;Your site should drive your traffic effectively&#8221;.</p>
<h2>&#8220;Provide performance metrics&#8221;</h2>
<p>I would consider this an irresponsible statement:</p>
<blockquote><p>Finally, if you really want to impress business people, put together a little report of how a design performs. It doesn’t have to be fancy — maybe a little spreadsheet (those business types do love Excel) with some basic metrics you can pull off of Google Analytics like visitors, time on site, most popular funnel path, and even a goal conversion rate.</p></blockquote>
<p>I definitely agree that providing post-launch metrics are an effective means of helping to justify or support certain design decisions on a website, but this needs to be put into serious perspective: a responsible <span style="text-decoration: line-through;">designer </span>Agency/Vendor/Consultant will look first to ensure that the metrics support the design recommendations as it applies to the <strong>business goals</strong>.</p>
<p>To be clear: look to the business goals of the website FIRST &#8212; design decisions when it comes to websites should be considered with an eye towards <strong>better usability</strong> to support those business goals.</p>
<p>My biggest point of contention with this last guideline is that metrics are interpretive and can easily be used to disguise a poor architecture or site user-interaction strategy.</p>
<p>The value of certain metrics are largely determined by type of website, which in many cases is a reflection of the fundamental difference between a E-commerce website vs. a Lead Generation website. &#8220;Traffic Volume&#8221; for one site does not equate to &#8220;Lead Capture&#8221; on another.</p>
<p>Simply providing a spreadsheet and some screen captures is a easy way to obfuscate or skew the meaningful metrics. Be responsible and avoid polluting your client&#8217;s metrics without providing a deeper understand of the &#8216;why&#8217; behind the numbers.</p>
<h2>Conclusion</h2>
<p>What the last section of Mr. Armstrong&#8217;s article should have proposed is:</p>
<p>Much of the time, &#8220;business speak&#8221; can (and will likely) hamper true conversations and discussions around meeting business goals. I would suggest that rather than effect pretence, speak plainly.</p>
<p>When you are engaged with a client to develop or refresh their website, it is your responsibility to educate yourself and your client about what constitutes good design as it is applied to their project, and ultimately how the goals are quantified.</p>
<p>This is how an agency/vendor/consultant can add true value for a client.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.farfromfearless.com/2008/07/23/how-to-better-communicate-design-decisions-to-clients/feed/</wfw:commentRss>
		<slash:comments>6</slash:comments>
		</item>
		<item>
		<title>Twilight Saga WordPress Theme</title>
		<link>http://www.farfromfearless.com/2008/07/11/twilight-saga-wordpress-theme/</link>
		<comments>http://www.farfromfearless.com/2008/07/11/twilight-saga-wordpress-theme/#comments</comments>
		<pubDate>Fri, 11 Jul 2008 15:21:17 +0000</pubDate>
		<dc:creator>Chris Murphy</dc:creator>
				<category><![CDATA[Books]]></category>
		<category><![CDATA[Design]]></category>
		<category><![CDATA[Movies]]></category>
		<category><![CDATA[WordPress]]></category>
		<category><![CDATA[WordPress Themes]]></category>
		<category><![CDATA[Eclipse]]></category>
		<category><![CDATA[New Moon]]></category>
		<category><![CDATA[Stephanie Meyer Books]]></category>
		<category><![CDATA[Twilight]]></category>

		<guid isPermaLink="false">http://www.farfromfearless.com/?p=135</guid>
		<description><![CDATA[UPDATE (2008.08.27): I'm kind of embarrassed that I published this theme without performing any quality assurance. In any case, I’ve re-factored the markup from the ground up, and fixed many of the layout issues that were cropping up in the last build.  I also wanted to clarify a couple things: this theme uses PNG’s to take advantage of transparencies such that *modern* browsers are able render them properly; second, none of the themes I develop are widget-ready – I’ll get around to it some day; and hey if you want to take a shot at it – be my guest! 
The theme you will download is version 2.0. If you have an older version of the theme, please feel free to replace it. My apologies for the false start.]]></description>
			<content:encoded><![CDATA[<p>There are so many themes out there that just don&#8217;t seem to have much of a concept behind them, in fact most seem to be little more than decoration. I don&#8217;t think WordPress themes need to always have a concept behind them, but the ones that do tend to stick around longer. I had a bit of downtime a little while ago and I wanted to create a WordPress Theme that had a little bit more of unified concept.</p>
<p>At the time <a title="Stephanie Meyer" href="http://en.wikipedia.org/wiki/Stephenie_Meyer" onclick="urchinTracker('/outgoing/en.wikipedia.org/wiki/Stephenie_Meyer?referer=');">Stephanie Meyer</a> had just released the third book in her debut series, the <a title="Twilight Saga - Official Site" href="http://www.thetwilightsaga.com/books/book-series" onclick="urchinTracker('/outgoing/www.thetwilightsaga.com/books/book-series?referer=');">&#8220;Twilight Saga&#8221;</a>, and I had admired the book covers while browsing through my local Chapters bookstore.</p>
<p>There are so many books that hit the shelves these days that covers just start to blend together into one big mottled wallpaper. So it was a mild surprise when I encountered the stark black and minimalist cover designs.</p>
<p><a href="http://www.farfromfearless.com/wp-content/uploads/TwilightSagaWordPressTheme_14BCE/book1.jpg"><img src="http://www.farfromfearless.com/wp-content/uploads/TwilightSagaWordPressTheme_14BCE/book1_thumb.jpg" alt="book1" width="175" height="264" /></a> <a href="http://www.farfromfearless.com/wp-content/uploads/TwilightSagaWordPressTheme_14BCE/book2.jpg"><img src="http://www.farfromfearless.com/wp-content/uploads/TwilightSagaWordPressTheme_14BCE/book2_thumb.jpg" alt="book2" width="175" height="262" /></a> <a href="http://www.farfromfearless.com/wp-content/uploads/TwilightSagaWordPressTheme_14BCE/book3.jpg"><img src="http://www.farfromfearless.com/wp-content/uploads/TwilightSagaWordPressTheme_14BCE/book3_thumb.jpg" alt="book3" width="175" height="264" /></a></p>
<h2>The Twilight Theme</h2>
<p>Inspired by this, I decided to design and develop a WordPress Theme based on the book covers.</p>
<p><a href="http://www.farfromfearless.com/wp-content/uploads/TwilightSagaWordPressTheme_14BCE/twlight.jpg"><img src="http://www.farfromfearless.com/wp-content/uploads/TwilightSagaWordPressTheme_14BCE/twlight_thumb.jpg" alt="twlight" width="540" height="540" /></a></p>
<h2>Variations</h2>
<p>I thought I would have been satisfied with using only one of the book covers as inspiration, but the more I worked on it, the more I felt that I couldn&#8217;t settle with just one. On top of that, I think anyone who would have been interested in using the theme would likely have a favourite cover graphic other than the one I preferred most.</p>
<p>Here are some variations of the same WordPress theme. It didn&#8217;t take much (CSS is awesome), and I even went as far as to allow customization with quick modification of one of the theme files.</p>
<p><a href="http://www.farfromfearless.com/wp-content/uploads/TwilightSagaWordPressTheme_14BCE/wp_theme_twilight.jpg"><img src="http://www.farfromfearless.com/wp-content/uploads/TwilightSagaWordPressTheme_14BCE/wp_theme_twilight_thumb.jpg" alt="wp_theme_twilight" width="175" height="113" /></a> <a href="http://www.farfromfearless.com/wp-content/uploads/TwilightSagaWordPressTheme_14BCE/wp_theme_newmoon.jpg"><img src="http://www.farfromfearless.com/wp-content/uploads/TwilightSagaWordPressTheme_14BCE/wp_theme_newmoon_thumb.jpg" alt="wp_theme_newmoon" width="175" height="113" /></a> <a href="http://www.farfromfearless.com/wp-content/uploads/TwilightSagaWordPressTheme_14BCE/wp_theme_eclipse.jpg"><img src="http://www.farfromfearless.com/wp-content/uploads/TwilightSagaWordPressTheme_14BCE/wp_theme_eclipse_thumb.jpg" alt="wp_theme_eclipse" width="175" height="113" /></a></p>
<p>Now WordPress authors can use either one of these themes. There&#8217;s a fourth book that is coming out: <a title="Stephanie Meyer - Breaking Dawn" href="http://www.stepheniemeyer.com/breakingdawn.html" onclick="urchinTracker('/outgoing/www.stepheniemeyer.com/breakingdawn.html?referer=');">&#8220;Breaking Dawn&#8221;</a> which I will try to add to this series at a later date.</p>
<h2>Download</h2>
<p>Okay, so I&#8217;ve rambled on enough, <a title="Twilight, Eclipse, and New Moon WordPress Theme" href="http://www.farfromfearless.com/fff-theme/WP_Twilight_Theme_v2_0_1.zip">Download the WordPress &#8211; Twilight Theme v2.0.1</a>.</p>
<h3>Notes</h3>
<p><strong>BIG FYI: It looks like the comment&#8217;s code is missing from this build. I will work on getting that re-implemented tonight. My applogies for the inconvenience!</strong></p>
<p>If you want to modify the graphic to achive either of the variations above, all you have to do is find the file &#8220;settings.php&#8221; in the Twilight theme folder (includes/settings.php), and edit the following snippet at the very beginning of the file:</p>
<pre>// use either "twilight" or "eclipse" or "newmoon" to customize which graphic to show
$THEME_GRAPHIC = 'eclipse';</pre>
<p>This theme is built on the same basic framework as my current <a title="Download Lemon Twist" href="http://www.farfromfearless.com/2008/01/11/lemon-twist-v20-updated-wordpress-theme/">Lemon Twist Theme</a>. As such, you will likely want to install a few WordPress plugins that work with this theme, so take a look through this <a title="README FIRST!!!!" href="http://www.farfromfearless.com/xmas_2007/lemon_twist_readme.txt">README</a> file.</p>
<p>If you are running into errors when applying the theme, it is likely that a plugin is missing and is causing the problem. If you encounter this, check out the &#8220;includes&#8221; directory and modify any of the offending includes in the &#8220;sidebar&#8221; sub directory.</p>
<p>Still at a loss? <a title="Contact me." href="http://www.farfromfearless.com/contact/">Contact me</a>.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.farfromfearless.com/2008/07/11/twilight-saga-wordpress-theme/feed/</wfw:commentRss>
		<slash:comments>202</slash:comments>
		</item>
		<item>
		<title>Separating the creative from the technical in web-design.</title>
		<link>http://www.farfromfearless.com/2008/06/24/separating-the-creative-from-the-technical-in-web-design/</link>
		<comments>http://www.farfromfearless.com/2008/06/24/separating-the-creative-from-the-technical-in-web-design/#comments</comments>
		<pubDate>Wed, 25 Jun 2008 04:45:17 +0000</pubDate>
		<dc:creator>Chris Murphy</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Developement]]></category>
		<category><![CDATA[General]]></category>
		<category><![CDATA[challenge]]></category>
		<category><![CDATA[Creative]]></category>
		<category><![CDATA[solutions]]></category>
		<category><![CDATA[technical]]></category>

		<guid isPermaLink="false">http://www.farfromfearless.com/2008/06/24/separating-the-creative-from-the-technical-in-web-design/</guid>
		<description><![CDATA[The first lesson I learned when I started in web-design was that it was extremely difficult to separate the technical from the creative. This is the foundation of my design philosophy and something that comes up now and then in discussions around what it means to "do better work". Over the years, and with the rapid advances in web-technologies, the notion of "extremely difficult" has evolved into "extremely naive".]]></description>
			<content:encoded><![CDATA[<p>Web-design in all it myriad forms, can be characterized as the marriage of creative vision and technical implementation. But it is the limitations and resulting solutions for what can be achieved technically that &#8212; to me &#8212; is the truest definition.</p>
<p>Understandably, this is a touchy standpoint to take depending on who you talk to. From a design and creative perspective, one could argue that it&#8217;s all about the ideas; and from a development perspective, one could argue, equally, that the technology drives the creative.</p>
<p>I don&#8217;t see that either argument is truly wrong; rather, it has been my experience that creative ideas that steam ahead without regard for the technology required to execute the idea, have typically run amok. This is a lesson that I&#8217;m forced to re-iterate whenever I start on a new project.</p>
<h2>The road to project hell</h2>
<p>When I&#8217;m involved in any sort of discussion around creative for online media, one of my first questions is always, &#8220;how is it supposed to work?&#8221;</p>
<p>Depending on how that question is answered, three typical scenarios arise:</p>
<ol>
<li>People will hedge around the issue of technology and gloss over it with a dismissive, &#8220;let&#8217;s address that later &#8212; this is creative discussion,&#8221; response.</li>
<li>The &#8220;build it and they will come&#8221; syndrome rears its ugly head once again (this is, by far,  my personal favourite and one that I&#8217;d put money on if the occasion presents itself).</li>
<li>Technical members of a team are conveniently uninvited from the next few meetings until the concept is baked, and only once it&#8217;s ready to go into development are they brought back into the mix.</li>
</ol>
<p>Follow any of the above scenarios &#8212; unimpeded &#8212; to their natural conclusion, and the result is an uncomfortable, awkward discussion with the client about how the concept needs to be revisited.</p>
<p>This is the not-so-fun part where I usually get dragged back into the mix to help sort things out. For some reason &#8212; and despite my best efforts &#8212; the same issues come up time and again.</p>
<p>(At this point I usually excuse myself for a sanity check.)</p>
<p>Seriously, how many awkward client conversations does it take for folks to realize the pattern? How much more of a projects&#8217; profit margin need to be consumed before the red flags start to go up? What about the impact to public/client perception of the creative company as a whole?</p>
<h2>Rock the boat</h2>
<p>When it comes to online media, it is naive to foster the notion that separating the creative from the technical is sound practice.</p>
<p>If you find yourself in a scenario such as the ones I mentioned earlier, consider the following:</p>
<ol>
<li>Challenge the assumptions and address the issue head-on. There are solid technical solutions to creative challenges, and just because the problem cannot be solved one way does not immediately discount the possibility of it being solved in some other manner. Engage the creative process with a healthy amount of pragmatism.</li>
<li>Web-projects need strategy, planning, and enough time to execute effectively. Very few online experiences/applications are instant hits. The rare ones that are (<a href="http://www.twitter.com" onclick="urchinTracker('/outgoing/www.twitter.com?referer=');">Twitter</a>, <a href="http://www.facebook.com" onclick="urchinTracker('/outgoing/www.facebook.com?referer=');">FaceBook</a>, <a href="http://www.basecamphq.com" onclick="urchinTracker('/outgoing/www.basecamphq.com?referer=');">BaseCamp</a>, etc), have strategy and planning behind them, each with enough time to evolve. Do not be afraid to play the devil&#8217;s advocate and ask the tough questions.</li>
<li>Designing and conceptualizing in a silo is rarely ever effective. External input (partial or impartial) can be the difference between having to call a client and tell them you can&#8217;t execute on what you proposed, and taking the kernel of an idea and pushing it in a direction previously not considered. Keep your technical team involved as much as possible &#8212; they are the last ones who have to execute the concept.</li>
</ol>
<p>When asked, this is how I consider being able to &#8220;do better work&#8221;:</p>
<p>If a creative team can accept the notion that separating the creative from the technical is folly, the possibility of conceptualizing better ideas and solutions (stronger creative) is all the more tangible.</p>
<p>Perhaps I am over-simplifying the issue (clients do play a big role in contributing to the issue as well), and there are many other considerations, but all of that aside, at some point common sense needs to prevail.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.farfromfearless.com/2008/06/24/separating-the-creative-from-the-technical-in-web-design/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>Working at an Advertising Agency or a Boutique Shop &#8211; which option is better?</title>
		<link>http://www.farfromfearless.com/2008/03/18/working-at-an-advertising-agency-or-a-boutique-shop-which-option-is-better/</link>
		<comments>http://www.farfromfearless.com/2008/03/18/working-at-an-advertising-agency-or-a-boutique-shop-which-option-is-better/#comments</comments>
		<pubDate>Tue, 18 Mar 2008 19:16:44 +0000</pubDate>
		<dc:creator>Chris Murphy</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Developement]]></category>
		<category><![CDATA[Grrr]]></category>
		<category><![CDATA[Agencies]]></category>
		<category><![CDATA[Creative]]></category>
		<category><![CDATA[Development]]></category>
		<category><![CDATA[Internships]]></category>
		<category><![CDATA[Work Experience]]></category>

		<guid isPermaLink="false">http://www.farfromfearless.com/2008/03/18/working-at-an-advertising-agency-or-a-boutique-shop-which-option-is-better/</guid>
		<description><![CDATA[It's internship season again and the queries are starting to flow in greater numbers. One of the most frequently asked questions I hear from students is, "am I better off working at an ad agency or a boutique shop?" This is usually followed up by, "is one better than the other?"]]></description>
			<content:encoded><![CDATA[<p>With all the stiff competition for limited placements in agencies, it&#8217;s not difficult to understand the concern over wanting to work for the best and at the best creative agency. To confuse students further, they now have much more to choose from in terms of creative agencies &#8212; so much so that it is more difficult to draw a clear distinction between a traditional ad agency and a boutique shop when it comes to web.</p>
<p>The creative industry has seen an incredible upsurge in companies adding &#8220;interactive&#8221; to their service offering, and along with that we have a number of other vendor companies which bill themselves as agencies with similar services.</p>
<p>If you are a student, you may want to consider that the idea of &#8220;working for the best&#8221; is more of a matter of determining where you can best hone your craft &#8212; in this case, web design or development.</p>
<h4>Is there a difference?</h4>
<p>Yes. But let&#8217;s take a step back for a moment and take a look at the question holistically.</p>
<p>The creative industry is comprised of many players, but you can draw a clean line right down the middle &#8212; I can say this because I&#8217;ve been on both side of that industry line.</p>
<p>The players fall into two distinct categories: the traditional Advertising Agency, and the Boutique Shops (vendors).</p>
<p>In the past, it was possible to make a distinction based on their portfolios, but given the current state of the creative industry, we need to consider what makes an ad agency versus what makes a boutique shop.</p>
<p>For the most part, ad agencies have a much broader service offering than a boutique shop. A traditional ad agency will typically offer their clients such services as: branding, messaging, conceptualization, and design. These types of agencies bill themselves as a &#8220;full service&#8221; agency as most of them include additional services like &#8220;media buying&#8221;. A full service agency also has the added benefit of several organization layers &#8212; management specifically designed to handle a large volume of projects.</p>
<p>The service offering of a Boutique Shop is considerably less. In most cases, a Boutique Shop will offer only a fraction of the services which an ad agency supports. The services are typically design, development, broadcast, post-production, etc. Companies like this have chosen to specialize in one field or another and offer their specializations to larger companies who outsource to them. A Boutique Shop does not [always] have the organizational layers to handle volume.</p>
<p>When it comes to Interactive Services such as web design and development &#8212; this includes flash, application programming, etc, &#8212; ad agencies typically rely on outsource partners to provide that specialization.</p>
<p>At this point I can already see the emails coming in to argue this particular point, but let me say this much: ad agencies can often provide &#8220;Interactive Services&#8221; through internal web-teams, but most of them do not. This as more to do with their particular focus in the industry (traditional media, print, etc).</p>
<h4>Why the distinction?</h4>
<p>The distinction has less to do with size than it does with capabilities. More specifically, it&#8217;s about the creative.</p>
<p>Advertising agencies want to own the creative on every level. Quality is obviously important, but the execution is not something they want to concern themselves with most times. The capabilities of an advertising agency are quite considerable, but again, this all relies upon their outsourcing relationships &#8212; printers, media, etc. An ad agency relies on the specializations of a vendor to help them execute a concept.</p>
<p>Boutique shops typically do not have the capability to execute a fully integrated campaign on a national level let alone a global scale. That is not to say that they can&#8217;t leverage serious partnerships to allow them to do that, but even then the campaigns are limited in scope &#8212; mostly online with limited if any offline components.</p>
<p>Interactive boutique shops know this. Quite honestly, most of them appear to be quite happy with this distinction. There are certain financial and client-related constraints which boutique shops do not have to worry about simply because they typically will not encounter them. On the flip side, you get the few who attempt to bill themselves as a full service &#8220;agency&#8221;. Well, nobody is being fooled, least of all the client (if they&#8217;re smart).</p>
<p>Don&#8217;t get me wrong &#8212; a boutique shop can be creative and have great ideas. Sometimes those ideas resonate so strongly that they propagate into a campaign idea or platform, which may or may not turn into a national or global campaign. But you get the idea.</p>
<p>Suffice it to say that what a boutique shop does is execute on components of a campaign. A boutique shop can do this quickly where ad agencies with internal web development teams might take longer &#8212; specializations remember?</p>
<h4>Which is better?</h4>
<p>Neither is better … or worse.</p>
<p>Ad agencies offer tremendous opportunity for creative development, where as a boutique shop might offer better opportunity for technical development. For students, an internship is an opportunity to challenge the way you think and work, and ultimately what you&#8217;ve learned. If you are a student, you may want to consider the company which offers you the best experience in terms of professional growth and opportunity, and not necessarily what looks best on a resume.</p>
<p>When it comes to interactive &#8212; web design and development &#8212; I strongly suggest interning with a creative company which will challenge the skills and theories you&#8217;ve learned in school. The work you may encounter as an intern is a direct reflection of the capabilities of a creative company (ad agency or boutique shop), so make the determination based on what you might end up working on, and what you can walk away with.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.farfromfearless.com/2008/03/18/working-at-an-advertising-agency-or-a-boutique-shop-which-option-is-better/feed/</wfw:commentRss>
		<slash:comments>13</slash:comments>
		</item>
		<item>
		<title>WordPress Theme Design Part 3: Color and Contrast</title>
		<link>http://www.farfromfearless.com/2008/01/24/wordpress-theme-design-part-3-color-and-contrast/</link>
		<comments>http://www.farfromfearless.com/2008/01/24/wordpress-theme-design-part-3-color-and-contrast/#comments</comments>
		<pubDate>Thu, 24 Jan 2008 20:18:02 +0000</pubDate>
		<dc:creator>Chris Murphy</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Developement]]></category>
		<category><![CDATA[Tutorial]]></category>
		<category><![CDATA[WordPress]]></category>
		<category><![CDATA[WordPress Themes]]></category>
		<category><![CDATA[Color]]></category>
		<category><![CDATA[Color Schemes]]></category>

		<guid isPermaLink="false">http://www.farfromfearless.com/2008/01/24/wordpress-theme-design-part-3-color-and-contrast/</guid>
		<description><![CDATA[In previous articles, I have written about colour and its importance when it comes to design. Since we're discussing design as it applies to WordPress themes, I thought it appropriate to revist the topic.]]></description>
			<content:encoded><![CDATA[<p>Color selection can be troublesome especially when it comes to designing for yourself. WordPress themes are no exception, and the exercise itself is possibly one of the more challenging aspects of creating a new theme. When it comes to design in general, there are some basic guidelines that you can follow to make things a little easier.</p>
<p>In my previous article &#8220;<a href="http://www.farfromfearless.com/2006/11/16/getting-emo-with-color/" title="Getting emo with color" target="_blank">Getting emo with color</a>&#8221; I discussed the benefits of understanding the emotional impact of color.</p>
<blockquote><p>&#8230;think about how certain colors can provoke a response. A combination of responses creates an experience. So when we design with color, what we’re really doing is designing an experience. So before you start mashing pixels together in your next design, ask yourself this one question: “What kind of experience do I want to create?” <a href="http://www.farfromfearless.com/2006/11/16/getting-emo-with-color/" title="Getting emo with color" target="_blank">Source: &#8220;Getting emo with color&#8221;</a></p></blockquote>
<p>When you&#8217;re designing your WordPress theme, consider what kind of experience you want your readers to have. This goes back to <a href="http://www.farfromfearless.com/2008/01/18/wordpress-theme-design-part-2-typography/" title="WordPress Theme Design Part 2: Web Typography" target="_blank">Part 2</a> of this series where I suggested asking yourself which type of blogger/writer you considered yourself. Knowing that is part of understanding how to develop an experience for your readers. If your articles are verbose then you may want to consider a color scheme that allows better readability over a longer period of time, or if you are brief, then a more flexible color scheme may be considered.</p>
<h4>A emotional user experience</h4>
<p>Color influences the User Experience in ways you might not immediately consider, and while color affects people in various ways, there are some generally accepted understandings:</p>
<ul>
<li>High-energy colors &#8212; colors that fall in the warmer part of the spectrum &#8212; tend to make readers feel restless. Certain combinations of colors can make readers feel agitated and that reflects in the amount of time they are willing to spent on a given page.</li>
<li>Low-energy colors &#8212; colors which fall in the cooler part of the spectrum &#8212; tend to leave readers feeling passive. Again, this is not necessarily a good thing as you are not engaging the reader (let&#8217;s hope your content is engaging).</li>
<li>Neutral colors &#8212; colors which are neither warm nor cool &#8212; make for a bland experience.</li>
</ul>
<p>Here are some examples of color schemes to illustrate color temperature. Keep in mind that not all of these sample pallets translate well for a design, but they are a good foundation to build on.</p>
<p><strong>Warm Colors:</strong></p>
<p><a href="http://www.colourlovers.com/palette/262435/affectionately" onclick="urchinTracker('/outgoing/www.colourlovers.com/palette/262435/affectionately?referer=');"><img src="http://www.farfromfearless.com/wp-content/uploads/WordPressThemeDesignPart3_ABD6/affectionately.png" alt="affectionately" height="124" width="175" /></a> <a href="http://www.colourlovers.com/palette/257681/Alienor" onclick="urchinTracker('/outgoing/www.colourlovers.com/palette/257681/Alienor?referer=');"><img src="http://www.farfromfearless.com/wp-content/uploads/WordPressThemeDesignPart3_ABD6/Alienor.png" alt="Alienor" height="124" width="175" /></a> <a href="http://www.colourlovers.com/palette/213494/Hot_spice" onclick="urchinTracker('/outgoing/www.colourlovers.com/palette/213494/Hot_spice?referer=');"><img src="http://www.farfromfearless.com/wp-content/uploads/WordPressThemeDesignPart3_ABD6/Hot_spice.png" alt="Hot_spice" height="124" width="175" /></a> <a href="http://www.colourlovers.com/palette/260803/Mr._Camo_Pants" onclick="urchinTracker('/outgoing/www.colourlovers.com/palette/260803/Mr._Camo_Pants?referer=');"><img src="http://www.farfromfearless.com/wp-content/uploads/WordPressThemeDesignPart3_ABD6/Mr._Camo_Pants.png" alt="Mr._Camo_Pants" height="124" width="175" /></a> <a href="http://www.colourlovers.com/palette/262466/S%C3%A6vik" onclick="urchinTracker('/outgoing/www.colourlovers.com/palette/262466/S_C3_A6vik?referer=');"><img src="http://www.farfromfearless.com/wp-content/uploads/WordPressThemeDesignPart3_ABD6/Svik.png" alt="Sævik" height="124" width="175" /></a> <a href="http://www.colourlovers.com/palette/261965/Sphinx" onclick="urchinTracker('/outgoing/www.colourlovers.com/palette/261965/Sphinx?referer=');"><img src="http://www.farfromfearless.com/wp-content/uploads/WordPressThemeDesignPart3_ABD6/Sphinx.png" alt="Sphinx" height="124" width="175" /></a></p>
<p><strong>Cool Colors:</strong></p>
<p><a href="http://www.colourlovers.com/palette/262429/The_Lonely_Palm_Tree" onclick="urchinTracker('/outgoing/www.colourlovers.com/palette/262429/The_Lonely_Palm_Tree?referer=');"><img src="http://www.farfromfearless.com/wp-content/uploads/WordPressThemeDesignPart3_ABD6/The_Lonely_Palm_Tree.png" alt="The_Lonely_Palm_Tree" height="124" width="175" /></a> <a href="http://www.colourlovers.com/palette/261046/from_pink_to_blue" onclick="urchinTracker('/outgoing/www.colourlovers.com/palette/261046/from_pink_to_blue?referer=');"><img src="http://www.farfromfearless.com/wp-content/uploads/WordPressThemeDesignPart3_ABD6/from_pink_to_blue1.png" alt="from_pink_to_blue-1" height="124" width="175" /></a> <a href="http://www.colourlovers.com/palette/213487/You_were_saying" onclick="urchinTracker('/outgoing/www.colourlovers.com/palette/213487/You_were_saying?referer=');"><img src="http://www.farfromfearless.com/wp-content/uploads/WordPressThemeDesignPart3_ABD6/You_were_saying.png" alt="You_were_saying" height="124" width="175" /></a> <a href="http://www.colourlovers.com/palette/235767/Blow_Away" onclick="urchinTracker('/outgoing/www.colourlovers.com/palette/235767/Blow_Away?referer=');"><img src="http://www.farfromfearless.com/wp-content/uploads/WordPressThemeDesignPart3_ABD6/Blow_Away1.png" alt="Blow_Away-1" height="124" width="175" /></a> <a href="http://www.colourlovers.com/palette/255052/market_pepper" onclick="urchinTracker('/outgoing/www.colourlovers.com/palette/255052/market_pepper?referer=');"><img src="http://www.farfromfearless.com/wp-content/uploads/WordPressThemeDesignPart3_ABD6/market_pepper.png" alt="market_pepper" height="124" width="175" /></a> <a href="http://www.colourlovers.com/palette/3330/TrendyRobe" onclick="urchinTracker('/outgoing/www.colourlovers.com/palette/3330/TrendyRobe?referer=');"><img src="http://www.farfromfearless.com/wp-content/uploads/WordPressThemeDesignPart3_ABD6/TrendyRobe.png" alt="TrendyRobe" height="124" width="175" /></a></p>
<p><strong>Neutral Colors:</strong></p>
<p><a href="http://www.colourlovers.com/palette/262452/Bad_News" onclick="urchinTracker('/outgoing/www.colourlovers.com/palette/262452/Bad_News?referer=');"><img src="http://www.farfromfearless.com/wp-content/uploads/WordPressThemeDesignPart3_ABD6/Bad_News.png" alt="Bad_News" height="124" width="175" /></a> <a href="http://www.colourlovers.com/palette/213483/Blind_man_dream" onclick="urchinTracker('/outgoing/www.colourlovers.com/palette/213483/Blind_man_dream?referer=');"><img src="http://www.farfromfearless.com/wp-content/uploads/WordPressThemeDesignPart3_ABD6/Blind_man_dream.png" alt="Blind_man_dream" height="124" width="175" /></a> <a href="http://www.colourlovers.com/palette/262467/Dream_Home" onclick="urchinTracker('/outgoing/www.colourlovers.com/palette/262467/Dream_Home?referer=');"><img src="http://www.farfromfearless.com/wp-content/uploads/WordPressThemeDesignPart3_ABD6/Dream_Home.png" alt="Dream_Home" height="124" width="175" /></a> <a href="http://www.colourlovers.com/palette/246892/Green_Envy" onclick="urchinTracker('/outgoing/www.colourlovers.com/palette/246892/Green_Envy?referer=');"><img src="http://www.farfromfearless.com/wp-content/uploads/WordPressThemeDesignPart3_ABD6/Green_Envy.png" alt="Green_Envy" height="124" width="175" /></a> <a href="http://www.colourlovers.com/palette/257623/in_the_earth" onclick="urchinTracker('/outgoing/www.colourlovers.com/palette/257623/in_the_earth?referer=');"><img src="http://www.farfromfearless.com/wp-content/uploads/WordPressThemeDesignPart3_ABD6/in_the_earth.png" alt="in_the_earth" height="124" width="175" /></a> <a href="http://www.colourlovers.com/palette/234744/Missed" onclick="urchinTracker('/outgoing/www.colourlovers.com/palette/234744/Missed?referer=');"><img src="http://www.farfromfearless.com/wp-content/uploads/WordPressThemeDesignPart3_ABD6/Missed.png" alt="Missed" height="124" width="175" /></a></p>
<p><strong>Note:</strong> All samples were taken from <a href="http://www.colourlovers.com/" title="COLORLovers" target="_blank" onclick="urchinTracker('/outgoing/www.colourlovers.com/?referer=');">COLOURLovers</a>.</p>
<h4>Contrast is key</h4>
<p>Take a look through <a href="http://www.smashingmagazine.com/2008/01/08/100-excellent-free-high-quality-wordpress-themes/" title="100 Excellent Free WordPress Themes" target="_blank" onclick="urchinTracker('/outgoing/www.smashingmagazine.com/2008/01/08/100-excellent-free-high-quality-wordpress-themes/?referer=');">SmashingMagazine.com&#8217;s collection of WordPress themes</a>. What you&#8217;ll notice is that the color palettes fall equally on both sides of the spectrum (with a bare handful that are monochromatic). But what you may not immediately recognize is that each of them employs contrast to a high degree.</p>
<p>Contrast is a tool that works well to deliver focus add tension in a design. Developing contrast is not always as straightforward as designating a big block of white space (literally) as the content area. In order to develop a good balance between your color scheme and necessary contrast for your readers, you need to figure out a few things:</p>
<ul>
<li>On average, how long are your articles? The longer the article, the longer it takes for your readers to consume it. In a case like this, low contrast makes it quite difficult for a reader to maintain their attention and adds undue physiological strain.</li>
<li>Is there functionality or features in your sidebar that are absolutely integral to the reading experience. I&#8217;m not only talking about ad space here, I&#8217;m also talking about search features, or a list of recent or related articles, links, etc. If the sidebar features are not integral to the reading experience, you may want to make sure they recede into the background through lower contrast.</li>
<li>What is relevant in terms of content? Do you want your latest article to stand out from the rest? Consider that readers interested in your blog will be visiting through varying methods(RSS, Organic Search, Track-backs, etc.), which means you may want to ensure they get what they are looking for quickly.</li>
</ul>
<h4>Tools of the trade</h4>
<p>In my previous article, &#8220;<a href="http://www.farfromfearless.com/2006/11/16/getting-emo-with-color/" title="Getting emo with color" target="_blank">Getting emo with color</a>&#8220;, I mentioned a few tools that can help you in developing color schemes. Here is a site that I personally love: <a href="http://www.colourlovers.com/" title="COLORLovers" target="_blank" onclick="urchinTracker('/outgoing/www.colourlovers.com/?referer=');">COLOURLovers</a>.</p>
<p>The samples generated by the community are great to experiment with and it also helps to see what others are doing as well. But be careful, these are color schemes and do not necessarily reflect a real-world application, just an aesthetic.</p>
<p>Fortunately, there are tools out there that can help you in terms of gauging contrast. Take a look at Jon Snook&#8217;s &#8220;<a href="http://snook.ca/archives/accessibility_and_usability/colour_color_co/" title="Color (color) contrast check" target="_blank" onclick="urchinTracker('/outgoing/snook.ca/archives/accessibility_and_usability/colour_color_co/?referer=');">Colour (color) contrast check</a>&#8221; article. Jon provides a nifty little utility for evaluating the contrast of your color selections. The example page lists two other utilities which you can play around with as well. <a href="http://www.456bereastreet.com/archive/200709/10_colour_contrast_checking_tools_to_improve_the_accessibility_of_your_design/" title="10 colour contrast checking tools to improve the accessibility of your design" target="_blank" onclick="urchinTracker('/outgoing/www.456bereastreet.com/archive/200709/10_colour_contrast_checking_tools_to_improve_the_accessibility_of_your_design/?referer=');">456Bereastreet.com complied a list of additional utilities</a> which are both desktop and web applications.</p>
<p>I can&#8217;t tell you which color schemes work best &#8212; that is for you to decide; however, I can tell you that regardless of the color scheme you end up with, it is wise to ensure that you provide contrast in the right places for the right reason. Understand your goals and design accordingly.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.farfromfearless.com/2008/01/24/wordpress-theme-design-part-3-color-and-contrast/feed/</wfw:commentRss>
		<slash:comments>8</slash:comments>
		</item>
		<item>
		<title>WordPress Theme Design Part 2: Web Typography</title>
		<link>http://www.farfromfearless.com/2008/01/18/wordpress-theme-design-part-2-typography/</link>
		<comments>http://www.farfromfearless.com/2008/01/18/wordpress-theme-design-part-2-typography/#comments</comments>
		<pubDate>Fri, 18 Jan 2008 22:13:49 +0000</pubDate>
		<dc:creator>Chris Murphy</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Developement]]></category>
		<category><![CDATA[Tutorial]]></category>
		<category><![CDATA[WordPress]]></category>
		<category><![CDATA[WordPress Themes]]></category>
		<category><![CDATA[Layout]]></category>
		<category><![CDATA[Theme Design]]></category>
		<category><![CDATA[Typographic Color]]></category>
		<category><![CDATA[Typography]]></category>

		<guid isPermaLink="false">http://www.farfromfearless.com/2008/01/18/wordpress-theme-design-part-2-typography/</guid>
		<description><![CDATA[WordPress theme design -- like most disciplines in web design -- bridges many fields of contemporary graphic design. I say that lightly since web design as a discipline involves many other aspects uncommon to traditional graphic design. However, that does not immediately exempt web designers from certain priciples such as those which govern good typography.]]></description>
			<content:encoded><![CDATA[<p>In the previous installment of this series, I covered how we can harmonize and control the layout of our design by making consistent use of a strong column measure. In turn, the column measure gave us the foundation for our visual grid. With that invisible grid in mind, a designer can ideally lay out the components of their WordPress theme and ensure that we meet some basic requirements such as good readability, and a clutter-free visual experience.</p>
<p>For this installment, I&#8217;m going to focus on another issue that tends to plague web designers &#8212; typography.</p>
<p>Before we get started, it&#8217;s best that we get a few misconceptions out of the way:</p>
<ol>
<li>Typographic principles for Print Design cannot be applied to Web Design;</li>
<li>Good typography requires images;</li>
<li>Users only care about content;</li>
</ol>
<p>For the most part, point three is correct; however, let&#8217;s put this into a little more context. Users care about your content &#8212; or at least you hope they do if they&#8217;re browsing your site &#8212; but that does not preclude you from developing a better reading experience for them by applying some straight-forward approaches to typography. I personally hate going to a site only to find that fonts are so tiny on my screen that I have to crank up my font settings in my browser to read it. It is equally annoying if I really want to read the content and am forced to resort to that. It doesn&#8217;t hurt to make things a little easier for your readers.</p>
<p>As for the second point, my response to that is typically &#8220;know your audience&#8221;. I say that because every site is different. Content on one site might require that images be used in place of text, whereas on another site, it is far more important to the audience that content be easily accessible (select, copy, paste, etc). Arguably, it is easier to share text-based content, than it is to share graphical content. Understand who your audience is, and cater to them as appropriate.</p>
<p>Finally, most typographic principles used in print translate beautifully to screen. We have far more advanced tools to develop a better reading experience with CSS-based layouts, which control everything from positioning to formatting. While I don&#8217;t want this to turn into an in-depth discussion about usability and web standards, I will say that applying good typographic practices enhances both web usability and accessibility efforts.</p>
<p>Let&#8217;s get started.</p>
<h2>Issue: Poor reading experience for users</h2>
<blockquote><p>For too long typographic style and its accompanying attention to detail have been overlooked by website designers, particularly in body copy. In years gone by this could have been put down to the technology, but now the web has caught up. The advent of much improved browsers, text rendering and high resolution screens, combine to negate technology as an excuse. <a href="http://webtypography.net/intro/" title="Web Typography" target="_blank" onclick="urchinTracker('/outgoing/webtypography.net/intro/?referer=');">Source: webtypography.net</a></p></blockquote>
<p>I could not have said it any better.</p>
<p>When it comes to developing a good reading experience for your users, typography is an important aspect that needs as much consideration as colour and layout. A good reading experience should leave your users free to do one thing: read. If you can present your content in a way that makes it both easy to read, and requires less from the user than scrolling, you&#8217;ve accomplished what many websites fail to do.</p>
<p>Good typography in your design opens up your layout and makes a normally &#8220;grey&#8221; page appear friendly and light.</p>
<p><strong>Something to think about:</strong></p>
<p>It is inevitable that you will come across older sites &#8212; and even new websites &#8212; which still seek to compact as much copywriting into a given area as possible. It is not uncommon to hear feedback along the lines of &#8220;keep the content above the fold&#8221;; every time someone must say this, a kitten dies somewhere. <a href="http://www.boxesandarrows.com/view/blasting-the-myth-of" title="Blasting the Myth of the Fold" target="_blank" onclick="urchinTracker('/outgoing/www.boxesandarrows.com/view/blasting-the-myth-of?referer=');">I counter that kind of feedback with this.</a> With current web standards, there is no harm in scrolling a page. It is a natural browsing behaviour; again, this is a good case where it pays to know your audience.</p>
<h4>Density or &#8220;Typographic Colour&#8221;</h4>
<p>First off, you need to ask yourself what kind of blogger you are. Are you the type of blogger that publishes short paragraphs with a smattering of links? Are you the type of blogger that prefers to drop lots of images and media with brief explanations? Or are you a copious writer given to generous use of copy, media and links?</p>
<p>If you can identify what kind of writer you are, then you&#8217;re half way to understanding your audience. People visit your blog for any number of reasons, but the foremost amongst those reasons is your content. They like what you have to say, what you have to show them, and the information you can point them to.</p>
<p>For the purposes of this article, let&#8217;s assume you&#8217;re like me &#8212; a copious writer. You love your words and your blog is the perfect place to share them.</p>
<p><strong>Given the assumption, here are a few considerations:</strong></p>
<ol>
<li>Large amounts of copy on a screen or piece of paper turn your normal white space in a big grey mass. In traditional typography we call this &#8220;typographic colour&#8221;. More specifically this is the density of your paragraphs in relation to the space you have given the paragraphs. You can lighten things up by adjusting the &#8220;leading&#8221; (<a href="http://www.w3schools.com/css/pr_dim_line-height.asp" title="CSS line-height property" target="_blank" onclick="urchinTracker('/outgoing/www.w3schools.com/css/pr_dim_line-height.asp?referer=');">line-height</a> in CSS), and the &#8220;Kerning&#8221; (<a href="http://www.w3schools.com/css/pr_text_letter-spacing.asp" title="CSS letter-spacing property" target="_blank" onclick="urchinTracker('/outgoing/www.w3schools.com/css/pr_text_letter-spacing.asp?referer=');">letter-spacing</a> in CSS).</li>
<li>Colour as a tool plays a much more important (though subtle) role in good typographic design. You have many colours to choose from, but when it comes to presenting content that is intended to be read, contrast between the background and the type is essential. The better the contrast, the less work is required of the reader to focus and interpret what is on screen. Pick colours that are harmonious with your overall design, but also have a high-degree of contrast. This does not mean you have to stick to black and white; as long as the colour has enough contrast to it, you should be fine. &#8220;Cooler&#8221; colours (colour temperature, not &#8220;cool factor&#8221;) for type work best across most screens.</li>
<li>The typeface, its size, its leading and kerning all affect the readability of your content. Choose a typeface and set its properties to ensure that it is legible. I cannot stress this aspect enough. I have had one too many debates with designers who transition from Print to Web, arguing that 9pt to 10pt type is more than sufficient for on-screen legibility (this is one of those exceptions where print and web typographic principles do not marry so well). I end these long-winded debates with this consideration: in contemporary graphic design, a designer must design for the medium. The same holds true for web designers. We have to design for the medium, and in our case the medium is the screen. <a href="http://webtypography.net/Rhythm_and_Proportion/Vertical_Motion/2.2.1/" title="The Elements of Typographic Style Applied to the Web" target="_blank" onclick="urchinTracker('/outgoing/webtypography.net/Rhythm_and_Proportion/Vertical_Motion/2.2.1/?referer=');">Here is an article that also talks about adjusting typography for the web</a>. It also covers parts of the previous discussion in relation to the column measure.</li>
</ol>
<p>Here are some examples of density, and how typographic control can affect the legibility of your body copy:</p>
<p><a href="http://www.farfromfearless.com/wp-content/uploads/WordPressThemeDesignPart2ContentDensity_CD22/typography_01.png"><img src="http://www.farfromfearless.com/wp-content/uploads/WordPressThemeDesignPart2ContentDensity_CD22/typography_01_thumb.png" alt="typography_01" height="146" width="256" /></a> <a href="http://www.farfromfearless.com/wp-content/uploads/WordPressThemeDesignPart2ContentDensity_CD22/typography_02.png"><img src="http://www.farfromfearless.com/wp-content/uploads/WordPressThemeDesignPart2ContentDensity_CD22/typography_02_thumb.png" alt="typography_02" height="146" width="256" /></a> <a href="http://www.farfromfearless.com/wp-content/uploads/WordPressThemeDesignPart2ContentDensity_CD22/typography_03.png"><img src="http://www.farfromfearless.com/wp-content/uploads/WordPressThemeDesignPart2ContentDensity_CD22/typography_03_thumb.png" alt="typography_03" height="146" width="256" /></a> <a href="http://www.farfromfearless.com/wp-content/uploads/WordPressThemeDesignPart2ContentDensity_CD22/typography_04.png"><img src="http://www.farfromfearless.com/wp-content/uploads/WordPressThemeDesignPart2ContentDensity_CD22/typography_04_thumb.png" alt="typography_04" height="146" width="256" /></a></p>
<p>You can see from the thumbnails how the leading affects the density of copy on the page. The tighter the leading (and other type properties) the more dense a single paragraph appears to a reader.</p>
<h4>Putting it into practice</h4>
<p>Spend the time and go through the motions of playing around with typographic colour in your design application, or if you prefer to deal with your typography in CSS you can use tools like <a href="http://www.fonttester.com/" title="Font Tester" target="_blank" onclick="urchinTracker('/outgoing/www.fonttester.com/?referer=');">Font Tester</a> or <a href="http://typetester.maratz.com/" title="TypeTester.com" target="_blank" onclick="urchinTracker('/outgoing/typetester.maratz.com/?referer=');">TypeTester</a>. The benefit of these online tools is that you are very quickly able to see the results of your tests as they appear on screen &#8212; in a browsing environment. The more time you spend on determining your typographic styles in the design phase of creating a WordPress theme, the better off you will be later in the development process.</p>
<h4>Design for the medium</h4>
<p>Keep in mind that for web, it is easier to scale back than it is to scale up. We don&#8217;t have the restrictions of paper or other physical media &#8212; we do have to contend with other issues (we&#8217;ll cover that later), but for the most part you&#8217;re better off starting larger at first and scaling back if you have to.</p>
<p>Here are some sites that are some examples of web typography that illustrate the design principles I have been talking about in this article:</p>
<ul>
<li><a href="http://www.clearleft.com/about/" title="http://www.clearleft.com/about/" onclick="urchinTracker('/outgoing/www.clearleft.com/about/?referer=');">http://www.clearleft.com/about/</a></li>
<li><a href="http://www.simplebits.com/" title="http://www.simplebits.com/" onclick="urchinTracker('/outgoing/www.simplebits.com/?referer=');">http://www.simplebits.com/</a></li>
<li><a href="http://www.whatdoiknow.org/" title="http://www.whatdoiknow.org/" onclick="urchinTracker('/outgoing/www.whatdoiknow.org/?referer=');">http://www.whatdoiknow.org/</a></li>
<li><a href="http://slideshowpro.net/" title="http://slideshowpro.net/" onclick="urchinTracker('/outgoing/slideshowpro.net/?referer=');">http://slideshowpro.net/</a></li>
</ul>
<h4>Some Considerations:</h4>
<p>Feedback is always nice to have. If possible, solicit some of your readers about their thoughts on your typographic choices, but remember to put your questions into the proper context:</p>
<ul>
<li>&#8220;Is it easier to read my articles if I do this or that?&#8221;</li>
<li>&#8220;Does the page feel lighter to you if I chose this colour or that colour?&#8221;</li>
<li>&#8220;Can you scan the page quickly and find what you need?&#8221;</li>
</ul>
<h4>Further Reading:</h4>
<p><a href="http://webtypography.net/toc/" target="_blank" onclick="urchinTracker('/outgoing/webtypography.net/toc/?referer=');">&#8220;The Elements of Typographic Style Applied to the Web&#8221;</a> is a site that I have found infinitely useful as a reference and as a sounding board for decisions I make in terms of my typographic design. I encourage anyone who has an interest in web typography to read it &#8212; it&#8217;s not a long read &#8212; quite brief in fact. Keep in mind that as a designer, you the final call on decisions &#8212; don&#8217;t get caught up in the stress of &#8220;I have to adhere strictly to the rules or my design sucks&#8221;. Instead, think about your audience. Put yourself in their shoes and consider what works best for them in regards to your content.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.farfromfearless.com/2008/01/18/wordpress-theme-design-part-2-typography/feed/</wfw:commentRss>
		<slash:comments>9</slash:comments>
		</item>
	</channel>
</rss>
