<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" media="screen" href="/~d/styles/atom10full.xsl"?><?xml-stylesheet type="text/css" media="screen" href="http://feeds.feedburner.com/~d/styles/itemcontent.css"?><feed xmlns="http://www.w3.org/2005/Atom" xmlns:feedburner="http://rssnamespace.org/feedburner/ext/1.0">
  <title>Ordered List Blog</title>
  
  <link href="http://orderedlist.com/our-writing/blog/" />
  <id>4b2fa713dabe9d1c22000002</id>
  <updated>2010-02-08T17:23:33-0500</updated>
 
  
    <atom10:link xmlns:atom10="http://www.w3.org/2005/Atom" rel="self" type="application/atom+xml" href="http://feeds.feedburner.com/orderedlist" /><feedburner:info uri="orderedlist" /><atom10:link xmlns:atom10="http://www.w3.org/2005/Atom" rel="hub" href="http://pubsubhubbub.appspot.com" /><feedburner:browserFriendly>This is an XML content feed. It is intended to be viewed in a newsreader or syndicated to another site.</feedburner:browserFriendly><entry>
      <title>Stop Being an Idiot</title>
      <link href="http://orderedlist.com/our-writing/blog/articles/stop-being-an-idiot/" />
      <id>4b69bd2edabe9d2cc4000001</id>
      <updated>2010-02-08T17:23:33-0500</updated>
      <published>2010-02-03T13:00:00-0500</published>
      <category term="design" /><category term="interface" /><category term="rant" />
      <summary type="html">&lt;p&gt;I hear this phrase a lot, and even recently, out of my own mouth: &amp;#8220;Users are stupid, so we have to dumb this down to the lowest common denominator.&amp;#8221; &lt;strong&gt;Stop it&lt;/strong&gt;. Just stop it.&lt;/p&gt;</summary>
      <content type="html">&lt;p&gt;I hear this phrase a lot, and even recently, out of my own mouth: &amp;#8220;Users are stupid, so we have to dumb this down to the lowest common denominator.&amp;#8221; &lt;strong&gt;Stop it&lt;/strong&gt;. Just stop it.&lt;/p&gt;&lt;p&gt;Our job, when designing features and interfaces, is to make them powerful, usable, and understandable. Not to cater to those people too lazy to think. Our job is to make things intuitive. But intuition still requires an individual to &lt;strong&gt;want&lt;/strong&gt; to understand something. It requires an attempt to understand. It requires thought, even subconsciously. We have little power over people&amp;#8217;s desire to succeed. We can only provide the tools to do so. So teach people, don&amp;#8217;t criticize them.&lt;/p&gt;
&lt;p&gt;People aren&amp;#8217;t stupid. Really, they&amp;#8217;re not. It&amp;#8217;s possible they don&amp;#8217;t have the same experiences you do, but that doesn&amp;#8217;t mean they&amp;#8217;re an idiot. Writing people off, and dumbing down utility in the name of stupidity is, well, stupid. Bring people with you, and provide them tools to learn and be successful.&lt;/p&gt;
&lt;h2&gt;Exercise and Education&lt;/h2&gt;
&lt;p&gt;When you exercise, you stretch yourself. You get healthy by pushing past your existing level of fitness. You don&amp;#8217;t succeed by dumbing down your workout. You push, you learn, and you get better. We educate users the same way. We must show, explain, and gently push our users to succeed.&lt;/p&gt;
&lt;h2&gt;Simple, not Stupid&lt;/h2&gt;
&lt;p&gt;And don&amp;#8217;t misunderstand. Keep things simple. But simple doesn&amp;#8217;t mean stupid. Simple doesn&amp;#8217;t mean boring. And simple certainly doesn&amp;#8217;t mean standard. It means you can figure it out, even if it takes a minimal amount of thinking.&lt;sup&gt;1&lt;/sup&gt; &lt;aside&gt;&lt;sup&gt;1&lt;/sup&gt;What&amp;#8217;s interesting is that making something simple is significantly more difficult than making it complicated. Simple takes thought. It takes work, and lots of it.&lt;/aside&gt; Celebrate when users succeed, and don&amp;#8217;t patronize them for wanting or needing help.&lt;/p&gt;
&lt;h2&gt;Teach, Don&amp;#8217;t Ignore&lt;/h2&gt;
&lt;p&gt;Again, your users aren&amp;#8217;t stupid. They &lt;em&gt;could&lt;/em&gt; very easily be &lt;strong&gt;intimidated&lt;/strong&gt;. Nobody likes the unfamiliar. But people love to succeed. So help them. Provide cues, hints, and even invite questions. But don&amp;#8217;t dumb it down.&lt;/p&gt;
&lt;p&gt;And here&amp;#8217;s the real truth: If you&amp;#8217;re dumbing down your interface or features because you think people won&amp;#8217;t &amp;#8216;get it,&amp;#8217; you&amp;#8217;re hurting the experience of those who are more comfortable in your software. If you don&amp;#8217;t provide hints and cues in your interface, you&amp;#8217;re intimidating and hurting the experience for people who aren&amp;#8217;t as comfortable on the web. Either way, you&amp;#8217;re &lt;strong&gt;keeping people from learning&lt;/strong&gt;, and that&amp;#8217;s just uncool.&lt;/p&gt;
&lt;p&gt;So stop thinking your users are stupid. Teach them, train them, and let them succeed. And in the process, if you let them, they&amp;#8217;ll teach you a thing or two as well.&lt;/p&gt;</content>
      <author>
        <name>Steve Smith</name>
      </author>
    </entry>
  
    <entry>
      <title>Stop Blogging</title>
      <link href="http://orderedlist.com/our-writing/blog/articles/stop-blogging/" />
      <id>4b4cc8b3dabe9d58f1000003</id>
      <updated>2010-02-04T09:29:55-0500</updated>
      <published>2010-01-12T14:00:00-0500</published>
      <category term="resources" /><category term="blogs" />
      <summary type="html">&lt;p&gt;I mean it. All of you people are writing fantastic, useful articles about code, methods, and technologies, but you&amp;#8217;re putting them in blog posts &amp;#8212; a date-based format that encourages us to leave things as they were,&amp;nbsp;historically.&lt;/p&gt;</summary>
      <content type="html">&lt;p&gt;I mean it. All of you people are writing fantastic, useful articles about code, methods, and technologies, but you&amp;#8217;re putting them in blog posts &amp;#8212; a date-based format that encourages us to leave things as they were,&amp;nbsp;historically.&lt;/p&gt;&lt;p&gt;And with any blog post about technology, it gets stale. It gets outdated. And in the worst case, several months or years later, it&amp;#8217;s just absolutely wrong.&lt;/p&gt;
