Navigation and UX

Navigation is so important with web design because it allows the user to know how to use your website. Good navigation would allow the user to instantly see where they need to go to access information. For example, if you were looking for a way to get in touch with a company through their website, there should be very little/no hunting around in order to get that information.

Three clicks

Good navigation can be measured through clicks. Within three clicks, a user should be able to land on any page and find what they need. A great example of this is Abbey Masterbatch as all of the links are displayed in the navigation and you can easily click through the pages to find the relevant information.

Website navigation should be high up on the list of priorities when designing a website. If visitors can’t find your web form, then your site is useless and users will leave. Breadcrumbs, navigation elements and other ways to explore your site should be at the forefront of your mind when designing a website.

Headers

Most websites feature a header as a form of navigation, such as Jesmond Dene House. These are effective because you can clearly see the pages and call-to-actions (CTA’s) as soon as you get onto the page, meaning other pages and links are only a click away. Make sure your logo links back to the homepage as this is a convention that is best followed as it is so widely implemented.

Headers are usually contrasting to the rest of the design on-screen so that the eye is instantly drawn to them.

Hamburger Menus

Headers may also feature a hamburger menu as well as the links / CTA’s or maybe in place of this. Background Sounds is a great example of a hamburger menu that also takes elements from the logo. More links can be found through this at the expense of an extra click.

Hamburger menus are a great navigational device because they are subtle and don’t take up too much room. They can also be used to reflect the branding and can be nicely designed to fit in with the rest of the website. It was originally implemented for easier navigation on mobile devices but is also now used a lot on desktop too.

Footers

Footers are also great navigational tools as they feature all of the links within a website. They can also include popular resources, relevant links and social media content and are great for user experience. Fat footers are really good for this because they can contain a lot of information and all website links.

Sticky navigation

Sticky or fixed navigation is a menu that locked in place as you navigate throughout the page. This means that you don’t have to scroll back up to the top to get to another page on the website. ING do this quite well as the navigation menu comes down the page as you scroll.

Final thoughts

Good navigation is essential to UX because users want to know where they are, where they have been and where they are going easily and without clicking around too much.

The Importance of Visual Hierarchy in Web Design

Visual hierarchy describes the order in which the user processes the information throughout a website/ design. It is very important to use visual hierarchy in web design because it is the main strategy of communicating with the user about the purpose and importance of the design. During UX design, you should be asking yourself these questions:

  • What is the purpose of this? (Usefulness)
  • How would I use it? (Usability)
  • Why should I care about using it? (Desirability)

This way, you will be designing with the user in mind and create something that is easily comprehensible as well as appealing.

How to use hierarchy

There is no one way to build a concrete hierarchy in design, however, understanding what you are designing and who for is crucial.

For example, if you are designing something with a lot of text, you should try and section this with headings, bullet points and imagery. This will break up the layout and make the page easier to read as well as nicer to use.

The ‘Z’ pattern

On a homepage layout, the user will most likely read the page in a ‘Z’ formation, going from the top left to right, and then down to the bottom left of the screen, then across to the right. An example of this is the Zero Banking website.

The Z pattern is applicable to a lot of web interfaces as it addresses hierarchy, branding and calls-to-actions. If we can predict where the user’s eye is going, we can place elements in certain positions, to navigate the user to the most relevant points.

Size and scale

Size and scale are obvious tools for hierarchy but not always effective. The most important elements should be standing out the most but this can also be counteractive if used in excess as the design becomes overwhelming or too much effort to understand.

For example, if the design isn’t balanced or has too many elements of different sizes, the user’s eye won’t be directed to the relevant points. This is important for calls-to-action(CTA’s) because if your buttons are too small or unbalanced, they are more likely to be ignored.

The user should never be overpowered by a large focal point, nor compromise usability with content that is too small. Simply Chocolate is a good example of size and scale being used as a hierarchy tool as the user’s attention is drawn the product and the information is scaled according to importance around this.

