Bookmark Now: 10 Web Design Dos and Don’ts
The days of sad-looking websites are over. With Wix, you can create a website that is robust, professional and exceptionally good-looking. All it takes is some inspiration and one of our gorgeous website templates.
Before you begin designing your very own website, we want to introduce you to several web design principles that can make a big difference in your website’s overall looks and performance. Keep these Do’s and Don’t in mind to avoid web design pitfalls and to make smart choices about your stunning website.
Website layout
Don’t try to reinvent the wheel.
Do use UX standards to assure friendly browsing. Creativity is a great thing, but you don’t want it coming between you and a powerful online presence.
When you structure your website’s layout, follow UX recommendations (user experience, that is) to make sure that your visitors enjoy a smooth browsing. A website is not a treasure hunt. Make sure your site’s navigation is clear and intuitive; that all clickable items (links, buttons) are straightforward and easy to understand and that your site visitors don’t need to wander around searching for what they need.
Background visuals
Don’t choose a background that can be distracting.
Do choose a background that inspires visitors to experience your site in its fullest.
There’s a reason we call it “background” – it should be beautiful but not too dominant. Whether you’re going with vectors, photos, videos or any other type of visual, make sure your website background is not distracting from your site’s main purposes. The background is there to generate an atmosphere, to further enhance your branding and to support the browsing experience. Oh, and one last tip: make sure you have a strong contrast between the background and the text that lays over it. After all the purpose is to highlight your message – not take away from it.
Mobile design
Don’t forget your site must look great on mobile screens.
Do optimize images, texts and other components to mobile viewing.
Use Wix’s Mobile Editor to set up a mobile version of your website that will look and function just as great as the fullscreen one. From adjusting your background image to customizing your design and text, you can make the mobile version of your website entirely your own.
Space distribution
Don’t clutter the screen.
Do consider content hierarchy and use white space to air your site.
Browsing through an excellent website is like eating a great meal. Regardless how tasty the food is, no one wants you to shove it into their mouths without giving them a chance to chew and enjoy! When you design your website to make sure you are not overcrowding the screen with content. Too much all at once means your visitors will inevitably miss out on something. Use enough white space (space that has no content whatsoever) to create a nice flow between your site elements.
Color scheme
Don’t select your colors solely based on their beauty.
Do make smart color combinations that enhance your content and branding.
Colors matter in web design. In fact, the psychological impact of colors on site visitors can really influence their overall experience with your website and the way they perceive your brand. That’s why you can’t base your color scheme on a random combination of colors that you like. Read about color theory to understand how different colors work with each other. Make informed choices about your site’s color palette and your website will reward you with an awesome online presence.
Image quality
Don’t settle for basic quality – but don’t go to the extreme either.
Do use high-quality images and optimize them for your site.
Do you want site visitors to take you seriously? Do you want to be respected as a professional? Do you want to get your audience excited about your product, your brand or your organization? Then there’s no compromise on this issue – make sure your site images and photos are high-quality only. Don’t leave it at that, though. Use cropping and filters to optimize your images even further and get just the right look.
In addition, you should make sure that your images aren’t too heavy and respect the web standards. Here a full guide on how to optimize images for your website.
Stock images
Don’t be cheesy.
Do try to generate a relatable vibe.
Gone are the days in which a perfect-looking family of supermodels with ear-to-ear smiles and a weirdly similar sense of fashion are considered effective presenters for businesses and brands. Your site visitors will much rather establish trust and interaction with a website that caters to the needs of real people, like themselves. Make them feel right at home with stock photos of people and situations that they can actually relate to.
Animations, GIFs and effects
Don’t turn your site into a psychedelic 1970s music video.
Do use such elements to add a touch of motion to your site.
We love animated GIFS and fun effects just as much as the next guy. What we don’t like is running into a website that looks like the zombie apocalypse of animations. There’s no place to hide from them! When it comes to animations and effects (like text effects or image effects), moderation is the number one principle to keep in mind. Use them elegantly, and you have yourself a vibrant, dynamic website. Use them excessively, and you’re pretty much dooming your website to loneliness.
Written content
Don’t let your stream of consciousness take over.
Do plan a focused, optimized and targeted content strategy.
Your website texts are some of your greatest assets as a website owner. They don’t only provide visitors with a sense of orientation, they also give you a wonderful platform to enhance your branding and messaging, AND to optimize your site for search engines. To get the most out of your written content, you have to approach it from a strategic point of view. Refine your texts to reach a clear and powerful message that resonates with your target market. Fuse the right tone of voice with the right vocabulary; be concise but not too vague; write in a way that will inspire your site visitors to stay and browse your site some more.
Fonts, fonts, fonts
Don’t assume they’re all the same.
Do research fonts that complement your branding.
You may think fonts are only interesting for design nerds. Well, think again. As a website owner, you need to have some measure of understanding of how fonts work so that you can choose the right font for your site. Different fonts raise different mental or cultural associations and therefore can generate a particular atmosphere. Your choice of font should strengthen your website’s overall branding message, not contradict it.
By The Wix Team
