Post Detail

Apps are ascendent, but websites are far from obsolete. In fact, there’s virtually no end to the need for increasingly sophisticated web presences. Fortune 500 or corner lemonade stand, you’ve got a site, and odds are it could be better.

Odds are, also, that it runs on WordPress. Half of the world’s top million sites (including Forbes.com) do. But many designers, myself included, have a love-hate relationship with WordPress. On the back-end, as a place that a writer or editor can manage content, it’s amazing. This is why they call it content management. It works great out of the box and you can customize the interface for your editorial clients quite easily through the use of plugins or (if you are ambitious) with your own code.

And since most people who produce web content know how to use WordPress (because so many sites already use it) it’s a natural choice when you are setting a site up for a not-technical person to use. But the presentation of that content on an increasing number of screens has been less of a slam dunk for WordPress.

WordPress, like virtually all content management systems, relies of “themes” to determine the fonts, colors and layout of a website. The wonderful thing about themes in WordPress is that if you set things up in a standard manner (i.e. a blog) you can effortlessly change themes and transform the look of your site. But in a world of increasingly sophisticated web sites and full-fledged web apps, that turns out to be a big “if.”

Once you are in non-standard territory, you either have to find a theme that is doing almost exactly what you want to do, do an extreme customization on an existing theme or (more efficiently, perhaps) build it from scratch. Very quickly, terra firma is gone and the wonderful content management advantages of WordPress begin to seem questionable.

WordPress, and many other forms of software for the web, relies on convention over configuration to really be effortless. If you are setting up a blog or some kind of well-established type of site, there will be ready-made themes available, and not to difficult to find, that can enable you to get a good-looking site up quickly. But once you begin to diverge from convention in a meaningful way, you are confronted with the WordPress conundrum. Building a WordPress site entirely from scratch, to a person who knows what they are doing, may make technical sense. By starting clean you can minimize the amount of code that the site uses and the conflicts that can arise with other people’s code. On the other hand, if you are the person paying for that developer’s time and having to budget for every feature you want included, the process can quickly become time-consuming and expensive. Exactly the opposite of what people sign on for with WordPress.

One thing that is lost when you ditch pre-built themes is all of the design and user interface craft that goes into a well-built theme. Whether you build a theme from scratch or use some kind of simplified WISIWYG theme builder for WordPress, you are not assured of having top-rate contemporary design—unless you’ve hired (or happen to be) a top-rate contemporary designer. Again, more than you bargained with when choosing WordPress.

On the other end of the spectrum, you can try to find a theme that does most of what you need and customize the rest. The advantage here should be that you preserve all of the design and interaction goodness in your chosen theme. In actual practices, though, the demos of themes and what they look like as a raw install can be strikingly different. As Andrew Powers, founder and CEO of the PageLines front-end framework for WordPress, writes in a post about the problem with themes, “most people don’t have the skills or time needed to do something as simple as recreate the demo.” He offers the examples below of the disjunction between the demos of some popular premium (i.e. paid) themes and what your initial install might look like.

Powers is not just musing on this problem. PageLines’ new product, DMS (for Design Management System) is an attempt at solving them. DMS is installed in WordPress just like any theme, but that’s where the resemblance to a standard WordPress theme ends. Instead of specifying what your finished website will look like, DMS creates an interface for building your site with drag-and-drop components right on top of your live site. In effect, DMS transforms the design and construction of a WordPress site from a back-end process to a front-end experience. This immediate visual feedback cuts a tremendous amount of time out of the site development cycle and the modularity takes a lot of the guesswork out of how the details of your design are specified.

For those unfamiliar with how websites are built, there are two basic categories, static and dynamic. A basic business card or brochure-ware website consists of one or more pages that are not intended to change often. The work of these sites is the creation of the content and crafting the visual presentation. The “code” aspect of static sites is often quite minimal, perhaps limited to animated visual effects or layout variations based on screen size. But people discovered a problem with static sites—Google didn’t love them. Search engines want your site’s content to be highly specific, yes, but also frequently updated.

Even better than updating your static text, from a search perspective, is to add whole new pages, optimally with content of even greater specificity. So the solution to the Google problem, for many websites, became adding a blog. And here is where static sites took a turn towards the dynamic. If you are a web designer or a developer, it is not an efficient use of your time (or of your client’s money) to build a new page for every blog post. And most blog posts need to have a fairly standard set of elements, like post dates or bylines, and should look like the website their are attached to.

Long story short, MovableType, WordPress, Blogger and a raft of other purpose-built blogging platforms arose and their progeny are now used by the majority of the world’s websites, many of which don’t even have a “blog” component. I’m skipping over vast swaths of web history here, but the virtue of these platforms is that they are the easiest way to build and maintain a dynamic, template driven website. And as the tools have progressed, more people can do more while knowing less. This is, in general terms, a very good thing.