&lt;p&gt;As a content consumer, sometimes we can tell. Some of us might pay attention to the post date, some of us might be deep enough into the subject to tell outdated information from fresh. But lots of people can&amp;#8217;t. And keeping incorrect information on the web, simply for historical reasons, is &amp;#8212; well, just selfish.&lt;/p&gt;
&lt;h2&gt;Looking in the Mirror&lt;/h2&gt;
&lt;p&gt;I&amp;#8217;m only saying this to &lt;strong&gt;you&lt;/strong&gt; because I said it to myself about six months ago. I&amp;#8217;m annoyed that this very site contains bad information in its archives. So I&amp;#8217;ve decided to clean it up. Yes, this may mean broken links in some places on the web. But a broken link is better than misleading someone who is genuinely looking for information.&lt;/p&gt;
&lt;p&gt;We have a responsibility, as publishers, to maintain and cultivate our sites. I agree with archiving our opinions, or our experiences, but keeping old, outdated code, examples, or resources isn&amp;#8217;t helping the web.&lt;/p&gt;
&lt;h2&gt;Our Solution&lt;/h2&gt;
&lt;aside&gt;&lt;sup&gt;1&lt;/sup&gt;In the ideal sense, if information is removed, it is replaced with an explanation as to why, and where better, more correct information can be found.&lt;/aside&gt;
&lt;p&gt;We&amp;#8217;ve decided to maintain a &lt;a href="/our-writing/resources/"&gt;resources&lt;/a&gt; area where we will post examples, data, and code samples. We will likely refer to them in our blog, or make posts when we create or update them, but those posts won&amp;#8217;t get stale. The content of the resource, however, might. So we&amp;#8217;re making a decision to regularly go through our resources to tweak them, rewrite them, or sometimes even delete them&lt;sup&gt;1&lt;/sup&gt;, if it makes sense.&lt;/p&gt;
&lt;p&gt;Keep in mind that this is a process.  We&amp;#8217;re not done moving old posts that should be resources, and some of our resources may already need a little updating. It will take work, but we think it&amp;#8217;s worth it.&lt;/p&gt;
&lt;p&gt;So what do you do to keep the web fresh?&lt;/p&gt;</content>
      <author>
        <name>Steve Smith</name>
      </author>
    </entry>
  
    <entry>
      <title>A New Look, a New CMS </title>
      <link href="http://orderedlist.com/our-writing/blog/articles/a-new-look-a-new-cms/" />
      <id>4b466df9dabe9d3e92000004</id>
      <updated>2010-01-21T09:45:11-0500</updated>
      <published>2010-01-07T18:00:00-0500</published>
      <category term="launch" /><category term="design" />
      <summary type="html">&lt;p&gt;We&amp;#8217;ve been focusing our efforts on building &lt;a href="http://get.harmonyapp.com"&gt;Harmony&lt;/a&gt; the past few months, but we recently carved out some time to give our site some much needed love and attention.&lt;/p&gt;</summary>
      <content type="html">&lt;p&gt;We&amp;#8217;ve been focusing our efforts on building &lt;a href="http://get.harmonyapp.com"&gt;Harmony&lt;/a&gt; the past few months, but we recently carved out some time to give our site some much needed love and attention.&lt;/p&gt;&lt;p&gt;This design has been waiting in the wings for a few months, and now that Harmony is able to handle most everything this site needed, we&amp;#8217;re ready to make the switch. We&amp;#8217;ve reorganized and replaced some content, so I&amp;#8217;m sure a few things will be broken. If they are, just &lt;a href="mailto:contact@orderedlist.com"&gt;let us know&lt;/a&gt;.&lt;/p&gt;
&lt;p&gt;Also, this design uses some pretty advanced CSS3, so things might not look quite the same in older or less capable browsers. We&amp;#8217;re fine with that, and will likely give them a little more love in the near future.&lt;/p&gt;
&lt;p&gt;We hope you enjoy the new version of OrderedList.com.&lt;/p&gt;</content>
      <author>
        <name>Steve Smith</name>
      </author>
    </entry>
  
    <entry>
      <title>Harmony Documentation</title>
      <link href="http://orderedlist.com/our-writing/blog/articles/harmony-documentation/" />
      <id>4b421871dabe9d77fc00001a</id>
      <updated>2010-01-05T17:07:21-0500</updated>
      <published>2009-12-18T15:00:00-0500</published>
      
      <summary type="html">&lt;p&gt;We&amp;#8217;re finally revealing the tip of the Harmony iceberg in the form of a nearly-complete &lt;a href="http://docs.harmonyapp.com"&gt;documentation site&lt;/a&gt; that will fuel our beta testers, and help future customers hit the ground running once the &lt;span class="caps"&gt;CMS&lt;/span&gt; is released.&lt;/p&gt;</summary>
      <content type="html">&lt;p&gt;We&amp;#8217;re finally revealing the tip of the Harmony iceberg in the form of a nearly-complete &lt;a href="http://docs.harmonyapp.com"&gt;documentation site&lt;/a&gt; that will fuel our beta testers, and help future customers hit the ground running once the &lt;span class="caps"&gt;CMS&lt;/span&gt; is released.&lt;/p&gt;&lt;p&gt;&lt;a href="http://docs.harmonyapp.com"&gt;&lt;img src="/assets/4b423a97dabe9d016e000001/harmony_docs.png" alt="" /&gt;&lt;/a&gt;&lt;/p&gt;
&lt;p&gt;I say &amp;#8216;tip of the iceberg&amp;#8217; for two reasons. One, Harmony has been in the making for 18 months now, and has been under constant revision, refinement, and improvement the whole time. It&amp;#8217;s was clear when we started Harmony that we knew what direction we wanted to go, but had no idea what it would become, specifically. But more importantly, reading about, and watching screencasts, just can&amp;#8217;t give you the same experience. You really have to &lt;strong&gt;use&lt;/strong&gt; Harmony to get just how intuitive and powerful it really is.&lt;/p&gt;
&lt;p&gt;We&amp;#8217;re happy to say that as we&amp;#8217;re writing and testing some of the last bits of code before we can let other people use it, we couldn&amp;#8217;t be happier with how Harmony is turning out. We &lt;strong&gt;love&lt;/strong&gt; using it. And we can&amp;#8217;t wait to make it better.&lt;/p&gt;
&lt;p&gt;So head on over to the &lt;a href="http://get.harmonyapp.com"&gt;Harmony site&lt;/a&gt;, and check out what all the fuss is about. And don&amp;#8217;t forget to &lt;a href="http://docs.harmonyapp.com"&gt;check out the documentation&lt;/a&gt;. We&amp;#8217;d love to hear what you think.&lt;/p&gt;</content>
      <author>
        <name>Steve Smith</name>
      </author>
    </entry>
  
    <entry>
      <title>Building Evented Single Page Applications</title>
      <link href="http://orderedlist.com/our-writing/blog/articles/building-evented-single-page-applications/" />
      <id>4b421873dabe9d77fc000056</id>
      <updated>2010-01-04T14:07:29-0500</updated>
      <published>2009-09-13T17:59:00-0400</published>
      
      <summary type="html">&lt;p&gt;Today I did a presentation on what Steve and I have been working on behind closed doors for the past year (or more it seems). It is always fun to share the exciting things we have been up to and this was no different.&lt;/p&gt;</summary>
      <content type="html">&lt;p&gt;Today I did a presentation on what Steve and I have been working on behind closed doors for the past year (or more it seems). It is always fun to share the exciting things we have been up to and this was no different.&lt;/p&gt;&lt;p&gt;I promised those that were at the talk that I would post my slides, so here you go. I don&amp;#8217;t know how helpful the slides are without my incredible, booming voice, but hopefully you find value in them.&lt;/p&gt;
