5 Ways to Ensure Your Fancy Site Doesn't Suck

Default avatar.
November 30, 2017
5 Ways to Ensure Your Fancy Site Doesn't Suck.
Macromedia has a lot to answer for. Flash may be on the way out; but flashy websites reminiscent of the ’90s are very much alive and kicking. They just use JavaScript now. And they take up a lot of bandwidth. Okay, I promise that this won’t be yet another rant extolling the virtues of minimalism, and websites that are hard to break. I mean, I prefer them. I always will. However, I am coming to realize that we minimalism-loving designers are outnumbered by designers who like to make things move around the screen (excessively), and the customers who hire them to do it. [pullquote]you can make your websites all kinds of fancy, while still making sure they don’t suck[/pullquote] Just look at any of my portfolio review articles. Fancy, “flashy” websites are here to stay, and they’re going to eat our data plans alive. You blew it up! Goddamn you a... okay, that’s out of my system. All hope is not lost, however. Best practices are still a thing. There are still ways you can make your websites all kinds of fancy, while still making sure they don’t suck. Here are some basic tips for making sure your dynamic, power-point-style, parallax extravaganza still converts users instead of frustrating them:

1. Use Moderation

Fancy effects stand out more when they’re not everywhere. When everything is animated, then animated stuff isn’t all that special, is it? Try to limit the number of elements on your page that get hit with the innovation stick. If that’s not an option, make elements that users have to interact with fancier and flashier than other elements. Use more subtle animation for hero images, and especially for anything in the background. Limiting the number of things you animate or otherwise make fancy will drastically decrease the amount of time spent optimizing your site for speed. It can also drastically reduce the cognitive load on your user’s brains, as they spend less time figuring out what they can or can’t tap on.

2. Navigation Should Never Be Too Fancy

It’s frustrating to do the same thing over and over. Navigation patterns all tend to look the same, even more than other website elements. It can feel like there’s no innovation. It can be tempting to go wild with new ideas for website navigation. [pullquote]You might enjoy creating new design patterns; but users do not like learning them[/pullquote] Here’s the problem: you still need to make sure every user can find exactly what they’re looking for, as quickly as possible. The more unfamiliar your navigation becomes, the harder it is for users to find what they want. You might enjoy creating new design patterns; but users do not like learning them. This is triply true if they’re in a hurry. Make everything else on the site as wild as you want. Go nuts! But navigation should always be the easiest thing on your site.

3. Make a Fallback For Everything

Do you have a JavaScript workaround for CSS that isn’t fully supported yet? Make a fallback for it. Have a slideshow? Fallback. Animated background? Fallback. I’m going to assume you’ve gotten the idea now. To put it bluntly, if any part of your site breaks when the JavaScript does, you have failed. And JavaScript does break. If things go really wrong, it can break for thousands of users at a time. The only reasonably foolproof site is one that remains functional even when JavaScript does not. Let’s take it further: Your site should ideally be functional even if the CSS doesn’t load. Yes, it’s an old argument; but is it really any less valid for its age? The job of any good designer or developer is to make sure their client’s site is usable under the widest possible range of conditions. So yeah... fallbacks. Learn to love them.

4. Optimize For Speed

Okay, I know I’ve been over this before, but the more fancy schmancy stuff you put into a site, the more important speed becomes. It’s really bad enough that people are using pre-loaders on websites again. Once everything is loaded, everything should run fast. Forget the classic examples of low-end phones and old desktops. There are Chromebooks being sold even now with only two gigabytes of RAM. 2GB. That’s it. For an OS based on Chrome, one of the world’s most notorious RAM hogs. Even Android phones with only two gigabytes are starting to feel slow and sluggish. Running a laptop on similar specs is basically lunacy. But it’s still your job to make sure your site loads and runs reasonably fast on those weird, sad little laptops. Your Chromebook-loving users aren’t going to give you a free pass if the site you build doesn’t work for them.

5. Don’t Skip User Testing

You’ve thought outside the box. You’ve broken the mold. You’ve made something new and unique. Look at you go! Now test it... with people. The more fancy and outlandish your design, the more it needs to be tested on regular people, especially those outside the design industry. Even if your site is targeted directly to designers and no one else, designers are busy people. Busy people don’t have time to learn a whole new way of browsing.

Conclusion

The only reason I don’t tend to like showy websites with lots of extras is because every extra feature is another chance for your site to break. That’s it. That’s the only reason. I have seen far too many that basically leave the user with a blank home page if anything goes wrong at all. It doesn’t have to be like that. Your site can be as robust as it is pretty, dynamic, and innovative. It’s just gonna take some extra work. That work is worth it.

Ezequiel Bruni

Ezequiel Bruni is a web/UX designer, blogger, and aspiring photographer living in Mexico. When he’s not up to his finely-chiselled ears in wire-frames and front-end code, or ranting about the same, he indulges in beer, pizza, fantasy novels, and stand-up comedy.

Read Next

20 Best New Websites, July 2024

Welcome to July’s round up of websites to inspire you. This month’s collection ranges from the most stripped-back…

Top 7 WordPress Plugins for 2024: Enhance Your Site's Performance

WordPress is a hands-down favorite of website designers and developers. Renowned for its flexibility and ease of use,…

Exciting New Tools for Designers, July 2024

Welcome to this July’s collection of tools, gathered from around the web over the past month. We hope you’ll find…

3 Essential Design Trends, July 2024

Add some summer sizzle to your design projects with trendy website elements. Learn what's trending and how to use these…

15 Best New Fonts, June 2024

Welcome to our roundup of the best new fonts we’ve found online in the last month. This month, there are notably fewer…

20 Best New Websites, June 2024

Arranging content in an easily accessible way is the backbone of any user-friendly website. A good website will present…

Exciting New Tools for Designers, June 2024

In this month’s roundup of the best tools for web designers and developers, we’ll explore a range of new and noteworthy…

3 Essential Design Trends, June 2024

Summer is off to a fun start with some highly dramatic website design trends showing up in projects. Let's dive in!

15 Best New Fonts, May 2024

In this month’s edition, there are lots of historically-inspired typefaces, more of the growing trend for French…

How to Reduce The Carbon Footprint of Your Website

On average, a web page produces 4.61 grams of CO2 for every page view; for whole sites, that amounts to hundreds of KG…

20 Best New Websites, May 2024

Welcome to May’s compilation of the best sites on the web. This month we’re focused on color for younger humans,…

Has AI Killed User Testing?

Web designers employ user testing to evaluate a website’s functionality and overall UX (user experience). Various…