As any developer will tell you, though, there is a lot of complexity behind the scenes involved in making something user-friendly. WordPress is a case in point. In order to create a system where themes and bits of functionality (called plugins) can be swapped in and out at will through the admin interface, WordPress itself (and the developers that code for it) needs to manage an ungodly pile of files. Typically, there are multiple places to look when you need to change some little configuration or setting. And anything you change in the code, or any plugin you add, can have unintended consequences downstream on some other attribute or plugin. And you don’t always see the effects immediately.

The graphic below shows how Powers has positioned his DMS product in the WordPress design space. Hand coding is the slowest and most difficult option, and requires the intervention of a designer as well as a coder (not often the same person!) Using a pre-built theme is fast, but customization can be difficult. WYSIWYG site builders are built for customization, but time-consuming to achieve professional results. DMS aims to be both fast and easy to customize. PageLines is built on top of Twitter’s Bootstrap framework, so everything looks clean and modern right out of the box. Plus, most web designers are familiar with Bootstrap at this point and know how to quickly use and build on its class names to style page elements.

DMS is in fact part of a larger trend to make web design both more modular and more declarative. Google’s javascript web app framework Angular.js, for instance, lets you insert dynamic data variables and other functionality right into the the HTML element that they refer to. And the Adobe-supported open-source code editor, Brackets, lets you view the snippets of linked files relevant to a given HTML element in an accordion directly below it in the code. Similarly, when you work in DMS, you have immediate access to the settings for a given page element directly adjacent to the element in your browser.

It’s important to make clear, however, that you still need to know what you are doing to take advantage of the framework’s power. If you are confused about how websites are built, or how WordPress works, DMS may not be for you. But given a grasp of the fundamentals, even an enterprising non-designer will surprise themselves with how much they can do—and how quickly—once they are up and running with DMS.

One of the things that distinguishes DMS from some of its competitors, like Squarespace (which also offers a great visual interface and well-crafted components, as well), is that DMS is built on top of WordPress. This means that in addition to the components built-in to DMS, and the plugins, sections and DMS child themes available (for a fee) from the PageLines store (52 at present) you also have the entire selection of 26,567 WordPress plugins to work with, many of them free.

The function of a premium framework and a paid store amidst the free-for-all that is WordPress is itself an interesting story. Like many open-source projects, WordPress has grown and thrived on the basis of the unpaid contributions of legions of developers. Many have used their demonstration of expertise in the free plugin market to drive business to their paid consultancies. Others have built additional functionality on top of their free plugins to create premium versions. As in the world of free apps, this can seem annoying and manipulative—the free app (or plugin) as gateway drug.

But after using DMS, my perspective on this has changed somewhat. Instead of avoiding paid plugins on DMS and WordPress, I found myself doing a cost/benefit analysis of how much time a given plugin or DMS section would save me and often concluded that the prices were very reasonable. In this way, a paid framework like DMS makes you realize that you are indirectly hiring developers to help you with your projects. For those familiar with Jaron Lanier’s recent book, Who Owns the Future?, this is a very Lanier-esque concept.

The way the PageLines store is integrated right into the DMS interface is really helpful, but only if what is on offer is genuinely useful. In the case of the DMS components, they need to not only be functional and attractive right out of the box, but also generalized and reusable in many different contexts. I asked CEO Powers how tightly they will be controlling what goes in the store. “Running a marketplace comes down to economics,” he responded. “What we do is review extensions for basic quality and functionality, and then let them play the game. We’ve designed the store to be a meritocracy, where the best extensions win.”

The developers themselves have to make a lot of decisions about satisfying their customers. Most expert WordPress users expect plugins to be editable and forkable, since it is an open-source platform. All of the DMS components are addressable in the front-end site view mode, but some offer control through the back-end dashboard as well. And Powers tells me that, “Most developers (all so far) have opted to license their products in a way that allows users to use them on as many sites as the user wants.”

Has there been pushback to the pricing model from users? “Yes!,” Powers affirms. “The expectations of the market that everything should be free, regardless of quality or support, have been a challenge for us.” In the end, though, designers and developers are pragmatic. If something is going to save them time and help them do a better job for their clients, they will pay for it.

I talked to Evan Mattson, one of the developers who has contributed substantially to the PageLines store, about his perspective on building for the platform. “DMS is doing for web design what iTunes did for music by bringing the marketplace right into the hands of the user. Built-in extensibility means significantly less time finding and implementing what you’re looking for, which adds up to a much better experience for the user.” To Mattson, “Developer… is just a fancy name for the first user. I’m also interested in things that save me time and energy, so [the store is] really a win-win.”

It will be interesting to see how PageLines DMS grows and whether Powers or others will extend the concept to other platforms. A DMS for Drupal would be great as well as for some of the new JavaScript frameworks like Angular, Ember and Meteor. Famo.us may already have something similar in the works, as well. Powers has open-sourced the code for DMS, which certainly opens the way for other applications.

PageLines is attempting to name something and also be the first working example. Will “DMS” become a well-used a term as “CMS”? Either way, PageLines DMS is making a case for being the fastest way to build high-quality, production-ready websites. The future will tell if others follow suit.