Form based vs WYSIWYG editing - the lowdown

Creating a great website requires many elements to tie together. From awe-inspiring design that promotes a strong digital experience, to a firm codebase which is secure, scalable and maintainable, the importance of promoting an excellent standard cannot be forgotten.

However, one often overlooked component of the web design process is content management – specifically how will users update and create new content that adheres to brand guidelines, is easy to manage, and separates the concepts of data and design.

There are really only two schools of thought when it comes to the content management process – Form Based and WYSIWYG (What You See Is What You Get) editing. Let’s take a look at both approaches, and outline some key pitfalls to avoid when making a decision.

A common form of editing especially in small sites is via the use of a WYSIWYG editor. You’ll be provided with a large text area to input your content as well as buttons to help you align text, put words in bold, insert images/table etc.

The argument is that anyone who is comfortable formatting a word document (adding images/headings etc) should be OK with generating a page of content in a WYSIWYG panel.

The WYSIWYG editor does have some benefits, in that it promotes immediacy and works well for a fairly tech-savvy user who would want more freedom in terms of page layout.

Even so, there are some large concerns when choosing this route. What you see is rarely what you get when using the editor. As additional styles and formatting might be applied via external CSS or templates, the representation of content to the final page can be miles apart.

From a technical perspective WYSIWYG editing promotes poor standards of maintenance as it does not separate data from design. A lot of decisions around the formatting of code should be made at the template level (not the editor) so that content editors don’t break the page with malformed HTML.

Form based editing makes up a large portion of the way enterprise and large business sites are run. It encourages separation of concerns – content marketers worry only about content, web designs focus on high quality template design and build etc.

Whilst there is a short and shallow learning curve for form based editing (knowing which field relates to which bit of data on the front end), there is very little that can go wrong. Good form based editors will provide field types that directly relate to the type of content you need to enter i.e. a calendar for date entries, a predefined dropdown for select choices, a media library field for images etc. The end result is brand and code consistent pages.

Some may argue that this approach removes the layer of creative freedom that some desire when creating content, but we’d say the benefits far outweigh the trade-offs. With data sitting in the correct format in the correct places, it is even easier to reuse data to create a variety of outputs i.e. mobile sites and apps, print collateral and more. It also lends itself well to site wide upgrades and changes (a change on a template will be applied to all pages rather than having to edit them one by one).

There are some sensible questions to ask yourself and your development team or agency when you are having your site built. After all, maintaining a site’s content should be both efficient and fun for content editors.

• Does the content management process promote scalability. For example if a change needed to be applied to a template, can this be actioned in one place or does lots of content have to be updated manually?
• Does your content process promote sensible SEO constraints? Are there defaults in place for where heading tags, alt tags are used etc?
• Who will be managing the content most frequently? A developer? A general/content marketer? What level of tech expertise do they have?

At Debunc, we unashamedly promote the use of form based editing for content management. Even so, we know that there are cases where a WYSIWYG editor is required for some bespoke needs. To manage this, we create a separate template as a blank canvas for more tech savvy users to create unique and often complex page configurations.

Fortunately (or unfortunately), the digital world is made of a mix of varying needs and so there really isn’t a one size fits all solution. We’ve outlined some key criteria when helping you to decide your content management needs:

Choose WYSIWYG if:

• You do not have a competent development team/agency to support with template design and build
• Your content editing team is comfortable with the foundations of HTML/CSS
• Scalability/upgrading the site is less of a concern

Choose Form Based editing if:

• You have a feature rich site
• You are trying to maintain a consistent web/brand experience
• You have a separate team to management development concerns
• Your content editing team have a lower technical understanding