Everything has a user experience: may it be a drive in a Porsche, may it be using the latest iOS on your iPhone, or may it be using a website.

As a UX designer, the challenge you face is to provide the best UX and the least hindrance possible for the user.

Even business people who want to prosper online and marketers who sell products and services on the internet have to touch base with UX or user experience at some point.

There are already many case studies out there that user experience can make or break an online business. Think about it - if the visitor dislikes the experience he has on a website, most likely the purchase or transaction he wishes to complete will fall through.

A poor website user experience can lead to visitors leaving in droves and getting impatient. Naturally, that's very bad for business. Therefore, it is a must to take into account the user experience when designing, building, or managing a website.

UX design (UXD) involves a lot of research to understand the user and how they behave on the website.

For an eCommerce website, it's important to target users subconsciously and the homepage is the first thing users see and experience, and on a subconscious level decides if it's a good website or not. So, a homepage must be designed well for the users to enjoy their experience on the website, which will eventually lead to building a better relationship with the user.

Most e-commerce websites today will greet you with a large image slider to give you a preview of their best products, latest deals, and discounts. Clean, high-quality images of the image slider with white background put the focus on the product in the image.

Also having a search bar is essential for the user to easily type and look for their product with ease without having to apply 5-10 filters to search their product.

The navigation menu gives users an idea of the range of products available on the website. Most users come to an e-commerce site to browse before they can make their decision, so make the navigation menu prominent and keep 6-7 main categories.

Don't clutter the navigation menu with more than 6-7 choices.

For most e-commerce websites, navigation menu on the top works well but you can also keep one on the left side.

Show the navigation menu on most of the pages, even when you scroll down, make sure it's visible.

A good logo can help your customer create a positive impression of your brand. So a good prominent logo whether on the top left corner or in the center is a must, and add your company's tagline below it, and it should be functional. Clicking on the logo should land the customer on the home page.

The shopping cart should be easy to access and must display the number of products added to the cart. If you add three distinct products to the cart, the cart should display the prominent number 3 on it, like a notification.

When a user browses through products, let's say a user is looking for a nice pair of jeans. He types 'Jeans' in the search box. The result displays all the jeans available on the website, then the user uses a filter for his gender, waist size and colour preference. The user must also have the option to sort the products by: most popular, high price to low, low price to high, new, or discount. Through these small steps, the user can now see the type of jeans she was interested in.

As the user scrolls down and keeps checking the number of jeans, he can add the ones he likes to the wish list and check them later or make the payment later, if he's not ready to buy yet. It's important to note that the product should remain on the wish list as long as the user doesn't remove it.

Give your users their private account where they can store their personal information like name, address, credit/debit card information, email, last order details, status on the current order, discount coupon, etc.

It's important to know that customers love personalized shopping experiences.

Fast and easy access to tracking their order is such a useful tool for the customer to keep track of where their product has reached, and how much time will the product take to reach their home or office. Rather than going through the whole process of sig in, check your account, click on last order, check last order and click on it, and then see the details ─ make it more convenient for the user by putting a 'Track Order' button on the home page.

By simply adding the customer care phone number on the homepage, you tell your customers that you are there to help them and it establishes trust between the user and the website. But keep note that you have enough staff to help the customers, and don't forget to specify the days and time to call. Else the user will feel irritated and agitated if the problem isn't solved right then and there. We've all been in that situation. And as I write, I'm talking to customer care with one of the world's leading brands, which seems to have lost my return package and hasn't initiated the return process in the last 10 days.

Creating a Website with a Great User Experience

Optimum UX can be a hard thing to achieve but it's under constant evolution, as people use more and more e-commerce websites, it's helping UX designers to evaluate the users' behaviour and give them the best UX.

To help you build a website that offers a stellar digital experience, then we proudly recommend the WebriQ Studio to you. Check out the W-Studio for digital marketers and the C-Studio or the WebriQ Commerce Studio.

These are excellent microsites and landing page builders that not only integrate design and functionality but offer a really good user experience and content management system as well.

Take a look at the WebriQ Studio and enjoy these benefits:

Smooth team collaboration for content management

C-Studio for eCommerce managers will provide you with:

Integration with apps and enterprise software systems

To know more about these products and how you can build a website with top-level user experience, get in touch with us!

