24 Ways behind exhibit glass
If you work for the web, you likely have this one in your feed reader already. Published once a year, in December, 24 Ways is an “advent calendar for web geeks”, as well as an excellent reference for web design and development at any other time of the year. Each issue is an event that marks—not the end—but the beginning of a new year of ideas and developments in web design. 24 Ways has run on Textpattern CMS since its debut, and being an excellent site inside and out, it’s well deserving of our first Site Watch column, and thus first Exhibit entry. Drew McLellan, 24 Ways Editor-in-Chief, found time in his busy schedule to give me some background about the site—how it was built, who helps with the work involved, etc.—and shared his honest thoughts about Textpattern CMS too.
24 Ways, the brainchild of Drew McLellan, took shape in mid-November of 2005, though looking quite different then from how it looks today. “If you had an idea back then, you started a blog” says Drew, who, after seeing sites like the Perl Advent calendar, intended it to be “24 quick tips or thoughts”. But as he pointed out, “it very quickly turned into longer articles, simply because our authors were more generous with their time than I’d asked. I’m quite happy, as I think it’s turned out well.”
Indeed, 24 Ways looked much like a blog, as the WayBack Machine reveals. But in 2008, after teasing Drew relentlessly about the original design’s shortcomings, Tim van Damme took the challenge and did a redesign. In 2011, Drew took it one step further and made the layout responsive.
A design that stands out
Although looks are usually a matter of taste, 24 Ways remains smart and fresh after all these years. Its unusual design comes with a few quirks, however, like having a navigation that blends so well with the rest of the graphical environment that at first it’s hard to identify it as navigation. Interactive changes in linked elements throughout the site are quite subtle, and this might be a challenge in terms of usability, but the combination of colours is one that would not confuse a colour blind person.
There are also details I find particularly useful, such as a tab linking to comments at top of every article, and the author profiles in context with stories that bring reader and author closer together. The staggered avatar images in comments are also interesting; they seem disorderly at first, but the result helps to differentiate the various comments, much like the conversation flow in an instant messenger. And perhaps a luxury in this day and age, 24 Ways does not sit under a load of advertising, which makes it faster and more pleasurable to read, without having to rely on Readability, for example.
Articles are organised by year, with 24 articles in each one. There are no categories or keywords, but lists of related articles are output next to every story using chh_related_articles, which suggests a thematic ordering of some sort on the backend. Should a reader still get lost, there is the neatly organised archive and search function, both are fairly easy to spot. In general, content organisation is more suited to the calendar’s publishing rhythm than the flow of a typical blog.
Nuts and bolts
Drew tells me he originally picked Textpattern partly because he was short on time back in late 2005, but also because he knew the CMS well, and that it was capable of handling the sort of site he was after.
Each year of articles is a section, and so each year I create a new section (e.g. ‘2011’) and set that to be the only one listed on the home page. There’s also an ‘authors’ section, which handles the profile pages for each author. Each post has custom fields for the day number (1–24), the author name, URL and identifier.
The only core modification is the custom field for the author names being used in the RSS feed too. Drew says he doesn’t like core modifications because of the overhead on updates, so he sticks with plugins, or custom code packaged up as a plugin.
Under the hood of 24 Ways those plugins are quite a few, actually. The site uses asy_jpcache for caching, which Drew finds indispensable and highly recommends. There’s the aforementioned chh_related_articles, glx_gravatar for the pretty faces next to comments, and glx_code (“for code samples, as it’s a nightmare trying to embed code in Textile”), to name a few.
There’s also a custom plugin called tfw_days, which generates the days navigation down the left site of the page. Drew describes it:
That navigation links to the article for each day in the currently selected year (section), but also only shows links for published articles. So on the 14th December, only half of those numbers for the current year will be links, as there are still 14 more articles to go. It enables me to add the following to a template: <txp:tfw_days day="24">24</txp:tfw_days>. That becomes a link to article 24 of the current year if it’s been published, otherwise it just returns the number as unlinked text.
Nifty, eh?
After seven years, Drew finds Textpattern CMS has served them well, and although he expects to migrate 24 Ways to a custom solution eventually, he admits: “Mind you, I say that every year and we’re still on Textpattern!”
Back in time
Although seven years is a long time, Drew and Textpattern crossed paths much earlier. He became aware of the project around the summer of 2001 while reading Dean Allen’s Textism. At some point he contacted Dean and offered to test the new CMS and early in 2003 was finally able to run a very basic install of Textpattern on allinthehead.com, Drew’s personal blog. Drew rolled back the years:
Prior to [using Textpattern] I had been blogging via a rather pathetic home-spun ASP system on my (ahem) Dreamweaver blog. The opportunity to use Textpattern was an opportunity for a fresh start. I registered a new domain, grabbed a PHP hosting account and did what bloggers do; I posted. I like Textpattern’s uncomplicated approach, and particularly its tag-based template language.
Old-time Textpattern hands might even remember Drew as a Textpattern support forum moderator (“Drew”, his nick) or remember one of his plugins for early Textpattern incarnations.
Tools of the trade
In view of all that, one might assume that Texpattern is a regular choice for Drew, but this isn’t necessarily the case. He believes that tools like Textpattern and WordPress are primarily geared towards blogging with pluggable features that increase their scope, and though they can be used to publish all sorts of sites, he says “the underlying admin interface of posts in categories may be something that’s not always easy to understand for a client”.
https://twitter.com/#!/acbca/status/2616377365
This might be one reason he’s developed Perch, “the really little” CMS that takes a page-based approach. Perch has a page-tree in its management interface which clients can use to browse to the page the content is on, and it offers content reuse and multiple fields to capture specific data—functions that Drew believes make for a more intuitive use.
Drew says Perch’s templating system will be familiar to any Textpattern user, “its design owes a lot to Textpattern and is completely tag-based”. He explains that if he reaches for Textpattern, it’s for personal projects where Textpattern proves to be simple and effective, but he still finds it a bit basic for commercial applications:
If I really think about it hard, I’m not sure I’d actually ever be comfortable providing Textpattern to a client commercially. Whilst it’s capable, it lacks polish.
Area of application may be a contentious point, and those are fair—not fightin’—words based on Drew’s personal experience. But one can see why something like commenting would be a huge issue for Drew, provided a site like 24 Ways receives a lot of attention, and with it, a lot of possibilities for spam:
These days, if you have a form on your site, you’ll get spam form submissions. Textpattern doesn’t do anything effective to stop those, and the UI for clearing through spam comments is slow and cumbersome. All comments therefore have to be moderated, and working through the moderation queue becomes a chore. As a result, valid and useful comments can sit in the queue waiting for a long time before they get posted.
I’m very much against any anti-spam measures that shift the burden to the website visitor. CAPTCHAs are an example of this—they may spam the problem of genuine users by making them jump through hoops to post a comment. That’s the wrong approach. Using Akismet would be a better solution, along with a redesigned interface to make it quicker to manually sort through any spam that slips through the net.
Of course it’s fair to point out there are at least two spam blocking plugins for Textpattern—mem_akismet and the excellent rah_comment_spam, by the community’s security expert, Jukka Svahn—along with the sometimes (admittedly) insufficient preview step.
In addition to issues with comment spam, Drew believes Textpattern could really benefit from a way to identify repeat commenters, or at least those that are logged in so a moderator wouldn’t be forced to approve their own comments.
An easy way around this problem, and one desired by a growing number of people interested in more social sharing, is to implement commenting services like DISQUS (as we have done) or Livefyre (presumably possible), which provide advanced functionality like Drew speaks of (and more) through slicker user interfaces and with lower overhead. Not to undermine Textpattern or offend the CMS puritan, but these are probably smarter solutions for commercial clients anyway who are more interested in the advantages of sharing content easier, and measuring the results.
Another place Textpattern “falls down”, according to Drew, is caching:
I wouldn’t run a Textpattern site without a cache in front of it. I use asy_jpcache, which is excellent, but I can’t see why this functionality shouldn’t be built in.”
This is another fair point, and we have heard these kinds of arguments before with other key functionalities having universal appeal, such as native handling of multilingual content like the once-great Multilingual Publishing Pack provided. Though many people would say why put this into core when an “excellent” plugin does just fine. A few possible reasons, of course, would be to reduce risk of plugin failure due to incompatibilities with other plugins (more is not necessarily merrier), to reduce maintenance headaches should plugins be abandoned, or simply to reduce potential lag time after system updates, if for any reason plugins need updated against core changes.
A community effort for the community
Despite any shortcomings with Textpattern, 24 Ways has so far published 168 articles from 95 authors with subjects ranging from front-end development to ways to communicate ideas. Apart from Drew, who always writes Day 1 of each year, saying “I think it’s only fair that if I’m asking other people to contribute to the site that I stick my head over the parapet first”, a huge number of other people have generously contributed. Nowadays a lot of help comes from three main people: Brian Suda works on the content side, researching article topics and authors as well as helping with author liaison. On production, Anna Debenham gets the articles formatted and ready in a “staging” copy of Textpattern, and Owen Gregory proof-reads articles, writes introductions, and, as Drew says, “generally has our backs for all the little details that matter”.
The result of this community effort is a site that not only keeps track of current trends, but which tries to look ahead, or stays universally relevant, as far as it’s possible in a field where eleven months is considered a very long time. Not an easy task, and Drew explains how they go about achieving it:
One of the interesting things about 24 ways is that the articles we publish in December are our most current articles for the next eleven months. We quite often cover more cutting-edge topics; things like CSS techniques that are so new they only work on one browser. Not only does spreading the word help increase demand for those features to be implemented in other browsers, but quite often the techniques we were writing about as cutting-edge in December are production-ready by the following autumn.
Still, he worries some of the older articles may become irrelevant over time, or that the techniques they promote would no longer be considered good practice:
I don’t think we have anything on the site that falls into that category yet, but surely it will happen at some point. I’m not sure [what’s] the best way to deal with it, apart from perhaps starting the article with an advisory note explaining that what constituted best practise in 2005 [for example] has since changed. Perhaps we should publish a new article with an updated technique for each outdated article we denote.
Before such a need arises, the folks at 24 Ways have enough new ideas to choose from. As Drew points out:
In 2011 more than half of the authors were new to the site and most of those were chosen simply because they emailed in and pitched a good idea. The selection process is a mix of us finding people we think have interesting things to say and approaching them, and authors contacting us to pitch ideas.
It’s the ideas, I think, that make 24 Ways above all a good read at any time of the year. So if you have that exceptional idea, or a technique nobody has previously thought of, don’t wait too long to let the 24 Ways crew know.
We start planning for each year around September. I’d encourage anyone with a good idea and a passion to write about it to drop us a line and pitch it to us.
And that goes ditto for us.
About Drew McLellan
Drew McLellan is Editor-in-Chief of 24 Ways, and the guy behind that other great Textpattern-based blog, allinthehead.com. He’s been hacking the web since 1996 and has worked on both front- and backend development projects for a long list of important companies. He was also an evangelist for Macromedia’s Dreamweaver during its early days, and a former Group Lead for the Web Standards Project.
Currently, Drew is a Director and Senior Developer at edgeofmyseat.com, and the creator of Perch, a little page-based CMS for small and mid-sized web sites.
Like most birds in this business, you can find him in the branches at @drewm.
comments powered by Disqus
