• RedDot CMS Blog
• 13.03.2020
• EN

rdb: RedDot and Usability: How to make your RedDot CMS projects easier to use for authors

Regardless of which CMS application you use to manage a site or how well you optimise it from a performance perspective, the project will be deemed a failure by end users authors if they are unable create and edit content quickly and easily.

CMS projects that are simple and easy to use not only reduce the amount of time required for content changes, they will also minimize possibilities of content entry mistakes and/or inconsistencies across site pages.

The key to making a project ‘useable’ for all authors, is to strike a balance between catering for beginners with limited or no web content management experience and power users – who many want as many bells and whistles as possible.

I recently came across a quote by a developer from the RedDot community along the lines of “…If an author has to ask me twice how to perform a task, then I have failed as a developer”. (apologies for not being able to quote that person directly.. I can’t seem to relocate the source at the time I posted this blog entry!) The beauty of the SmartEdit interface within RedDot CMS in particular, is that users are provided with instant feedback as to which elements on the page they can edit and the type of content of that can be displayed on the page. Very little training (or in some cases none) is required since the RedDot’s on the page act as a ‘map’ or a ‘guide’ as to how to create and or edit the page.

Having also run training sessions for authors using other CMS applications (in particular Drupal and Umbraco), I’ve found that those applications that require users to edit content via forms take some time getting used since there is a disconnect between how the content entered into the forms will eventually be displayed and positioned on the page. Even though there are plenty of powerful CMS/ECMS applications out on the market – my feeling is that RedDot’s main selling point is its ease of use and ability for authors to start editing content straight away with minimal training. This is extremely important within a large distributed content management setup where tens to hundreds of users are responsible for site content.

On the flipside, a poorly constructed SmartEdit page can be a nightmare for users – not knowing what each and every ‘RedDot’ does (due to poor labelling, layout issues), too many ‘open/close’ RedDots etc which can make the editing experience very frustrating, confusing and time consuming – no matter how much of a RedDot CMS guru you think you are!

Below are some simple techniques, hints/tips that I use regularly to help improve the content entry process for RedDot CMS authors.
 

SmartEdit features

Label all RedDot’s clearly and consistently.
Never just stick a RedDot in the middle of the page and assume the user will know what it is for. Come up with a labelling standard/convention for content placeholders – as well as containers, lists, dynamic anchors and open/close RedDots. I tend to use the word ‘maintain’ for linking items, ‘edit’ for open/close RedDots and very brief description/purpose for all other RedDots.

Reduce amount of RedDots displayed on page at a given time.
Too many RedDots on the page can be a bad thing since authors become overwhelmed and don’t know where to start. Consider using the ‘child’ element feature which will enable you to group related RedDots together to enable the user to edit all items via a single form, or perhaps split your template into individual ‘page parts’ – enabling content to group together into individual managed items.

Configure Editable Areas
The Editable Areas feature provides users with feedback as to which areas of the page are editable (by hovering over a RedDot) or which page item is currently open for editing.

Add Edit via form RedDots
Once users become proficient with the layout and purpose of the RedDots on the page, they generally prefer to edit all content via one big long form without having to click on individual RedDots. Another time saving measure…

Provide the user with page feedback
Consider displaying the ID and or GUID of each page and page part on the page. Searching for pages using the ID or GUID can be a lot quicker in some cases – especially using the ‘Connect to Existing’ page option when linking page parts across multiple foundation pages.

Consider use of ‘not applicable for workflow’ for ‘cosmetic’ content items
Having to submit small content changes through the workflow before they can be published can become a major pain for most users. Major content changes (such as page titles, page content etc) may only be appropriate to go through the workflow. Cosmetic items – such as images – don’t necessarily need approval prior to publication. Use the ‘Not applicable for workflow’ option within the placeholder settings to bypass workflow.

Where possible, don’t use target containers
By far, the most confusing and cumbersome feature of RedDot CMS projects are target containers. Having two ‘open and close’ RedDots on the page to manage the bare necessities (title, page content, meta information) is totally unnecessary…

Automatic resizing options for image
For all image placeholders, make sure you utilise the ‘Scaling and Conversion’ features which will automatically scale images down to the correct size for display within the page. Not only will this ensure that images don’t affect the layout of the page (especially if they are too large) – but also saves the user a huge headache having to have to crop images down to an appropriate size using Photoshop or other image editor.

Always provide detailed decriptions
In addition to clearly labelling your RedDots, ensure you provide detailed descriptions for all placeholders (which is displayed to the user when the item has been clicked for editing.) These descriptions act as a ‘contextual’ help for the user, so provide as much information as possible.

Enable direct edit features
For Text and Standard Text field placeholders, activate DirectEdit features to enable authors to make quick and simple changes directly within the page (by holding down the CTRL key while clicking on the RedDot). This feature is particularly helpful for fixing up spelling and grammatical errors without having to open up the text editor.
 

Text Editor

Make sure that you enable/disabled any unwanted settings under the Text Editor Settings option. In order to ensure consistency across site pages in terms of layout and content and styles, users should be never be able to change font colours, insert HTML markup etc. Providing a predefined set of text formatting options will ensure that no ‘unwanted’ HTML code and styling information makes its way onto site pages.

Ensure that system folders (which contain background images, styles, javascript etc) are not accessible via the text editor (using the ‘folder not available in the text editor’ option – otherwise users will end up uploading images and files into these folder repositories. I’ve seen this happen too many times, which makes it impossible to find uploaded files if they are not stored in the correct folder structure.
 

Content Class Pre-Assignment

For all link elements (lists, containers, anchors) make sure that users can only create and connect up new pages based on a predefined set of content class templates. Overwhelming users with too many options when creating a new page can be very confusing and may cause the user to connect up unsuitable objects (such as headers, footers, javascript, css) – that may ‘break’ the layout of the page.

It’s also an added benefit to give your content classes’ detailed descriptions that provide information as to each content classes’ intended purpose. There is also a new option in v10 which enables you to assign icons against content classes during selection.. just another little touch which can make all the difference!
 

Custom Plugins

I’m all for creating custom plugins wherever possible to reduce the amount of clicks required for a content entry task. Try and keep the look and feel of all your plugins consistent, so users will be able to gasp how to use the plugin straight away.
 

Training

Whilst working on a number of RedDot CMS projects for overseas clients, I found creating ‘tutorial’ videos invaluable for training up users that I wasn’t able to connect with face to face. It is much easier for users to watch and learn how to perform a task from example – rather than reading through a formal step-by-step training manual or guide. This is particularly true when it comes to learning how to use the wysiwyg text editor – which tends to be a source of frustration for most users due to its complexity and countless features. You can even incorporate these videos into a ‘main menu’ page in the project making it easy for all users to view when needed.

Feel free to share some of your hints/tips that you use to make your RedDot CMS projects easier to use!