UX Principle: How to Design an eCommerce Site that Offers Top-Level User Experience

Why should e-commerce websites use headless CMS? Find out the answers through this business case..

The Business Case For Headless Commerce

If you’re like most, your website is the cornerstone of your business marketing. Because of this, your content management system (CMS) may come with a high price tag. But, do you have to pay as much as you think?

Most companies go into business with zero knowledge of how to build a website, let alone how to make efficient decisions about software and hosting. You probably hired a developer to make most of your decisions for you. Sadly, developers are generally biased toward the software they were trained to work with and their idea of what’s best isn’t always what’s best for you. They don’t necessarily consider your financial goals when planning your website design.

Don’t get me wrong, here — I deeply admire web developers and could never do what they do; HTML and CSS are foreign languages to me. I do know content marketing, which is where your choice of CMS comes into the picture. Here’s what you need to consider when making a decision about the platform where you will host your online marketing materials, products, and services.

What Can the Wrong CMS Actually Cost You?

A few months ago, I was working with a B2B company that had major issues with its website. When their customers tried to place product orders, they were suddenly being charged ten dollars more per piece than the actual cost of the product. When your customers are giants like Starbucks and Natural Grocers who want to place hundred-piece orders, that kind of glitch can be detrimental to the sum of tens of thousands of dollars.

The company above was referred by a colleague to contact me about ironing out the kinks in their shopping cart flow. When I was able to get into the site, which was pretty well barricaded by the developer, I found that the shopping cart wasn’t the only issue. An advanced CMS platform that costs $18K per year was being used to host a five-page, one-product website; this was extremely expensive and far beyond the needs of the client.

By migrating the website to another CMS with a customizable eCommerce theme and built-in, reliable shopping cart, I was able to cut their annual cost to $348 in a matter of hours. The glitches ended and the company was able to go back to business as usual.

This is How to Determine Your Opportunities for Savings

The above story illustrates just how much you can actually save by exploring whether or not you are spending too much on your CMS. So, from a financial perspective, where do you begin?

First, Break Down Your Content System & Costs

Your content management system can be categorized into six parts:

Secondary CMS Platform (for an external blog, etc.)

Write down which software you’re using for each item and how much each cost.

Website Hosting: HostGator: $5.95/ month ($71.40/ year)

Shopping Cart/ Payment Processing: BluePay: $15/ month ($180/ year) + $129/ year for PCI compliance

Plug-ins/ Add-ons: Misc: $59/ month ($708/ year)

If your CMS system is represented by the above example, your total annual cost is $1,103.39. Keep in mind that this is just the system, not including content creation and administrative costs. This is actually a comparatively inexpensive system and it still leaves room for savings.

Sometimes you can find a free or inexpensive plugin that will serve the same function as a costly one you’re currently using. Is there another platform that is less expensive and provides all the tools you need? Investigate your options in each category; just remember to test new software before you publish on your active site.

For example, you could compare SEO plugins. If you’re spending the current yearly cost on the paid version of the Yoast SEO plugin, you may be pleased to know that you can replace it with SEO premium for a lesser cost per year.

You may also want to check out our Webriq Studio, which is not only an excellent page builder tool but also a wonderful content management system. More on the W-Studio below, but basically, you will get access to a flexible and powerful tool that will give you value for your money and make managing a website so much easier.

Explore whether or not you can combine some of your CMS costs. For example, some CMS platforms include hosting in the cost of the software. Some provide free shopping carts. If you can drop one external platform and utilize some options included in another, you will definitely save.

This could seem like a measly way to save when you’re working with add-ons that cost less than $10/ month. But, when you consider how long you could be using a tool, it adds up. At this price, you spend $600 after 5 years. And how many tools like this are you using? Four $10 add-ons could cost nearly $5K after 10 years. If you can consolidate the number of tools you pay for, you will definitely cut your software spending.

Speaking of which, you can make full use of our Webriq Studio at a fixed monthly cost. Below are just a few of the benefits you will enjoy:

Omnichannel personalized experiences across all digital touchpoints

Unlimited marketing campaigns in one tool (for one price)

Unified analytics and measurable ROI for all campaigns

Smooth team collaboration for content management without tech staff help