Colour

Colour is another great tool for building a hierarchy in web design because you can highlight information or imagery with it. Human brains are attracted to contrasting colours, so we will look for the colours that stand out. When designing, colour can be used to pair elements, for example, CTA’s could all be one contrasting colour so the brain sees the relevance between them and their purpose.

Connect Insolvency is a good example of colour hierarchy because the colours not only reinforces the brand but draws the users attention to CTA’s and important elements.

Layout

Layout is one of the easiest way to direct the user’s eye and control your website’s hierarchy. Humans like order and structure, especially when looking for information. Organising your website into columns and rows can be very useful for creating clear and concise design. However, this does not mean your designs can’t be fluid with interesting interface elements.

As long as there is a balance and layout in place, hierarchy should be still understood and clear. Using too many visual elements and not enough structure/layout will flatten your hierarchy and there will be nothing standing out to the user. Calexo achieves hierarchy through layout very well by creating a very visual and fluid design that also has a lot of layout and structure behind it, meaning the information doesn’t get lost.

Spacing

Spacing is incredibly useful for not overwhelming site visitors. There may be an urge when designing to fit a lot of information into one space which will create confusion and therefore distrust for the user.

Allowing white space throughout your design can really help when separating elements and sections within your designs. Through spacing, you can create order and logic which will help create a clear hierarchy for the user.

Wealthsimple are a good example of using spacing as a tool for hierarchy in their website Balance is created through the use of white space, creating a concise and fresh design with great visual hierarchy.

Fonts

Fonts can be used to differentiate information. For example, headings and body text will likely be different fonts / weights/ sizes to highlight the purpose of the information. Headings are often a lot bigger than body text as well as often having heavier weights or being a different font altogether.

This draws the users eye and captions the body text, so the user knows what information they are reading and the purpose of that information. It also means that the main points of the text can be summarised without having to read the body text, which is great for users as they will probably only read text that is relevant to them.

Hotel Capolagala uses a serif font for the headings and a sans-serif font for the body text to create visual hierarchy through fonts. The fonts also balance each other whilst reflecting the brand.

Using these points when designing your website will help you build a visual hierarchy and increase usefulness, usability, and desirability.

Blogging For Your Rankings

person typing on laptop

Blogging. Whether you sigh in exasperation or get excited by the thought of it, it’s an absolute staple of not only the world of SEO, but online culture in general.

You could be reading more official news blogs, or you could be reading monthly blogs by a brand that to particularly like. They come in all shapes and sizes, with something catering for every possible personality out there.

The fact of the matter is that every month, approximately 409 million people view more than 20 billion pages. That’s some big numbers coming your way.

Blogging was more or less brought into the mainstream public eye by a handy platform, now called Blogger. Sounds familiar right? It came about in 1999 and the whole idea of blogging really blew up in the early 2000’s.

What is a blog?

So, what exactly IS a blog?

Short for weblog, a blog is an online journal or website that shows information in reverse chronological order (so latest posts first, oldest posts last).

On this website or online journal, people share pieces of writing about their opinions, news, hobbies, anything they want really.

What is the point of it?

Back in the day during the early boom of the blogs, political blogs were some of the most popular.

Then came the topic blogs, quenching the public’s thirst for current news and pop culture.

Then blogs about how to write blogs came about.

Then you guessed it, the gossip blogs came into play.

The point is, you can start a blog for whatever reason. Maybe you want to explore your love of travelling through writing, or a new passion for crochet you’ve discovered, or maybe you’re wanting to set something up on your company’s website where customers can come and check for up to date information.

Whatever your reason, there’s a space for you in the blogging world.

Now, when your blogging for personal reasons, you may not necessarily care about SEO or your audience. However if you’re blogging for a business, this is a little more important. So let’s take a further look at the benefits of blogging in a more professional capacity.

The benefits of blogging