&lt;div style="width:425px;text-align:left" id="__ss_1992312"&gt;&lt;object style="margin:0px" width="425" height="355"&gt;&lt;param name="movie" value="http://static.slidesharecdn.com/swf/ssplayer2.swf?doc=buildingeventedsinglepageapplications-090913155032-phpapp01&amp;stripped_title=building-evented-single-page-applications" /&gt;&lt;param name="allowFullScreen" value="true"/&gt;&lt;param name="allowScriptAccess" value="always"/&gt;&lt;embed src="http://static.slidesharecdn.com/swf/ssplayer2.swf?doc=buildingeventedsinglepageapplications-090913155032-phpapp01&amp;stripped_title=building-evented-single-page-applications" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="425" height="355"&gt;&lt;/embed&gt;&lt;/object&gt;&lt;/div&gt;&lt;p&gt;&lt;br /&gt;&lt;/p&gt;
&lt;p&gt;Since people were curious, I have also pasted some of the code online. Right now it is quick, dirty and relies on an &lt;a href="http://gist.github.com/186325"&gt;older nightly version of jQuery&lt;/a&gt;, but hopefully some will find it helpful. Once 1.3.3 is released, you will not need this nightly version to get stuff working. Also, your mileage will vary in IE as we haven&amp;#8217;t really done any testing with it.&lt;/p&gt;
&lt;p&gt;You can download the core layout javascript file from Harmony (&lt;a href="http://gist.github.com/186329"&gt;gist&lt;/a&gt;) and from Peoplebase (&lt;a href="http://gist.github.com/186328"&gt;gist&lt;/a&gt;). The two files are very similar, but have a few different features that haven&amp;#8217;t been merged together. Feel free to play with it, but &lt;strong&gt;I in no way recommend using it in production right now&lt;/strong&gt;. Just look at the code for ideas.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;Once we get some time&lt;/strong&gt;, we&amp;#8217;ll extract the parts that we see valuable into a framework with tests that anyone can feel free to drop in to their project.&lt;/p&gt;</content>
      <author>
        <name>John Nunemaker</name>
      </author>
    </entry>
  
    <entry>
      <title>Atmail Launched</title>
      <link href="http://orderedlist.com/our-writing/blog/articles/atmail-launched/" />
      <id>4b421874dabe9d77fc000064</id>
      <updated>2010-01-07T17:09:01-0500</updated>
      <published>2009-08-07T12:00:00-0400</published>
      
      <summary type="html">&lt;p&gt;Every once and a while, a project comes along, that despite your current workload, you just cannot turn down. Last November, Atmail brought us a project like that.&lt;/p&gt;</summary>
      <content type="html">&lt;p&gt;Every once and a while, a project comes along, that despite your current workload, you just cannot turn down. Last November, Atmail brought us a project like that.&lt;/p&gt;&lt;p&gt;&lt;a href="http://atmail.com/"&gt;Atmail&lt;/a&gt; is a Linux based Webmail Client + Email solution that you can use as an alternative to Gmail or Exchange to bring your organization&amp;#8217;s email under control. They came to us looking simply for ideas and nothing more. Perfect.&lt;/p&gt;
&lt;p&gt;We have always had a soft spot for webmail and the thought of ideas being a deliverable was exciting. We spent some time brainstorming and then Steve&amp;#8217;s eyes glazed over much like Isaac, the painter on Heroes, and he went to work. A few revisions later, we had something we were excited about and it was time to make sure it would actually work.&lt;/p&gt;
&lt;p&gt;Since Steve did the design, I worked on the &lt;span class="caps"&gt;XHTML&lt;/span&gt;/&lt;span class="caps"&gt;CSS&lt;/span&gt;. I can promise you the implementation was anything but typical. Supporting IE6 is usually not much of an issue, as both of us have experience bending it to our will, but we did not have a lot of experience making web apps rendered with IE6 look and feel like a paned desktop app. A few expressions and some crazy css later, we had it working in all browsers and good to go.&lt;/p&gt;
&lt;p&gt;We delivered the files to Atmail and hoped they were happy. Normally, we get feedback in the design process long before we implement the &lt;span class="caps"&gt;XHTML&lt;/span&gt;/&lt;span class="caps"&gt;CSS&lt;/span&gt;. Atmail was different though, as they just wanted to see what we would do without them. Talk about a cool client!  Here&amp;#8217;s what they had to say about our work.&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;I was impressed with the delivery and formatting of the &lt;span class="caps"&gt;HTML&lt;/span&gt;/&lt;span class="caps"&gt;CSS&lt;/span&gt; templates from Orderedlist &amp;#8211; This enabled us to easily transform the mocks into jQuery and Zend, and get the prototype design into working code!&lt;/p&gt;
&lt;/blockquote&gt;
&lt;p&gt;Evidently they were as happy as we were with the direction as they took it and ran with it. Last month, they launched version 6, which is our initial thoughts, brought to fruition by the their team. We were impressed at how well they took our 2 or 3 mockups and used them to create a cohesive app with a lot of functionality. Below is a screenshot of the final product.&lt;/p&gt;
&lt;p&gt;&lt;img src="/assets/4b465b64dabe9d3e68000001/atmail_client.jpg" alt="Atmail Mockup" class="feature" /&gt;&lt;/p&gt;
&lt;p&gt;Congrats on the launch Atmail, and we are glad we could help out!&lt;/p&gt;</content>
      <author>
        <name>John Nunemaker</name>
      </author>
    </entry>
  
    <entry>
      <title>Google Ajax Feeds Fun</title>
      <link href="http://orderedlist.com/our-writing/blog/articles/google-ajax-feeds-fun/" />
      <id>4b421876dabe9d77fc000091</id>
      <updated>2010-01-04T14:07:29-0500</updated>
      <published>2009-03-27T18:05:00-0400</published>
      
      <summary type="html">&lt;p&gt;Often times when new things come out, I am aware of them, but for whatever reason, they don&amp;#8217;t really click with me. I heard about Google&amp;#8217;s Ajax libraries a while back and I remember thinking whoop-dee-freakin-doo.&lt;/p&gt;</summary>
      <content type="html">&lt;p&gt;Often times when new things come out, I am aware of them, but for whatever reason, they don&amp;#8217;t really click with me. I heard about Google&amp;#8217;s Ajax libraries a while back and I remember thinking whoop-dee-freakin-doo.&lt;/p&gt;&lt;p&gt;Today, somehow, I ended up on the &lt;a href="http://code.google.com/apis/ajaxfeeds/documentation/"&gt;docs page&lt;/a&gt; for Google&amp;#8217;s Ajax Feed &lt;span class="caps"&gt;API&lt;/span&gt; and it clicked.&lt;/p&gt;
