Paul Andrew 
Using SharePoint hero web part strategically can transform your intranet and cloud sites.
This in-depth guide covers what hero web parts are when to use them, and step-by-step instructions for adding them to SharePoint pages.
What are SharePoint hero web parts? They are full-width web parts that stand out and command attention.
Hero web parts showcase important content, events, announcements, images, videos, and more. They immerse site visitors with large, vibrant displays.
Strategically adding SharePoint hero web parts to your pages helps guide users, highlight priorities, and make desired actions instinctive. This article outlines best practices for unleashing their potential.
When Should You Use Hero Web Parts?
Hero web parts shine when you want site users to:
- Notice timely announcements and events
- Easily find recent or vital content
- View rotating content like images and videos
- Perform key tasks and workflows
They transform SharePoint from a collection of pages into an engaging digital experience.
Highlight Time-Sensitive Content
Hero web parts excel at showcasing timely, ephemeral info. Use them to highlight:
- Short-term announcements: New policy changes, org updates, maintenance notices, etc.
- Events and promotions: Conferences, sales, contests, limited offers
- Recent or popular content: New guidance, trending news, helpful FAQs
- Emergencies or outages: Hero web parts stand out against all other page content during crises
Time-sensitive content demands attention. Hero web parts provide the real estate and visibility these messages require.
Guide Users to Important Actions
Well-designed heroes influence user actions by making desired pathways instinctive. Use them to promote:
- Vital workflows: High-priority requests, required training, new system rollouts
- Community resources: Wiki home pages, document libraries, contact directories
- Business objectives: Sales targets, productivity goals, internal initiatives
- Help and assistance: Support links, self-help guidance, account management
Hero web parts allow you to route users to key destinations without excessive clicks or confusion. They prevent important content from being buried.
Showcase Rich Media
Hero web parts give visual content the space and prominence it deserves. Use them for:
- Image carousels: To display rotating, full-width images
- Background images: For visually stunning backdrops that set the tone
- Full-screen videos: To draw attention and interest
Text-heavy pages fail to engage modern users. Hero web parts provide canvas space for vital visual storytelling.
- Step-By-Step Guide: Adding Hero Web Parts
- Follow these instructions to add hero web parts to SharePoint pages:
- Edit your site page
- Select the Settings icon > Edit to unlock the page
- Add a new web part
- Choose “+ Add” > Media and Content > Hero
- Select your layout
- Pick from half-width, full-width, and full-screen options
- Configure content
- Add images, videos, links, custom HTML, etc.
- Provide alt text for accessibility
- Refine design
- Adjust colors, spacing, overlay, animation, etc.
- Limit loud designs
- Save page
- Select Publish > Save to update
Additional tips:
- Spotlight vital info only: Avoid overusing heroes or they lose impact
- Keep heroes high contrast: Don’t compete with background images
- Use responsively: Test mobile and tablet views
- Check accessibility: Ensure good color contrast and alt text
- Iterate based on data: Monitor page analytics to optimize
Hero web parts, when used appropriately, make sites more usable and captivating. They provide bold canvases for showcasing priorities.
Carefully incorporate them to guide users, highlight timely content, and showcase visuals.