– It boosts your SEO

You’re probably sick of hearing the letters S E and O strung together like this. But it’s important.

Search engines love fresh, relevant content and I can’t think of an easier, less expensive way to tick this box than by blogging.

Every time you post a new blog, search engines such as Google are crawling your page and indexing this. Not only are you showing them that you’re relevant, but your giving your customers and clients more of a chance of finding your websites through different keywords.

The more blog posts your website has, the more times you show on Google.

– It strengthens your relationship with customers

As a business, you’ll know how important it is to build a relationship with your customers.

Especially in today’s society, where how a business comes across can essentially make or break them.

What a blog does, is it gives you the opportunity to connect with your customer base in a more friendly, approachable and conversational way. If you switch your comments on, you can also see exactly what people are thinking about your brand.

– It establishes you as a leader, not a follower

From a business sense, putting up regular informational blogs can put you ahead of your competition.

By providing content that people deem as valuable, you’re establishing yourself as a leader, and confirming the idea that your business is knowledgeable and has experience.

– It builds connection with your customer base

Blogs give your business the powerful marketing tool of showing your customers your more personal side.

As I have said many times before, people are far more likely to buy into something they can relate to, as opposed to something from a large, faceless corporation.

– It creates opportunities for sharing

Ahh, social media. A stable advertising platform. And you know what’s great about it?

If you play your cards right, you can get free advertising!

That’s right, free advertising. Who wouldn’t want that?

So how do you get this, you ask? By creating shareable content, that your customers are likely to want to share. With the multitude of social media platforms available, there’s a real chance of huge market growth.

One of the easiest way to do this is via a blog.

How often should you blog?

So here comes the big questions we’ve all been waiting for. How often should you blog?

The short answer is, it totally depends!

Depending on your goals for the blog, it can massively differ. For example, if your goal is to increase traffic to your site, you’ll probably want to publish more often as that will give you more opportunities to be found on search engines.

But if you’re wanting to create more formal, in-depth posts, you can get away with posting them less frequently, as long as they actually are informative and crucially, longer.

In conclusion

Blogging is here to stay, and has been since the 2000s. Whether you’re looking for a creative outlet or you’re wanting to drive more business to your website, blogging is the perfect way to achieve this.

The only question is now, how often will you be blogging?

Why You Should Have A Personal Website

Hours and hours go into creating and curating all of the necessary information on a CV. This is something no one thinks twice about. It’s second nature to make sure your CV is absolutely pristine, but what if we told you there was another, more exciting way to get your name out there?

We’re talking about your own, personal resume website.

Now we’re not saying that it should be used instead of a CV, as you can’t go into an interview and hand over a screenshot. However, your online presence is now so important that if done right, your own website will ensure that job opportunies come your way.

So what are the advantages of having a personal website? Let’s look into them here:

It gives you control over your image

As I said earlier, your online presence is extremely important. With stories about people not getting jobs because of their social media not uncommon, it’s imperitive to make sure you presence is a strong one.
According to CareerBuilder, 70% of employers use social media to screen candidates. But don’t think you can get away from this by deleting your social media, as 57% of employers are less likely to call someone in from an interview if they don’t have an online presence at all.

Not only that, but 69% of employers are using search engines to research their candidates. Why is that a good thing? That’s where your website is.

Having a strong, professional website shows employers exactly what you want them to see. Not only can you show off your qualifications, but you can let your personality shine through and really show your potential employers why you’re so hireable.

Dr Birchall of Neuroradiology Consulting has his CV on his website to hand, so you don’t have to dig deep to understand his qualifications and expertise.

It stands you out from the competition

Would you rather read about a subject, or watch something about a subject? The majority of us, the majority of the time would prefer to watch something. As a society, we hold onto and take in visual stimulation a lot easier than reading. Your website is the perfect place to take full advantage of that.

