Contents
As a photographer, you’re known for your best photos. So it makes sense to display some of them in a visually-impressive rotating slideshow on your homepage, right?
No.
Sure, you want to “wow” people with your imagery and convince them of the quality of your work. But slideshows are not good for user experience, and they might actually leave your website visitors more confused.
In this detailed article, I’ll try to make a strong case AGAINST an all-time photo website classic – the slideshow, and what you can replace it with.
Homepage slideshows are boring & usually bad for UX
I’ve always had strong opinions about homepage slideshows but never put them in writing. This specific email from a photographer was, however, the impetus I needed:
“Could you give a hard and fast decision (with reasoning) on whether one should have a slideshow at all on their home page? I’ve asked this question of several people and no one ever wants to give a definitive answer. It’s frustrating. It would be so great to read someone who says “yes, slideshows are OK and here’s why” or “no, it’s sh*t for your users and here’s why.”
I consider photo sliders as a missed opportunity, especially when they take up the entire homepage with nothing else underneath:
“In all the testing I have done, homepage carousels are completely ineffective… In test after test the first thing the visitor did when coming to a page with a large carousel is scroll right past it and start looking for triggers that will move them forward with their task.” – Craig Kistler (Strategy & Design Co.) (source)
The wow-factor of such large slideshows is diminished by the problems they create:
1. Slideshows aren’t usually fully viewed anyway.
People are impatient, and they’re no longer willing to sit through an entire slideshow. Instead, they want to be in complete control of the website navigation experience and to find the relevant information quickly.
2. Slideshows can affect performance.
Having to load multiple large images at the top of the homepage can significantly affect page load times (unless everything is expertly optimized by a knowledgeable photography website designer through proper image sizing and compression, lazy loading, caching, asynchronously loading scripts, etc.)
3. If not built correctly, slideshows can also be bad for SEO
As far as Google is concerned, a slideshow is just a list of HTML elements with or without images with ALT tags inside them. But the way your slideshow is coded (by your template/theme) can create problems, for example, when each slide is an H1 tag and when images are loaded as background images without ALT tags.
4. Slideshows can give out the wrong first impressions.
And those are incredibly important! Since people mostly see the first few slideshow images at most, they immediately create a mental “model” of your site based on what they saw.
“Humans are able to make extremely sophisticated judgments in a fraction of a second. And once they’ve drawn that conclusion, they resist changing it.” – Seth Godin – All marketers
are liarstell stories
Are you sure your very first slideshow image conveys the full range of your photography business? Or are you naively hoping that people will sit obediently through all your 20+ slideshow to build an informed impression?
For more on this topic, this is a must-read: Clarify your photography website for first-time visitors to help drive more business
Better things to put at the top of your homepage
So, what’s better than a full-screen slideshow? Here are a few options:
A) Short panoramic slideshow
Main reasons to use this:
- now occupying the entire “fold” with the slideshow, letting people see more critical information underneath.
- smaller images => lower file sizes => better page performance
Examples of short panoramic homepage slideshows:
(click on the images to view them full-screen)
- A wide 8:3 “best-of” slideshow that’s stylish but doesn’t take up too much vertical space.
- The almost-full-width slideshow here is intentionally cropped to a 2:1 aspect ratio, so you can catch glimpses of the tagline and featured galleries underneath.
- Full-width video section cropped to a panoramic aspect ratio (at least on mobile), to allow the next couple of elements to fit “above the fold”.
- A simple full-width panoramic slideshow that sets the mood and doesn’t take up too much vertical space.
- This is not a panoramic slideshow, but it ticks other boxes: it shows the edges of the next/previous photos to create interest, the animations are fast, you can swipe to change images, and the overall slider dimensions are small.
- Another good example of a shorter slider to allow the tagline to be visible underneath. The visual effect is not lost, but it’s better for UX than having the slider full-screen.
B) Slideshow or single image behind an info-box
Main reasons to use this:
- providing more clarity straight away
- an opportunity to include a call-to-action button front and center
Examples of homepages with slideshows and information overlays:
- A semi-transparent box in the middle, containing specialty + tagline + CTA
- Three slides in total, each showing a small semi-transparent box on the left, containing information about her specialty and reasons/benefits of working with her
- A single impressive image, overlaid by a tagline and a small arrow inviting visitors to scroll down. The whole section is a bit too tall for my taste, but it works. At least it’s not just a bare image.
- A beautiful draggable carousel of vertical images, partially covered by an info box (with a photographer bio, portrait image, link, and social media icons). A much better design than the over-used boring full-screen slideshow on many wedding photography websites out there.
- A single large images with text overlay (specialty & tagline), showing bits of content underneath to signal that there’s more to scroll for.
- This one’s quite a unique example (that I built many years ago). It’s a single full-screen background image, covered by an animated logo, tagline, introductory paragraph, and a prominent call-to-action.
- Jimmy’s site has a full-screen slider “behind” the logo and nav menu, and each slide information to promote a product or a section on the site (title + description + CTA). If you look closer, you can spot a few other nice touches: discreet dark background behind the text area, text position changes sides to avoid monotony, text never covers the image point of focus.
- A panoramic static image that exemplifies what the site is all about, and then also immediately spells it out. Simple and effective.
- A custom-made panoramic photo with a portrait and text to introduce visitors to the photographer and his work.
- Excellent use of a strong tagline on top of a single image. Simple and effective. Bonus points for the extra 3 benefits clients get, listed underneath the hero section.
Here’s another creative example I spotted in the wild, I wasn’t even sure which category to fit it in:
But even better: replace a carousel with a slightly more contextual component; and instead of dots, use arrows or thumbnails instead.https://t.co/ezRKmDsFJP pic.twitter.com/XbcJvZLNTC
— Smashing Magazine 🇺🇦 (@smashingmag) May 12, 2020
C) Grid of images
Main reasons to use this:
- showcasing more “range” as a photographer (because more images together help visitors create a better impression of your work)
- you get the best of both worlds: people can still click on thumbs to open them in a full-screen “lightbox” slideshow if they want
- it can act as a “best of” portfolio, so you no longer need a dedicated page for that
For a very clean look, go for a standard/regular or a justified thumbnail grid.
Examples of image grids on photography website homepages:
- A small grid of 5 vertical photos showing dogs in different settings, with or without toys or their owners. Clicking on images opens them up in a lightbox view to be seen in their full glory. Slideshow intentionally small to not take up too much vertical “screen real-estate”, so that the tagline can be read underneath.
- Huge grid of images linking to the respective portfolios, all arranged in a 2-column full-width grid. The large photos and lack of paddings & column gaps all make up for a very clean look.
- A nice example for photographers with two specialties fighting for attention on the same website. Just break the intro section in halves :-)
- The logo and a single bird photo would have been enough to clarify this photographer’s specialty. But this grid of photos proves her experience in this niche and makes you trust her more.
- Large irregular grid of images that shows the incredible range of work done by this talented pet photographer. The grid is playful and fun to make it appealing to the target audience. And you can click on images to show a lightbox view with side captions, and then go full-screen to see images even larger. Awesome!
D) Custom collage of images (with or without text)
Main reasons to use this:
- allows promoting / linking to multiple sections on your site
- looks stylish, and if done correctly, can make your website really stand out
Examples of custom image collages/mosaics on website homepages:
- A horizontal array of overlapping photos at different sizes, with a featured portrait of tennis player Venus Williams shown prominently in the center.
- A simple 3-photo collage to the right of a strong tagline and a CTA.
- An interactive custom-collage of boxes, each with different buttons or information appearing on hover. Quite a clever design that can basically be achieved with any good WordPress page builder. On mobile, the buttons show up directly (unlike on desktop), because there’s no hover event.
* Be mindful of how collages look on mobile devices. If your collage is just a single static image done in Photoshop, it might not look good shrunk down to mobile screen sizes. Consider showing an alternate simplified collage on mobile and only serving the large one on desktop and tablet.
If you really must have a slideshow, make it as user-friendly as possible
How good (or bad) slideshows are for user-experience depends on how it’s designed and built.
Here are a few distinct pointers for improving your homepage slideshow:
1. Too many slideshow images are never good. Nobody is expected to sit through 50 images or more in a slideshow these days. It just means you were lazy with your image selection/editing.
2. If the slideshow is a splash/intro page (blocking the site navigation), then it’s “user experience hell”, yes. Anything blocking the user from reaching the main navigation and homepage content is bad.
Sure, such a splash page is visually impressive to parts of your audience but really annoying for the rest.
3. Slideshows with no left/right arrows are bad. You’re forcing visitors to wait for images to change; you’re taking control away from them. I don’t think they’ll reward you with their patience.
4. Keyboard navigation is a nice feature. As a user, I sometimes love switching a page to full-screen and using keyboard arrows to navigate a slideshow.
5. Thumbnails can help. Some users like to have the option of jumping from one image to another, and providing thumbnails is great for that. Full-screen homepage slideshows are usually exempted from this, though.
6. For portfolio sites (where the goal itself is to showcase your best work), full-width (or full-screen) slideshows work well, they can really impress your audience. But make sure the website’s main menu is still accessible. Otherwise, it becomes a hindrance.
7. The slideshow needs to pre-load images in the background, so transitions work fast. Even if you have a small selection of images in the slideshow, users should not see a loading animation for each one. (Some older websites still need to wait to load all images before starting the actual slideshow, which is obviously a bad thing).
8. Another common slideshow annoyance (for the regular slideshow at the top of the homepage) is when images get cropped too much or when the slideshow changes in size with every image (pushing the rest of the content down as well). The fix for both problems is simple: properly crop and size all slideshow images to have the same aspect ratio.
9. And then there’s the issue with vertical images. Since slideshows usually have a horizontal layout, vertical images can leave a lot of empty space to the sides, not looking as good. You could look into displaying two vertical images side-by-side at the same time (if your slideshow allows it), or preparing photo collages beforehand (one single image file containing two or three images – basically a “diptych” or “triptych”).
10. Playback should be automatic, but with the option to manually go back and forth between images. It’s good to provide both options.
11. Transitions between slides should be kept fast (<500ms) and simple. So nothing “creative” like this:
12. Next & Previous buttons/arrows need to be in a steady place. Nobody expects to move their mouse cursor when clicking “next” in a slideshow.
Related to this topic, but make sure you’re also properly sequencing images in your slideshows.
Slideshows will always have their place on photography websites, especially on gallery/portfolio pages. Just as long as they’re built right!
Always add a short tagline (or USP) to provide clarity
Your homepage should tell people what your site is all about, using words. Because just “letting the photos speak for themselves” is incredibly difficult to pull off.
Put this tagline immediately visible “above the fold”, so as part of the intro section (whatever you’re using, slideshow or not) or immediately below it. Don’t make people have to work to figure out what you do.
So what do you write about?
Lucky for you, I’ve collected a lot of examples during my 100+ popular websites project. Don’t copy others, just draw inspiration on what you can write for your own website and business, in your unique style.
Here are some nice examples of “unique selling propositions” (USP) on photography websites (and my comments underneath):
- Peter Hurley is the premier headshot photographer in New York City. He is known for the genuine expressions he captures in his actors’ headshots and executive business portraits. (really well written, describes what makes him unique, not just his niche and location)
- Strobist is the world’s most popular resource for photographers who want how to learn to use their flashes like a pro. (simple and straightforward description of what the site is all about)
- Conor MacNeill is a fine-art, landscape and travel photographer for TheFella Photography based in London, UK (specialty: check, brand name: check, location: check)
- Photoshop Aficionado w/ Adult Teen Angst. (short but very interesting)
- Your high school senior photographer creating beautiful photos, custom prints, and keepsake albums for Columbus, Ohio. (visitors get a clear idea of what they get)
- Portraits as unique as you (could be more descriptive, but there’s something intriguing here)
- Celebrations. Culture. Couture. Sophisticated photography in exclusive destinations. (niceeee)
- For glamorous couples who want to make a statement and an entrance. (assuming that the top of the homepage already “screams” wedding-photography, this text would pair with it well, it’s nicely written)
- Headshots & branding photos that make you feel confident. (awesome tagline speaking directly to the audience’s deep-seated motivation for wanting headshots)
Not-so-good examples:
- Welcome (borrrriiiiiiiing)
- Welcome to my travel blog (boring)
- DO COOL THINGS ~ TAKE COOL PHOTOS. (yeah, but why should I check “you” out?)
- DIGITAL INFLUENCER – australia’s first professional instagrammer (trying to convince us just with “social proof”, but not yet clear what type of photography they’re talking about)
- Real photographs of your individual stories. Your everyday. (nice, but a bit too vague. Is this photo -journalism or “day-in-the-life” family photography?)
- [NAME] is a modern photographer with a refined quality, delivering fresh and distinctive perspective to her wedding, lifestyle and fashion work. (checking a lot of boxes, but should be shorter)
- My mission is to explore the intersection of creativity and empathy. (too vague)
- Travel images from all over the world (too vague, what makes these travel images unique?)
- [NAME] is an internationally acclaimed photographer, book author, educator, and keynote speaker from the United States. (good intro, but maybe missing a photography specialty)
Frequently asked questions
“But I’ve seen famous photographers use slideshows or a large single photo on the homepage, and they’re doing alright.”
Sure. If you’re famous, and all your work already comes from word of mouth and from your reputation, you can get away with anything.
Take Vincent Laforet’s homepage (as of writing this):
Absolutely fantastic image. As a first-time visitor to his site, do I know what type of photography he usually does? Or where he’s from? No. Does Vincent need me to know that? No. Because he’s no longer actively looking from inquiries from organic traffic, from random site visitors.
But if you’re not at that level yet, you need to do anything you can (besides creating epic photos) to increase your chances of getting more clients. And optimizing your website (including the top of the homepage) helps with that.
“I want to keep a full-screen slideshow because it has great impact visually. But how can I improve it for SEO?”
This question is relevant to many other photographers out there. Here’s my take on it:
First of all, as I mentioned throughout this article, I’d really think hard if the fullscreen homepage is really worth it. It’s obviously a game of compromises: you’re trading usability for visual impact.
Some of the times that’s not really needed, and you can “get away” with just a strong slideshow or static image, while still having content below that (text and links that act as portals to other sections in your site). To make this decision, you need to get an understanding of who your target audience is, and what browsing preferences they have.
And probably the best recommendation I can give you (if you have some technical knowledge or a developer to help you) is to test things out: do an A/B test and compare the results in Google Analytics. Don’t just assume a version of the page is better, get proof.
But let’s say you’re still keen on having a fullscreen homepage. This web-design practice is popular with wedding photography websites, or with general portfolio-type websites (where the main focus is on impressing with images, and not on selling or blogging).
In this case, you have to commit to your decision of not having text on the homepage, and stick to the tools you do have to “tame” SEO:
- Make sure your SEO title and meta description for the homepage are perfect
- Have a clean & clear navigation menu so visitors can find it easy to jump to other pages without any confusion
- Work on the site’s performance (which in turn affects bounce rates and SEO)
- Compensate for the lack of text on the other pages: make sure you’re properly describing what your site is all about in the About page, gallery descriptions, etc.
And finally, don’t worry about it too much. Google is smart about it, ranking happens for the entire site as a whole. So if you’re doing a good job with SEO on the other pages (and also off-site), your website will still come up higher in search results, even without text on the homepage.
What I don’t recommend is having hidden text in the homepage source code (just for SEO purposes). Once again Google is smart about it :-)
“What about slideshows on other pages? Are they OK?”
There’s definitely a place for slideshows, yes. They allow you to view large images in a portfolio, one after another, without having to scroll through a long time.
In fact, the “lightbox” view that opens up when you click on gallery thumbnails is basically a slideshow. It’s a way to enjoy the images without distractions.
This article just advocates against forcing a slideshow at the top of the homepage, because visitors have different goals there: they don’t (yet) want to sit and enjoy large images, but instead want to quickly find information and navigate to other pages.
“What about the rest of the homepage?”
This article focuses only on the top of the homepage (aka “the hero section”).
Beyond that, as you scroll down, your homepage can contain a wide range of other elements, depending on the complexity of your site and your business goals.
They come in all shapes and sizes, and they usually fit in one or more of these categories:
- Thumbnails (“boxes”) linking to your featured galleries or portfolios
- A grid or carousel of your most recent blog posts
- Lists of services, benefits of working with you, featured products, etc.
- A newsletter subscribe box
- An about section (portrait + short bio + link)
- Awards, Memberships, “featured in…”, any sort of social proof
- Testimonials
- Instagram feed
- Contact information
- Call to action buttons (at least one, guiding visitors to the page they should see next). For more on CTAs, read this: Using call-to-action buttons to guide people through your photography website
Conclusion
I hope I’ve convinced you that you have better options for your homepage than the classic slideshow.
And by “better”, I mean both from a visual perspective (grids and collages are cooler) and from a business perspective (info-boxes, CTAs, and taglines help guide your website traffic in the right direction).
And if you won’t budge, and you’re keen on using a large slideshow, at least read the tips listed in this article to make your existing slideshow more user-friendly.
Whatever you choose for your website’s homepage, I’m excited to see what you come up with. Feel free to post a comment below, and I’ll reply with my honest feedback.