Templates

Your region's website homepage should provide an overview of features and services that support user needs, drive actions and convey MetLife's global brand promise of Navigating Life Together.

The category page gives users a section overview, allowing them to understand the section’s scope and find important details, products, and services clearly and quickly. It also helps organize and prioritize a section’s offerings.

The subcategory page gives users a sub section overview. Instead of using the category page template, the subcategory template can be used.

Introduce the entire range of product lineup using a product tile (or a comparison table).  Navigate users to a specific product page or provide supports they are looking for. Introduce feature products/services.

Leveraged the newer components(superhero, content banner, grouped list), brand design, photography, and content, to improve the user experience and drive conversion while elevating MetLife and the value of our brand.

This product page is where a user learns about a specific MetLife product/service. Allow users to understand the product/service details clearly and quickly. Educate users about the product/service. Encourage users to take an intended action.

This product page is where a user learns about a specific MetLife product/service. Allow users to understand the product/service details clearly and quickly. Educate users about the product/service. Encourage users to take an intended action.

This page template is to be utilized as a blank template to create many predetermined layouts (ex: FAQ, Form Library, Search Results, Glossary, Privacy Policy, Newsroom) as well as freeform use of components to best display the content needed.

Displays an individual news article.

Known defect: Can not render a sub navigation, page header title should be rendered with the section name ex.Newsroom, instead of the article title.

The blog has three primary templates:

Blog Home Page: The blog home page will provide users with highlighted posts in a carousel and columned list format.
Layout 1		Layout 2
Blog Category Page:  The blog category page shows users a columned list of posts that have been categorized by a specific tag (ex: Wellness).
Layout 1		Layout 2
Blog Post Page: The blog post page is where a user can read the entire posts that have been categorized by a specific tag (ex: Life Insurance).
Layout 1		Layout 2

A campaign page appears in response to clicking on a search engine search result or an online advertisement (web banner, email).

The landing page should display sales copy and/or branding message relating to the campaign. Landing pages are used for lead generation. The actions that a visitor takes on a campaign page determines conversion rate.

Campaign Page Layout Samples: The blog home page will provide users with highlighted posts in a carousel and columned list format.
With form in the right rail		With footer form

The Reference Site includes two microsite templates, basic and advanced. The primary difference is the global navigation used by larger advanced microsite (10+ pages) versus smaller basic microsites (usually less than 10 pages) that are more campaign-focused.

Microsite Home - Hero		Microsite Home - Superhero