Clock tower on the UT Tyler campus

Secondary Component Inventory

The secondary template is a multi-use template designed with a single-column layout. This template is ideal for marketing-critical pages, pages that benefit from a more-presentational layout, and most top-level pages on your site. The secondary template provides routing to subpages and supports the components listed below to create dynamic and immersive pages.

Hero

Start the page with an impactful image or short, b-roll video that is high quality and consistent with your institution's brand. (As seen at the top of this page)

Use This Component When:

Component Includes:

Timely Update

A data-driven component to feature upcoming events, deadlines, and announcements. 

Use This Component When:

  • You want to draw attention to important, data-driven content.
  • You don’t need a lot of content, or you have a link destination.
  • Timely Updates display prominently between the Hero and the Sub Navigation.
  • You can include up to 3 Timely Updates in a carousel.

Component Includes:

  • Date
  • Supporting copy - Up to 30 words
  • Call-to-Action - 1-5 words (optional)

As seen below.

Navigation (Secondary)

Provide a list of child pages within a section to help orient visitors.

Use This Component When:

  • You want to provide a curated list of navigational links in a consistent place and style on secondary templates.
  • This component is displayed below the Hero.
  • We recommend no more than 9 links. If you have more than 9 links, revisit your information architecture or use on-page linking and routing to direct visitors to additional pages.

Component Includes:

  • Link Text - Up to 30 characters

As seen below.

Intro Text

Draw attention to a short introductory description for a page.

Use This Component When:

  • You want to draw attention to introductory text to capture visitors, create engagement, and highlight key messaging.
  • Your text is relatively short and doesn’t require links or additional styling such as bolding or italics.
  • Create a cohesive user experience by reserving Styled Intro Text for content at the beginning of a page.

Component Includes:

  • Paragraph text - 10-30 words

Body Paragraph

Use this flexible module for adding headings, body copy, links, and buttons to a page. Powered by a WYSIWYG editor, the paragraph component allows for all standard text formatting options.

Use This Component When:

  • You have a text-heavy page and need flexible formatting options.
  • Be mindful of the tendency of web visitors to scan content. Use structured headings, short paragraphs, and bulleted or numbered lists to make your content easy to consume online.

Component Includes:

  • Heading -  1-10 words
  • Paragraph text - Flexible length

Split Column

Utilize the split column module for side-by-side content. The WYSIWYG editor allows you to add headings and buttons for further separation of the two columns.

Use This Component When:

  • You want to break up the visual presentation of text by presenting it in two columns.
  • The content you have is relatively short. Long columns will become difficult for web readers to consume.

Component Includes:

  • Heading - 1-10 words
  • Paragraph text - Up to 250 words

Full-Width Image

placeholder
Incorporate images throughout the page to break up text-based modules and offer relevant visuals to the user. Use this component when: you have a strong image that should be the center of attention; your image tells a story without supporting copy. Component includes: Heading - 1-10 words; Image caption - Up to 30 words; Image - 3:2 aspect ratio.

Video Embed

Showcase a relevant video on the page to increase engagement and provide a visual medium for interpreting information. Use this component when: you want to place a video on your webpage; the Video Embed supports a thumbnail and UI elements from a third-party video player such as YouTube or Vimeo. Clicking “play” starts this video directly in the embed frame. Component includes: Heading - 1-10 words; Caption - Up to 30 words.

Two-Up Panel

Showcase between 2 and 6  related topics with or without supporting links.

Subheading Link (3-5 Words)

Use this component when: you want a way to organize content and links about related topics; your content is succinct and approximately the same length for each topic; text matters more than visuals - two-up panels are great for routing visitors and/or providing explanatory content; two-up panels support linked headers, CTA buttons, or no links. The link style will be consistent within each panel but can vary across different panels.

Subheading Link (3-5 Words)

Component includes: Group heading - 1-10 words; Section supporting copy - Up to 30 words (optional); Item headings - 1-7 words; Item supporting copy - Up to 30 words; Link - 1-5 words (optional). Item headings can also be links.

Subheading Link (3-5 Words)

Paragraph Text (1-3 sentences) — Sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt. Sit amet, consectetur adipiscing elit, sed do eiusmod tempor.

Link (3-5 Words)

Subheading Link (3-5 Words)

Paragraph Text (1-3 sentences) — Sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt. Sit amet, consectetur adipiscing elit, sed do eiusmod tempor.

