This article highlights hero images and the different variants that you can choose from in the website builder.
A hero image is a large banner that appears prominently at the top of a website, designed to capture visitors' attention and effectively communicate the association's identity. This is the first image users see when they visit your webpage, so it has an important use in introducing your association. With Tradewing's website builder, you can customize the appearance of your hero image to meet your association's specific needs and branding strategies.
There are three variants of Hero Images: Card, Blend In, and Image.
Card
The Card option allows you to display a card over a background image. This feature allows you to communicate important information about your organization. You can include a title that captures attention, a subtitle that provides additional context, and detailed information that describes your association's mission, values, or services.
You can also add a button that redirects users to an external link when clicked. This feature is useful if you want to direct them to your association's website or a webpage with more information about your association.
Users can also click directly on the card itself to be redirected to the specified link, eliminating the need for a separate button.
Below is an example of a hero image featuring cards. This option is particularly effective for promoting upcoming events and conferences that you would like to attract participants from outside of Tradewing. By placing your conference as a hero image, you can capture the attention of potential attendees. Additionally, you can embed a link in the button that directs users to the registration page, making it easy for them to sign up.
Blend In
The Blend In option allows you to overlay text directly onto the background image. Unlike the Card option, this text does not have a white background. Instead, it subtly darkens the background image to enhance the visibility of the text.
You can also incorporate a button that, when clicked, will direct users to a specified link.
Below is an example illustrating how the Blend In variant can be utilized by associations. This option is ideal for highlighting text while ensuring the background image remains subtle and non-distracting. For instance, you can use this feature to showcase your membership offerings or to convey your mission and vision, complete with an embedded link for more details.
Image
The Image option lets you select a specific image to display on your webpage. Unlike the other options, you cannot add text overlays to this image. Additionally, when you upload your chosen image, it will appear at its original dimensions, ensuring that the visual integrity is maintained.
Below is an example of how the Image option can be utilized by associations. It is particularly recommended if you want to display a banner at the top of your homepage or if you wish to insert a banner image between different components of your webpage. It is important to note, however, that you need to choose high-quality images that reflect your association's branding and values.
