Did you know you can use a block-based approach with your WordPress website to gain more value from the platform, with significant advantages in flexibility, scalability, and ease-of-use?
In this article, we’ll explain what blocks are, how they work, and how you can use them to build enterprise-grade websites quickly and efficiently, without compromising on quality.
—
WordPress is the most popular content management system (CMS) in the world right now, and it has been for a while. Unfortunately, though, some people still have the wrong impression that it is a CMS that can only be used to build more simple websites that do not have any real complex functionality or integrations, but this couldn’t be further from the truth.
In fact, WordPress is far more intuitive and robust than most realise. The fact that around 45% of all websites online today are built on the platform goes a long way to prove that. WordPress also provides more scalable, agile capabilities that are perfectly suited to building enterprise-grade websites if leveraged in the right way.
There are intelligent – but still very straightforward – ways to use WordPress that can unlock more value from the CMS. If done with the right guidance, this can make WordPress a far better option than the more traditional, rigid approach of building websites.
This is an opportunity most large businesses are currently missing out on. In this article, we’ll show you how using blocks is a more flexible approach that can provide you with a wealth of benefits.
Understanding How Using Blocks In Your Website Backend works
In 2018, WordPress released a new block-based design and editing user interface (UI), known as Gutenberg. Instead of the typical page creation and editing functionality of a CMS, where you’d input text and images into a rich text editor, you can now build your site by creating and using a set of components. Components are blocks of code which have pre-defined style and input types.
Each component is named, to denote what it is from the perspective of the front-end of your site on the web page.
Note: Some agencies only provide a list of block names, but here at SoBold we also provide screenshots of each block so you can see it first. This makes the process much easier and saves you a great deal of time.
Each part of each web page is made up of these components, as pictured below.
However, taking a bespoke approach, you can design and construct unique blocks that are entirely your own. Blocks or components can be built for you by your agency so they’re bespoke to you, your style guidelines, your design preferences, and so on. And, when building your site, you can go into your pre-built components and edit things, like changing background colours, adding images, adding text, and so on.
This can be set up for you by your agency, so you have everything you need to create, edit, and publish new pages with your pre-built blocks. Anytime you need to create a new page, you just have to pick the appropriate components and place them in the correct position to quickly and easily build the page.
The Business Benefits of Using a Component-Based Approach
Scalability
Scalability is one of the greatest benefits of using these blocks, especially if you are wanting to continue to build out your sitemap and build out the content.
This scalability is where WordPress really shines, enabling simple, rapid, virtually limitless scaling of your website with a high level of accuracy. This is a cost-effective way of growing without having to compromise on the quality of your design.
Flexibility
Blocks provide you with a great deal of flexibility in building, editing, and structuring of pages as well. The ability to customise all your components, along with the intuitive drag and drop functionality, allows you to effortlessly adapt and expand on your website.
Efficiency
Building components, and repurposing them repeatedly across your website, is a highly efficient way of growing your site. It also makes it very difficult to make mistakes or take a wrong turn.
This efficiency of reusing blocks across your website will free up time for you to develop innovative new features, or focus on improving the service and experience you provide your clients.
Ease-of-Use
If you have non-technical members of your team who would benefit from using WordPress, blocks will almost certainly improve the usability of the CMS for those people.
An easier design and editing function helps more members of your team create web pages within clear, pre-set brand guidelines. That’s another aspect that frees up more time and resources to focus on higher value tasks.
If you’re working with a design and development agency, this also makes it much easier for them to be able to train you and enable you to use the platform to manage your site.
Faster Time-to-Market
All this efficiency and ease-of-use will enable you to achieve a faster time-to-market for new web pages, extensions of your site, or even entirely new websites.
That can, in turn, create competitive advantages for your business, particularly if your competitors are working with CMSs that are slower and harder to use.
Whether it’s you or your agency handling this, you can create and publish new web pages quicker than you could with any other approach.
Lower Costs and TCO
As a result of all of the above, you can reduce costs on development and design, and achieve a much better total cost of ownership (TCO) with the WordPress platform.
Something that takes an inexperienced agency days to complete with the classic design approach can be done in hours using bespoke blocks. This drastically reduces development costs and gives you a lower TCO in the long-term.
The Importance of Finding a Capable Agency Partner
As mentioned earlier, bespoke blocks provide you with a proven way to unlock more potential with WordPress and gain greater value from the platform. However, in order to do that, it’s important to find the right agency partner. You’ll need an agency with enterprise-grade expertise and a certain level of skill to guide and support you through this process.
Taking this approach to building WordPress websites is nothing new, but the real value here comes in creating blocks that are completely unique and specific to you, then enabling your team to use those to scale your site.
Many WordPress agencies may lean on the generic block editor. But to get this right, you should push beyond that to find a partner who can educate you on the opportunities of using a bespoke design system to build a high-performance website that’s effortless to manage and edit.
A great partner will also facilitate this for you in a way that ensures you have control, removing the risk of any users making mistakes with the flexibility of this system. You won’t need to worry about the integrity or quality of your site being spoiled because all your components will be built specifically to prevent that.
You’ll gain tremendous value from receiving an intuitive, quality website that you can easily grow at will, but one that’s also managed and supported by an experienced partner. Sticking to these blocks helps you stay within brand guidelines, adhere to best practices, and keep your site consistent.
You then have the choice to manage, edit, and expand your site yourself, or rely on your partner to do it for you quicker, easier, and more efficiently than they would with a traditional CMS.
Making the Most of Your WordPress Platform
Modern businesses today require a powerful, sophisticated CMS that can deliver great websites at scale with enterprise-grade performance. WordPress is a platform that’s built to provide all those qualities and more. Embracing this block-based approach is the most effective and efficient way to achieve that.
With a skilled agency partner to help you maximise the value your business gains from the platform, you’ll quickly realise just how well WordPress can deliver agile, intuitive websites.
If you’re in the process of evaluating platforms to deliver a bespoke web development project, check our comprehensive guide to assessing and selecting the right CMS here
Would you like these insights straight to your mailbox?
- Your target audience now has a shorter attention span, and less patience when browsing websites and services online.
- Your target audience also has more choice of options than ever before when choosing who to buy from.
- Boost SEO and brand awareness
- Improve audience engagement
- Reduce bounce rates
- Increase conversions
- Drive more sales through your website
- Accelerate business growth
- Improve customer retention and loyalty
- Gain competitive advantages.
- Your brand
- Your company values
- Your colour scheme
- Your typography
- Imagery and other visual content
- Structuring of pages
- And other visual components that are used to tell your brand’s story across your website’s design.
Announcement
24 March, 2020
SoBold’s response to COVID-19
In response to COVID-19, we’ve put in place a number of measures at SoBold to make sure we can continue to provide our services to our clients around the world as well as do what we can to help contain the spread of the virus.
It’s helpful to reflect on the fact that we offer a service whereby the performance and outcome of work produced will not be affected at all.
We’ve moved to full-time remote work
SoBold has decided to close our office in London and have our employees work remotely until further notice.
We’re doing this in an effort to help prevent the spread of the virus because, while most SoBold employees are healthy and not in the high-risk category, we appreciate that is not the case for all of those around us, or in the wider community we live in.
We have a responsibility towards these people, including others who work in our building and those we come into contact with during each others’ daily commute.
We’ve set up enhanced support for remote work
We don’t believe it’ll cause much disruption to the rest of the team and business.
Most of our clients, for example, will be familiar with remote meetings; we regularly host virtual meetings between clients and SoBold.
All team members have access to reliable remote conferencing and workflow tools, so they can speak to anyone either within SoBold or outside of the organisation, whenever they need or want to.
This means we can continue to frictionlessly share and work collaboratively cross-functionally, with the ultimate goal of always delighting our clients and partners.
Free support to those directly affected by the closure of their businesses
We want to give back and help businesses and individuals that have been so badly damaged by the closure of their shopfronts, gyms, restaurants and other businesses in the hospitality industry.
We are offering free website help to these businesses during these tough times.
If you would like to get in touch with a team member about this, please email hello@soboldltd.com
Would you like these insights straight to your mailbox?
UX Design
15 May, 2023
Demystifying User Experience (UX) Design
As technology continues to evolve and advance rapidly, more of our daily lives are taking place in a digital-first context. When marketing your products and services, this means:
Modern users demand the same speed and convenience they get from the industry-leading sites and apps they use every day. That means you only have a matter of seconds to make a positive, memorable connection with your visitors.
UX design, therefore, serves as a critical phase within the end-to-end process of web design. This is essentially the practice of creating a website that allows your visitors to complete a process, take an action, or fulfill their need in as few steps or clicks as possible.
Despite its ever-increasing importance, UX design is a process that many businesses, and even many agencies, still struggle to get right.
To ease this challenge, and help you ensure your own website’s UX is designed effectively, we’ve written this article to outline the process in detail. We’ll also provide advice and tips to help you ensure your website can provide your target audience with an experience that drives them towards your desired outcomes.
What is UX Design?
The aim of UX design is to make it quick, easy, and convenient for your visitors to complete a task or process, or follow a call-to-action. Your UX involves everything from functionality, navigation, accessibility, layout, structure, and even the site’s content itself.
Designing your website in a way that’s intuitive and easy-to-use will provide your visitors with a satisfying UX. It’s important to note here that UX design shouldn’t be confused or bundled up with user interface (UI) design. UI design is its own separate phase of the process that comes slightly later.
Understanding the Design Process as a Whole
Research and Planning
Earlier in the overall design process, before you approach the UX, you should’ve gone through a thorough research and planning phase with your design agency.
This is important in ensuring that every decision you make towards your UX and UI will produce a more effective website capable of meeting your business goals and your audience’s needs.
Working alongside your agency, you’ll use this research to define the full scope of your website and all its requirements. This will include the creation of user personas and user journeys. These will help you determine the most simple and efficient flow for your visitors to take through your website to each call-to-action, and this is how your UX is created.
This research will guide both your UX design and UI design processes.
Related reading: Understanding the Important Role of Research and Planning When Designing a New Website.
Visual Exploration
Your agency partner should then produce a set of mood boards that you’ll use to create the aesthetic style of your site in line with your brand. These mood boards help you visualise the way your website will look and feel when built.
This is a precursor to your UI design, and it’s done before the UX phase to ensure the overall style is correct before any more design work is completed.
This is another collaborative process, where your agency should advise you with their expertise and experience from delivering successful website projects in the past.
Related reading: What is Visual Exploration in the Process of Web Design?
The UX Process
Information Architecture
The information architecture of your website is devised by building a sitemap, which is a map of all the necessary pages across your entire website. You’ll likely have an existing one from your current site, but this will probably need updating based on all the new research and strategic planning you’ve done.
From the sitemap, you’ll have a list of all the pages and content required to populate your site. Your agency will then build out a content base framework, noting any content that you need support in developing.
The users’ navigation through the site needs to be tailored to the objectives you’ve set and the research findings from earlier. It also needs to be built in a way that allows for flexibility and scalability later, as your requirements evolve and your business grows.
High-Fidelity Wireframes
Wireframes are used to design the user experience of your website. This is essentially like creating a blueprint of your website’s pages prior to beginning the actual design work, detailing the site’s flow and the users’ journey through it.
These wireframes are used to determine how the user can reach their desired outcome, or reach your desired call-to-action, in as few clicks or steps as possible. Remember, the purpose of UX design is to optimise that journey.
Here at SoBold, we use high-fidelity wireframes that provide a clear, detailed representation of the users’ flow to all calls-to-action. This is directed and influenced by the things we learned in the research and planning phase.
These wireframes are typically built on a standard desktop size, but they can be done on a mobile device screen size if you want your site to be designed mobile-first.
Wireframes are used to create the UX so you don’t get distracted by the visual design when evaluating the user journeys. This allows you to focus completely on the flow and the experience the user will have when visiting your site, without worrying about the aesthetic elements. It proves to be a much more effective approach towards creating an experience that will satisfy your visitors and help you achieve your objectives.
Again, this will be a collaborative process in which you’ll work closely with your agency, providing feedback on the wireframes to ensure they align with your requirements.
Once the mood boards and the wireframes are approved, all that’s left to do is apply the design to the wireframes to bring your website’s design to life. This makes the UI design process very quick and easy from here.
A Quick Word on Accessibility
Accessibility is a crucial aspect of any user experience.
Accessibility refers to how easy and accessible technology is for all users, regardless of their physical ability, location, personal background, or any other factors. While accessibility is primarily a concern for the UI design team, it’s also important in optimising your UX as well. After all, a website that isn’t accessible simply cannot be considered to have a good UX.
If accessibility isn’t included as a core component of your web design process, you should raise this as a concern with your agency.
Here at SoBold, accessibility is a key part of all our design processes, as we believe that all technology must be fully inclusive and equally available to everyone.
Related reading: You can learn all about what it takes to deliver good usability through your website in our related article here.
Finding the Optimum Balance
As touched on earlier, your target audience will be visiting your site with a goal in mind, and the UX is what enables them to achieve that easily.
Of course, you also have business objectives to achieve through your website, which must also be supported by UX design. That creates the need for balance between a UX that serves your visitors and supports your business strategy simultaneously. Your design should also play the important role of directing visitors to the calls-to-action that you want them to engage with.
Finding this balance is a challenge, and one that could have a negative impact if you get it wrong. This is where the guidance and expertise of a specialist agency partner becomes so important. All design is collaborative and iterative, and UX design is all about compromising to find the right balance.
The Business Benefits of Great UX
Finding a design agency you can trust, and investing the time to work with them to craft a truly outstanding user experience, will prove well worth it in the long-run.
UX design is complex, but the right agency can guide you by demystifying the process and helping you make the right decisions at every step. Finding that aforementioned balance between your strategic objectives and your target audience’s best interests can have a transformational impact on the performance of your website.
Providing your visitors with a great UX can deliver a wealth of other benefits as well, not only to the performance of your website but to your wider business too. For instance, a study by
Some of these additional benefits include:
Your UX isn’t Complete Without User Interface Design
The key thing to remember is that good UX design is really just helping your website visitors travel from their entry point to wherever they need to get to as easily and efficiently as possible.
In the UX phase of your project, you need to consider who the user is, what they’re aiming to do, and then determine how to enable them to do that with an intuitive design.
Once your UX design begins to come together, and you’re satisfied with everything, the next step will be for your agency partner to begin to design your user interface.
While UX and UI are separate, they’re also intrinsically linked. They need to work together seamlessly and complement each other in order for your website to be successful.
If you’d like to take a step back and learn more about the overall process of web design, read our related article here.
Would you like these insights straight to your mailbox?
Announcement
1 November, 2022
SoBold announce Cyber Essentials certification
SoBold announce their Cyber Essentials certification for the third consecutive year which demononstrates their commitment to delivering secure technical solutions to their new and existing clients.
Cyber Essentials is scheme which helps guard your organisation against a range of common cyber threats. SoBold’s resilience across a range of internet facing devices was tested and approved, ensuring there were not any major critical vulnerabilities discovered
SoBold Technical Director, Sam Phillips said:
With an ever growing cyber threat, Cyber Essentials certification is becoming more and more important to maintain. Protecting both our clients data and websites is of the upmost importance and successfully passing the more thorough Cyber Essentials guidelines new for 2022 shows our commitment to this.
Would you like these insights straight to your mailbox?
Development
9 June, 2023
Craft vs WordPress: Which Platform is the Best Option for Your Business?
When you’re responsible for managing a new website development process, you’ll have some difficult decisions to make. Two of the most difficult decisions will be finding an agency that you can trust, and finding a content management system (CMS) that will give you the flexibility and performance to drive your business forward online.
Your CMS will play a significant role in helping you meet your specific website requirements and enabling you to achieve your strategic goals.
We’ve compared lots of different CMSs in our recent series of articles, and each of them have their own strengths and weaknesses. In this article, we’ll compare WordPress and Craft.
Ease-of-Use
It’s vitally important to ensure that the platform you choose is straightforward to manage. You’ll want a platform that’s approachable, with a low barrier for entry, to avoid any challenges in the daily running of your website.
Craft’s Ease-of-Use
Whilst Craft is an open-source CMS, it requires technical development expertise in order to manage the platform once built. Management for non-technical teams will likely be difficult, thus limiting you in your ability to build out content and new features over time.
If you do have expertise in-house, that will allow you to manage your website more easily, as the CMS itself is efficient for publishing and managing content.
Craft also makes it easy to collaborate and share responsibilities across teams without any interference or complications. For example, you can save draft versions of pages and share them with colleagues – with private links that don’t even require you to be signed in – before publishing live on your site.
WordPress’s Ease-of-Use
Conversely, WordPress is specifically built so that content can be managed in-house. WordPress provides you with a convenient, intuitive user interface (UI) that allows quick and easy publishing, management, and editing of content on your sites.
Put simply, WordPress is a more traditional CMS that’s suitable for a wider range of users and teams. It allows you to easily manage the content on the front-end, whilst also facilitating a quick time-to-market for the development of your website.
This ease-of-use also helps to share responsibilities throughout your team.
Flexibility
Flexibility will always be high on your list of priorities when looking for a CMS. Tailoring your platform to fit your own unique requirements is a crucial capability in today’s digital business landscape.
How Flexible is Craft?
Craft is all code-based, which allows you to build virtually any type of website you want, with great flexibility. The only limitations, really, will be with the platform-specific development capabilities of your agency.
How Flexible is WordPress?
WordPress also offers a great deal of flexibility and customisation, but the difference here is that it’s unlikely you’ll need to alter much about WordPress’s pre-existing tools and features to be able to build a website you’re happy with.
With WordPress, you have everything you need to build a high-performance website. But that’s complemented by the flexibility to make enhancements and seamlessly scale the platform with new bespoke features if you wish to.
Integrations
Before you select a CMS, you’ll need to ensure it can easily integrate with any existing systems your business has in place. Whilst most CMSs will be able to integrate well with a variety of third party systems, it’s important to be aware of any limiting capabilities of the platforms.
Craft’s Integrations
Integrations with the most popular third-party platforms are typically supported in Craft through plugins. However, you may need to integrate manually with platforms using API’s.
While this gives you more control over your CMS’s functionality and security, it’s another area in which you’ll likely have to spend more time and money on agency development work. Those integrations will also need to be maintained and updated manually as well, which may be a financial and time burden on your agency.
WordPress’s Integrations
WordPress’s global popularity means that it’s readily compatible with most of the third-party systems you’ll already have within your business.
You’ll have a wide range of native plugins available that will integrate your WordPress site with virtually any other tool. Even if you have more advanced requirements, it’s usually easier for your agency partner to do this bespoke development work in WordPress than it is with other CMSs.
Developer Communities
Investing in a platform that’s supported by a community of developers will provide you with additional benefits and advantages. It’s always helpful to have other users working to continuously create additions and updates to help the CMS grow and improve.
Craft’s Community
Craft has a passionate community working hard to help enhance the platform, but it’s only a fraction of the size when compared to more mainstream CMSs like WordPress.
Still, size isn’t all that counts here. Craft’s community is very supportive and highly active on channels like Slack and Discord. Craft also has a StackExchange, which is a Q&A forum that many developers use to share learnings as they work through projects.
The WordPress Community
At 20 years old now, WordPress’s popularity and global market share means it has an enormous community supporting it.
WordPress’s community consists of millions of users who work tirelessly to offer support, collaboration, knowledge sharing, events, and much more.
Any questions, problems, or requirements you have are often answered very quickly by members of the WordPress community. This also results in exciting new enhancements and features being released on a near-constant basis to drive the platform forward.
Being part of the WordPress community will also give you access to free events that help users learn to get as much value as possible from the platform.
Cost and TCO
Cost is a key factor when choosing a CMS. It’s also important to remember the up-front costs aren’t the only thing you need to consider here. Since your CMS is a long-term investment, you should be looking for a low total cost of ownership (TCO) for all your related costs over time.
Craft’s Initial Investment and Ongoing Costs
With Craft, you’ll need to purchase either the pro or enterprise plan. Pro comes with a one-time payment of £250 per project, and an additional annual payment to continue receiving updates. The cost of the enterprise plan will vary depending on your requirements and usage.
As mentioned earlier, the costs associated with the platform may also be high. This is due to the need for agency support across many aspects of your project, from setting up your website, to integrations, to ongoing maintenance.
The actual costs of development with Craft may also be higher than with other CMSs because of the smaller scale and more specialist nature of the platform.
It’s also worth mentioning that Craft CMS hosting services are more limited than those of WordPress, again likely making them more expensive.
WordPress Cost and TCO
On the most part, WordPress is a more cost-effective platform than Craft, with a lower TCO.
WordPress is free-to-use, limiting your initial costs to just hosting, development agency fees, and post-deployment support.
As touched on earlier, achieving a much faster time-to-market will allow you to launch a quality website quickly so you can begin gaining strong ROI right away.
Another cost-related benefit of WordPress’s ease-of-use is that if there’s bespoke development work you need your agency to complete, it will usually come at a reasonable cost. Because Craft is such a niche and technical platform, bespoke development work often comes at a premium in comparison to the more widely-used WordPress.
When the WordPress platform receives updates, it’s often fairly quick and straightforward for your agency partner to test and maintain your site.
These advantages add up to create a lower TCO for WordPress than you’ll have with other enterprise CMSs.
Conclusion
Both Craft and WordPress are both great CMSs in their own right, and would serve most businesses. Although, it’s difficult to deny that WordPress is a much more approachable platform than Craft for the average user.
If you’re a team with a great selection of existing development skills, Craft can provide you with some innovative capabilities and could be the right platform for you.
The key thing to remember when making this evaluation is that you should select the platform that directly aligns with your own specific circumstances and requirements.
Every business, and every web development project, is different. Carefully consider your objectives, budget, users, in-house skills, and any other factors that may come into play. That should allow you to determine which CMS is the right one to deliver what you need.
If you need more help finding a CMS for your new website project, read our comprehensive guide to understanding and evaluating the options for large businesses here.
Would you like these insights straight to your mailbox?
UI Design
18 April, 2023
What is Visual Exploration in the Process of Web Design?
When a visitor lands on your website, the visual design is likely to be the first thing they’ll notice. It’s also usually the thing they’ll remember most.
75% of consumers reportedly judge a business’s credibility based on its website design. This first impression can make or break a prospective client’s interest in working with you.
The ultimate goal of your website is to attract and retain as many prospects as possible, and then convert them into clients. But most websites are designed in a way that leaves those goals unfulfilled, failing to reach their full potential.
With that in mind, your visual identity should be treated as a top priority within the overall design of your website. Believe it or not, this can have a significant influence on the growth and success of your business.
When working on a web design project, you should always go through a careful visual exploration phase to find the right visual identity for your website.
Whether you’re going through a full company rebrand or just refreshing the style of your website, it’s important to ensure your design is tailored to your specific target audience. This is how you begin to drive business growth through your website.
Without a visual exploration process, your website may not convey your company’s brand identity and values as clearly as you’d like it to.
In this article, we’ll outline the steps taken so you’ll know what to expect when working on a website design project.
What Does the Process Involve?
The purpose of this process is to define the best visual direction to take with your site.
This is a crucial aspect of your overall design, with aesthetic elements being brought together to create a look and feel that engages your site’s visitors and retains their attention. To achieve that, your visual design needs to establish a connection between your audience and your brand immediately. It should also demonstrate why your visitors should work with you.
Exploring your visual identity will cover a wide range of elements, including:
What are Mood Boards and How Can You Use them?
The main tool used to help determine the right visual identity is a set of mood boards.
These are a visual compilation of all the various elements that make up your website’s visual design. Each mood board is essentially just a single-page collage of design styles based on previous discussions and the findings from the research and planning phase of the process.
The aim of these is to capture your brand’s visual style and tone. This will give the stakeholders, and your designers, a shared understanding of the design you’re working towards.
Mood-boarding helps you visualise the work on your website’s design before it begins and agree on a design aesthetic that accurately reflects your brand identity and values.
Think of this like a problem-solving exercise. Your design agency will take a research and data-driven approach to conveying your brand identity, while also catering to your target audience and accommodating the latest industry trends.
Collaboration and Iteration
Like most processes within web design and development, this visual exploration process should be collaborative and iterative.
You’ll typically be presented with a mood board and a set of ideas by your agency partner, then given the chance to provide feedback across several rounds of revisions.
Rounds and revisions are always important in any creative process. It’s usually necessary for your agency to develop and present a minimum of three mood boards before the optimum aesthetic is agreed upon. This is a crucial step towards the ultimate goal of creating a new website that accurately reflects your brand and has a positive impact on your target audience.
Connecting with Your Clients Through Design
Your website’s visual identity is what makes your brand resonate with your target audience. Your design needs to clearly convey the values of your business, the quality of your products and services, and the reason why your visitors would benefit from working with you.
Working through this visual exploration phase is an important step towards designing a website that will attract more visitors and increase your conversions.
Once this visual exploration is complete, the next phase of your web design process will be to craft your website’s user experience (UX).