Web design is all about striking a fine balance between flair and function. You want your content, visual design and UI to wow your audience, without being so flashy that it hinders the user experience and bogs down your site’s performance.
So, trying to be bold and tenacious on the web can get a bit tricky. The bolder you get, the higher the risks. But there are definitely ways to make it happen.
Keep It Real
With modern design, it’s all about visuals. You’re better off saying as much as possible with a stunning, high-quality photo or image than a wall of text. The good news is that it’s easier than ever to optimize high-resolution images so they load quickly and effortlessly, even on older devices and browsers. Mobile is a huge concern, too, especially considering it’s the major browsing platform of today.
The website for Forklift and Palate — belonging to an exceptional restaurant in Pennsylvania — is one of the best examples of this concept. They’ve chosen to use a deep, yet solid, header to accent the top portion of their front page. Right below that is an image of one of their delicious meals. Look at that plate! Our mouths are watering already.
Parallax the Page
Parallax scrolling and design techniques are a love-it-or-hate-it deal. But even if you’re not fond of the practice, you have to admit when web designers use it effectively, it really spruces up the aesthetics and feel of a site.
Take a look at the Spotify front page, for instance. It’s not too flashy, but there are enough design elements and pops of color to keep the overall look fresh and engaging. Not to mention, the colors and theme of the page mesh well. As it turns out, it is possible to be tasteful with such a design technique.
3. Animate When Possible
Animation, when used properly, can be absolutely stunning on both desktop and mobile. For a solid example of the proper use of animation, head on over to the Symbolset website. Feast your eyes on the entire front page for sure, but make sure you watch that animated carousel right at the top. You see, most elements like this use sweeping visuals and flashy photos to stand out. The Symbolset team used minimal colors and fonts to achieve the same goal.
Animation is still unequivocally one of the best ways to make a bold statement on your website without destroying the bulk of your design. Yes, you do have to work to optimize everything so your site loads quickly and reliably. But once you get everything right, it’s perfect — and that’s exactly the kind of mojo you’re looking for.
4. Take It Back to Basics
If you only get one takeaway from reading this article, it should be this: Minimal and subtle are not synonymous with unattractive and bland. In design, less is often more. Keeping a minimal design means you’re staying clean, straightforward — and, more importantly, simple. Trust us when we say your customers and audience will appreciate an effortless, straightforward approach.
The Dropbox site is perhaps the best example of this concept. Newcomers who land on the site get a quick tour of the service, features and support they can expect. Returning users, meanwhile, immediately get a login prompt, along with the option to download the desktop or mobile app. It’s simple, clean and efficient — not to mention, it looks and performs well no matter what platform or device you’re browsing on.
5. Choose Your Spaces Wisely
Animation can definitely spruce up any site, but sometimes it’s better to crop the canvas and keep things a little less — well — resource-intensive. Take a look at the front page of the Squarespace hub. As you may know, the service makes it extremely easy for just about anyone to build a professional-looking website, even with little to no coding, design or website development experience.
What really stands out, however, isn’t necessarily the subtle animations and visuals they implemented throughout the page, but the location choice for each element. The large, top-seated carousel shows a small, animated tablet screen. Further down on the homepage, there’s a series of side and background images with brief pops of animation. The visuals are subtle and unobtrusive — almost to the point that you might overlook them — but still visible enough to keep the entire design modern and delightful.
Follow Squarespace’s lead, and remember to choose your spaces or elements wisely. You don’t always have to go with a sweeping animated frame to capture attention or focus.
Go Big or Go Home… Sometimes
Bold and tenacious is not always conducive to reliable and enjoyable, especially when it comes to modern web design and visual elements. If you plaster your website with high-resolution, large-sized images, your audience is going to run into some issues. More specifically, your site’s loading times will be slower than average, and since Google does penalize sites for performance issues, you’ll take some hits regarding your SEO, too.
Ultimately, the idea behind any good website design is to remain tasteful and engaging. If you follow the rules set forth here, you should do just fine. Don’t be afraid to experiment and step outside the box a little — just make sure you optimize the experience for your user base as much as possible while you’re at it.
Lexie Lu is a designer and writer. She loves researching trends in the web and graphic design industry. She writes weekly on Design Roast and can be followed on Twitter @lexieludesigner.