Link (3-5 Words)

Three-Up Panel

Showcase between 3 and 9 related topics with or without supporting links.

Subheading Link (3-5 Words)

Use this component when: you want a way to organize content and links about related topics; your content is succinct and approximately the same length for each topic; text matters more than visuals - three-up panels are great for routing visitors and/or providing explanatory content; three-up panels support linked headers, CTA buttons, or no links. The link style will be consistent within each panel but can vary across different panels.

Subheading Link (3-5 Words)

Component includes: Group heading - 1-10 words; Section supporting copy - Up to 30 words (optional); Item headings - 1-7 words. Headings can optionally be links.; Item supporting copy - Up to 30 words; Link - 1-5 words (optional).

Subheading Link (3-5 Words)

Paragraph Text (1-3 sentences) — Sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt. Sit amet, consectetur adipiscing elit, sed do eiusmod tempor.

Subheading Link (3-5 Words)

Paragraph Text (1-3 sentences) — Sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt. Sit amet, consectetur adipiscing elit, sed do eiusmod tempor.

Link (3-5 Words)

Subheading Link (3-5 Words)

Paragraph Text (1-3 sentences) — Sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt. Sit amet, consectetur adipiscing elit, sed do eiusmod tempor.

Link (3-5 Words)

Subheading Link (3-5 Words)

Paragraph Text (1-3 sentences) — Sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt. Sit amet, consectetur adipiscing elit, sed do eiusmod tempor.

Link (3-5 Words)

Visual Router Grid

Create visual interest by adding images to 3 to 9 items, with or without supporting copy and links.

Use this component when: you want a visually interesting way to route visitors from landing pages to deeper portions of the website; you don’t need a lot of copy to support each item in your grid; you have meaningful images to support each item in your grid.

Component includes: Group heading - 1-10 words; Item headings - 1-7 words; Supporting copy - Up to 30 words (optional); Image - 1:1 aspect ratio.

placeholder

Subheading 1 (3-5 Words)

With options in Tyler, Palestine, and Longview, as well as traditional and accelerated BSN tracks, you can pick the program that fits your needs.

placeholder

Subheading 1 (3-5 Words)

Training advanced clinicians and researchers to serve East Texas. We offer online and hybrid options in a variety of specialties.

placeholder

Subheading 1 (3-5 Words)

Receive specialized training at the graduate level to focus your nursing skills in family practice, nurse management, mental health, and more.

placeholder

Subheading 1 (3-5 Words)

With options in Tyler, Palestine, and Longview, as well as traditional and accelerated BSN tracks, you can pick the program that fits your needs.

placeholder

Subheading 1 (3-5 Words)

Training advanced clinicians and researchers to serve East Texas. We offer online and hybrid options in a variety of specialties.

placeholder

Subheading 1 (3-5 Words)

Receive specialized training at the graduate level to focus your nursing skills in family practice, nurse management, mental health, and more.

Stats Panel

7st

Highlight three or more impactful statistics or rankings.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris rutrum, massa at congue tincidunt, dolor justo molestie leo, sit amet.

2

Use This Component When

You want to draw serious attention to key pride points. This component supports both numerical stats and short, concise text. You have stats that speak for themselves without a lot of supporting copy or explanation.

$58k+

Component Includes

Heading - 1-10 words; Item titles - 1-4 words; Supporting copy - Up to 30 words (optional)

T

placeholder
placeholder
placeholder

Testimonial Carousel

Explore more stories
Use a testimonial to feature impactful quotes from students, faculty, alums, or other relevant sources.

Jane Campbell ’23, Business
Athens, Ohio

Read Jane’s Story

Use this component when: you’ve got quotes and images from students, faculty, or alumni to support your page content; your goal is to highlight the UT Tyler experience; you have between 3 and 7 testimonials.

Jon Doe ’25, Chemistry

Read Jon’s Story

Component includes: Heading - 1-10 words; Quote - Up to 30 words; Attribution - 1-7 words; CTA - 1-5 words (optional); Image.

Jane Thompson ’18, Nursing
Columbus, Ohio

Learn More About Jane

Blockquote

"Highlight a student, faculty, or alumni testimonial. Use this component when: you want to draw attention to a compelling quote or testimonial in a news story, a page promoting an important initiative, or a marketing-critical landing page; you don’t have a strong supporting image or want to focus attention on the words rather than the speaker; the Blockquote features options for a white or blue background, and supports carousel functionality. Component includes: Quote - 3-30 words; Attribution - 1-7 words per line; CTA - 1-5 words."

