Web services

Spotlights

The Spotlights section of the homepage highlights PCC websites related to upcoming featured events, current campaigns and marketing efforts. The images are attention-getting, attractive, and come from Marketing and Communications.

Guidelines

  • Spotlights are not:
    • a sales tool for individual programs or classes

Development info

  • Stylesheet location: /source-v6/styles/applications/_home.scss
  • The Web Team adds spotlights to the page manually.
  • Full-sized spotlight images should be 340px by 370px and half-sized images should be 340px by 180px
    • Put full-sized spotlight images in the /about/spotlights/images/340x370/ folder and half-sized images in the /about/spotlights/images/340x180/ folder
  • Make sure to include descriptive alt text – include the text from the image
  • One announcement: 
    <a href="">
  <img alt="" src="/about/spotlight/images/340x370/image-name.jpg">
</a>
  • Two announcements: 
    <a href="">
  <img alt="" src="/about/spotlight/images/340x180/image-name.jpg">
</a>
<a href="">
  <img alt="" src="/about/spotlight/images/340x180/image-name.jpg">
</a>

Styling

This space allows for images that contain limited text and link to a related website. Marketing and Communications typically provides the images. There can be one full-size or two half-size spotlights.

Responsive behavior

No change.

One

One spotlight

Two

Two spotlights