The Best Websites of 2022

Posted on January 27, 2021 | Updated on June 21, 2023

How do you figure out which are the best websites of 2022? Trends come and go, so you don’t want a too modern choice. At the same time, the best websites don’t look dated. The top ones are often popular with users and thus have a lot of time and money to invest in the usability of their site. 

Figuring out which sites are “the best” is a bit subjective. While there are some elements that stand up to good design principles, others may or may not enhance the overall user experience (UX). What industry a business resides in can impact which features are most important.

According to Internet Live Stats, there are approximately 1.9 billion websites in the world. Not all are active, and some domains park on top of others. Still, business owners and designers face a lot of competition in grabbing and holding people’s attention. For example, if you run a mortgage company, a calculator is a vital part of the UX.

If you want to stand out from the crowd, you must embrace the top things users gravitate toward. What is it about the most popular websites they love? How are even smaller brands innovating and adding excellent user experience (UX) without spending a fortune?

What Are the Website Trends for 2022?

Figuring out the web design trends for the year isn’t always easy. To figure out some popular features, we looked to numerous design advice and tech information sites. Some trends we readily agreed would be a thing, but others seemed pretty iffy. Here are the ones we expect to last throughout the year:

  • One-page: With more people accessing the internet via mobile devices than ever before, we agree that single page sites will become more popular. There’s no need to worry about clickable areas for smaller screens or broken links. Everything is viewable on scroll. 
  • Fewer Hero Images: Although there is always a place for a big, beautiful image, many brands emphasize the content and headings. Expect to see fewer large images and more headlines. 
  • Big Typography: Huge headings are something we’ve been seeing for a while as designers play around with different typefaces and layering. We expect this trend to continue but type to become more and more responsive to different screen sizes. 
  • Inclusive Copy: Brands are more aware of what they say, how they say it, and if everyone can access their copy. They’ll pay particular attention to alt tags and descriptions in 2022. 

Many trends will come and go throughout the year, but good design stands the test of time. 

What Criteria Did We Use to Choose the Best Websites of 2022?

It’s impossible to predict every trend or which websites will rise and fall. However, by looking back at some of the best sites of 2020, we can make some excellent guesses about which ones will remain popular with consumers. 

Some of the criteria we used included recommendations based on information from Lydia M. Olson Library for Northern Michigan University on evaluating sources. In addition, we considered the aesthetics of the site and how well the design tapped into user needs and expectations. 

  • Accuracy – How true was the information on the site? Were reliable sources quoted and linked to for verification? How trusted is the brand?
  • Coverage – How well does the website cover the topic? Is the focus wide enough but not too broad? If there’s a blog, does it dig deep into a subject? If it is an e-commerce store, are descriptions detailed enough?
  • Objectivity – How neutral was the content? If the site had reviews, was there a mix of positive and negative, or did they seem skewed? Were negatives presented, even if only to overcome objections by the buyer?
  • Currency – How frequently is the page updated? Are there dates somewhere to show the last time there were edits?
  • Appearance – Is the navigation bar straightforward and easy to work with? What about the aesthetics of the site? Is the site user friendly, even for those on mobile devices? We checked each site on both desktop and mobile. 
  • Speed – We also considered how quickly the page loaded. Nearly every browser considers page load speeds in their algorithms and search engine results pages. If a site doesn’t load quickly, it might be beautiful but not as usable.

Each category received a grade of A, B. C, D or F. We looked at 50 different popular sites and narrowed the choices down to the top 16. We also threw out ones people are crazy familiar with, such as Google or Amazon. There are plenty of articles about why these places have excellent UX. We wanted to dig into websites more applicable to small business owners. You’ll learn a lot by studying these examples and what they do best. 

1. HumAIn

Source: https://www.humain.ai

HumAIn is right on trend with large, beautiful typography for the headline, and some interactive animated elements. As the user mouses over the heading, a darker orange gradient morphs around the letters. 

The overall effect is a smokey orange aesthetic that keeps the user engaged and reading. We love the logo, with the highlight around the letters AI in the wordmark. Interesting visuals are on trend with what we’re in 2022 design and should stick around for at least the next several years, making the site somewhat evergreen.

2. Heyday

Source: https://heyday.xyz

Heyday offers a relatively simple design. The sans serif font from the Helvetica family is basic and easy to read. The graphics are hands pointing toward the call to action or where the designer wants the user to look. Even the call to action (CTA) button is a simple green oval with white letters. 

