3 Simple Ways to Spruce Up Your Website

Aug 14, 2017 | Branding Basics, The Business of Design

I’m currently in the process of redesigning my site… and have been for most of this year. It’s a time-consuming process, and as any designer or freelancer will tell you: our own sites often come last on the work totem pole. It seems like this is the case for most business owners I talk to as well – either considering a redesign, in the midst of a long ongoing redesign, or having just finished a redesign. I get it. The web is flux, and it can be hard to keep up with the latest trends or standards.

The good news is that for a lot of businesses, a full site redesign isn’t necessary. Simply making some adjustments to spruce up your website might be all you need. And it’s a lot quicker and easier that redoing your entire site. Here are my 3 tips for giving your site a little face-lift:


1. Consistent fonts and colors

When you create a visual brand identity for your business, the cornerstones of that (along with your logo) are the fonts and colors you use. Using those same fonts and colors everywhere your business has a presence (print, web, social, etc.) helps establish your brand as recognizable and reliable. So we want to make sure you’ve got this in place on your website, too.

There are two places where fonts and colors are set for your website. One is in the main theme you’re using. Whether WordPress or Squarespace or a custom-built site, there’s a CSS file somewhere that has default settings for how things appear on your live site. Think of it as the master control. There may even be an option panel in your admin back-end where you can select the fonts and colors yourself, and it will set the CSS to style your site that way. This is the best way to maintain consistent usage site-wide. If you or your web person have already set this up, just leave it be and you should be good to go on having uniform font and color usage throughout your site. Easy peasy.

The other place you can set fonts and colors is on the edit screen of an individual page or post itself. This is especially true of admin systems with WYSIWYG editors, and that’s where people often run into trouble. See, the WYSIWYG editor runs on the admin back-end, which means the CSS isn’t being called. What you see by default in the WYSIWYG editor is often NOT how things will appear on your site if you type some text and hit publish. Once it’s published, when that page or post is called on the public side of your site, the CSS file is called to style it. So even though it may appear just plain text in some random font in your editor, once it’s on the front-end of the site and the CSS does its thing, it won’t be. But people often see that plain text in the editor, which doesn’t match their site’s fonts or colors, and think they need to add in the styling. Not only that, but there’s also often the temptation to get ‘creative’ just because the options are available in your WYSIWYG editor, even when those don’t match your brand guidelines. Short advice? Don’t do that. It is almost always a better idea to let the CSS of your theme style your posts and pages rather than manually adding styling in.

2. Consistent capitalization in page titles

If you’re going for an informal feel with all lowercase, that’s fine. Traditional headline capitalization? Also fine. If you’re using sentence capitalization (where only the first word is capitalized), that’s fine, too. The point is to decide how you are going to treat page/post titles, and then stick to it. Like with other visual cues, if you’re all over the place in your title styling, it sends mixed messages. It’s a small detail, but an important one.

This advice actually carries over into all of the text areas of your site (how will you treat captions? subheadings like in this list? menus?), but page and post titles are the most immediately noticeable.

3. Consistent images

If title treatment is an often overlooked consistency detail, this point ranks up there with it. How you use images on your site is a big factor in how professional and put-together your site appears. When all of the images within a page’s content are the same width and alignment, it helps the visual flow and is easier to parse. Not only that, but it makes your job easy, because you never have to wonder what size image to use for a certain feature, as it will always be the same.

For example: the featured images I use for my blog posts. These are all mainly one size, rectangular and filling the width of the content area. The only exception is when I do a quote post, and then the feature image is square for sharing on Instagram as well. They are still the same width (as are all images I use in-post), it’s just the height that differs. I’m able to have this slight variation because I have a system for my images and apply it consistently. The result is that everything works together and nothing jars the viewer out of the visual flow.

Along with the size you use for your images, you should also consider look and feel. Are you using illustrations, or photos? If photos, are you using crisp photos with items isolated on a background or more atmospheric photos with scenery and depth of field? Do you use/show people in your photos? Is there a certain color tone you stick to? All of these options are fair game, but if you have ALL of these going on at the same time, your site is going to look artistically schizophrenic.


The moral of the story is: consistency. Instead of just throwing things up on your website haphazardly, take the time to decide your visual system and then use it. This will do so much for the impact and appeal of your website, even if the changes seem small.

Have you applied any of these tips to spruce up your website? How was the result?

0 Comments

Topics

Get New Posts Straight to Your Inbox

I have read and agree to your privacy policy.

Archives