Social

Display links to official social channels or embed related content

Usage

Usability Guidance

Follow best practices in social media content and marketing:

• Only create unique channels if you have a strategy in place to regularly communicate and engage with customers.
• Don’t treat social channels like free advertising channels.
• Use social content to provide value to people.

If you don’t have enough resources or content to maintain social channels, that’s okay. Consider submitting your important content to official UCLA channels instead of investing resources in maintaining your own.

Accessibility Requirements

• Wrap social media icons in the <nav> element with ARIA aria-label="Social" or aria-label="@UCLA Social" to identify links to your channels.

Social Post Tiles

If you embed content from social channels on your website, we recommend displaying it with branded text- or image-based social tiles. Curate posts to match a specific theme such as campus life, research discoveries, etc. versus a hodgepodge of everything. Regularly update featured posts to ensure content stays current.

Anatomy

1. Post Text (required)
2. Handle and Time Stamp (required)
3. Social Channel Icon (required)
4. Container (required)
5. Photo (optional)
6. Overlay (required for social posts with images only)

States

With Photo States

Specs

With Photo Specs

Code

Social Links

Anatomy

1. Social Media Icon (required)
2. Container (required)

States

Specs

Code