Do you even exist if you don’t have a website? The answer is no, which is why we are writing another blog on website trends and user experience. We tapped our resident experts on the team, and their exact response was, “this is great, I love talking about web design!” We hope we can match their enthusiasm in this blog.
Trends
When looking at design, these are the current trends we’re really digging.
- Micro-interactions: This is using small amounts of animation to really bring a site to life. These can range from button-hover animations, to having the background move with the mouse as it crosses the screen. They can add huge amounts of dynamism to any website, even if the content is a little dry. Be careful to not overdo it as animations can slow down a page, especially on mobile.
- Hero images: These are front-page images that tend to cover the entire screen. On mobile, they often feature a clear CTA for the interaction a user should take. Integrating these with micro-animations boosts the engagement on a website significantly.
- Video hero: Videos can be great as heroes, especially if a site can’t handle animations. However, be sure to embed the video from elsewhere instead of uploading it directly to the site. Big files like that can slow download times. It’s also a great idea to include a play/pause button on mobile and/or provide an image to load instead on devices or connections that might not be able to support a video.
User Experience
Two words—mobile friendly. Google only cares about how your site performs on mobile. That means it can be beautiful on a desktop, but if it loads slowly or offers a poor user experience on mobile, you’ll get penalized. That could even mean the difference between the first and second page of search results.
Here are other things to consider when it comes to UI design.
- Navigation: Understanding what a client will WANT to do on any given page is imperative. For example, we recently checked out a portfolio website that began as a gallery, where each image was clickable. Once they clicked into an image, they got a case study. When the viewer reaches the end of the case study, rather than having a button to click back to the gallery, they simply have the gallery layout again. It becomes a seamless experience that keeps users engaged longer.
- User testing: People often think about websites as a series of pages, but they’re really more of a journey. That’s why user testing is a great practice. Get someone to visit a site, and see where they go. Notice if they have to keep clicking back to a specific page or drop down to access the information they need. Is there a better way to present this information? What about a button or an accordion? It may even be as simple as an auto-redirect to the main page, like in the example above.
- Just click it: Clickable elements are great on a desktop site; users can simply click on something to open it up. However, on mobile, if that item takes up the full screen, it’s likely that your user is going to have to swipe up to get past it, and that’s just a recipe for clicking on something accidentally. Be kind to your mobile users. Offer a hamburger menu and maybe even a button that will jump them to the bottom or top of your page.
- Foot(er): People often overlook their footers. Footers are the chunk of information at the bottom of the design that appears on every or nearly every page of the site. A sleek footer on desktop could translate to multiple screens worth of information on a phone.
Users should have a clear set of actions to take on your website. If they reach a page with information but no call to action or links, it’s not clear where to go next. Visualize the journey you want your visitors to take.
One last tip. Say you just installed a bunch of awesome animations, but you’re afraid your site might be slow. Easy. Pop your URL in here. This will show you how quickly your site loads on mobile and desktop, and even offer you tips on how to improve your score.
Here’s the deal, we’re the experts so just reach out, and we’ll make sure your website is bold, responsive, mobile-friendly and user friendly.
