I work in the world of web design, which is an ever-changing beast. There are constantly new ideas, methods, techniques, and languages evolving into what is trendy on the internet. Keeping up with what is current can be overwhelming, but in order to maintain a website that looks modern, updated, and relevant, it’s a small price to pay.

The best way I’ve found to keep up to date with current trends is simply to view lots of websites. If you’re visiting popular sites, design trends will often be up to date. Take a few notes as you browse on what you like and don’t like, and what you notice that is unique. Also, jot down some design practice you think show signs of staleness, and be sure to avoid those.

The next best thing you can do to keep up with current trends is to read about it. So if you’ve made it this far, you’re on the right track. As of the writing of this post, these tips will keep your website looking fresh!

Flat is in, for now.

Your site’s overall theme should consist of a flat look. The word often used in design circles is “clean.” Flat design looks clean and uncluttered. Loading up your site with shadows, 3D effects, and clumsy animations can distract viewers from your actual content and create a busy look. The last thing you want is something navigating away from your site because it was too much to take in. Keep it simple, keep it clean, keep it flat.

This is not to say that having a shadow or two on your site should be totally banned. Executed properly, effects like this are an excellent way to draw attention to a specific part of your content. However, they should be used as a secondary design tool. Your primary and overall design should be flatter than my voice trying to hit the high notes in Ed Sheeran’s “Castle on the Hill.”

Hide bulky content in accordions or tabs.

UMHB accoridionSpeaking of keeping your site clean, having too much content on a page can overwhelm your viewers. Most people tend to skim websites, so they’ll get lost in a sea of words. One way to help break content up is by adding pictures and other visual elements to give the eyes a break from reading.

Another way to take a lot of content that may be necessary but not super important is to display said content in an accordion or in tabs. These features allow users to click on a topic or sentence on your page before being shown the onslaught of information. This can prevent information overload while still giving the user access to all of the content they need.

A perfect example of using accordions or tabs would be a Frequently Asked Questions section. At first, users care far more about the questions than the answers. They have a specific question, and they’ve come to your site for answers. Rather than having to dig through an entire page to find their question (a lot of people have no idea what Ctrl+F does), you could display the questions and answers in an accordion format. The tabs show the questions, and when clicked, the answer appears. This is particularly helpful when some of the answers to the questions could account for an entire page on their own.

Utilize call to action buttons.

People don’t like being told what to do. But sometimes they need to be told what to do. On most websites, the goal is to get the user to perform some action with a click. Click through to the next page, enter your email to be added to a list, purchase yet another Funko Pop… whatever your website is for, there is likely some user action that is the ultimate goal of each page. So make it obvious! Put a giant button on the page that tells users what they need to do.

While people don’t like being told what to do, they do tend to like it when things are easy. If the goal is to get users to buy something, put a giant “Buy Now” button on the page. If the goal is to get them to sign up for an e-newsletter, put a giant “Sign Up Today” button on the page. Whatever it is, make it evident and easy for your users to understand. They’ll appreciate the gesture.

Easy Ways to Use Call to Action Buttons

Kiss your header sliders goodbye.

Once upon a time, sliders were all the rage. Nowadays, they’re mostly viewed as a poor choice. So what changed?

Well, lots. To start, sliders often function poorly on mobile devices, and as more and more web traffic is on mobile devices, sliders just aren’t cutting it. People tend to swipe up and down on mobile sites, not slide left to right.

With the current trend in design leaning toward a flat, clean look, sliders often take away from the simplicity of a page. Not only that, but they can muddle your message. The first image a visitor sees should clearly define what your site is all about. A slider can make that more confusing than it needs to be, or even worse, can simply scream “advertisements” to the casual visitor.

To top it all off, sliders usually slow down your page load speed by requiring extra scripts to run, which for you nerds like me, is a big SEO hit. All in all, it’s best to find a simple yet effective picture to do the visual talking for you.

Limit your navigation items in your menus.

Practicing menu-item-limiting really depends on your site, but I’ve found that in most cases, your primary menu should fall between 5 and 7 items, and your secondary menus shouldn’t have more than 8. Why is this?

For starters, having too many menu items makes your pages look cluttered, and this directly contrasts with the clean design approach we’ve more than established is “in.” On top of that, people tend to scan information online, even in menus; the more items you have, the higher the chances are that items will be overlooked.

Once again, depending on your site, that might be okay in some cases, but for the majority of people, keeping it simple will keep your visitors happy. Give users the content they need, but don’t overload them or overexplain things. Have a little faith that they’ll be able to find what they need!

Optimize images for the web.

If you aren’t already doing this, start now! While this isn’t necessarily a “design” practice, it’s still a helpful tip for designers and content creators. When you export photos for the web in Photoshop, use File > Export > Save for Web (Legacy), and drop the quality down until your image is at least under 1 MB. I tend to shoot for somewhere between 250 and 400 KB for larger header graphics, and under 100 KB for smaller pictures. You can often get there without really sacrificing too much quality.

You can also use image compressing sites like Compressor.io to reduce the file size of your images. As a designer, you’ll want your content to look great, but you should also care about speed and performance, and image compression is one of the best ways to keep your site running, not walking or crawling.

Saving for Web in Photoshop

Though these may be current trends now, there’s a chance this post ages poorly. When you’re in a profession that involves design, don’t take everything you read as gospel. Check the date on the posts you read, and do some fieldwork and research on your own. That’s where you can truly see what trends are hot and what trends are not.

Are you interested in graphic design? UMHB’s Art Department includes a graphic design degree that prepares students to communicate ideas and information within a commercial environment through the development of typography, visual problem solving, image making, and conceptual skills. Check out our website for more information, or stop by for a visit!