Since simpler sites are on trend for 2022, we expect people to love the sole focus of this website. When a user lands on this page, it’s clear what their next action should be. You won’t find a bunch of competing element to distract from the goal.

3. University of Notre Dame

screenshot university of notre dame
Source: https://www.nd.edu

One could argue whether a university is an organization or a business, but we’re just going to argue that the Notre Dame website is one of the best websites of the year. The layout is highly intuitive. Most people visiting the page are either students or parents of potential students, so having information about how to visit, academics and admissions in the header is smart.

What put this site over the edge for us compared to other education sites, though, was the limited number of categories. The university uses subcategories to offer further filtering. Also, the excellent content on the home page draws people in and makes them aware of some of their students’ work, what one might find on campus and top university news. 

You’ll find an excellent balance between headlines, text, and images on the page. Even the university colors are limited to the top and a few accents, with neutrals in the body so that you can effectively use any image. 

We also like the minimalistic and flat icon vibe of the design. The entire site is aesthetically pleasing and easy to navigate. New users won’t get overwhelmed or have trouble finding what they’re looking for.

4. Polygon Studio

screenshot of polygon studio website
Source: https://polygondesign.com.au

Polygon’s website showcases the two sides of its business model. One thing we really think is on trend for this site is the way it scrolls to the side instead of up and down. As the user hits Pgdn, the entire section shifts to the left.

The side scrolling element works particularly well for mobile users. With more people than ever before accessing websites via their mobile devices, expect to see more side scrolling in upcoming designs.

Also of note are the beautiful images showcasing their work. We love the directions notes explaining what the user should do and where they can locate a link to scroll and explore or click to shop more.

5. Frank Clegg

screenshot of frank clegg website
ource: https://frankcleggleatherworks.com/signature-lock-satchel-green.html

Frank Clegg is an American handbag company. We found this one of the best examples of an e-commerce store thanks to the ample description and how they showcase the different color options.

The description itself offers details as bullet points and then you can click on tabs to learn more about size and fit, product care, shipping and returns, and production time. 

6. Twisted Lily

screenshot of twisted lily website
urce: https://twistedlily.com

We love the way Twisted Lily uses a slider in their hero section. Although some would say sliders are out, we think this one more than makes up for anything dating a slider. Note the animated spinning wheel on one slide that matches fragrances of the world. 

Users can easily find their favorite fragrance type on the wheel and navigate directly to the best product for them. Not only is the wheel functional, but it’s a lot of fun and keeps site visitors engaged and thinking about the product choices.

Another thing that makes this particular slider work is that the elements around it are kept very minimalist. The background is white, and there aren’t any other graphics to distract from the slideshow. 

7. Instructure

screenshot of instructure website
Source: https://www.instructure.com

There’s a lot to love about the Instructure website design. First, we appreciate the live chat option that follows the user down the page. Since they’re offering a service as a software (SaaS), offering instant communication and a free demo is crucial to selling this edtech option. 

The design is clean with pops of red to draw the user’s attention to where the web designer wants it to go. At the same time, the CTA button has a bit of gradient color going on to give the site a unique feel. 

8. Lucky No. Candles

screenshot of lucky no. candles
Source: https://luckynocandles.com

Lucky No. Candles features a pop-up box when you land on their homepage. The idea is to capture visitors and collect their information. The company can then send messages and segment the audience for higher conversion rates. 

Although some people hate pop-ups, they still work to grab attention and convert site visitors. Consider adding a discount if the person signs up. You might also want to let them shop around a bit and then throw up the offer, but we still appreciate this one because of the beautiful animated images and how nicely the box meshes with the rest of the design. 

9. Martha Mae

screenshot of martha mae website
Source: https://marthamae.info

Martha Mae uses a hello bar at the top of their page to entice people to shop and spend a bit more in their e-commerce store. If customers spend $150, they get free shipping. We like how their banner bar is a different hue but still meshes with the rest of their color palette.

Use a hello bar to share information, such as current discounts, free shipping offers and other promotions. 

10. Bookshop.org

screenshot of bookshop.org website
Source: https://bookshop.org

Bookshop.org goes off the grid and lays out some of the books people can search for in an asymmetrical format. The simple purple background and the vivid hues of the covers grab the reader’s attention. 

The popularity of bright colors comes and goes in internet design. However, when used in the right way, the combination almost always works. Experiment with different combinations and see what your users respond best to. You can always conduct split testing to see what converts visitors into buyers. 

