UX, UI, and Landing Pages: Whats the Story

As I have progressed through the many tools of Digital Marketing in hopes of becoming a digital native, it has been cool to discover how many of the tools overlap with one another. For example, a few posts back I discussed the overlap of web analytics with A/B testing and how web analytics provides the metrics needed to discern between various webpages. Once again, A/B testing will be making an appearance later on in this week’s discussion about landing pages. But first, I want to begin with a brief introduction on User Experience (UX) and User Interface (UI).

Defined very generally, user experience (UX) is, “the overall experience of a person using a product such as a website or computer application, especially in terms of how easy or pleasing it is to use.” In digital marketing terms, this user experience may refer to a website, app, or some other sort of digital marketing effort; the question then becomes is that medium easy to navigate through and does it flow well? These questions are the responsibility of a UX designer. Fast Company describes the job of a UX designer as someone who is “concerned with how the product feels.” If you are like me, you maybe thinking that the “feel” of the product relates more to the visual aspects of a page or the “interface design.” However, when we discuss the “feel” in terms of UX, we are more referring to the “experience, emotion, intuition and connection a user feels when suing a site or product,” in addition to the “usability” of the site/product. That being said there are a few key aspects of UX design that are important to note:

  • As discussed above, the key job of the User Experience Designer is to ensure that the digital product/page/screen/medium flows easily. Fast company says, “The Broad responsibility of the UX designer is to ensure that the product logically flows from one step to the next…By identifying verbal and non-verbal stumbling blocks, they refine and iterate to create the ‘best’ user experience.” This is a key aspect for organizations to understand, because, in my opinion, the flow and experience of a digital product is crucial for doing business. For example, an organization that conducts a majority of its sales via ecommerce should be very concerned with the user experience they are offering. Consumers need to enjoy their time on an organizations site and be able to easily navigate through the steps to make a purchase. If the user experience is poor, customers may not put in the effort to do whatever action they were going to do, leading to conversion loss for the organization. In an article discussing UX and why it matters, Design Shack puts it best when they state, “In terms of design, user experience is just as important as visual identity. Seriously. It doesn’t matter what your site or app looks like if people don’t know how to interact with it. And moreover, they need to enjoy that interaction.”
  • Another key aspect of User Experience Design, that ironically diverts the attention away from users in some sense, is the interaction between UX designers and their fellow “partners” or coworkers. An article by UX magazine on “successful UX executives” presents four key ideas that will, ideally, lead to a more successful user experience by diverting the attention to internal dynamics. The four tips from UX magazine include: Study those around you as you would study users, studying those around you isn’t enough-you must have empathy, build relationships, and remember that people may not understand UX. While there is a lengthy explanation for each of these four tips, the essential lesson is that user experience designers need to put great effort into understanding colleagues/partners and their goals. The need to support their colleagues and create lasting relationships is due in great part to the need of mutual support for the UX work that they are doing. While it is an interesting concept to turn the spotlight away from the direct users of the pages/products, the idea that UX magazine is presenting is a crucial one for organizations and digital marketers working as UX designers; you need the support of those you work with in order to create an exceptional user experience. The article speaks about UX designers experiencing a lot of push back in their recommendations/ideas which can prove frustrating because the UX designer is the “expert.” But something to keep in mind is that “people may not understand UX” and therefore not understand your recommendations and why they will enhance what is already there. The article emphasizes that just as UX designers need to “ground” themselves in “users’ needs, wants and desires,” the same needs to be done with partners. “UX executives have learned that this skill translates directly to their professional success: ground yourself in your partner’s needs, wants, and desires to ensure that processes you build, the strategies you create, and presentations you give will speak to them and enable mutual success.” Gaining respect and mutual support internally is a key thing to know about UX design for organizations because having a strong internal dynamic will further enhance the user experience. Organizations want users to successfully interact with their digital products/mediums, but it is clear that this will not be able to happen unless the organizations UX team is on the same page as the other “partners.” By emphasizing their internal dynamic, Organizations are setting themselves up for greater collaboration on UX aspects, which will ideally translate into positive customer interactions and conversions.

Defined generally, UI design or User Interface Design is, “the design of websites, computers, appliances, machines, mobile, communication devices, and software applications with the focus on the users experience.” As stated above, the UX designer is primarily concerned with the feel of the product, where as the UI designer is primarily concerned with “how the product is laid out.” Fast Company describes the job of a UI designer as some who is “in charge of designing each screen or page with which a user interacts and ensuring that the UI visually communicated the path that a UX designer has laid out.” Again it is important to make the distinction that UI design is not about the feel, which was my initial thought before taking a deep dive into these two topics.

  • An important aspect of UI design to note is the various jobs that a UI designer might perform. According to Fast Company, UI designers might do anything from deciding where content should go, create a “consistent design language,” “maintain consistency in visual elements,” decide how to display “error messages,” etc. It is important for organizations to understand the jobs of a UI designer so that they can ensure their digital marketing products/pages/screens have the visual elements that are needed and are laid out in the way that makes the most sense. The UX and UI designers need to work together to enhance digital products for the consumers.

