CSS padding increases conversion rates!?

CSS padding increases conversion rates!?

Padding and margins create white space. And white space influences conversion rates.

Yes, a little extra or little less white space can affect your website’s conversion rates and in most cases that’s if someone buys whatever it is you’re selling.

It also turns out that margins and padding also have an imprint on the perceived value of a product or service.

So what’s going on exactly??

Empty space is expensive for retailers.

I’m completely fascinated by how weird we are.?

And despite things like websites and apps not being real, physical things we can visit or touch, subtle changes can have a wild impact on how we interact with them.

The relationship between space and the perceived value of products stems from brick-and-mortar retail.

We all know that the bigger the store is, the heftier the rent.

Depending on location, rents in London vary from ￡36 per square foot to ￡2,000.

Space is a precious commodity; and we know that if a product takes up a lot of floor space, or has a lot of empty space around the display, then it’s going to hammer your wallet.

Take Rolex as an example.

Jewellers use space in Rolex displays to convey luxury and expense.

However, discount stores cram as many products as possible onto a single shelf.

This link between space and price also applies to e-commerce.

How to use whitespace to boost conversion rates.

When it comes to websites, the illusion of space is created with margins and padding; CSS and html your browser uses to display a web page.

Huang, Lim, Lin, & Han in 2019, discovered that the padding around product images influences how much people think the item is worth.

• Selling products at discount prices? Use a theme or write custom code to display tight category pages for your products
• Do you sell luxury items in your Shopify store? Use a lot of whitespace around product images

For product images, there are two different ways that you can use white space:

1. Alignment padding: The amount of padding at the top, bottom, left and right between rows and columns
2. Product image size and cropping: How large a product image is on a web page or landing page

Use the right amount of white space and your products will resonate with the desires and perceptions of your audience.

How eBay display products based on?price.

eBay is an excellent example of how you should use white space for your product images on category pages and result pages.

More expensive items on eBay such as vehicles or property are displayed with one product listing per row.

eBay product images for items being sold at low prices are crammed together and have four products per row in their result page.

This is synonymous with bargains.

This is because they know that luxury and quality are associated with how much white space is used on a web page and landing page.

Now it’s time for you to do the same.