Web design

Web design tips to create a unique looking site in WordPress

rgrgOne of the most commonly used CMS (content management system) is WordPress. It powers one out of every six websites on the Internet and comes with hundreds of free themes for you to pick from. The challenge with using a generic theme is that it won’t be customized to your brand or deliver a message that sets you apart from the crowd. This article explains how to create a unique presence on the internet in WordPress or any of the other popular CMS systems (Drupal, Joomla, PrestaShop, etc.)

A large image as your background makes your website appear more original

The problem with using CMS programs is that a lot of websites start to look the same. To get around this, you can use a large image and set it as your background. This is particularly recommended where you have an image-poor website. If you set the background on the main content of your site to be an 80% white opaque image that repeats horizontally and vertically, then it means when you roll over the background, you’ll still be able to see it, but it will be significantly faded. This way, your visitors will easily be able to read the text.

This option isn’t recommended for image-rich sites (e.g. photo galleries, art galleries or e-commerce sites where every product has an image), as a background image across the whole page can detract from visual content in the foreground.

Think outside of the box (or the rectangle)

Using a CMS often makes people arrange their websites in a uniform fashion. The worst offenders will end up making their look very blocky, like the columns in a newspaper, but with no creativity. Try designing your website on a whiteboard or blackboard first so that it is closer to a self-styled website design.

Now that you have your design, use the CMS to translate your hand-drawn design into a web design. You will have to make compromises because your CMS will have limitations. As you hit these limitations, you should go back to your white or blackboard design and change the design on there accordingly. You should then do a quick design revision and work from the revised drawing as you progress with your CMS.

Often it’s clever use of graphic design rather than CSS that lets you create apparently overlapping images. Create a background shape that’s rounded or a gradual fade at the bottom of a page and immediately you have a more fluid design. Another alternative is to use Z Index to overlap multiple elements of a design.

Set your screenshots at an angle before you start

A classic sign that a person has used a CMS for their website design is through the use of straight graphics and images. If you’re showing screenshots on your site, you can create a more unique look by adjusting the angle of your image file before you upload it.

This will leave four patches of white space on your image, which you should fill with the colour or background that the image will be placed upon, or better still, crop the screenshot to show a smaller image, cutting out the white corners completely.

Balance design, development, and SEO

The 3 main elements of a successful website are:

  • Design – Many people like minimalist designs that just show the core points and use images for navigation and as little text as possible. The challenge is that these sites are often difficult to navigate, create a poor user-experience and are bad for SEO, as Google like a healthy amount of text on a page.
  • Development – CMS systems used to create a very uniform design, however, if you look at the blocks of a site, many now have the option to easily add some pages with 3 or 4 column layouts relatively simply. You can also choose to show different features in different categories of your site and this is a way that lets you, for example, add image navigation to specific pages.
  • SEO – Elements of a design help your SEO, for example, every page should have a single h1 title that tells Google what the page is about (in addition to a Meta Title, which appears in the search results). It’s also a good idea to allow room for an unlimited amount of text on blogs and product descriptions in your design so that writers aren’t forced to restrict content to fit the design.

For your home page and other main category pages, it’s optimal to have text in several different blocks, as this creates the optimal balance between design and SEO and is still easy for developers to work with.

Experiment with fonts and color

A website can look completely different by modifying fonts and color. These are some of the simplest things to modify in CSS and are good ways to give your site a unique look. Use 2-3 fonts at most on a page though and a similar number of colors, otherwise what might have been a classy web design could descend into chaos.

Other web design tips
Following the above tips will help you to create a unique site that helps your site stand out from the crowd. You can also read these 68 actionable web design tips to get more inspiration for your site!

If you have any questions, please ask below!