&lt;p&gt;On RailsTips, I show the latest quick tips (ruby and rails related links) &lt;a href="http://railstips.org/2009/1/3/look-at-the-size-of-my-footer"&gt;in the footer&lt;/a&gt; on every page. I didn&amp;#8217;t want to customize Mephisto to spit out the link list, so I set out to find a client-side solution. I ended up creating a Yahoo Pipe with a &lt;span class="caps"&gt;JSON&lt;/span&gt; callback to show the list on page load. This worked fine, but it annoyed me that I had to manually create a Yahoo Pipe each time that I wanted to do this on a site.&lt;/p&gt;
&lt;h2&gt;The Solution&lt;/h2&gt;
&lt;p&gt;Today, when I randomly ended up browsing the documentation, I realized that the Google Feed &lt;span class="caps"&gt;API&lt;/span&gt; would be a better solution for what I needed. In just a few minutes, I ended up with a really simple solution.&lt;/p&gt;
&lt;pre&gt;&lt;code class="javascript"&gt;RailsTips.QuickTips = {
  load: function() {
    var feed = new google.feeds.Feed("http://feeds2.feedburner.com/railsquicktips/");
    feed.setNumEntries(12);
    feed.load(function(result) {
      if (!result.error) {
        var list = jQuery('#more_quick_links');
        for (var i=0; i &amp;lt; result.feed.entries.length; i++) {
          var entry = result.feed.entries[i];
          list.append('&amp;lt;li&amp;gt;&amp;lt;a href="' + entry.link + '"&amp;gt;' + entry.title + '&amp;lt;/a&amp;gt;&amp;lt;/li&amp;gt;')
        }
      }
    });
  }
}
&lt;/code&gt;&lt;/pre&gt;
&lt;h2&gt;The Live Demo&lt;/h2&gt;
&lt;p&gt;No need to login to Yahoo Pipes, create a pipe and copy the &lt;span class="caps"&gt;URL&lt;/span&gt;. All I need to do now is just include Google&amp;#8217;s &lt;span class="caps"&gt;AJAX&lt;/span&gt; Feed &lt;span class="caps"&gt;API&lt;/span&gt; and tell it which feed I would like to display. Of course, being the astute gentleman that I am, I &lt;a href="http://orderedlist.com/demos/google_ajax_feeds/"&gt;created a demo for you&lt;/a&gt; to check out.&lt;/p&gt;
&lt;p&gt;If you are curious about my previous solution, using a Yahoo Pipe, Snook just wrote a little bit on it, so feel free to &lt;a href="http://snook.ca/archives/javascript/yahoo-pipes-xml-json"&gt;head over there&lt;/a&gt;.&lt;/p&gt;
&lt;p&gt;The ability to show feeds on a website using JavaScript is really cool. The possibilities are endless. Anything that is in feed form can now be shown on any site with no hardcore programming needed. Pretty crazy. Next you&amp;#8217;re going to try tell me that in the future we can use multiple background images on a single element. Ha, you&amp;#8217;re funny!&lt;/p&gt;</content>
      <author>
        <name>John Nunemaker</name>
      </author>
    </entry>
  
    <entry>
      <title>Harmony Update</title>
      <link href="http://orderedlist.com/our-writing/blog/articles/harmony-update/" />
      <id>4b421877dabe9d77fc00009d</id>
      <updated>2010-01-04T14:07:30-0500</updated>
      <published>2009-03-02T23:25:00-0500</published>
      
      <summary type="html">&lt;p&gt;Things have been silent on this here blog because Steve and I have been making ridiculously awesome progress on Harmony. We are actually less than a week away from our first deploy and only a few weeks away from running OrderedList.com in Harmony.&lt;/p&gt;</summary>
      <content type="html">&lt;p&gt;Things have been silent on this here blog because Steve and I have been making ridiculously awesome progress on Harmony. We are actually less than a week away from our first deploy and only a few weeks away from running OrderedList.com in Harmony.&lt;/p&gt;&lt;p&gt;Yep, you heard it here first. We are actually going to be able to demo this thing at &lt;span class="caps"&gt;SXSW&lt;/span&gt; in a few weeks. Exciting! Tonight, we spent some time showing it off at our local Ruby group meeting and it went pretty well. Below is a rather blurry picture of Harmony projected onto the wall at the meeting.&lt;/p&gt;
&lt;p&gt;&lt;a href="http://www.flickr.com/photos/johnnunemaker/3324894016/" title="Steve Demoing Harmony by jnunemaker, on Flickr"&gt;&lt;img src="http://farm4.static.flickr.com/3551/3324894016_edfb4ea8bc.jpg" width="500" height="333" alt="Steve Demoing Harmony" class="feature" /&gt;&lt;/a&gt;&lt;/p&gt;
&lt;h2&gt;Some Stats&lt;/h2&gt;
&lt;p&gt;Harmony is currently hosted in a private repository on Github, so I used Github&amp;#8217;s &lt;span class="caps"&gt;API&lt;/span&gt; along with &lt;a href="http://railstips.org/2008/7/29/it-s-an-httparty-and-everyone-is-invited"&gt;HTTParty&lt;/a&gt; to generate some stats. Below is the number of commits by month to the repo, which is a general indication of the intensity on our part. If you are curious about the code, it is nothing special, but &lt;a href="http://gist.github.com/73171"&gt;you can find it here&lt;/a&gt;.&lt;/p&gt;
&lt;table&gt;
&lt;thead&gt;
&lt;tr&gt;
      &lt;th&gt;Month&lt;/th&gt;&lt;th&gt;# of Commits&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
    &lt;tr&gt;&lt;td&gt;June 2008&lt;/td&gt;&lt;td&gt;99&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;August 2008&lt;/td&gt;&lt;td&gt;2&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;September 2008&lt;/td&gt;&lt;td&gt;16&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;October 2008&lt;/td&gt;&lt;td&gt;28&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;November 2008&lt;/td&gt;&lt;td&gt;3&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;December 2008&lt;/td&gt;&lt;td&gt;0&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;January 2009&lt;/td&gt;&lt;td&gt;122&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;February 2009&lt;/td&gt;&lt;td&gt;129&lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td&gt;March 2009&lt;/td&gt;&lt;td&gt;17&lt;/td&gt;&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;
&lt;p&gt;As you can see, we were pretty sporadic with Harmonious Fridays from June to December. We noticed that in January and decided it was time to spend more time on Harmony. Since January, you can see a massive upswing in activity. Heck, we already have 17 in March (only 2 days).&lt;/p&gt;
&lt;p&gt;I&amp;#8217;ve been working on Harmony full time since mid-January and Steve has been putting in extra hours on top of client work. Speaking of client work, we have some cool projects that we need to post about. I&amp;#8217;ll make a note to myself to get that done in the next couple weeks. That is all for now. Hope a blurry photo and a promise of work being done is enough.&lt;/p&gt;
&lt;p&gt;If you are heading to &lt;span class="caps"&gt;SXSW&lt;/span&gt;, find us (twitter should work) and we&amp;#8217;ll give you a demo. We didn&amp;#8217;t get conference passes, but we&amp;#8217;ll be in town from Saturday to Tuesday enjoying the night life. :)&lt;/p&gt;</content>
      <author>
        <name>John Nunemaker</name>
      </author>
    </entry>
  
    <entry>
      <title>Is The Web Recession Proof?</title>
      <link href="http://orderedlist.com/our-writing/blog/articles/is-the-web-recession-proof/" />
      <id>4b421877dabe9d77fc0000ab</id>
      <updated>2010-01-04T14:07:30-0500</updated>
      <published>2009-03-02T22:42:00-0500</published>
      
      <summary type="html">&lt;p&gt;Economy, economy, economy. I swear it is all you hear about these days. Turn on the news. Go to a cafe.  Doesn&amp;#8217;t matter where you are, someone mentions how bad the economy is. Because Steve and I left extremely stable and secure jobs, we often get asked, &amp;#8220;Are you feeling the hurt?&amp;#8221;&lt;/p&gt;</summary>
      <content type="html">&lt;p&gt;Economy, economy, economy. I swear it is all you hear about these days. Turn on the news. Go to a cafe.  Doesn&amp;#8217;t matter where you are, someone mentions how bad the economy is. Because Steve and I left extremely stable and secure jobs, we often get asked, &amp;#8220;Are you feeling the hurt?&amp;#8221;&lt;/p&gt;&lt;p&gt;So are we? Currently and &lt;strong&gt;thankfully&lt;/strong&gt;, we are a not. On the contrary, we have noticed an increase in project requests in December and January. Granted, project requests do not always turn into projects, but I think for us they are pretty indicative of interest.&lt;/p&gt;
