Spring 2020 Web Content Designer Tips

After reviewing our college's major websites over the end of 2019, I wanted to share a few helpful web content creator tips now that we're all (hopefully) settled into spring semester.

1. Always include the year on any informational web pages posted in support of an event (e.g. conference, symposium, town hall, etc.) 

While it may seem overly obvious to you that you're posting about an upcoming event, the web has no sense of time.  An outside visitor coming across an event's pages without the year listed can be left wondering if the event is about to happen, or occured in a previous year, especially if you leave the pages up beyond the end of the event.  Including the year prominently is an incredibly simple way of avoiding this kind of confusion.

Also, be sure the the event's dates and year are provided in plain text, and not just in an image of a flyer for the event.  Plain text is required for accessibility compliance to ensure that screen reader users can know when your event is occurring (or occurred in the past).

2. Flyers for events and activities have to be accessible like all other content.

A good rule of thumb is that if a flyer is more than 25% text, it should be retyped directly into a page of the website as regular text, and then (if you wish) you can cut-and-paste images from the flyer into the page.  When less than 25% of the flyer is text, you can post the flyer as it is, but in all cases, you should provide the most important details (what, when, where) directly on the event's web page, so that visitors don't have to dig into the flyer to find them.

The preferred format for posting any event flyer is an accessible PDF.  This means a PDF where the text can be independently highlighted, copied, and pasted into a notepad or text editor application.  An internet search on "accessible PDF" will provide all kinds of resources on how to create an accessible PDF in your favorite word processing or graphic design software.

3. When preparing images for your website, use the right file format.

If the image is photographic in nature, *always* convert it to JPEG format before uploading (if it's not already in JPEG, as indicated by a '.jpg' or '.jpeg' filename extension.)  JPEGs should be compressed to an 85% level whenever possible.

Photographic images should never be uploaded in PNG format, as PNG does not have any compression, meaning that your image file will be huge, and anyone viewing your site on a mobile device or slow internet connection will have a very poor experience.

4. Always resize your images before uploading them to your website.

Here are a few standard guidelines for most common image usages:

  •   Banner/Headline images:  no more than 1440px horizontal, and no more than 500px vertical
  •   Supporting image on a page (e.g. floated to the right of text):  no more than 500px horizontal
  •   Images in a set of two columns on a page:  no more than 500px horizontal
  •   Images in a set of three columns on a page:  no more than 320px horizontal

Resizing your image files before uploading them will help keep your file sizes down, which again improves the visitor experience on mobile devices and over slow internet connections.