HTML is a bit of a tricky beast, for a long time you couldn’t make any changes at all without technical knowledge of how it works. Quickly enough people created HTML “editors” but until recently they’ve been well, frankly rubbish. Thankfully the one used it Sitecore ticks all the boxes; it has all the standard editing features you’d expect to see and behaves in a WYSIWYG fashion.

The only downside to this process however is that rich text editors still can’t replicate a web developer’s ability to produce HTML that is always compliant with XHTML standards, especially once all the features of the rich text editor have been enabled.

This presents a particular problem for projects caught between the conflicting requirements of 100% compliant XHTML websites while also allowing non-technical content editors to make changes using the fully featured Rich Text Editor. Here are 5 suggestions that will help you with both of these:

  1. Rich Text Editor Snippets – This feature in Sitecore allows you to insert prefabricated HTML templates that have already been validated for XHTML compliance. An example would be a div containing Lorem Ipsum text with a placeholder image floating to the right. Content editors can then insert this snippet into the RTE via a dropdown menu and then change the filler text and image to suit, the underlying HTML itself however will be unchanged. A good example of how this can be done can be found on learnsitecore.cmsuniverse.net.
  2. Sitecore WebStylesheet – Any CSS classes stored in this style sheet (default.css) will be available in the rich text editor via the “Apply CSS Class” dropdown menu. This allows editors to style their content according to a predefined style guide instead of using hardcoded inline styles. This also greatly reduces the amount of non-transitional compliant HTML generated as most of the invalid statements are regarding style related tags such as align=”left”. Additional details on configuring this feature can be found in the Client Configuration Cookbook on the Sitecore Developer Network.
  3. Automatic Workflow triaging of content – With a small amount of development a workflow action could be created that would automatically put items that fail validation into an “Awaiting Web Developer” state. From here someone with technical HTML knowledge could manually fix the errors and then move the item into the normal “Awaiting Approval” state. This way the content editors would no longer have to worry about HTML validation and items would only be escalated if special attention was required. I’ve gone ahead and created this in a previous blog post which you can find here.
  4. Customize the RTE Profile – Each rich text field is associated to a profile which defines which buttons are available (e.g. bullet points, bold, italic). I would recommend standardising this across the site and only removing those features which aren’t required. More information on configuring the RTE profiles can be found in the Client Configuration Cookbook on the Sitecore Developer Network.
  5. Reduce use of Rich Text fields – In many cases the problem can be avoided in its entirety by simply redesigning the page so it no longer needs the rich text field, you can achieve this by replacing it with a series of single and multi-line text fields. This has the added bonus of keeping content and presentation separate which allows for greater reuse and flexibility.