&lt;p&gt;Here are my unfiltered and most likely naive thoughts on our current circumstances. I believe that even though the economy as a whole is hurting, there are pockets of growth. I believe that one of those pockets is the web. I believe that if you are a company that has been fiscally responsible, grown at a reasonable rate, and continually provided high quality products and services, you are going to be fine.&lt;/p&gt;
&lt;p&gt;The answer is no. The web is obviously not recession proof, but &lt;strong&gt;if there is any industry right now that provides opportunity, it is the web&lt;/strong&gt;. Stop worrying about the economy and focus on strengthening your business. What do we do, here at Ordered List, to make sure we are strong?&lt;/p&gt;
&lt;ul&gt;
	&lt;li&gt;&lt;strong&gt;Cash flow&lt;/strong&gt;. We don&amp;#8217;t obsess over cash, but we require payment to do work. Yep, we are paid before we do work, not after. If a client wants a fixed price, they&amp;#8217;ll get one, but they&amp;#8217;ll pay all or at least half of it up front. If the project is larger, we work in 100 hour blocks. Once we have logged 80-90 hours, we let the client know and go from there.&lt;/li&gt;
	&lt;li&gt;&lt;strong&gt;Keep reserves&lt;/strong&gt;. It is tempting to pay yourself a ridiculous salary or pay out large profit checks, but that is very short-sighted. We pay ourselves modest salaries, even for South Bend, and always make sure we have several months of expenses in the bank before we partake in profit sharing.&lt;/li&gt;
	&lt;li&gt;&lt;strong&gt;Spend money where it counts&lt;/strong&gt;. If you don&amp;#8217;t need an office, don&amp;#8217;t pay for office space. This is different for everyone, but instead of paying rent and utilities every month, we choose to keep our recurring monthly expenses low. Instead, we splurge more on laptops, gadgets and conferences.  We care a lot more about that.&lt;/li&gt;
	&lt;li&gt;&lt;strong&gt;Build a reputation online&lt;/strong&gt;. Every piece of work that we are commissioned to do comes from the reputations that Steve and I have built online. Geographically, our closest client to date was almost 100 miles away. Our clients find us online and we work remotely for them, which opens up far more opportunities than if we focused on the local chamber of commerce. Recently, someone asked me what the market was like in South Bend. My response was, &amp;#8220;I don&amp;#8217;t know.&amp;#8221;&lt;/li&gt;
	&lt;li&gt;&lt;strong&gt;Stay current&lt;/strong&gt;. Don&amp;#8217;t shoehorn yourself into one thing. Our primary service is website and application design, but we are also pretty knowledgeable in Ruby and Rails, and more recently, have been diving into iPhone development. The great thing about being small and current is that different opportunities are more profitable at different times, and if you are current, you can not only see them coming, but also take part in them.&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;I could be wrong. We could be in for dark times, but worrying about that won&amp;#8217;t get us anywhere. &lt;strong&gt;Focusing on what is going good and attempting to amplify that will&lt;/strong&gt;.&lt;/p&gt;
&lt;p&gt;What is your sense of the web world right now?&lt;/p&gt;</content>
      <author>
        <name>John Nunemaker</name>
      </author>
    </entry>
  
    <entry>
      <title>Another Blawg Enters The Sphere</title>
      <link href="http://orderedlist.com/our-writing/blog/articles/another-blawg-enters-the-sphere/" />
      <id>4b421878dabe9d77fc0000b8</id>
      <updated>2010-01-04T14:07:30-0500</updated>
      <published>2009-01-12T10:38:00-0500</published>
      
      <summary type="html">&lt;p&gt;I have spent a lot of time over the past few months growing &lt;a href="http://railstips.org"&gt;RailsTips&lt;/a&gt;, a Ruby and Rails programming blog. All the tweaks I have been doing over there, have left me wanting an outlet to share.&lt;/p&gt;</summary>
      <content type="html">&lt;p&gt;I have spent a lot of time over the past few months growing &lt;a href="http://railstips.org"&gt;RailsTips&lt;/a&gt;, a Ruby and Rails programming blog. All the tweaks I have been doing over there, have left me wanting an outlet to share.&lt;/p&gt;&lt;p&gt;I didn&amp;#8217;t want to completely change topic here on Ordered List, since Steve is doing such a great job on &lt;a href="http://orderedlist.com/tags/html5"&gt;HTML5&lt;/a&gt;, so last Sunday I whipped &lt;a href="http://blawgtips.com"&gt;BlawgTips&lt;/a&gt; together and invited my friend &lt;a href="http://grundyhome.com"&gt;Chas Grundy&lt;/a&gt; to co-author it with me. Get it, blawwwwg? Hilarious, I know.&lt;/p&gt;
&lt;h2&gt;What it will/won&amp;#8217;t be&lt;/h2&gt;
&lt;p&gt;I can promise you now that Blawgtips won&amp;#8217;t be boring. It won&amp;#8217;t teach you how to install Wordpress (or any WP plugins for that matter). It won&amp;#8217;t be about &lt;strong&gt;how&lt;/strong&gt; to use blogging tools. So what will it be about? &lt;strong&gt;Why&lt;/strong&gt;. Why should you measure your traffic? Why should you think about your post titles? Why you should go from specific to general in your &lt;code&gt;&amp;lt;title&amp;gt;&lt;/code&gt; tags. These are principles that are helpful for all websites, but we will focus on blogs in particular.&lt;/p&gt;
&lt;h2&gt;A Sampling&lt;/h2&gt;
&lt;p&gt;Below are a few articles we added last week, to kick things off and give you an idea of what is to come. I have plenty more ideas sitting in the hopper as well.&lt;/p&gt;
&lt;ul&gt;
	&lt;li&gt;&lt;a href="http://blawgtips.com/2009/1/11/its-the-little-things"&gt;It&amp;#8217;s the Little Things&lt;/a&gt;&lt;/li&gt;
	&lt;li&gt;&lt;a href="http://blawgtips.com/2009/1/11/does-blogging-matter"&gt;Does Blogging Matter?&lt;/a&gt;&lt;/li&gt;
	&lt;li&gt;&lt;a href="http://blawgtips.com/2009/1/6/gardening-your-blog"&gt;Gardening Your Blog&lt;/a&gt;&lt;/li&gt;
	&lt;li&gt;&lt;a href="http://blawgtips.com/2009/1/6/if-you-post-it-they-will-come"&gt;If You Post It, They Will Come&lt;/a&gt;&lt;/li&gt;
	&lt;li&gt;&lt;a href="http://blawgtips.com/2009/1/6/make-your-post-title-count"&gt;Make Your Post Title Count&lt;/a&gt;&lt;/li&gt;
	&lt;li&gt;&lt;a href="http://blawgtips.com/2009/1/6/ribbon-cutting"&gt;Ribbon Cutting&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;Hope you find this new resource helpful. Head on over and &lt;a href="http://blawgtips.com/"&gt;subscribe&lt;/a&gt; if you want to stay in the loop. Also, we are sure there are other bloggers out there with stuff to say, so if you would like to guest author a post (or a few), let me know.&lt;/p&gt;</content>
      <author>
        <name>John Nunemaker</name>
      </author>
    </entry>
  
    <entry>
      <title>Getting Started with HTML5</title>
      <link href="http://orderedlist.com/our-writing/blog/articles/getting-started-with-html5/" />
      <id>4b42187adabe9d77fc000102</id>
      <updated>2010-01-04T14:07:30-0500</updated>
      <published>2009-01-10T15:30:00-0500</published>
      
      <summary type="html">&lt;p&gt;HTML5 has some interesting new additions. But let&amp;#8217;s recognize the elephant in the room: HTML5 isn&amp;#8217;t a final spec, nor will it be for quite some time. That said, there are many pieces that are stable, and can be used right now.&lt;/p&gt;</summary>
      <content type="html">&lt;p&gt;HTML5 has some interesting new additions. But let&amp;#8217;s recognize the elephant in the room: HTML5 isn&amp;#8217;t a final spec, nor will it be for quite some time. That said, there are many pieces that are stable, and can be used right now.&lt;/p&gt;&lt;h2&gt;The Doctype&lt;/h2&gt;