Student Name | 2024 | Major of Study

News Panel

Incorporate relevant and timely headlines on a page with the news module.

Use This Component When:

  • You have multiple news items to include. We recommend at least three upcoming news items for the news listing component.

Component Includes:

  • Heading - 8-10 words
  • Date
  • CTAs - 1-5 words (optional)

As seen below.

News Panel

Events Panel

Incorporate relevant and timely events on a page with the events module.

Use This Component When:

  • You have multiple events to include. We recommend at least three upcoming events for the events listing component.
  • Your events can link to a supporting page with additional event details.
  • The Events Panel has a variation that supports one featured event with image.

Component Includes:

  • Date
  • Event Title
  • Time and Location
  • Calls to Action (optional)
  • Featured Event Image: 2:1

As seen below.

Events Panel

American Flag

May 26

Memorial Day

Memorial day; University offices are closed.

Jun 19

Juneteenth/Emancipation Day

12 AM - 12 AM

Jul 4

Independence Day

12 AM - 12 AM

Aug 9

Summer Commencement

12 AM - 12 AM

Router List with Image

A visually appealing way to help visitors route to content on other pages within your site. Use this component when: you want to highlight content that routes visitors deeper into the website; you have no more than four links to include; you have a relevant image to support your links. Component includes: Heading - 1-7 words; Supporting copy - Up to 25 words; Link text - 1-5 words; Image - 1:1 aspect ratio.

placeholder

Router List

A list of links in an easy-to-read two-column format. Use this component when: you want a functional component that helps visitors find resources or related content across your website; you have 4 to 8 links; you want to add some style and organization to a list of links. Component includes: Heading - 1-7 words; Supporting copy - Up to 25 words; Link text - 1-5 words.

Accordion

Accordion Subheading

The Accordion component presents related topics in a condensed format. Examples include FAQs, biographical info, and step-by-step processes.

Use This Component When:

  • You have a lot of content and need an organized way to present it.
  • You want to reduce scrolling and make key topics visible by scanning.
  • Your visitors don’t need to see all the content at once.
  • The content you want to display within the accordion is relatively simple.

Component Includes:

  • Heading - 1-10 words
  • Supporting copy - Up to 30 words (optional)
  • Item headers - 1-10 words
  • Accordion item copy - Flexible but recommend 3-5 paragraphs maximum
  • CTA - 3-5 words (optional)
A UT Tyler nursing student

Accordion Subheading

Sorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam eu turpis molestie, dictum est a, mattis tellus. Sed dignissim, metus nec fringilla accumsan, risus sem sollicitudin lacus, ut interdum tellus elit sed risus. Maecenas eget condimentum velit, sit amet feugiat lectus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Praesent auctor purus luctus enim egestas, ac scelerisque ante pulvinar. Donec ut rhoncus ex. Suspendisse ac rhoncus nisl, eu tempor urna.

Call To Action

Accordion Subheading

Sorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam eu turpis molestie, dictum est a, mattis tellus. Sed dignissim, metus nec fringilla accumsan, risus sem sollicitudin lacus, ut interdum tellus elit sed risus. Maecenas eget condimentum velit, sit amet feugiat lectus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Praesent auctor purus luctus enim egestas, ac scelerisque ante pulvinar. Donec ut rhoncus ex. Suspendisse ac rhoncus nisl, eu tempor urna.

Call To Action

Social Feed

A social media feed is a dedicated section or component that integrates and displays the university’s official social media feeds and content.

Use This Component When:

  • You want to help website visitors connect with the latest news, events, and community activities at UT Tyler.
  • You have a curated, regularly updated, and on-brand social media feed to include.

Component Includes:

  • The component is a feed, and content is populated from the social media platform

As seen below.

Connect With Us

CTA Panel

Incorporate relevant calls to action as a means of moving visitors to the next meaningful step in their exploration process.

Use This Component When: you want a full-width element that encourages visitors to take a specific action; you don’t need a lot of copies to support your CTAs; the CTA panel is placed at the bottom of the page to encourage further exploration.

Component Includes: Heading - 1-7 words; Supporting copy - Up to 30 words (optional); Call-to-Action - 1-5 words each, up to 3 CTAs