Having your own personal website gives you the freedom to be as creative as you like. Not only can recruiters find you more easily if you have a professional website, but you’ll also gain a competitive edge.

Your resume is restricted to things you can put on paper, but with a website, anything goes. Make the most of this medium and showcase your strengths. Demonstrate why people should hire you!

It is dynamic

If You may keep your resume updated regularly, but with every version comes a lot of paper waste. There’s nothing more frustrating than realising that the CV you gave to a potential employer is an old copy or that you left something out.

With websites, they can be updated easily. You don’t have to worry about the length and adding fresh pages is a breeze.

Overall, having a personal website resume is an engaging and unique way to show off your potential. Having a professional online presence can’t do you any harm, why not go ahead and create one for yourself?

4 Key Terms to add to your web development glossary

If you started a web development project and picked a dev team, it would be a good idea to familiarise yourself with some of the most common terms used in the industry. Although you are not going to build the website yourself, having a better understanding of the terms used will allow you to ask more questions and get involved in the process. We are going to tell you more about the key terms you should know if you want to speak the language of your team.

Web Design vs. Web Development

Let’s start with the basics and be aware of the difference between web developers and web designers. The design team is responsible for the look and feel of your website, while the development team takes care of the functionality and they build the site. There are a lot of elements to consider in the whole process, for example, the design could include colours, logo design, images and overall layout. When you have a basic understanding of who does what you could easily ask questions or make suggestions to the right people.

Responsive Design

Things have changed a lot in the last couple of years and responsive design is not an extra, but it is a must. People are making most of their browsing through mobile phones and devices, so if you would like to keep them on your website, you would need to optimise it. Alternatively, users would not spend time trying to navigate or resize the screen, but just leave your site and move on.

UI/ UX

Both UI and UX are essential for the quality of your website. To give you a better understanding, we should explain what each of these phrases means. UI stands for user interface and represents the means of communication your website provides, for example, specific call-to-action buttons, sections or layout. The UX – user experience, on the other hand, is the act of engagement with these instruments, for instance, if people are clicking on certain buttons, watch videos, make comments and make use of the functionality.

CMS

Adding a content management system (CMS) to your website would make your life a lot easier. The opportunity of adding new content or make small changes would be so much simpler when using a CMS. Moreover, it will also reduce ongoing costs as you would not pay for small changes and amends. Some of the most popular CMS are WordPress, Drupal, Magento, etc.

Wrap-up

There are so many things you could add to your glossary and learn about, but at the end of the day, you do not need to know everything if you have the right team – you can familiarise with the basics and make sure you know everyone’s responsibilities. If you do not have a development team in place yet, we would love to help you! Our fantastic team recently helped Connect Insolvency and their brand new website and branding, so give us a call and find out what we could do for you!

Is Your Website Your Best Online Marketing Tool?

There are many ways you can promote your business online, and yes, I would definitely say that your website could be your best online marketing tool. But is it? Well, it depends. If your website is aligned with your current marketing strategy, if it is up to date, responsive and SEO optimized, with the right and well-targeted content, I’d say that your website is your best online marketing tool indeed.

 

 

What I am trying to say is: Your website should be your primary online marketing tool because having a website makes your business credible and trustworthy and this is the foundation of success. Social media platforms do help your business and outreach, but to maximise your chances of success, you need a website, and it better be a good one. I do not know of any successful business that does not have a good website, and building a website is not as simple as setting up social media profiles, but it is worth it because it shows your audience that you take your business seriously.

Social media, business listings and other marketing activities like Google ads and similar should be the supporting efforts that help you reach your target audience, but it is your website that will eventually convert them into customers. Your social media profiles and your posts are the voice of your business while your website is its face and its words because it gives your potential customers an opportunity to hear your message, learn more about your services, what you offer and how you can help their business.

A modern website with a minimal look, hamburger menu and a homepage video like Belfund is a great option, but if you prefer a classic-looking website with simple navigation like Connect Insolvency  –  that’s perfectly fine too, as long as your content is clear and well-written.