&lt;p&gt;For a little background, HTML5 comes in two serializations: &lt;span class="caps"&gt;XML&lt;/span&gt; and &lt;span class="caps"&gt;HTML&lt;/span&gt;. The &lt;span class="caps"&gt;XML&lt;/span&gt; serialization of HTML5 is served as &lt;code&gt;application/xhtml+xml&lt;/code&gt;, while the &lt;span class="caps"&gt;HTML&lt;/span&gt; serialization is served as &lt;code&gt;text/html&lt;/code&gt;.  Due to the added complications of serving &lt;code&gt;application/xhtml+xml&lt;/code&gt;, we&amp;#8217;re going to use the &lt;span class="caps"&gt;HTML&lt;/span&gt; serialization for all our demos here.&lt;/p&gt;
&lt;p&gt;So here&amp;#8217;s one of my favorite parts about starting a new HTML5 document: I can do it from memory.&lt;/p&gt;
&lt;p&gt;&lt;code class="html"&gt;&amp;lt;pre&amp;gt;&amp;lt;!DOCTYPE html&amp;gt;
&amp;lt;html&amp;gt;
  &amp;lt;head&amp;gt;
    &amp;lt;title&amp;gt;New Document&amp;lt;/title&amp;gt;&lt;/p&gt;
&lt;/head&gt;
&lt;body&gt;

&lt;/body&gt;
&lt;p&gt;&lt;/html&gt;&lt;/pre&gt;&lt;/code&gt;&lt;/p&gt;
&lt;p&gt;Now that&amp;#8217;s simple, isn&amp;#8217;t it? Finally, a memorable doctype!&lt;/p&gt;
&lt;h2&gt;Will that Work?&lt;/h2&gt;
&lt;p&gt;But browsers don&amp;#8217;t recognize the HTML5 doctype yet, right? While that&amp;#8217;s mostly true, we need to remember one great fact: If a browser comes across a new or unrecognized doctype, it simply moves into standards mode (or strict mode in IE).  So you can begin building pages with this HTML5 doctype &lt;strong&gt;right now&lt;/strong&gt;, and they will just work! And when browsers &lt;em&gt;do&lt;/em&gt; implement HTML5, you&amp;#8217;ll be ahead of the game.&lt;/p&gt;
&lt;h2&gt;So what Now?&lt;/h2&gt;
&lt;p&gt;Now you have a few options.  You could just go about the way you normally code pages, with no real changes.  But that&amp;#8217;s not really worth changing a doctype, is it? More appropriately we should learn and use some of the new tags HTML5 gives us to improve our coding semantics and efficiency.  Next in this series, we&amp;#8217;ll touch on the new structural tags HTML5 provides us, and how they can be used today. Stay tuned.&lt;/p&gt;</content>
      <author>
        <name>Steve Smith</name>
      </author>
    </entry>
  
    <entry>
      <title>Getting Topical</title>
      <link href="http://orderedlist.com/our-writing/blog/articles/getting-topical/" />
      <id>4b42187adabe9d77fc00010e</id>
      <updated>2010-01-04T14:07:30-0500</updated>
      <published>2009-01-08T10:16:00-0500</published>
      
      <summary type="html">&lt;p&gt;Posting on this site has dwindled significantly, especially as John and I get busier.  But it&amp;#8217;s not for lack of fun and interesting stuff to talk about.  Recently, I&amp;#8217;m just not sure &lt;strong&gt;what&lt;/strong&gt; to post.&lt;/p&gt;</summary>
      <content type="html">&lt;p&gt;Posting on this site has dwindled significantly, especially as John and I get busier.  But it&amp;#8217;s not for lack of fun and interesting stuff to talk about.  Recently, I&amp;#8217;m just not sure &lt;strong&gt;what&lt;/strong&gt; to post.&lt;/p&gt;&lt;p&gt;The theme of this blog has always been general, and I&amp;#8217;d like to keep that flexibility.  That said, I think having a short-term focus would be helpful to help get some more ideas and knowledge out in writing.  So we&amp;#8217;re going to start having monthly themes around here.&lt;/p&gt;
&lt;p&gt;So starting tomorrow, January will be the month of &amp;#8220;&lt;strong&gt;HTML5 and CSS3&lt;/strong&gt;.&amp;#8221;  I recently gave a workshop on the topic at &lt;a href="http://events.carsonified.com/fowd"&gt;Future of Web Design&lt;/a&gt;, so I have lots to share.  There will be unrelated posts that crop up throughout the month, but we&amp;#8217;ll try to stay on topic as much as possible.&lt;/p&gt;
&lt;p&gt;Also, if you have ideas for topics, be sure to &lt;a href="/contact"&gt;let us know&lt;/a&gt;.  We aim to please, after all.&lt;/p&gt;</content>
      <author>
        <name>Steve Smith</name>
      </author>
    </entry>
  
    <entry>
      <title>Harmony: Theme Management</title>
      <link href="http://orderedlist.com/our-writing/blog/articles/harmony-theme-management/" />
      <id>4b42187bdabe9d77fc00011b</id>
      <updated>2010-01-04T14:07:30-0500</updated>
      <published>2009-01-05T13:03:00-0500</published>
      
      <summary type="html">&lt;p&gt;Hard to believe it has been three months since we last talked about Harmony. Heck, it is hard to believe it has been three months period. The last three months have flown by for us, but we thought we would start the new year off on the right foot.&lt;/p&gt;</summary>
      <content type="html">&lt;p&gt;Hard to believe it has been three months since we last talked about Harmony. Heck, it is hard to believe it has been three months period. The last three months have flown by for us, but we thought we would start the new year off on the right foot.&lt;/p&gt;&lt;p&gt;While development on Harmony has slowed considerably since the last post on &lt;a href="http://orderedlist.com/articles/harmony-user-management"&gt;user management&lt;/a&gt;, it has not stopped. We &lt;a href="http://orderedlist.com/articles/ordered-list-on-the-road"&gt;traveled&lt;/a&gt; the months of October and November away. And December? Well, December was full of a couple really cool client projects that we just couldn&amp;#8217;t turn down,  despite having an already full schedule.&lt;/p&gt;