11. Catbird

screenshot of catbird website
ource: https://www.catbirdnyc.com

Catbird uses gorgeous and stunning typography throughout the site. Notice the wordmark logo and how it has a handwritten font look. Then, the headlines, such as “Hundred Summers,” are a script font. The body text is a sans serif presented in different sizes, italics and bold in spots.

The text hierarchy of this site makes it clear what the most critical information is and what users should pay attention to. 

12. Estelle Colored Glass

screenshot of estelle colored glass website
Source: https://estellecoloredglass.com

Estelle Colored Glass does an excellent job with its content. Not only are the images relevant, but the gorgeous glass captures the imagination. As the user scrolls down, they share the story of the luxury hand-blown colored glass cake stands and stemware. You find out how they got their start and why the brand is named “Estelle.”

Your brand story is arguably one of the most essential parts of your design. It’s what makes you unique. No one else faced quite the same challenges or has the exact purpose you do. 

13. Twitch

screenshot of Twitch website
Source: https://www.twitch.tv

Twitch often hits the top 20 lists of most visited websites. One of the reasons for its popularity is the different types of videos offered. People love to stream things online, and Twitch offers live options, how-tos and shows. It’s like a mix between YouTube, Facebook Live and Amazon Prime video. 

Some of the more interesting things in their design include links to the most viewed creators and live channels they recommend. The sign up button is in a banner bar across the bottom of the landing page. While the design itself is a bit busy, designers can learn a lot from how they list popular features and make them easy to locate. 

14. Mammut

screenshot of Mammut website
Source: https://www.mammut.com/uk/en

Mammut uses a split screen design, which is fairly popular for 2022. Dividing the space above the fold in sections allows the designer to share two competing images, a before and after, or have room for some text next to a stark picture. 

Mammut places a vivid image of their shoe with some of the other gear climbers use on the left and a plain box on the right that matches the colors in the image. They then have a large type headline and a tagline. Note the arrows and benefits listed across the bottom of the page. 

15. Blok Watches

Source: https://blokwatches.com

Blok Watches utilizes some simple geometric typography to add an element of interactivity to their landing page. Interestingly, they cover their call to action button with the letter “L,” allowing only part of it to peek through.

The user is curious and thus scrolls down and clicks to see what they need to do to make the letter move and see what’s on the CTA button. The concept wouldn’t work for just any type of website, but the high-end watch designer already has people’s curiosity.

As the user scrolls down, animated elements burst into life and the letters shift to the side, breaking the middle of the screen wide open. It’s a powerful statement about the fun, high-tech watches the company makes.

16. Yeti

Source: https://www.yeti.com/

Yeti does so many things right on the website, it takes a minute of study to see them all. First, the pages are rather minimalistic. They use a bold, bright image of their products in use as the background, which makes the page seem busy at first glance until you realize the photo serves as the background and the other elements are limited to a handful.

The fixed navigation bar scrolls down with the user, giving them a point of reference as they move through different elements on the page. There is a live chat feature, so the user can interact and get questions answered instantly.

At the top of the home page is a reference to upcoming seasons and holidays. Adding timely material is a smart move on Yeti’s part and taps into a segment of their buying audience looking for gifts or seasonal items, such as coolers.

Even the colors on the page work well, coming in muted greenish-blue and white. Any pops of color from the products stand out thanks to the subtle effect.

Tech May Change Best Design Practices

There you have it—our favorite websites for 2022. We’ve worked on selecting a wide range of business types and highlighting some of the current trends, so you can repeat efforts for your site. 

Tech is advancing faster than expected as people stay home and do more online shopping. As computers grow faster, connections more secure and machines and artificial intelligence advances, expect to see tech trends emerge, such as more speech recognition, voice search, touchless navigation and intuitive audience targeting. 

There’s no telling where 2022 might take web designers. We can learn from the sites already built but keep an eye on innovations as they emerge throughout the year.

About The Author

Eleanor Hecks is the Editor-in-Chief of Designerly Magazine, an online publication dedicated to providing in-depth content from the design and marketing industries. When she's not designing or writing code, you can find her exploring the outdoors with her husband and dog in their RV, burning calories at a local Zumba class, or curled up with a good book with her cats Gem and Cali.

You can find more of Eleanor's work at www.eleanorhecks.com.

Leave a Comment





Related Posts