Web Best Practices

These best practices are subject to change to meet new trends and the evolving needs of the Krieger School of Arts and Sciences.

Courses

Course listings are often one of the most popular pages on the website. To keep a consistent user experience in line with the varying needs of our departments, programs, and centers, we support the following methods of presenting courses:

  • SIS Listings: This WordPress plugin accesses SIS’ API. It only displays courses that are specifically listed in your department. Course information provided includes: course number, course name, description, credits, instructor(s), term, meetings, and status. Courses are searchable and filterable by term.
  • HTML: This method is for mostly interdisciplinary and smaller major/minor offerings. The content can be displayed in a flat list or within accordions. At a minimum we require course number, course name, instructor, and meeting times.

Faculty Bio Pages

To provide users easy access to faculty contact information, the Office of Marketing and Communications requires faculty bio pages to list the following: name, title, email address, phone number, and office location. Research interests should also be listed if applicable. Faculty members can have their own website, hosted by themselves, JHU IT, or our office, either in addition to or in lieu of a faculty bio page.

The faculty biobpages are built in such a way to uniformly service over 400 Krieger School faculty (and other) members; while providing consistency for both the administrators that edit the pages and the users visiting the site. We provide tabs that highlight a faculty member’s biography, research, teaching, publications, and published books; along with two custom tabs. Due to the shared theme environment, the order of the tabs cannot be modified.

Images

The Office of Marketing and Communications will select all branding photos, along with all faculty and staff headshots. These may be rotated out at the change of a semester or at the end of the year. If you would like your site’s photos changed, or a faculty member requests a different headshot, please contact us.

Web editors should follow the guidelines set forth in the brand manual, as well as keep photos under 100 KB to allow for quicker page load times. Web-optimized images are typically 72 DPI. Due to limited server space, images larger than 100 KB may be taken down without notice. If you have a lot of images, we strongly recommend uploading them to JHBox (or create a department Flickr account) and linking where appropriate.

If you would like to include a photo gallery, WordPress offers a way to do that.

Custom or generated images are subject to approval. We reserve the right to remove any images, especially clipart, that do not comply with our standards for quality and/or content.

Inline Styles

Please do not use inline styles in your html (e.g., <h1 style=”font-size:30px;color:#A0A0A0;”>). Inline styles violate our theme’s style guide, are harmful for web accessibility, and do not follow best practices. Non-header text should be bolded only in rare circumstances. Underlines should not be used. Please consult the style guide for appropriate content guidelines.

Logos

Johns Hopkins University branding standards do not allow any unauthorized logos. You can download the approved KSAS logo on the branding website.

PDFs

Due to potential accessibility issues, we discourage uploading PDFs unless they provide an index of information (e.g., student handbook, departmental newsletter, essay, etc.). Please use images or HTML text instead of PDFs whenever possible.

PDFs of scanned book pages or posters, and other PDFS that are not machine-readable, are accessibility violations because a screen reader cannot read the words on the page. PDFs that are not machine-readable will be taken down without notice.

Making a document machine-readable allows users to search the contents of the PDF and copy and paste from it. It also enables screen-reader users to access the content.

Tips to create accessible PDFs:

Create Accessible PDFs from Microsoft Word Documents or PowerPoint

  • Save as an Adobe PDF
  • Identify the document language
  • Use the Touchup Reading Order feature

Create Accessible PDFs from Scanned Documents

  • This requires Adobe Acrobat X Pro, which is available on most computers.
  • Open your non-editable PDF document in Acrobat Pro and click on the “Tools” option. In the sidebar, select Text Recognition and then select “In This File”. Click ok on modal popup.
  • Save file and replace it on your website

Style Guide

All Krieger School websites must follow Johns Hopkins University branding standards, the JHU Editorial Style Guide, and the Krieger School’s Web Writing Style Guide. The Marketing and Communications team will correct sites that do not comply with these standards and guides.

Uploads

You are able to upload .doc and .pdf files, but we suggest they are used sparingly. Instead, considering creating a page or content out of these .doc and .pdf files. If you need to upload many .doc or .pdf files, we strongly encourage you to upload them to your JHBox, or 3rd party cloud hosting, and link where appropriate. Due to limited server space, file sizes larger than 2 MB may be taken down without notice.

This document was last updated on March 15, 2017.