Reusable content blocks across all of your digital channels

Continuous functionality updates once they are built

To know more about Webriq Studio, please try it out here.

Finally, Should You Pay Monthly or Annually?

Most online SaaS companies offer monthly and annual subscriptions. As long as you’re sure you’re going to have your website for the next year (hopefully this is the case), you are sure to save by paying upfront.

Take a look at Squarespace’s pricing, which they lay out nicely on their sales page.

For an eCommerce store, there are two options: basic and advanced. For each alternative, users receive a discount for paying upfront. So, unless you’re not sure that you’ll still have your CMS in a year, pay your costs upfront.

How to Get Exactly What You Need in a CMS

You see how this decision is critical. So, now you need to know what to look for in a CMS and why. Ask yourself the following questions to choose the right platform(s).

1. How many pages does your website have?

Are You Paying Too Much for Your Content Management System

Simply put, it is a set of interconnected web pages that talk about your product. It is a subset of your main website. You can have microsites dedicated to different needs such as:

Promote a product or service outside your main website

Educate viewers about the product or service

Drive registrations to the gated content about the product

Boost search engine optimization efforts for your main site or other microsites

A product microsite or product microsites can be the cornerstone of your inbound strategy. To be successful, it should be well-thought-out and exhaustive in terms of coverage. Aim to educate your target buyer on why buy and why buy from you. If well-executed, it can help reduce the time inside sales and sales spend on lead qualification and product demos. Let’s look at some successful microsite examples.

The main website is packed with information, which you may need or not need initially. The order page is central to the website but has a ton of products that you can order. No issue if you quickly know what you want and how to navigate the complex site.

The microsite is simple in its digital marketing messaging and navigation. Two menu items, a simple main message, and a list of farmers that are part of the farmer's market.

Whereas the main web page is clearly very transactional, the microsite is building trust and has a clear appeal. The brand recognition on the microsite is strong and distinct and is certainly appealing to an audience that is looking for healthy food straight from the source. The microsite is educational and with embedded videos entertaining as well.

A sales page is a landing page designed to convert your target audience and website visitors into actual paying customers. They do this by including page elements and a digital marketing strategy that persuades visitors to take action.

When you write a sales page, your elements can be anything from social media buttons, social proof, and persuasive content marketing to explanation videos and customer testimonials.

However, the goal remains the same: to get visitors to purchase your products or services.

An interesting example of a sales landing page is 

The main site is definitely in the form of a sales landing page, whereas the Master page is still in the form of a page, but should have been structured as a microsite. The Master page is too long, and not structured to allow easy navigation and understanding of why this is different from the main site. But it is overall a good example of where sales landing pages and product microsites overlap.

Let’s look at how a product microsite is different from a product sales page. Here are some key differences:

A sales page or sales landing page has one objective, convert the visitor or target audience to a buyer of the product or service. It is short by definition and follows the branding of the main website. It is targeted at a single audience.

A microsite has a broader objective -- it surely has the objective of converting a viewer into a customer, but microsite marketing can become educational and entertaining as well. It can contain a quiz, a contest, or other online marketing tools that can lead to purchasing after having taken the quiz or the contest.

An example can be found on the main website of htpps://ooyes.love

It incentivizes viewers to take the quiz before actually purchasing the products. The quiz is nicely embedded into a microsite: 

Even if the site does not directly benefit from the quiz commercially, at least you get valuable zero-party and first-party data out of the quiz. With this data, you can cross-market and cross-sell to these quizzers, and the data you collect will be extremely valuable in a post cookie world that is rapidly coming to all of the Internet.

Is it for everyone? No. What are some triggers to see if a product microsite is right for your company? See if any of these situations resonate with you:

You want to talk to multiple buyer personas and create several types of buyer's journey or focused content.

You are not getting enough inbound leads.

Your target customers don’t understand your specific message or your product and its value.

Your sales face the same objections from prospects, time and again.

You have several products but you want to put the spotlight on Product B.

You want to create a time-sensitive marketing campaign.

You need a specific product or service to stand out more on the search engines.

If you face one or more of these commonly-found marketing quandaries, a product microsite might be just your thing. A product microsite will help you:

Increase awareness about your product category and your product

Educate buyers so sales can spend less time selling

