Promotion stage

Elements

Used when campaign image is not suitable for full bleed

The promotion component shows priority content such as campaigns, corporate announcements, events or other themes of timely relevance in a visually attractive manner.
Promotion teasers consist of a large image, text block (keyline and infoline) and a call-to-action button.
There are two options for imagery:
- 'Full bleed image', spanning from browser edge to browser edge in view ports XS, S, M and L and above. This format is the primary choice for this component. It is possible to have a white box behind the text.
- Option for 50:50 image (in case a campaign image is not suitable for 'full bleed')
The text box can be defined in width, vertical alignment and position on the left or right hand side. In addition, there are five font sizes to choose from for the keyline and three for the infoline.

The stage has a viewport optimized fixed image ratio.
The news ticker component is an optional part. It can be enabled on the homepage in combination with the content shown of the promotion stage. The news ticker is intended to show links to news content with significant importance.

Business areas can request the use of the promotion stage for their communication purposes. A review and decision process is in preparation.
High-priority corporate communication pieces (e.g. financial results announcements) may be displayed on any country homepage at any time.
Promotion images need to fit to the UBS brand design guidelines.
Promotions can link to underlying content pages, microsites or videos. They never link to content sections of the homepage or to documents.
Required image resolutions
- Full bleed image:
  - for 'desktop'-view (x-large, large and medium viewport):
    min. 3840 x 1000px
  - for 'mobile'-view (small and extra small viewport):
    min. 2046 x 873px
- 50:50 image:
  - for 'desktop'-view (large and medium viewport):
    min. 1600 x 1000px
  - for 'mobile'-view (small and extra small viewport):
    min. 1534 x 654px
Optimal number of characters
For the optimum number of characters, please consult the corresponding guidelines or crosslink mentioned below.

AEM view