Skip to main content
Get Urgent Help

Search

Student Affairs Website Overview

The Student Affairs website is maintained by the Communications & Marketing office. We oversee content editor training and access to the website. You can also request website changes through our office. 

Many Student Affairs departments have a content editor. This page provides resources for content editors. If you have a need for a content editor in your unit, please contact the Communications & Marketing Director

Staff Directory Additions and Updates

Adding New Staff to the Directory

If a new staff member joins your office, the staff member will receive a communication from our office after you submit the SAIT account request form. A new staff member will receive a Qualtrics form where they can enter their information as well as a sign-up sheet for photos. 

Changing Current Directory Information

If you need to update your information or have moved to a new unit within Student Affairs, please make the change request using the Directory Change Form

Removing Staff form the Directory

Staff will be removed from the directory after a manager submits the SAIT account separation form

Content Editor Access and Training

If you have a need for a content editor in your unit, please contact the Communications & Marketing Director

Website Login Page: studentaffairs.psu.edu/user

Training modules for content editors:

 

Web Content Manager Reference Guide

Image Resources

Image Sizes & Naming Conventions

Web images MUST be sized correctly, cropped before uploading, and named according to the below naming conventions. If you are unsure how to size correctly, please contact our office. We are happy to help upload photos.

Sizing

  • Page Banner – 1366 x 420
  • Text with Image – 208 x 312 (width is always 208, height is variable but never less than 312)
  • Call Out – 184 x 184
  • Slideshow – 690 x 460

Photos should be optimized for the web, downsized to 72 dpi.

Naming Conventions

  • PageBanner_Dept.Abbreviation_Description_Month_Year
  • TextImage_Dept.Abbreviation_Description_Month_Year
  • CallOut_Dept.Abbreviation_Description_Month_Year
  • Slideshow_Dept.Abbreviation_Descrption_Month_Year
Examples
  • PageBanner_CR_Rockwall_03_17
  • SlideShow_SEP_AlternativeBreakHouston_01_18

Other Helpful Tips

  • Do not embed text within images. Screen readers cannot read text in an image. 
  • Ensure all images have a descriptive alt tag. The alt tag should briefly describe what is happening in the photo. You do not need to include words like "photo of" or "image of." 
Content Resources

Editorial Style 

Penn State uses the Chicago Manual of Style for website content. In addition, Penn State has an editorial style manual that supersedes Chicago style in some cases and contains Penn State-specific style information (such as campus names). Please reference these documents if you have questions about style, spelling, capitalization, dates, numbers, etc. 

We have captured some common questions in our Student Affairs website style-guide

Other Helpful Information

  • When copying and pasting content into the website, first copy it into Notepad or TextExit and strip the formatting.  
  • Use bold sparingly. For headings, us a heading style instead of bold text. 
  • Use bullets for easy scanning of text or to break up large sections of text. 
  • Avoid directional language, such as "navigation on the left" because page sections move or disappear on mobile. 
  • Test your pages on mobile. Especially if you are using tables, it can be helpful to view your page on a cell phone or tablet.
  • Use inclusive language. Try to avoid "she/he." It's awkward and can exclude individuals. Use words such as "you," "student," or "they" when possible. 
Accessibility Resources

Web Accessibility

Accessible content can be understood by everyone, regardless of the browser or adaptive technology a person might be using. Penn State policy requires all web content to be accessible. However, accessible content benefits everyone, even those with no apparent disability. 

Descriptive Link Text

  • Links should be written in conversational text. Do not write out the URL. 
  • Avoid phrases such as "click here," "read more," or "more information." 
  • Make sure the linked text describes the information the user will be taken to. 
  • Do not underline non-linked text as it can look like a broken link. 

Image Alt Text

  • All images should have Alternative Text or Alt text. Alt text is a required field in our Drupal content management system. 
  • This is the text that will be read by a screen reader for users with visual impairments. It will also display if the browser has trouble loading an image.
  • Alt text should describe what is happening in the photo. Limit Alt text to about 10-20 words. 
  • Do not include words such as "image of" or "photo of." 