Besides that, in today’s situation when customers are not always ready to buy, this is a great long-term investment to educate buyers on their problems and why you are the best solution in town.

A microsite is a big lift, involving not just the entire marketing team but even sales. Be ready for the long haul. It will take a quarter or two to complete, as it requires thorough research, rigorous planning, and diligent execution.

For an effective microsite that converts casual leads into active prospects you need:

Credible information and an authoritative point of view

A plan for content updates on a 6-monthly or 12-monthly cycle

You want to be absolutely sure you need a product microsite before you embark on this high-visibility project.

Know Your Product Deeply Before You Get Started

If you are new to product marketing or new to the company, I would not recommend you build a product microsite right off the bat. You want to be sure you know your product, market, customers, and competitors.

Why do your customers buy you over your competitors?

What value and benefits do customers get from your product.

Key buyer personas and what they care about.

If you know your customers well, the microsite’s structure and messaging will easily come to you.

Crucial Sections to Make Your Product Microsite a Killer

1. Pages by Persona and/or Key Benefits and/or Verticals:

Deciding how to organize your microsite and divide your pages can be the most difficult part. Do you want to divide them by buyer persona, key benefits, or by verticals? You might want to choose a combination of these as well depending on who you want to target.

Don’t be afraid to spend time on this. Only then will it resonate with your target audience/s. You want to get this absolutely right. A change mid-way will mean a lot of disruption for everyone involved from content writers to designers.

Remember, even buyers typically look for answers with a Google search. And when they do, your site will come up. With a well-researched FAQ, sales can spend less time answering questions. Plus, it’s great for SEO.

Create an FAQ section with questions and objections your sales repeatedly face such as those around benefits, integration, reporting, pricing etc. Work with sales closely to develop it and get it spot on. Make sure sales uses it to answer queries, and enlist their help to maintain it.

Hopefully, you have a rich library of customer case studies before you start work on your product microsite. Otherwise, that can be a separate project by itself, from targeting and outreach to execution.

Work with sales and customer success to develop a library of customer case studies on your happy customers. Go after recognizable logos, your target verticals, and customers who have been with you for over a year. Case studies are also a great way to make your customers feel special.

Use customer case studies, video testimonials, customer quotes, and photographs across your microsite to make your customer stories come alive. When a customer says something about you, it carries a lot more weight than when you say it about yourself.

When was the last time you went to a company’s product page and you just couldn’t put a finger on what it is they do? I see it way too often for my liking. You can’t keep your product and your category a mystery if you want people to buy from you. You got to shout it out from the rooftops.

Showcase your key product collateral, such as:

Keep the majority of your product collateral ungated so people can freely learn about it. The more that buyers know about your product, the fewer time sales will need to educate them.

Don’t leave your microsite visitors hanging. At the bottom of every page, give visitors something to deepen the engagement, something to download and remember you by. You can gate many of these assets and rake in the form fills.

content, give them unbiased market research reports from reputed research firms. In addition to your Click to Action (or CTA) buttons offering free trials and product tours, create a comprehensive list of all downloadable and trackable content such as:

Many of these may already exist in different parts of your website or in shared folders. If they are dated, refresh them with a fresh coat of paint. Consolidate all relevant assets and bring them under the microsite umbrella. It will create a much more effective customer education experience, and will likely improve your SEO along the way.

A product microsite used to be a weighty project which took a quarter or two to complete from planning to execution. It does not need to be that way, especially with products and services on the market like 

 powers microsites with audience-specific content and with content that is delivered to your customers just when they need it.

In a microsite, the UX is in the detail. With less information to distract users on a microsite, companies can provide more detail on each product and its reason for being.

Some sites are overcrowded and this seriously affects the navigation of the site. This makes it difficult to complete the action users came to achieve lowering conversions.

A microsite solves the issue by offloading product categories from the primary website, to another more streamlined and specific site. The more targeted the site, the more likely people are to be engaged by it.

With a clear understanding of a smaller user group, call to action and content can be tailored to increase interaction and user experience satisfaction. Creating a microsite for one product can allow you to become a specialist in that domain.

Having a stronger position in one market can then strengthen the entire brand allowing for more risk without damaging alternative brand extensions.

As long as you check one or two of the objectives underneath, you can start building

