Client: Erik Remmel

Title: “Designing Your Best Website In 2018: The UI/UX”


Source: The Erik Remmel Blog Part 1 | Part 2
Word Count: 832 (part 1), 714 (part 2)
Notes: This is a 2-part blog on request of the client, merged together into this one project.

"UI/UX"In the technological world we live in, the pillar of marketing consists of two forms of design known as “UI” and “UX.” Oftentimes, they’re lumped together and illustrate how poor or how well a website is designed and how a user experiences the product. UI stands for User Interface, which is best defined as the overall look and feel, the presentation and interactivity of a product. On the other hand, UX stands for User Experience or the usability and ease of use towards its end users. In this episode of my blog, I will be discussing today’s most important and essential website components for 2018, the UI and UX.

When you visit a new website for the first time, you will notice immediately how well the UI and UX were designed. More often than not, it’s a fast pass or fail—fast as in under a minute. This is not unusual because people are quick to judge. You can gauge how well your designs are working based on your bounce rate. A bounce rate is how soon after landing on your page, your visitors leave. I’ll get into the underlying metrics in future blogs.

User Interface Design—Top Website Components

I’m covering the top components that a successful website needs. Based on your business or brand, you might not need every single one. However, comb through the below options to see which will best compliment your business’ website and products.

For those of us who are in sales and marketing, having a call-to-action (CTA) is critical. You have to give visitors a reason to take action to either learn or buy. During the design phase, ensure the CTA or button to sign up for your service is visible. A nice trick to use is the trick of space. Putting lots of space around the sign-up button will bring visitors’ eyes to the action. Thinking of the button as a real start button will tell customers what they can expect. For example, “go” or “join” is not as powerful as “Sign Up Today” or “Explode Your Business.”

Giving your visitors and regular users a way to search or navigate your site is helpful. Some websites have search bars at the top. This option is very useful when searching for specifics such as keywords, terms, and verbiage written in blogs. Websites heavy with written content—blogs, articles, a research database and so on—would benefit greatly from a search bar. On the other hand, a site map or informational footer is the route to go when using a website with many sections and pages. You’ll notice the difference between a standard footer and an informational footer simply by the size. Here are two differences:

User Experience Design—Top Website Components

Navigation is key when it comes to UX. The denser the content on your website, the thicker your menus and navigation could become. No matter how many public pages your website boasts, the menus should remain simplistic. A drop-down menu (or several) can organize everything into a manageable list for the end user. Depending on how your website is designed, it may make more sense to have a primary menu and a secondary menu. One of my clients has a perfect example of a double menu: FotoBox Live. You can see the primary menu has a transparent black background, while the secondary menu has a red background above it. These examples will give you some ideas to start or adjust your existing website.

In what ways can visitors contact you? Be sure to include all the necessary modes of contact for your website. Many businesses go overboard when they try to win over visitors. Keep it simple. It would be a smart idea to include multiple “Contact Us” modules across your web page. I feel that you should have a separate “Contact Us” page and a handful of “Contact Us” boxes scattered on other pages. A great example of this principle can also be found on the FotoBox Live site. I’ve suggested placing CTAs and prompting users to request a quote for their photo booths from whatever page they moved to. This way, users didn’t have to find the one and the only button to take action. My team and I duplicated it onto every major informational page.

Checklist And Recap

  1. UI: Call-to-action (CTA)
  2. UI: Search bar / Informational footer
  3. UX: Navigation
  4. UX: Contact

How many of these major components do you have? Follow-up question: could any of them be simplified or improved to better convert visitors into customers? Your CTA could be modified to garner more attention or duplicated to other informational pages regarding your product or service. It’s not always a matter of “what can I change?” Most times the question you should be asking is “What can I add or enhance?” Another question to concern yourself with is “How can I be different than the rest?”

"UI/UX"Websites are still raging on as the primary means to inform the masses about a person, a cause, a business or a product. To refresh: UI stands for User Interface, which is best defined as the overall look and feel and the presentation and interactivity of a product. On the other hand, UX stands for User Experience or the usability and ease of use towards the end users. In part 2 of my blog, I continue discussing today’s most important and essential website components.

User Interface Design—Top Website Components

Visuals are definitely key and worth explaining as the first piece of UI design. Every business will need visuals of some sort, be it a photo gallery, backgrounds, professional product photos, videos, video graphics and so on. When we mention visuals, headshots and maps are very popular for innovative teams. Letting people know who is the face of your company or who is on your team helps visitors build trust between you. Where you are in the country or the world is a helpful tool as well.

Fonts, although separate, can also fall under visuals. It’s not often these are overlooked, but some websites are rough. Papyrus is not a font to use as body text and I’ve seen it before. Keep fonts light, legible, and properly-sized. Use multiple fonts to create flow within your design as well.

Email subscriptions—yes, this is the big one. We all love and hate email subscriptions. The right marketers know how to keep their list growing without an excessive number of opt-outs. It’s a matter of properly balancing emails and newsletters to their user base. Even before discussing your list, talk out the details of time delays or a trigger on your website. Do you want your email subscription pop up to appear as soon as a visitor lands on your homepage? Would it be better if the email request box popped up when they reached a certain section of your website’s homepage?

User Experience Design—Top Website Components

Visuals are important enough to list in both categories. One important part to realize is how many visuals to include. Too many visuals can overwhelm prospects, while too little might be a turnoff and a disservice to yourself and your brand.

Giving people information about you will earn their trust. Hopefully, it is true information about yourself and your business. Company past milestones and how the entity was founded is great to share. You may not think people will care about it. However, in the long run, it adds to the relationship between you and your customers. Your ‘About Us’ page should reflect a variety of things such as chief staff, history, your mission and vision statement as well as your value propositions. This is also the page you can use to professionally boast your achievements.

A great follow up component to the ‘About You’ page is a secondary page for testimonials. Of course, a great way to maximize the effectiveness of testimonials is to film them and embed a YouTube video or Vimeo video on your website. This is just my hypothesis, but people will most likely favor giving a written testimonial in lieu of a video testimonial. If that’s the case, use a written testimonial that can’t be simply copy-and-pasted. IDEA: You could screenshot a written testimony of a popular review-based website like Yelp, WeddingWire, or any resource found in this snazzy article!

Just as important as testimonials is your portfolio. Showing potential new clients what your past projects have included is a great move. Some people may be against this for fear of others stealing their work, which is a possibility. We recommend watermarking and/or copyrighting any work you can before posting it online. Keep in mind that not having any past work to showcase might draw a flag. Now, if you’re new to business and don’t have a portfolio, well, of course, you can’t showcase any past work. Be sure to work hard and hustle to get one growing as fast as possible. Don’t fake any work until you can show your real work. People will see right through the curtain and your credibility will take a serious hit.

Checklist And Recap

  1. UI: Visuals
  2. UI: Fonts
  3. UI: Subscription
  4. UX: Visuals
  5. UX: About You
  6. UX: Testimonials
  7. UX: Portfolio
© 2019 Writer's Block Media, LLC | Privacy Policy