Web Design Magazine | News, Tips, Blogs, Articles & Insights

8 Simple Rules for Web Design

Written by Simon Slade | Jul 28, 2016 5:00:00 AM

There are some basic standards of Web design that every website owner should know.

 

The proper design elements will ensure visitors enjoy your site and return. There are also some basic organization tips that will make operating your website a breeze. These eight tips will help your website appear professional, inside and out. 

 

1. Keep navigation simple

Avoiding clutter is the key to a beautiful, functional website. This means menus are your friend: they allow you to show visitors all the pages on your website without listing each one individually on the homepage. That said, don't overwhelm your visitors with 20 choices on your menu. Keep your pages broad enough to include a variety of information on each page, so every topic doesn't have it's own menu. Highlight the most important pages on your primary menu and use a few sub menus to keep your navigation clean. 

 

2. Consider appropriate pop-up use

Pop-ups and modal windows can be extremely useful in certain situations, but they also have a tendency to be abused. Have you ever clicked on a link to see a piece of content, only to be rudely interrupted by a full-page modal window asking you to sign up for an email list? When someone hasn't even read your content yet, it's unlikely they will be inspired to subscribe to your emails or follow you on social media. Don't keep them from your content with an annoying pop-up; it's more likely to alienate them than anything else. 

 

This isn't to say that pop-ups can't be useful if employed appropriately. For instance, if someone reaches the bottom of an article, that might be a good time to include a pop-up window asking them to sign up for your newsletter series that relates to the content they just read. 

 

3. Employ negative space wisely

Negative space, or whitespace, is the key to aesthetic balance on your website. You want a lot of negative space on your website to complement the positive space where you are displaying content and information. Paragraphs should be separated by lines of whitespace and there should be plenty of whitespace between your header and content. But don't make any margins too large, because an excess of white space can make your site look unfinished and empty.

 

Play around with it: the perfect balance of whitespace will make it far easier for visitors to read and enjoy your website. 

 

4. Leverage responsive design

The importance of responsive design can't be overstated. Visitors should be able to access a user-friendly experience on your site regardless of how they access it. Your site should be perfectly optimized for mobile, tablet and desktop. All of these items have different screen sizes, and nothing is more unprofessional than unintentionally cut-off text. It's far better to start with your site designed this way, rather than trying to restructure it later, which can be very complicated. 

 

5. Prioritize "above the fold" space

The space that immediately appears to your readers, without them having to scroll, is very high-value property. It's important that your website's design utilizes this space well. Identify what is most important for your readers to see when they arrive at your homepage: a mission statement, a logo, and a call to action are all commonly found above the fold in high-performing Web pages. These items identify your brand and inform your readers without them having to make a single click. 

 

6. Standardize file names

You want to have a system in place for organizing the names of your files so you can sort them and find specific items quickly and easily. First of all, keep all file titles in lowercase. On the Web, file names are case sensitive. This means that the file sunset.jpg is different from Sunset.jpg. Stick with lowercase so you never have trouble finding the exact file you want.

 

Also, spaces are a big no-no. In Web addresses, spaces are thought to be unsafe, which means they can be lost and confused, and often spaces are converted to "%20," making for a very unclear filename or URL. Instead of spaces, use underscores or hyphens to separate words. Search engines recognize words with an underscore between them as the same word, while hyphenated words are seen as truly separate, so hyphens are generally better for file naming and SEO purposes.

 

7. Source images correctly

Any and all images you obtain from other people or websites should be done with permission and proper attribution. That said, "hotlinking" is a common mistake for new website owners. This is when you link directly to an image on someone else's site rather than saving the image to your computer and uploading it to your site. When you hotlink, you use the host's bandwidth to display pictures on your page, which isn't entirely fair. Furthermore, you are subject to the status of the source site - if a file is deleted or the site stops working properly, the images you have hotlinked won't work. 

 

If you are operating a site as an affiliate marketer, there are some exceptions to this rule. Sometimes an affiliate program will give you code for putting a banner onto your site. This will streamline the process if they ever need to make any changes to the banner, and it also allows them to assess which banners are performing best. In this case, it's actually better to hotlink. Otherwise, avoid the practice - it's about as effective a housekeeping tactic as stashing junk under the bed because you don't know what to do with it! 

 

8. Keep separate directories

Early on, it seems easiest to just dump all your website's files into one directory: images, HTML pages, and CSS files, all in one central place. While this can make referencing things a little easier, as your website gets bigger, it's going to be a huge pain to sort through. 

 

Instead, keep an individual directory for each type of file. Images should go with other images and that directory should be separate from all your CSS files, which should be separate from your HTML articles. Each directory should be clearly named. 

 

Get Started

Just a few simple rules for your website can increase your traffic and improve the user experience for both you and your audience. While organization and cleanliness is not everyone's strong suit, consistency is important for a successful website. The sooner you start employing these easy techniques, the happier you and your readers will be. 

 

Simon Slade is CEO and co-founder of SaleHoo, an online wholesale directory of over 8,000 prescreened suppliers; Affilorama, an affiliate marketing training portal with 300,000 members and over 100 free video lessons; and their parent company Doubledot Media Limited, which provides seven different training and software applications to over 1 million customers worldwide.