How to build a product microsite

One of the most important aspects of a content management system is how it gives non-developers the ability to edit content for each single web page on your site. I think we can all agree that, for the most part, we don't want our developers spending their time writing content. Most headless CMS stay away from "page management."

They claim that, compared to the clunky traditional CMS architecture, the separation of content from its presentation disallows the management of "pages," as they are only intended for a single output - your website.

While this is true, it also ignores the fact that the main anchor for online content is your website, and it needs a special case. And yet creating pages, organizing sitemap, and reordering components on a page are one of the main tasks that editors often need help with when they work with a Headless CMS. However, it does not have to be this way.

When new customer experience channels started to emerge, developers had a great idea.

“Let’s build content management systems that don’t care about which frontend you use. They just pull and push content headlessly, to any channel or device using APIs!”

Suddenly, brands could write up content and design images to be spoken aloud by Amazon Alexa or displayed proudly on a wide-screen monitor at shopping malls, movie theaters and subway tunnels. Creating mobile sites and even a microsite dedicated to specific marketing campaigns for search engines and other channels is no problem.

The only problem was, that those headless CMS solutions focus purely on the usage of APIs to push and pull content to external applications and channels - ignoring the needs of marketing teams from traditional CMS - to find, organize and create this content.

 options come in different forms. Headless CMS offers numerous benefits for today's content management system landscape as well. In this section, let's have headless CMS explained.

Some of these headless content management systems label themselves as API-first, some as content-first, and many other variations of the headless trend. However, there is a problem with the way headless CMS operate.

Most of these content management systems can handle the storage and distribution of and managing content which makes headless CMS so attractive. These platforms recognize that it’s necessary to push content to various channels outside of the standard main site. The ability to connect to APIs and distribute to any front end makes this possible. However, a headless content management system caters to the ones producing this content - the editors and marketers.

Contrary to a traditional CMS, a headless content management system is entirely decoupled from the presentation layer or frontend, which is referred to as the "head." At the same time, the backend is your content repository and content management system, known as the "body." For this reason, headless CMS is often called decoupled CMS as well.

When you separate your content repository "body" from its presentation layer "head," it becomes a headless CMS. However, what truly makes a headless CMS better than a traditional CMS is its content-first approach with full APIs to access and display content in any way desired.

With this approach, a headless CMS enables you to author your content through the RESTful or GraphQL API and deliver that content wherever you need it — not just to a templated main website or application.

A pure headless CMS doesn't generate any front-end code, which is why a headless CMS is sometimes referred to as "Content-as-a-Service" (CaaS). This process results in the best available digital experience for the end-users of a particular device. Front-end developers can continue developing new functionality for any channel, independent of the core/backend CMS.

With headless CMS explained, let's delve into how decoupled CMS or headless CMS meets modern content management needs.

At the start of developing company websites, a developer usually determines all the pages and routes in your site so that then they can build the digital content types to represent them.

But what about pages we want to add in the future? I'm not talking about merely adding new blog posts or articles here, but instead adding actual new primary website pages, perhaps nested under other pages. What about landing pages, new lines of business, and so on?

The second complication here comes when we've got many pages and digital content we want to create on our website. If we have to create a different content type to articulate that, we will have a ton of content types to define.

Some traditional CMS options limit the number of content types, charging overages at a certain point. That's limiting in and of itself, but the bigger deal-breaker here is who is doing this work: Developers.

When we predefine our pages, a developer has to do the work of actually setting up those routes in code. Then they have to map those routes to the content types we defined earlier. Not only is that a great deal of work, but it means we have to get a developer involved again every time we want to add a new page! There's a better way.

A headless CMS acts primarily as a content repository, in order to store content and generate interest on multiple channels. This isn’t enough for the modern-day marketer and limits the capabilities of the organization as a whole, plus affects the digital experiences of potential customers.

Most developers and architects start building their content using simple content definitions, particularly in the case of traditional CMSes, and while that’s a good way to get started, it doesn’t scale well.

That’s why built-in page management is in high demand these days. Page management empowers editors to create and manage content using reusable building blocks, also called components.

Using these building blocks, editors can manage their site’s page tree (which helps avoid the pitfalls of duplicate content), edit SEO, and determine content relationships and the functionalities of each page.