&lt;h2&gt;Theme Management&lt;/h2&gt;
&lt;p&gt;Ok, that is enough excuses for now. How about we discuss themes? So what are themes? Well, themes are what make up the look and feel of your website. Harmony will support multiple themes for each site with one active theme. Each theme is comprised of template, stylesheet, javascript and image files.&lt;/p&gt;
&lt;p&gt;One note is that theme files should not be confused with assets. Assets are resources that are linked to and help support the content. Files like pdf&amp;#8217;s, images, zipped archives and such would go into the assets area. &lt;strong&gt;Theme files are only concerned with the look and feel of the site&lt;/strong&gt;. Your logo would be a theme file. Your annual report would be an asset. This will be obvious when you use Harmony, but since you can&amp;#8217;t right now I thought I would explain the difference. Hope that clears any possible confusion up.&lt;/p&gt;
&lt;p&gt;As I stated above, each site can have multiple themes. This means you can create a theme for your site and then when you redesign, you can simply create a new theme and leave the original theme active while you work on the new one. Once you complete the new theme, &lt;strong&gt;you can activate it and your whole site&amp;#8217;s look and feel will switch on a dime&lt;/strong&gt;. This is nothing new as far as website management systems are concerned, but if you are building static html sites, it will be an eye-opening experience.&lt;/p&gt;
&lt;h2&gt;The Template System&lt;/h2&gt;
&lt;p&gt;For the template system, we have chosen liquid, which is based on Django&amp;#8217;s template system and is very popular in the Rails ecosystem. If you interested, you can read more about liquid on the  &lt;a href="http://github.com/tobi/liquid/wikis/liquid-for-designers"&gt;wiki&lt;/a&gt;. The great thing about liquid is that it is so &lt;a href="http://github.com/tobi/liquid/wikis/liquid-for-programmers"&gt;extendable for programmers&lt;/a&gt;. We will have a lot of custom template tags and filters to make your development live a lot easier. Below is just &lt;strong&gt;a really  small&lt;/strong&gt; sample of some of the helpers we will provide. If you have ever used the &lt;a href="http://mephistoblog.com/"&gt;Mephisto blogging system&lt;/a&gt;, some of them will look familiar as Mephisto uses liquid extensively.&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;# outputs two stylesheet link tags to stylesheets 
# named reset.css and common.css
{{ 'reset,common' | stylesheets }}

# outputs one stylesheet link tag to print.css with media set to print
{{ 'print' | stylesheets: 'print' }}

# includes the file named _header.liquid
# very similar to apache and php includes, and very handy!
{% include 'header' %}

# outputs a ul with an id of nav and li's for each navigation item
# this will be customizable to change the id, 
# include or exclude child pages, etc.
{{ site.navigation | nav }}&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;You can probably see that these will indeed be helpful, but that is just the beginning. I don&amp;#8217;t know about you, but I can never remember the syntax for IE conditional statements. That is why I&amp;#8217;m particularly excited about filters like ie_stylesheet:&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;# outputs stylesheet link tag to ie.css wrapped
# in IE conditional comment for versions of IE less than 7
{{ 'ie' | ie_stylesheet: '&amp;lt; 7' }}&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;Think of all the things that you do everyday that you have to lookup on google or a previous project, because you forgot the exact syntax. One of our goals is to make web development &lt;strong&gt;easier and more fun using Harmony&lt;/strong&gt; than it would be &lt;strong&gt;using any other website management system or programming language&lt;/strong&gt;. A lofty goal yes, but we like to set our sights high.&lt;/p&gt;
&lt;h2&gt;Icing On The Cake&lt;/h2&gt;
&lt;p&gt;Another thing we are excited about is that because all the theme files are stored in the database, we can process them before serving them. This means we can enhance the ability to do things with files that normally wouldn&amp;#8217;t be possible in a more static development environment.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;One simple example is css variables&lt;/strong&gt;. Wouldn&amp;#8217;t it be handy to set dark_green, light_green, header_orange as variables in css and just reuse those colors where needed? I always forget hex codes, but variables names wouldn&amp;#8217;t be that hard.&lt;/p&gt;
&lt;p&gt;Yeah, we know webkit has an &lt;a href="http://disruptive-innovations.com/zoo/cssvariables/"&gt;initial run&lt;/a&gt; at css variables, but why should we wait for all the other browsers to come around? Because we can process your stylesheet when you save it, we can make things work programmatically that browsers don&amp;#8217;t currently support.&lt;/p&gt;
&lt;p&gt;It might be kind of hard to visualize what we are talking about above, but trust me, it will be cool. What are some other features we have thought would be cool?&lt;/p&gt;
&lt;ul&gt;
	&lt;li&gt;One click downloads of popular javascript and css frameworks into a theme&lt;/li&gt;
	&lt;li&gt;Asset bundling &amp;#8211; something automated for bundling stylesheets and javascripts together to minimize http requests and thus improve performance&lt;/li&gt;
	&lt;li&gt;Automatic JavaScript minifying &amp;#8211; would be something optional&lt;/li&gt;
	&lt;li&gt;&amp;#8220;Developer Mode&amp;#8221; when editing themes that allows one window with css/html open for editing and another open with a live preview&lt;/li&gt;
&lt;/ul&gt;
&lt;h2&gt;What are your pain points?&lt;/h2&gt;
&lt;p&gt;These are just a few ideas that we have thought would be handy and I&amp;#8217;m sure you have your own. What are things that you repeat all the time in web development? Where are your pain points? Give us more ideas. I&amp;#8217;m sure once you all get your hands on Harmony, you&amp;#8217;ll have even more, but I&amp;#8217;m curious if, while reading this post, &lt;strong&gt;anything else popped into your head&lt;/strong&gt;.&lt;/p&gt;</content>
      <author>
        <name>John Nunemaker</name>
      </author>
    </entry>
  
    <entry>
      <title>YardVote</title>
      <link href="http://orderedlist.com/our-writing/blog/articles/yardvote/" />
      <id>4b42187bdabe9d77fc000128</id>
      <updated>2010-01-04T14:07:31-0500</updated>
      <published>2008-10-24T18:39:00-0400</published>
      
      <summary type="html">&lt;p&gt;Yesterday some &lt;a href="http://collectiveidea.com"&gt;friends from Holland, MI&lt;/a&gt; came down to hang out with Steve and I all day. They started a project called Yard Vote &lt;a href="http://twitter.com/danielmorrison/statuses/929805773"&gt;about a month ago&lt;/a&gt; and we decided to help them give the application some upgrades.&lt;/p&gt;</summary>
      <content type="html">&lt;p&gt;Yesterday some &lt;a href="http://collectiveidea.com"&gt;friends from Holland, MI&lt;/a&gt; came down to hang out with Steve and I all day. They started a project called Yard Vote &lt;a href="http://twitter.com/danielmorrison/statuses/929805773"&gt;about a month ago&lt;/a&gt; and we decided to help them give the application some upgrades.&lt;/p&gt;&lt;h2&gt;New Design&lt;/h2&gt;