Text in Images

  • Avoid using text within an image. This text cannot be read by a screen reader, so visually impaired users will not be able to read it. In addition, if the images do not load on your page, this text is not available. 
  • Text in images often becomes distorted or unreadable when images are resized. 
  • If you must include text within an image, repeat the text in the Alt text field for that image. 

Headings

Web content should be organized into small sections separated by visual headings. Heading text must have an HTML tag in order for visually impaired users to navigate a website. 

  • Every page should have a heading. If there is a large amount of content, the content should be divided into sections with subheads.
  • When adding a heading, select heading text, do not use bold font. 
  • Never use a heading style to format text that is not a section heading.  
  • Headings should always be used in order from H2-H6. (Heading 1 is not available because it is used for the page title.)

Abbreviations and Acronyms

Avoid using acronyms. In some cases, an acronym may be used on the second reference. 

If using an acronym, make sure to spell out the full name at least once on EVERY page where you use the name. 

Instead of using an acronym for your office or department, use words such as the center, the institute, the office, etc.  

For many standard abbreviations, use periods so that a screen reader can read them. (e.g. U.S., a.m., p.m.) 

Page Titles

Page titles should be descriptive and unique to the page. The page title appears in the browser tab as well as in the page header. Page titles are essential for search engine optimization. 

Instead of "About," use "About Student Activities." 

File Uploads

PDF & Word documents

In general, we do not upload PDF or Word files to the website. In most cases, we will work with you to find a way to include the information on our website or as an online form. However, there are typically three cases where we'll make an exception. 

  • The content cannot be displayed in another way. 
  • The content must be printed and submitted as a hard copy. 
  • The content already appears on the website, but you'd like to have it available in another form. 

If you'd like to upload a file to the website, contact our office for assistance. We will let you know if the file is approved to be posted and assist you in posting.

Any documents that are posted to the website, MUST be made accessible. We will ask you to make the document accessible before sending it to us. Please see the instructions below for how to do this. 

Making a Word Document accessible

Word documents are easily made accessible by using the formatting functionality within Microsoft Word and many of the same strategies used for web content. The more complex the document is, the harder it will be to make accessible, so limit formatting, images, etc. 

Making a PDF accessible

To ensure that your PDF meets accessibility requirements, you will need to use Adobe Acrobat Pro/DC to check.

Make Your Accessible PDFs

  • Select "Tools > Action Wizard"
  • Select "Make Accessible"
  • Select "Start" and follow the prompts.

Check for Accessibility Issues

  • Select "Tools > Accessibility"
  • Select "Full Check" in the new sidebar
  • Select the issues that you would like to have checked
  • Select "Start Checking"
  • Right click on issues to either "Fix", "Explain Rule", or "Check Again"
Web Forms

When possible, use a web form to collect information instead of a PDF or Word document. We recommend using a Drupal for (which the Communications and Marketing team can create for you) or a Qualtrics form. 

To help you decide which form to use, here are some pros and cons of each. If you'd like us to create a form for you in Drupal. Please submit a new project request form online. 

Drupal Forms

Pros

  • Can be created within the website, which is helpful for tracking analytics. 
  • Form responses can be emailed to a recipient. 

Cons

  • The layout/style cannot be changed. 
  • Any changes to form fields/text have to be made through the Communications and Marketing office. 
  • Can't view the responses online. 

Qualtrics Forms        

Pros

  • Can create comlex forms. 
  • Form owner can make any changes. 
  • Responses can be emailed or view online. 

Cons

  • User has to leave the website to complete the form.
Video & Multimedia Content

Videos

If you have video content that you would like to have displayed on your webpage, please send it to the Communications and Marketing Department to upload. The video must meet all requirements below to be included on our website. 

  • Must be captioned (You can submit a script in Word with the video and we can caption in YouTube). 
  • Must be uploaded to the Student Affairs YouTube page 
  • Must contain an end slide with the appropriate Student Affairs wordmark. If you need assistance adding an end slide, contact our office.  

Other Multimedia Content

Any audio content, such as podcasts must be transcribed so the content can be accessed by users who are deaf or hard of hearing.  

Penn State Student Affairs
Communications & Marketing
Location

203 Boucke Building 
University Park, PA 16802
sacommunications@psu.edu