With Great (CMS) Power Comes Great Responsibility
One of the biggest advantages of using a content management system (CMS) is that it allows developers to empower site owners with unprecedented control of their website.
Giving website owners the ability to create, edit and manage their web property has many benefits. However, having too many features and site-management capabilities can burden the client and can wreak havoc on a website.
Read on for the five most common mistakes web developers make in an effort to empower their clients.
Mistake #1: WYSIWYG Editor Overload
What You See Is What You Get (WYSIYWG) editors (or rich-text editors) are great features to install in content management systems because they allow content creators the ability to create, edit and manage web pages without the need to know HTML.
WYSIYWG editors are so useful to end-users that you’d find most open source content management systems with it enabled by default. For example, WordPress has the Visual Editor and it’s the default content-editing view.
But is it really a good idea to let your client center text and turn it purple? Probably not. Ever been to a site with blue underlined text that wasn’t clickable? How about a company website that have hyperlinks in bolded, black text? These probably happened because they had out-of-the-box, un-customized WYSIWYG editors, which usually comes with everything but the kitchen sink.
In fact, the first thing most of our clients ask about is if they can limit how much their editors can use formatting.
Consider customizing WYSIWYG editors to only have the following:
Text Formatting
- Heading 1
- Heading 2
- Heading 3
- Heading 4 (if needed)
- Blockquote
- Ordered and unordered lists
- Italics
- Bold
- One or two special CSS classes for emphasizing or de-emphasizing text
Web Content Elements
- Links
- File upload/attach
- Images
- Tables (with instructions to use properly on tabular data only)
Get Rid of
- Underlining (because the industry best practice is to use underlines only for hyperlinks)
- Direct font controls (such being able to change the color)
- Emoticons
Below, see an example of a rich-text editor with too many options and features. It burdens the user interface and, when used improperly, can make web pages look like a Myspace page.
By configuring the CMS’s rich-text editor, content creators can have a less intimidating time composing content.
Of course, this is just a general guideline. Some project might need more and some might need less. A good practice would be to determine what’s needed and what’s not for each project instead of shortcutting the process and simply just providing the client with everything.
Mistake #2: Clients Editing CSS or HTML
A reasonably astute person with a desire to learn can edit HTML and CSS. But that’s true about anything. Just as car manufacturers don’t expect us to understand the inner workings of a car to be able to operate it, we shouldn’t expect our clients to know CSS and HTML to be able to run their website.
Like many design agencies, we tried to train our clients and their staff with HTML and CSS so that they could be fully empowered to make changes to their site. But every time, typically within a year or so, the client was so sick of it and had wasted so much time and money doing something they hated that they had us take back control of their websites.
When deploying content management systems, consider limiting access to the style sheets only to experienced professionals.
Mistake #3: Confusing "Empowered" with "Expert"
There was a recent Harvard Business Review report that talked about a number of studies that have shown that in order to be an expert at something, you need to have 10,000 hours of experience at it. It applies to chess, and music and business. It could also apply to web design and web development.
While you might have been in this industry for 5 or 10 years, your clients might only have a few hours experience as an operator of a site.
Don’t just turn over a CMS and hope that your client has enough experience to be an expert at usability and web design. Make sure you’re available for when they’re stuck.
Mistake #4: Giving Them More Than They Ask For
We’ve had a couple of clients come to us and tell us that their last web developer created a site that doesn’t do what they need it to do.
When we looked closer, we discovered that it did, in fact, do everything they needed it to do. And a lot more.
By going in, modifying the interface and removing and renaming things, we were able to create a much easier UI to use.
We know too many developers who create too many features for a project. Of course, when they put the product in front of real users, it becomes quickly obvious that it’s not user-friendly.
Mistake #5: Thinking That the Default CMS Settings Is Good
Today’s content management systems are so robust that you can pick any of the top five systems and 99% of your clients will have more features than they need.
What clients need is the ability to get their job done, and as web developers, it’s our responsibility to facilitate that. We need to make educated, experienced decisions so that our clients don’t have to. We need to help clients focus on what makes them awesome (as a person and as a company) and give them tools to leverage that.
Conclusion
As developers, we need to step up to the plate and make sure that our clients have tools that not only empower them in being able to manage the content on their site, but also empowers them to make the best use of their time.
Giving clients more choices and abilities to mess around with their website isn’t the same thing as empowering them. We might really just be hampering them and slowing them down with too many options, features and doodads.
Related Content
- Improving Usability with Fitts’ Law
- Getting Users to Sign Up: Factors in Design and Content
- How Cognitive Biases Shape User Experience
- Related categories: User Interface and Project Management
About the Authors
27 Comments
Phil Jones
September 26th, 2011
Decent article – couldn’t agree more that there are to many options on many WYSIWYG editors.
I’m a big believer in the KISS principle. Most of the features an advanced admin area offers are unused by none technical users.
Christian
September 26th, 2011
Thanks for this article.
Just an add on concerning
My WP users are basic users and asked me to have the same look in the edit pad than in the blog (public) part.
I found the solution here : http://www.deluxeblogtips.com/2010/05/editor-style-wordpress-30.html
The users have basics styles , but as they find the styles they required to write their articles, following the site colors and look, there is no temptation to use others.
TheAL
September 26th, 2011
Excellent article. WYSIWYG Editor woes are a big one. I have to gently remind clients every now and then that consistency with headers and paragraphs makes reading easier, and easier reading means happier visitors. Nothing is more unsettling than all the headers being different sizes and colors.
Michael
September 26th, 2011
Katie and Jason, thanks for the article, as it puts into focus what I’ve been thinking all along.
As mainly a designer, and only a ‘tinkerer’ with code that is under-the-hood, how might one limit the offerings in a CMS editor, to wit, as you said— go about “consider customizing WYSIWYG editors to only have the following…”
Plug-in? Tutorial someplace? :)
paul
September 26th, 2011
totally agree with you. If using WordPress, there are different ways to hide UI elements and controls from the user. The easiest would be to use a plugin called Adminimize.
That won’t take care of the WYSIWYG controls though. I found this post http://www.kevinleary.net/customizing-tinymce-wysiwyg-editor-wordpress/
Jason
September 26th, 2011
We always do this with our CMS installs and our clients are incredibly appreciative of the control they have and the simplicity in using the tools. That sea of icons in the default setting is completely overwhelming to almost everyone.
Joshua Lewis
September 26th, 2011
Balancing the power of a CMS with good usability is one of the problems that I’ve been mulling over for a while. I think one of the things that trips up a lot of designers/developers is they don’t approach the CMS back-end of the site as its own design problem with its separate goals and audience that often warrant as much attention as the front-end.
My personal solution has been to avoid overbuilt software like WordPress and Drupal that have to be striped down for use and instead start with CMS’s like Silverstripe and SymphonyCMS that I built up. Both types of software are, theoretically, equally powerful but I find starting with a cleaner slate results in a more focused and friendly interface for my clients.
Heath Howard
September 27th, 2011
Love the Spiderman reference.
Balancing flexibility and power with simplicity and ease of use is a difficult tightrope to walk.
I think one key is for the initial release to be as simple as possible and slowly add to it with enhancements. Rarely does anything start complex and work well, but 90% of the time, starting simple and working your way up, works every time ;-)
Saeed Neamati
September 27th, 2011
Great article. I specially agree with the item number 2 (Clients editing CSS and HTML). This has brought me almost hundreds of nightmares about cleansing up the mess my clients had created.
mikaweb
September 27th, 2011
I strongly agree with number 4. It can only brings some mess.
Rachel Andrew
September 27th, 2011
Good article and nice to see other people are thinking along similar lines. I wrote a piece about WYSIWYG editors recently there are also some interesting comments on the piece, I think there are problems to be solved here: http://www.rachelandrew.co.uk/archives/2011/07/27/your-wysiwyg-editor-sucks/
Maverick
September 27th, 2011
Really good tips from Usability and UX point of view.
In order to satisfy the client by giving them more functionalities we are infact doing them bad.
Thanks for this lovely tip.
Mimo
September 27th, 2011
Hey, loved this article. Made me smile because of how true it is. Great notes.
Katie Methe
September 27th, 2011
@Christian and @Paul – thanks for the links! We do use wordpress with some of our sites. I actually feel they do the best job with text editor control/integration.
@theAL – couldn’t agree more. it’s unsettling for users as well as the designer who is ripping their hair out because the site no longer looks the way they intended it to! :)
@michael – what CMS are you using (if any)? I work with Drupal primarily and there are lots of modules that will help with text editor UI. I think that is true for most CMS platforms. If you have a specific one in mind, let me know and I can help out. :)
@jason – it’s also tempting, and we like to not even put the options in the brain. let’s be realistic. humans can be greedy and want to use ALL the buttons! :)
@Joshua Lewis – i couldn’t agree more. we actually have a custom admin theme we use for the back end of some of our sites for that reason. the back end is just as important to site editors as the front end. In terms of avoiding overbuilt CMS’ I agree to a certain extent. If you are building a very basic site, it’s probably more time to strip down the full featured CMS’ than it is to build it in a simpler solution (have you looked at CushyCMS at all?). But when building a site that will need to be expanded and very robust with features I think using a full featured expandable CMS will actually help you in the end. You may have additional setup time in the beginning, but your CMS will be highly expandable with a lot less work and a lot more community support.
Manuel Vicedo
September 27th, 2011
I think point #4 is not necessarily accurate.
It’s true that clients that have to use the Admin interface may get overwhelmed by additional features, but that’s not to say you shouldn’t plan ahead a little bit and account for what they may possibly need in the near future.
In my opinion, it’s all in the execution. How you design the interface is pretty much what defines how fast they will be able to understand it, which in essence is turning to the best practices in UX design and usability.
Sennbrink
September 27th, 2011
_OMG_ funny post! =) ;)
Jon Pearce
September 28th, 2011
I have experienced this from both sides of the coin. I often set up blogs and sites for private clients, but my role in the marketing team for a big organisation means that our own websites are ‘locked down’ by in-house IT teams.
They seem to wield this like control freaks and do not release the basic functions that are required, probably once bitten by a content editor that used 5 font colours in one word thinking it looked ‘pretty’!
A good understanding of your clients abilities and knowledge helps a great deal when setting up a CMS, but you don’t want to allow them to ruin all of your hard work!
Michael
September 28th, 2011
@Katie: Of late, predominately WordPress. Thanks for your reply!
@Paul: Your links were just what the Dr. ordered, and my quest to slim down the pieces is near completion. Thanks!
George Hamill
September 28th, 2011
I am looking to hear from you
Chief Alchemist
September 28th, 2011
One of the key benefits to using a CMS is that it separates content from display. That is, a redesign is much closer to a re-skin, so to speak.
Aside from clients having a tendency to being heavy handed with the WYSIWYG (in a MySpace sorta way? hehe) is that the content and styling is less separated.
While I am a big fan of WordPress, one of the reasons I value ExpressionEngine so much is there is no WYSIWYG in EE. Sure it can be limiting at times but more often than not, less is more.
Katie Methe
September 30th, 2011
@Chief Alchemist – there isn’t a WYSIWYG built in, but there is a module (wygwam – http://pixelandtonic.com/wygwam) that implements one. Drupal doesn’t come with a WYSIWYG out of the box either, but a lot of clients want one.
Audrius Jankauskas
October 3rd, 2011
Don’t forget that text is not the only piece of content that can be added on today’s websites. Think of all other media. Soon you’ll realize that WYSIWYG will never fit. You don’t need any of WYSIWYG functions when you want to embed video or work with your image gallery. That’s why you should seek for a CMS with drag and drop capabilities, in-place content editing and automagical solutions for any type of content.
Mangirdas
October 3rd, 2011
That’s why I’ve build ImpressPages Drag & Drop CMS
Chris
October 3rd, 2011
One of the best WYSIWYG editors I ever found in fact wasn’t a traditional one, it was a WYSIWYM (What you see if what you MEAN). http://files.wymeditor.org/wymeditor/trunk/src/examples/01-basic.html
I found it provided a very clear structure which still had elements of a WYSIWYG which satisfied the client.
I definitely agree though that limiting the amount of editing that can happen is a must.
Majalah
October 4th, 2011
I use wordpress for all my blogs and I’m happy with their WYSIWYG Editor. Simple and it can be expanded.
Himanshu
October 16th, 2011
Nice article. Concise dose of valuable in-sights.
BTW, our design focused WebBuilder “DesignOnCloud” (http://hashedin.com) follows most of these patterns :)
Charlie Holder
October 17th, 2011
I would totally agree that WYSIWYG editors are a big pain-point for a lot of people, both administrative and end-user. In our CMS we provide the option for offering a WYSIWYG editor as well as other custom form fields that end-users can interact with.
We think it’s a good option for those administrators that want to create a structured form that offers simple fields for end-users to fill out while they get to retain all of the style control. When the end-user fills out the fields that data is stored as XML on the back-end and experienced users decided how those fields are handled with a simple block of XSLT or Velocity code.
This kind of approach not only helps eliminate the need for end-users to know HTML/CSS, it also help provide an clear structure for what kind of information the user should be supplying for the page.
Our CMS is a bit more robust than others, but you’ll see a lot of the same concepts on a much larger scale. Take for example creating a new page, you may have separate fields for the page title and page content as well as custom metadata fields that would need to be programmed for. Our structured page fields work much the same way by allowing admins to create a new form field when any design/style control is needed.
Check out Cascade Server from Hannon Hill.
Leave a Comment