Also, because of how a decoupled CMS is set up, developers can choose which components editors can add, where they go, and what they do. Think back to traditional CMSes wherein you cannot do this freely at all and you'll see how headless CMS is so much better.

Page management also includes page templates. Developers create templates to narrow down the possibilities of what kind of content and digital experiences your website shows, giving the editors the tools to customize them but with a consistent output. Each page template has content zones and focused content that gives editors a location to add, change or delete components.

Let’s recap this one day in a life of a content editor from a typical marketing team:

I need to create a new landing page specifically for the press. It will have the same content layout as the website home page, but just different content.

I need to set the SEO properties for each page, such as Meta Tags and Meta Descriptions. I also need to improve sitewide content infrastructure to boost the website's performance on the search results.

On the home page, we want the YoutTube video to be BELOW the Main Rich Text, but on our press page, we want the YouTube video to remain ABOVE the Main Rich Text.

Our CEO doesn't like it - can we have the YouTube video ABOVE the Main Rich Text area on the homepage again?

In the scenarios above, you can see that the editor's needs are impossible to predict. It's not their fault. It's just the nature of the game. Managing content comes with a lot of changes.

Not taking advantage of Page Management and the benefits of headless CMS for your digital solution means It's not flexible for editors. Hence, developers spend most of their time taking orders, tinkering with existing code to support content requirements, and wishing they were doing something else! Content infrastructure changes should not have to involve developers.

Editors cannot create/manage website pages on their own without a developer

Editors cannot control which components are on each page

Companies will find that more development resources/expenses are required over time

And, who's at fault for this? I'll give you a hint, it's not the editor, and it's not the developer... It's the architecture!

The Benefits of Headless CMS with Page Management

Using Page Management, you can empower editors to create and manage pages for your digital solutions using reusable building blocks.

With headless CMS page management, content editors can manage your site's page tree, and page-level SEO properties, and determine what content and functionality will be on each page.

Compared to traditional CMS, a developer and architect will still have full control over what page templates are available to the editor, where they can place modules within the page, and what the modules can do. To sum up, the benefits of Page Management:

Empowered editors who can do more without a developer

Happier developers who can focus on new functionality and enhancements, and less time responding to new website content requirements

Increased productivity for the website and the team behind it

 is a brand new application by Contentful that allows you to build and publish web pages in a few steps. Compose is a streamlined version of the Contentful web app designed specifically for editors and authors who don’t want to mess around with the more technical aspects of Contentful.

Unlike the web app, Compose does not require content modeling knowledge. Instead, editors can assemble pages from predefined content components and media, without involving additional engineering resources.

Compose experience is not the same as using Contentful with Page Management and is characterized by the following:

Compose is used for the quick creation of web pages.

Pages and fields are predefined and do not require extra setup.

The hierarchy of the page building blocks is displayed in a single editing view.

Entries can be published all at once with a single click.

The cost of Page Management with Contentful

For Team users, Compose + Launch can be added to all spaces within your organization for $1,995/month. The apps are available for a free 10-day trial, which will create a test space that allows you to test Compose + Launch without impacting the content or operations of your normal spaces. Contentful Team plans start at $499.

Recently, Kontent offers Web Spotlight as their Page Management feature. Web Spotlight combines in-context website management with the flexibility and multi-channel support of a headless CMS.

 makes it easy to create pages, add content, and rearrange components without any help from developers. Once you’re done, add the page to your navigation so all visitors can find it. With this feature, you can update content right within the pages of your websites. Changes can be made in seconds, without wondering how everything will look once it's published.

The cost of Page Management with Kentico Kontent

Web Spotlight is not included for free, you can add to your plan for $499/month. Kentico Plans start at $1249 for Business and $2,499 for Premium.

The architecture of WebriQ Studio is built on the headless CMS principles, but also around the MACH philosophy.

Built around Microservices and APIs, Cloud-native and Headless, WebriQ Studio is seamless to use and to operate. All components have an open-source philosophy.

Sanity and Sanity Studio for the headless CMS

Serverless forms and payment forms through AWS

Netlify for the entire publishing workflow and Edge functionality

The content schema is prebuilt and serves as the core of the publishing tool and as the only UI that users need to learn and understand.

Sorry, this page is not available.