Content management systems provide a simple and fast way to develop a website. Typical CMS provides quick development and deployment with easy design capabilities. They come with end-to-end site management, and strive to be easy for non-technical users to manage, allowing high-end engagement with online content.
Key benefits
- Create: create new pages, sections, menus, media etc.
- Manage: easy to edit, format content, and manage the site
- Implement: easy to implement ready code and template
- Branding: consistent brand and standard navigation
- Database driven: change once, update the entire website
- Shared resources: access to modules, images, audio, video files etc.
- Security & approval systems: different levels of access for approving content
- Mobile ready: templates are mobile compatible
- Search engine friendly: optimise your website for SEO compatibility
Three ways of UI/UX implementation for CMS
Good practices for CMS based Web Design and Development can be dived in three. These include Standard Templates, Custom Templates, and Headless CMS. How to choose between these?
Standard Template
Go for Standard Template approach when having less time and looking for quick development with minimum needs focusing on cost efficiency. Usually when getting your business started and aiming for simple and powerful design.
Pros & cons
- Ready designs available
- Follows the basic UI/UX guidelines
- Templates available with HTML/CSS
- CMS compatible
- Easy to implement and manage
- Template based sites often look alike
Key considerations
- Do not change the layout or structure of the template
- Template is styled to match the client’s branding
- Changes are mainly in terms of colors and images
Development process for standard template done in five simple steps: 1) select template, 2) change branding and images, 3) add pages, navigation & content, 4) deploy the changes on server, 5) website ready.
Custom Template
Go for Custom Template when looking for a tad more unique design with CMS facility. Usually when looking to achieve more business with exceptional user experience when cost and time limitations are secondary.
Pros & cons
- Liberty to create design
- Add UI/UX value based on scope of customisation
- Knowledge of the framework is required
- The design should be easy to integrate
- CSS plays a major role
- Can achieve unique designs
- Consumes more effort
Key considerations
- Designers need to be aware about the framework functionalities before starting the design
- Maintaining consistency in design, same section on different pages should look same
- Customising plug-in requires studying and development in order to be integrated and managed later
Development process for custom template in seven steps: 1) create custom design (as per framework compatibility), 2) select default template (modify CSS and template), 3) customize template, 4) template integration, 5) add pages, navigation & content, 6) deploy the changes on server, 7) website ready.
Headless CMS
Go for Headless CMS as future proof evergreen solution to support omni-channel architecture. Allows you to focus on your business while specialised team is working on your system. Easier, faster, and more flexible to develop on. Easier to learn and use. Cost less in the long run. Leads to better software architecture. More scalable.
Pros & cons
- Time efficiency i.e. no need to rebuild the whole system in future, existing content can be sent to any destination system via APIs
- Freedom and flexibility i.e. single content can be reused and combined with several different presentations, promoting agile way of working and iterating faster
- Secure & scalability since the backend and frontend are separated, if the backend CMS platform has any performance issues or, simply, needs maintenance, it won’t create any downtime the website
Key considerations
- Content first architecture approach with potential content delivery to any client or device via APIs
- CMS is used as backend fo manage and store content
- Clear separation of concern between creating, delivering, displaying content
Simplified development process for headless CMS as the development of content and website can be done in isolation and in parallel: 1) create website with your own look and feel, 2) connect the website to headless CMS, 3) website ready.
Go for standard template when getting business started, look into custom template when scaling your business, or go for headless CMS as a future proof solution.
What does our developers say
Check below for some comments and war stories from our developer crew in recent use of CMS.
“Friends don’t let friends run WordPress, especially not as a headless CMS.”
– WordPress“I’ve started to use Netlify CMS in a personal project and it works so well that I’d like to use it at work also”.
– Netlify CMS“Contentful is SaaS provided headless CMS that has been working mostly ok. Facing some bugs in their APIs in complex special cases.”
“Entire SaaS was down a while in 2019, and caused some gray hair for the customer as the content suddenly disappeared.”
“Wasn’t Contentful meant to be used more like a data storage with hooks for changes allowing the implementation of some pretty heavy caching like static caching on top of it.”
“It has worked well and seemed relatively easy to adopt for devs as well.”
– Contentful“Good experiences but hasn’t been used as a headless CMS.”
“Community version has its limitations.”
– Magnolia“Have been using Strapi in a personal project, it’s open source, still in beta but totally usable.”
– Strapi“Not headless but interesting. Uses event sourcing to manage change set merges and publishing reviews.”
– Neos
Choose your perfect match?
Happy to help if you would like to hear more or we could help you even further.
Juhana Harmanen
Capability Owner of Web Development,
Technology Consultant
PS. With headless CMS approach you can benefit from using a Design System, check Why you should definitely have a Design System in place already.
Photo by Hal Gatewood on Unsplash
