Using custom icons for navigation

Using custom icons on your site is a great way to customise your navigation bar and attract the attention of visitors on your site. Custom icons are effective because they appeal to the visual part of our brain. 90% of information transmitted to the brain is visual, which means incorporating these features on your site means it’s more likely that your content will be memorable to visitors.

Liquidators and Insolvency practitioners, Connect Insolvency, needed an informative website that would also be visually appealing. Check it out here: By using five coloured icons to represent each of the services, it draws attention to the main information points of the website as well as giving the homepage some life. Icons can be used to break content on your page up and make it more readable as well as being more aesthetically pleasing to the human eye. When it comes to designing icons, there are a number of styles and shapes that can be used to create unique images.

Screen Shot 2018-01-12 at 11.45.15.png

As you can see, hexagons are the choice of shape here. Using this shape compliments the branding of the site and the company’s cubic logo. Geometric shapes, as custom icons, also sit well on a responsive website that is being viewed on a mobile device or tablet.

Advertisements

5 Stunning & Effective White Websites

As a web designer, one of the problems you may face is convincing a client that throwing all the crayons in the box at the screen doesn’t always work – white websites can be just as effective and visually stunning as those with full palettes. Here are five examples of sites doing a great job with a minimal colour scheme…

Gitman Shirts

Screen Shot 2016-01-07 at 14.33.04

This strikingly simple website for a shirt maker lets the colours of the products get the message across – the majority of the page is beautifully white and clear, making navigation an absolute breeze and the content a joy to take in.

Stand Up To Cancer

Screen Shot 2016-01-07 at 14.33.07

A ‘digital canvas’ allowing visitors to learn about all the ways they can help raise money and awareness of cancer research. The minimal design isn’t 100% minimal – there are splashes of watercolours and hand drawn items throughout the page.

Orchestre De Paris

Screen Shot 2016-01-07 at 14.33.29

An adventure in sound is how this site is best described, with interactive symphonies the user can take part in using their mouse or trackpad. The white minimalist design is stunning, with the interactive elements adding a splash of life to the user experience.

Prestwick Care Home Group

Screen Shot 2016-01-07 at 14.34.02

A beautifully simple UI combined with immersive streaming video makes this introduction to a care homes north east provider informative and visually stimulating. The site has a beautifully minimal user interface and the information presented throughout is easy to find with nothing more than three clicks away at any time.

Sabe Masson

Screen Shot 2016-01-07 at 14.31.41

The French fragrance house has a suitably minimal website, with black and white photography, gorgeous typography and oodles of sexy white space.

Auto-Scrolling Image Carousels

Chances are at least 50% of the websites you’ve visited today have featured a scrolling/rotating image slider carousel taking up most of the homepage. The idea is to give a snapshot of a companies offering – products, services, special offers, latest news – but what is the reality? Are carousels a useful tool or a waste of valuable onscreen real estate?

advanceAdvance Flow Pack’s carousel allows users to scroll through their range of wrapping machines at their own pace.

A lot of the time, people will see something on a website and be impressed by the movement or graphics, thus the idea is stuck in their heads and they insist on having a similar feature on their own website. This is not a decision based on effectiveness, rather it’s a shallow way of planning a website.

Various organisations and companies have tested people’s reactions to image carousels and the feedback is not positive – the overall results show that auto scrolling carousels are terrible for business. Often users will look straight past them, as they look like banner adverts, and if they do notice them they become frustrated at the information changing before they’ve had a chance to find what they were looking for.

j3

This banner works as the call to action remains static whilst allowing high quality photos of previous projects of this Newcastle Builders to rotate in the background

So what’s the solution? If a client asks for a banner, you can’t just refuse. Here are the options:

  • Put control in the hands of the user – add navigation options so they can scroll through at their own pace. You get the impact of the large image without the frustration of missing it.
  • Use a static banner to communicate your main point – ideally the banner space should provide users with the ability to find what they’re looking for immediately, make the most of their one second attention span.
  • Don’t overstyle the banners – the more it stands out from the rest of the page, the more it looks like an external advertisment, so keep it relatively simple.
  • Ditch the whole concept of banners and simply start the actual web content at the top of the page.

monarch

This banner is static, and smaller than usual – the user instantly knows their looking at a range of flood protection products.

Interactive Infographics

Infographics are everywhere online. The current trend is for a more interactive type of graphic, allowing the user to learn more and – vitally – allowing the content provider extra attention span.  Here are five of the best interactive infographics we’ve found online.

Bond – Licence To Drive

http://www.evanshalshaw.com/more/bondcars/

This quirky and every so stylish minimalist infographic charts the entire history of Agent 007’s vast logbook history. They’re all there, from 1962’s Sunbeam Alpine to the upcoming Aston Martin DB10. Scrolling through provides a wonderfully animated stroll through memory lane for Bond and car buffs alike.

Thirteen Reasons Why Your Brain Craves Inforgraphics

http://neomam.com/interactive/13reasons/

Why bother explaining the benefits of using inforgraphics when this smart website does such a fine job of it? From interesting stats (use of visualised information has increased 400% in literature since 1990!) to useful science (almost 50% of your brain is involved in visual processing) this excellent site tells you all you need to know about presenting your data in a unique and memorable way.

The Console Evolution

http://www.designbysoap.co.uk/interactive-infographic-the-console-evolution/

Remember your first games console? This infographic probably does. Charting the rise and rise of the home gaming revolution from the humble Odyssey system (1972) all the way up to today’s graphical powerhouses, the main thing I learnt was how much these things used to cost, thanks to the useful inflation adjusted price tags.

Evolution of Insight

http://www.visioncritical.com/evolution-of-insight/

A fascinating journey through history, showing us the greatest innovations in research and behaviour quantifying.

Monarch Flood Protection

http://monarchfloodprotection.co.uk/help/

A brilliant infographic showing the best ways to flood proof your vulnerable home, with visual clues as to what’s available and full product information available once you’ve established the best option for you.

Have you gone responsive yet?

Responsive Web Design

Photo credit: Forklift Solutions Ltd

Last year’s web design buzzword was most definitely responsive web design.

With ever increasing mobile and tablet usage, responsive design has emerged as the undisputed solution for web designers.

A dedicated mobile website is no longer adaptable or flexible enough to cope with the proliferation of device / browser sizes. A mobile website also is a potential headache in terms of updating and duplicate content, as many a web designer will testify.

If you’re still weighing up the additional development time or web design costs, we list reasons for going responsive:

SEO – it is noticeable how responsive websites have been given a ranking boost in the last few months by Google. For example in May ne-web.com, teamvalleyweb.co.uk and sleeky.co.uk were the top three ranked websites for ‘web design newcastle’. Fast forward to September and sitely.co.uk has come from nowhere to #2, despite having a fraction of the backlinks and less established on-site optimisation. It is also the only site of the four that is responsive.

Future proofing the release of the new iPhone just days ago highlights the ever changing landscape of device and browser sizes. You may remember accessing the Internet on your WAP phone 10 years ago, and how things have changed. So imagine what the future will bring in 10 years time? Responsive design future proofs against this to an extent.

Maximise your visitors – with certain industries getting as much as 50% of their visits from mobile devices, not catering for this is like a shop and restaurant not accepting card payments. Fickle web users don’t need much excuse for tapping the dreaded cross, so don’t give them one!