Having a website and social media is a great start, but if you want to put more effort into online marketing, I have a present for you 🙂 . Here is a list of 99 online marketing tools that will help you promote your business online.

If you’d like to discuss your online marketing strategy, please feel free to contact me, I’d be happy to chat and find the best strategy to promote your business online.

How psychology affects your website

Psychology is everywhere and the sooner you realise that the better you’ll become at whatever you do for a living – sell, manage (people, company, etc..) or design websites. In this article, I’ll talk about how psychology affects your website visitors and how important it is for your website success.

 

 

Colour Palette

The colour palette you choose for your website will speak directly to your visitor’s emotional self. Depending on your visitors’ personality or even their current mood, they might instantly like or dislike your website. Colours are known to affect our feelings causing us to feel certain emotions when exposed to colours.  I won’t go into much detail on what each colour is associated with and how it makes us feel because there is a great post on this topic.

 

Imagery

You can use one image to tell a whole story, so imagine how important imagery is for the story you want your website to tell. Images breathe life into your website and given that the human eye identifies images in a matter of milliseconds, again, they speak to our subconscious and affect our mood just the same as colours.

 

Anchoring

According to Wikipedia, anchoring or focalism is a phenomenon where an individual relies too heavily on an initial piece of information, which is considered to be the “anchor” when making certain decisions. Knowing this, you can use the whole context to make certain information look more important or your prices more affordable. A good example of anchoring is a new discounted price shown next to the original price which is higher.

 

Typefaces

Typefaces can spark different associations, from fun (Comic Sans) or modern (Sans Serif) to formal and even solemn (Old English). For our client, AG Events, a wedding entertainment company based in Newcastle upon Tyne, we’ve used “a perfectly imperfect hand-drawn font” for certain parts of the website and this font is usually associated with fun, entertainment and playfulness – Playlist Script Font

 

Urgency

Creating a sense of urgency with your visitors can cause them to feel fear of missing a chance to do something good or lose something good. This can be done by adding ‘a limited time offer’ next to the product you want to focus on. The fear of loss or the idea that something they are interested in might not be available in a few days will create a sense of urgency with your customers, which will lead them to buy your product.

 

Community

Humans are social beings and the feeling that they are a part of a community, that they belong somewhere is what they need. According to Maslow, our social needs include love, acceptance, and belonging. Human beings feel a need for emotional relationships, and this need drives their behaviour. To satisfy this need and avoid loneliness, we form relationships with other people – friendships, romantic relationships, social groups or community groups and similar. If people believe that they will become a part of a community, your community, if they become your customers or users, they are more likely to subscribe to your newsletter or register as a member.

 

Social Proof

Social proof is a situation where people copy the behaviour of other people assuming that this is the correct behaviour in a given situation. If your website features testimonials, case studies or an outstanding product/service rating, your visitors are more likely to believe that what you offer is really good and the right thing to do is to become your customer.

 

Wrap up

As I said, psychology is everywhere. We work with people, our employers are people, our customers are people and they all feel the way they feel, they want something, fear something and do so many things driven by their emotions. Given that psychology deals with emotions, it IS everywhere and I really hope this post helps you understand how important it is in web design too.

How to use Google Analytics to create engaging content

Google Analytics is a tool that holds such valuable data which can be analysed and used to improve website performance. It is pretty straightforward and you do not even have to have advanced knowledge of the tool to understand what parts of your website or content are working well and what could be improved. Starting from acquisition (how you’ve acquired users) which happens before they’ve even landed on your website, to their behavior (actions, clicks, etc..) and finally – conversions (or in other words, this tool can help you see if users take a desired action when they visit your website).

Today, we will be focusing on the Behaviour section in Google Analytics and provide some useful tips on how to use the data in this section to create engaging and effective content.

