Ghost Buttons were huge in 2014, when simple flat design was all the rage across eCommerce sites. The trend has unexpectedly carried on well into 2015 and is still present in many high performing, top ranking eCommerce sites. So, what are they and how can they improve your site’s sales?
Ghost buttons are small buttons that appear on many pages throughout lots of eCommerce sites. They are transparent, empty buttons, formed of simple shapes, such as squares and rectangles and often have very thin borders, giving them that clean and stylish look. You can click on these buttons, they often take you to key parts of sites or contain calls to action.
Although they are transparent they immediately grab the users attention, hence the name ghost button. The beauty of these buttons is that although they merge seamlessly with any website, they also naturally pull the human gaze towards them.
The advantages of using ghost buttons are many. The obvious being that if you want your website to have that on-trend feel about it, then incorporating ghost buttons is a great starting point. Ghost buttons in essence capture the feel that all hip, stylish sites are trying to convey- minimalism and flatness. Ghost buttons are great at keeping the eye focused on a webpage’s primary imagery and then subtly drawing the eye elsewhere once said primary image has fully resonated. The versatility of these buttons also make them hugely attractive. They can be implemented in any number of different shades or colours, so no matter your company’s policy on branding, nothing will have to change in terms of colour scheme when you add them. Another great feature is that their flatness and understated form, allows you to save space on your pages.
The simple shapes that form these buttons, make them easily distinguishable, regardless of a site’s background. This legibility means that whatever commands you include in your buttons, they are likely to be read, understood and carried out. Instructions and commands aimed at sending users to specific parts of your site where transactions are carried out or products are selected, can be placed in ghost buttons to positive effect. There are some instances where ghost buttons should be avoided though. If your background is brightly lit and your text is white, then it’s safe to say that ghost buttons are not for you. Nothing irritates the eye more than white text over the top of a brightly lit background. Lastly, another great aspect of ghost buttons is how easy they are to create using either HTML or CSS. You can add them to your site with little difficulty.
Here are some great examples of the buttons in effect:
Digital content agency Parrallex, offers a vibrant, colourful site, with just one subdued element on its landing page- the ghost button. This calms the otherwise busy and brash site, providing some much needed elegance. Here is an example of how you can add style and sophistication to your eCommerce site.
In stark contrast, design agency The Distance uses ghost buttons to excite, rather than to calm their site. The homepage is quite austere with the exception of 3 ghost buttons, that are colourful, though still simple and true to type. Ghost buttons, are after all versatile in the different ways that you can use them to attract attention.
Architecture firm Powerhouse, uses its ghost button to funnel site traffic in the direction that it wants users to go in. The landing page features a striking image and a mesmerising video. After all this is absorbed, the user is awoken from their sensory overload by the sight of a ghost button encasing the word menu. This entices the user to click on the menu button and explore the site further. eCommerce site owners can use ghost buttons in this way to move traffic towards any area of their site that they want users to visit, more often than not this area is the product pages and later the checkout.
Ghost buttons have saturated the design world. As we have seen they can be peppered across your eCommerce site, in order to steer traffic in the direction that you want it to go in. If you subtly include commands and prompts in these stylish little buttons, users will be encouraged to explore your site in detail, moving towards product selection pages and checkouts, buying up your products along the way.
