A photograph of a person typing at a laptop

Image galleries

Make lots of photos look good instead of cluttered.

content

What does it look like?

<ul class="image-gallery">
	<li><img alt="This is a placeholder image" src="https://images.unsplash.com/photo-1666090314187-1ca4b41249c8" /></li>
	<li><img alt="This is a placeholder image" src="https://images.unsplash.com/photo-1666090377623-7e1ead5dca7f" /></li>
	<li><img alt="This is a placeholder image" src="https://images.unsplash.com/photo-1666090324714-02fa5229c779" /></li>
	<li><img alt="This is a placeholder image" src="https://images.unsplash.com/photo-1646308070521-6a837a3a543e" /></li>
	<li><img alt="This is a placeholder image" src="https://images.unsplash.com/photo-1646308070503-a9acfebaac77" /></li>
	<li><img alt="This is a placeholder image" src="https://images.unsplash.com/photo-1646308070559-f69cd2a69e5f" /></li>
</ul>

How does it work?

Copy the code and replace the images with your gallery photos. Make sure to update the alt text on each of your photos, and make sure it's something descriptive.

You can use photos of any size but avoid using images that show text or data, as some images will stretch and crop to fit the space available, leaving the information cut off.

Compress your images before uploading

Lots of images on the page will slow it down. Make sure each image is a really low file size - under 100kb, if not smaller. Under 50kb is even better! You don't want to slow your site down to the point where people aren't bothering to stick around and wait.

 

Related articles

Buttons

Buttons make your links stand out. Use them in combination with different arrows to make your call to action prominent.

Sun 09 Apr 2023

Quotes

For chunky testimonials that make an impact.

Sun 09 Apr 2023

Videos

Embed videos on your website while making sure they look great on mobile and desktop.

Sun 09 Apr 2023