Step 1 – Performance of all pages

If you go to Behaviour – Site Content – All Pages, you will be able to see the number of visits per page, the amount of time spent on each page, the bounce rate, and based on the data shown, you will be able to identify high performing pages of your website.

all pages

Step 2 – Identify and analyse top-performing pages

The top of the list items of the All Pages list are the ones you want to focus on in this step, but you need pay attention to the bounce rate too. The best-performing pages would be the ones towards the top of this list but with the lowest bounce rate. If the top page of this list has the highest bounce rate, it is an indicator that this page needs further improvement in terms of content and layout. Also, do not forget to check the amount of time your visitors spend on the top performing pages because this is also an indicator of what is going well and what can be improved.

By analyzing the top performing pages in this section, you will be able to understand what content your audience finds interesting and valuable and you can use this knowledge to optimize the rest of pages and improve their performance.

But how can you do that? How can you find out what your visitors need or find valuable in terms of content?

Step 3 – Optimise content and conversions

Search Terms is an incredibly useful section of Google Analytics. You can find it in Behaviour – Site Search – Search Terms and it shows you the words or phrases your visitors typed in search engines that led them to your website.

search terms

This is the answer to the question what your users are looking for, and it gives you a great opportunity to create effective content on the rest of your website pages, but also to further optimise the top performing pages. The info you can find in Search Terms combined with the bounce rate and average time spent on the top performing pages can help you understand what your visitors are looking for, what pages attract the majority of your website organic traffic and how valuable and engaging content these pages offer.

In summary

There are so many opportunities Google Analytics offers. The information this tool holds can answer a lot of your content related questions and so much more. I have done 2 very successful content optimisation projects recently with Rivergreen, North East based property developers and Abbey Masterbatch, a manufacturer and supplier of black, white, colour, additive masterbatch and pigment dispersions. Google Analytics helped me create new and improve the existing content – the results were stunning!

What colours say about your website?

When we think about web design, the initial thoughts could be about the colour scheme. Colours certainly affect our attitude and emotions so make sure you choose them wisely. First of all, you need to know your audience and what message you want to send them. In this post, we will give you some examples of some of the most popular tones in web design and how different companies use them.

Blue

Blue is a great colour option, and it’s one of the most popular choices. Most people like it, no matter what gender or age they are. That makes the blue very universal and a safe bet. Also, this colour is associated with trust, intelligence, and efficiency. Many financial organisations are using it, even the most significant social networks like Facebook and Twitter. Another excellent example is Norvic Aero Engines LTD. Norvic is one of the leading aircraft engine overhaul companies and has a very professional and strong presence.

Green

Another great option is the green which similarly to the blue is perceived very well by most of the people. The green represents the balance, harmony, refreshment and the beginning of something new. The Green colour works really well for environmentally friendly and outdoor products. However, green is also used by so many different websites and companies like BP, TripAdvisor, etc.

Yellow

Yellow speaks for optimism, friendliness, and creativity. This colour could be great if you want to stand out, but be careful as too much yellow and certain shades of it could have a negative effect on your visitors. Some good examples of yellow accents in websites are Thomas Cook, Lipton and The Froth Shop.

Black

The darker colours represent sophistication, glamour, and efficiency. Use black to add a high-end and luxury look to your website. Some great examples are Belfund, Adidas, Luis Vuitton, Mercedes. The Black colour is classy and would always be a good idea, just be careful how much you use to avoid the feeling of heaviness and coldness.

Pink

Pink tones are feminine they bring warmth and tranquillity. The brighter variations of pink are perfect if you are looking to achieve a higher conversion rate. Excellent examples of pink websites are Newcastle Premier Health and Renew life.

Wrap-up

In conclusion, there are plenty of shades and tones to choose from, however, ask yourself what goals and messages you would like to send with your website. In general, the brighter colours will bring your conversion rate up, while the darker tones will add luxury and sophistication.