Skip to content
Menu

Tech Tip of the Month – Naming Files Properly for Better Accessibility & Usability

There are several best practices you should follow when creating and naming assets for your  website.  Such assets may include documents, forms, images or other files that you intend to include on your website or make available as a download.  

Following these tips will help to improve search engine optimization efforts and file management. In addition, they will help assistive technology to better identify linked documents and images presented on your site.

Selecting images for website pageMake sure to include the file extension

If you rename your files, always include the file type extension  (.txt, pdf, doc, jpg, png).  Your software will usually take care of this when you use “save”, however if you rename a file, be sure the extension remains intact.

Use lowercase letters and no spaces

Avoid “Camel Case” or mixing upper and lower case letters in filenames.  Always use small, lowercase letters without spaces or special characters.   Use a hyphen ( – )  or underscore  ( _ ) to separate words within your filename.  Other conventions to remember include:

  • Never use spaces, or other characters such as:  ? ! # $ % & ‘ @ ^ ` ~ + , . ; = ) (
  • If you need to include a date in your file name use the format of  year, month, day. (e.g. YYYYMMDD, YYYYMMDD, YYYYMM).

Use a descriptive file name for documents and images

Use a descriptive title with at least one keyword associated with the file content.  This practice is beneficial to your search engine optimization efforts as well as file identification and management.

Examples of good filenames for images.

Name your file to represent the subject of the photo. Examples include:

  • dr-tony-m-tiger.jpg
  • tony-m-tiger-md.jpg
  • josh-dorran-20170605.jpg
  • east-lake-rd-pediatric-clinic.jpg 

 

Examples of good document filenames.

Name your documents according to the document type as well as the content it represents. Examples include:

  • patient-registration.pdf
  • hipaa-notice-of-privacy-practices.pdf
  • anthony-tiger-md-resume-20170605.doc
  • 2017-medical-records-release-form.pdf

Examples of poor filenames:

  • My resume
  • Web photo.jpg
  • Patient Form, ver 1.3 6.5.2017.doc
  • 2017 Records Release Form.doc

Don’t forget to add alternative text (ALT) to your images

Individuals with visual disabilities may not see your images without help from a text alternative. Image-based content may include infographics, graphs and charts. A text alternative needs to be added to images in order to ensure that the purpose and meaning of images used remains accessible to all.

Alternative text (or ALT text) provides screen reader software users with access to all of the non-text information. Adding ALT text allows you to provide image based content in an alternative text based format. Keep in mind that when adding an image to your website, it’s important to not only provide an ALT tag, but also provide one that is in context to what you are trying to describe from your image.