&lt;p&gt;Steve worked out a new design for them that really features the mapping aspect and he created some killer icons. The previous version was fixed width and kind of narrow, so it was harder to see all the signs. Now with the full width map, you can really get a feel for the sign density in an area.&lt;/p&gt;
&lt;p&gt;&lt;a href="http://yardvote.com"&gt;&lt;img src="http://orderedlist.com/assets/2008/10/24/yardvote.jpg" alt="YardVote" class="feature" /&gt;&lt;/a&gt;&lt;/p&gt;
&lt;h2&gt;Email a Sign&lt;/h2&gt;
&lt;p&gt;When I started using YardVote I quickly found myself addicted, but the sign entry process from a phone was kind of slow. While Steve was working on the interface, I added the ability for Yard Vote to receive emails. In a few hours, I was able to glue together the workings to allow emailing yardvote@collectiveidea.com with the subject being the color of the signs and the body equivalent to the address. The email receiving can even update existing signs if you accidentally put in the wrong color.&lt;/p&gt;
&lt;p&gt;It was a lot of fun to take a day off and help out our friends with their cool project. &lt;span class="caps"&gt;FYI&lt;/span&gt;:&amp;nbsp;YardVote isn&amp;#8217;t just for Michigan and Indiana either, as there are already signs marked in 26 states. &lt;a href="http://yardvote.com"&gt;Go ahead and add one yourself&lt;/a&gt;. Let&amp;#8217;s see how many we can get before the election.&lt;/p&gt;</content>
      <author>
        <name>John Nunemaker</name>
      </author>
    </entry>
  
    <entry>
      <title>Scannability Equals Profit</title>
      <link href="http://orderedlist.com/our-writing/blog/articles/scannability-equals-profit/" />
      <id>4b42187cdabe9d77fc00013c</id>
      <updated>2010-01-04T14:07:31-0500</updated>
      <published>2008-10-16T14:31:00-0400</published>
      
      <summary type="html">&lt;p&gt;No one reads on the internet anymore. Right? Time and time again it is proven that we just skim and scan, eyes darting around like a chicken with its head cut off. When are we as web workers going to fully recognize that?&lt;/p&gt;</summary>
      <content type="html">&lt;p&gt;No one reads on the internet anymore. Right? Time and time again it is proven that we just skim and scan, eyes darting around like a chicken with its head cut off. When are we as web workers going to fully recognize that?&lt;/p&gt;&lt;p&gt;I use Facebook pretty rarely, but today I received a message from a friend so I fired up Safari and logged in. I immediately was distracted by how perfect the messages area of Facebook is designed. See below.&lt;/p&gt;
&lt;p&gt;&lt;img src="http://orderedlist.com/assets/2008/10/16/facebook_readability_1.jpg" alt="Facebook messages area" class="feature" /&gt;&lt;/p&gt;
&lt;p&gt;You might be thinking, ok, this guy is crazy because that text is too blurry to read. If so, you missed the point. In order to really dive into &lt;strong&gt;why&lt;/strong&gt; I think it is designed so well, I&amp;#8217;m going to add some overlays so it is easier to reference things.&lt;/p&gt;
&lt;p&gt;&lt;img src="http://orderedlist.com/assets/2008/10/16/facebook_readability_columns_1.jpg" alt="Facebook messages area" class="feature" /&gt;&lt;/p&gt;
&lt;p&gt;The screenshot above is around 660 pixels of real estate when live in Facebook. I shrunk it down a bit to fit here. Let&amp;#8217;s start with columns 1 and 2. Facebook could have merged those columns together. I mean  look at all the vertical space left unused for each message. The reason Facebook separated the image and details is when you merge them into one column you lower scannability. It&amp;#8217;s definition time. I define scannability as the ability to &lt;em&gt;quickly&lt;/em&gt; scan &lt;em&gt;vertically&lt;/em&gt; and &lt;em&gt;comprehend&lt;/em&gt;. &lt;strong&gt;Scanning is a very vertical thing.&lt;/strong&gt; As your eyes shoot down the messages page, it is very easy to scan the images, then the names and then the message body. It would be much hard to for your brain to comprehend things if it had to process, text then image, text then image, text then&amp;#8230;you get the point.&lt;/p&gt;
&lt;h2&gt;Speed Reading&lt;/h2&gt;
&lt;p&gt;&lt;strong&gt;Try something real quick for me.&lt;/strong&gt; Reread the paragraph above, but as you go through the lines, don&amp;#8217;t trace all the way from the beginning of the line to the end. &lt;strong&gt;Start on the second or third word and as you get two or three words from the end continue&lt;/strong&gt; to the next line until you have read the paragraph. The amazing thing is, your brain sees and comprehends the words on each end of the line, even though you don&amp;#8217;t look at them. I picked up this speed reading technique in the &lt;a href="http://www.fourhourworkweek.com/blog/"&gt;Four Hour Workweek by Tim Ferriss&lt;/a&gt;.&lt;/p&gt;
&lt;p&gt;This is why Facebook, whether consciously or not, is only using a three hundred pixel column for the message body, instead of the four or five hundred pixels that are available. As columns of text get more thin, there are fewer words to deal with on each line, which makes it faster to scan vertically and comprehend.&lt;/p&gt;
&lt;h2&gt;Poor Scannability Example&lt;/h2&gt;
&lt;p&gt;Take &lt;a href="http://twitter.com"&gt;Twitter&lt;/a&gt; for example. I love Twitter like a son, but I find their web interface almost unusable.  Aesthetically, it is pleasing, but the line length of the tweets (around 400 pixels as of article posting date) is so long that I lose the ability to scan vertically through them. The length mixed with the fact that the username is inline in the tweet forces me to &lt;strong&gt;read&lt;/strong&gt; my tweets. Yeah, that is right, I don&amp;#8217;t like &lt;strong&gt;reading&lt;/strong&gt; my tweets. I scan them for keywords and such and only read those that catch my eye or are by someone I hold near and dear. I do the same thing on your blog, that is, if I read your blog.&lt;/p&gt;
&lt;p&gt;I believe &lt;strong&gt;scannability is one reason Twitterrific, &lt;a href="http://getsnitter.com/"&gt;Snitter&lt;/a&gt; and all the mobile Twitter clients are so popular&lt;/strong&gt;. Remember? People don&amp;#8217;t read anymore.&lt;/p&gt;
&lt;h2&gt;The Point&lt;/h2&gt;
&lt;p&gt;Yes, I do have a point. This is not just a rant. I think as screens started getting wider, web workers  decided they should use the extra space. I mean, we can&amp;#8217;t leave it blank, it&amp;#8217;s above the fold (don&amp;#8217;t get me started on that). &lt;strong&gt;Wrong.&lt;/strong&gt; Just because the space is there, doesn&amp;#8217;t mean it should be used. Next time you begin work on a website or web app, remember these three simple steps.&lt;/p&gt;
&lt;h2&gt;3 Simple Steps&lt;/h2&gt;
&lt;ol&gt;
	&lt;li&gt;Scannability&lt;/li&gt;
	&lt;li&gt;???&lt;/li&gt;
	&lt;li&gt;Profit&lt;/li&gt;
&lt;/ol&gt;</content>
      <author>
        <name>John Nunemaker</name>
      </author>
    </entry>
  
</feed>
