How to Incorporate Your Portfolio on the Landing Page
A portfolio highlights your best work. No matter what type of business you own, designs you create or photographs you take, it’s a personal calling card that shows what makes you unique. However, figuring out the best placement for your portfolio isn’t always easy. Obviously, you want it linked to from your landing and home page, but do you use thumbnails, sliders, full images or what?
Around 96% of site visitors aren’t yet ready to make a purchase. Your job is to convince them they can’t possibly live without what you have to offer. Showing off some of your best work is one way of engaging them and showing them what you might be able to do for them. Fortunately, there are several ways of incorporating your portfolio on the landing page without being too spammy about it.
1. Add a Slider
Some experts will say sliders are yesterday’s news, and you shouldn’t use them. However, with internet speeds faster than ever before, a slider is a nice way to highlight some of your best work without taking up a lot of space. Placing it at the top also shows site visitors that this is one of the most important elements on your landing page. Keep a few things in mind when creating sliders, such as how they appear to mobile users and limiting the number of screens, so the user isn’t overwhelmed with an endless sliding loop.
Tom Peters Art naturally lends itself to sharing images from paintings in a slider. When you land on the site, you see a slide that goes through several different pictures. From time to time, the offerings change based on the season or newer work. The slider and thus a few key offerings from the portfolio are the main focus of the page.
2. Use Thumbnails
If you want to give users a quick taste of what you have to offer, you could also add a few thumbnails of your best work and a CTA button inviting them to view your complete portfolio. When choosing thumbnails, look for images that translate well in a smaller size. You should also vary the type of thing you show. For example, if you are a photographer, you might want to highlight studio work and outdoor shots along with a few black and white images.
3. Make Images Clickable
When you share pictures of your work, make sure they are clickable so they take the user where you’d like them to go. If you show a product package you designed, make the picture clickable to a page of other examples or information on how to get in touch with you to create a unique design. Another option is making any photos go to the full online portfolio so the user has a chance to see more of your work.
However, ideally, the user takes an action that leads them to become a customer. Think about how clicking on the image creates a unique call to action (CTA) of its own and where the person goes next in the buyer’s journey.
USA Shade makes each of the images highlighting its shades clickable so users can get more information both on how they are used and how to purchase their own. For example, the first image in the slideshow is of the YETI corporate campus. The portfolio picture becomes a case study when you click on the link and it explains the uses of the shade and the size and style of the wing structure. A CTA button reads “Products in Use,” and a second one reads “Contact Us.”
4. Include a Logo and Tagline
Even though your goal for a landing page might be simply to highlight a specific type of work you do, you should still include a logo and tagline. It’s important to brand your business and not focus too much on a single project or image. While a portfolio highlights your best work, your brand is what shows you’re capable of continuing similar items and creating custom projects. Your logo and tagline should show clearly what you do and be memorable, so users keep you in mind when they need what you offer.
5. Show Different Sides
A popular trend in websites this year is showing dual sides of a brand personality. You can easily do this while highlighting your portfolio. Split the page in half and show each type of work you do with images and descriptions. Use grids to break up the different types of projects you do, with pictures that are highly relevant to what you’re trying to showcase.
Breather offers office space for small-business owners. It shows the different types of workspaces by placing two images side by side. It shows locations for a few hours of work or some of the benefits of leasing for a longer term. Depending upon the user’s needs, they are taken to additional information on available space when clicking on the image. For example, they discover monthly options that offer high-speed W-Fi, cleaning, furniture and no long-term commitments. They also find out what locations are available and see additional portfolio images.
6. Place in Nav Bar
Another simple way of incorporating your portfolio is by placing a tab in your navigation bar that says “portfolio” or “examples.” This allows you to guide users to it no matter which page they land on. It might not be as fancy as adding sliders or a video, but it is a practical way of keeping the information available on every landing page, home page and subpage on your website.
Put your portfolio images and links in different locations on your landing pages. Conduct split testing to see where it performs best. You can track performance through clicks and heat maps, seeing where users spend the most time on the page and which links they click on. If your portfolio is performing poorly, try moving images or links to a new location on your landing page and see if that helps improve conversions.
Lexie Lu is a designer and writer. She loves researching trends in the web and graphic design industry. She writes weekly on Design Roast and can be followed on Twitter @lexieludesigner.