Landing Pages
As most digital marketing gurus probably know, landing pages are key because they represent the digital marketing version of a first impression. By definition of HubSpot a landing page is, “a website page specifically designed to convert visitors into leads.” When your organization presents some sort of digital marketing effort, users click a button that hyperlinks them to a specific landing page that is, hopefully, relevant to them as a buyer and where they are in the buying process. Because the landing page is the first thing that a consumer sees after being navigated from whatever marketing effort lead them there, it is crucial that the page be “attention grabbing,” “uncluttered,” and “bold.” You want to get the consumer to stay and engage in the “event” or “offer” that will count as a conversion, whether that event be a download, or email sign up, etc. Landing pages are a key part of digital marketing efforts that organizations should pay extreme attention to because all of their marketing efforts point in that direction. Alexis Anderson, a director of marketing at PureWow, puts it best when he states, “We pour tremendous time and energy into driving qualified users to our landing pages to sign up for email. If they don’t take the last step to actually enter their email addresses, it’s a waste.” Because landing pages are so important, there are some very specific “best practices” that organizations should ensure are included in their landing pages:

  • Headlines: Both HubSpot and Copyblogger agree that landing pages MUST have a “compelling” headline that breaks through all of the clutter. Copyblogger states, “It’s your two second chance to overcome the swift and brutal attention filters that we have developed due to information overload.” Organizations can benefit from utilizing attention grabbing headlines because it will ensure, hopefully, that their consumers will actually take the time to read what the landing page is offering them, thus leading to a conversion.
  • Only ask for “one thing” or present one offer: HubSpot greatly harps on the importance of the offer and it being relevant to where the user is in terms of the “buyer’s journey.” In addition to this, Copyblogger says that you should “clearly ask for that one specific thing.” For example, if you are offering coupons to a user, only ask them for their email so that you can send them coupons. Don’t also ask them to sign up for a monthly subscription to your magazine or something additional your organization might be offering. This practice can help to organizations because it will increase the chances of the user actually giving them what they are asking for. Copyblogger goes on to discuss the idea that if you ask for too many things or give the consumer too many choices, they will end up choosing nothing. If that occurs, all the digital marketing efforts that lead up to that point will be for nothing.
  • Bullet Points: As digital marketers, we all know that customers are only going to read so much, and if they see a long paragraph of information, chances are they will not read any of it. HubSpot and Copyblogger both agree that a best practice of landing pages is to present information in bullet points and “put the most important points at the beginning.” Organizations can benefit from putting their information in bullets because it increases their chances that a customer might actually read what the landing page is offering them. If a customer takes the time to read, the organization is increasing their chances of getting a conversion or “qualified lead.”
  • Remove extra “clutter” from the landing page: As stated in the introduction to landing pages, they must be “bold” and “uncluttered.” HubSpot and Copyblogger both agree that a landing page best practice is to remove additional “links,” navigation bars,” and any “visual clutter.” The reason being is that you want the customer to be solely focused on the “offer your making them without being tempted to wander the room.” This is a tip that organizations can better from because it is again going to increase the chances that customers will take them up on their offer and they will land a conversion. If the landing page is focused and concise, there is an increased chance that users will engage.
  • “Assume nothing. Test everything.” This is a best practice that is presented by Copyblogger and it is where we see the overlap from A/B testing. When designing landing pages, it is imperative that an organizations test various designs, via A/B testing, in order to discover which design is leading to the greatest conversion rate. After all, if all of an organizations digital marketing efforts are leading to this point, we want the customer to take the offer. Organizations can better ensure that customers will take the offer if they test out the design of their landing pages.

HubSpot offers a great resource to organizations in the form of example landing pages that are doing everything right. They are concise, contain clear headers, ask for one thing, etc. One particular landing page that I found very “elegant” and successful was Shopify’s landing page. You can see from the image below that they have a clear header introducing their “create your store” offer. In addition, they are only asking them to sign up at the bottom and there is little clutter on the page. HubSpot is also a believer in having a video or image on your landing page, and Shopify is employing that technique. Visit HubSpots blog to see more companies that are utilizing landing pages in the correct way.

All quotes and statistics came from the following sources:
General Google definition of UX
Definition of UI
Design Shack Article
Mashable Article
UX Magazine Article
Fast Company Article
HubSpot Landing Page
HubSpot Conversion Process
Shoplift Image


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s