When using images and videos, there are a few mobile best practices to follow. These best practices also increase the usability of your content on desktop.

  • Do not use images for decoration only. Cute babies are always nice, but in mobile, photos push salient information off the small screen. When using imagery, it should support the main point of the page, or demonstrate something more simply than words can (such as our brand personality of the “compassionate expert”).
  • Do not put text in images. Search engines and screen readers can’t read it. One exception is infographics, but when using them there should be additional text on the page or meta data describing what is communicated in the infographic for accessibility and search engine optimization.
  • Avoid busy images. Use tight shots of one to two subjects versus large crowds or far away shots. The busier an image, the less it conveys and the more likely it is contributing to clutter on a page. Consider cropping existing images.

images-do-this

  • Use YouTube embedded videos. Videos hosted through YouTube have the most accessibility across mobile device types. We have several available embed sizes (see examples below). It’s also important to add a descriptive header or other text next the embedded video on the page. This makes the video search friendly.

Full-width (feature video): Careers

Half-width (in-line): Nursing Care Delivery

One column video listNursing Overview (bottom of page)

Two column video listAward-Winning Leader (bottom of page)

Questions about optimizing your content for mobile? Contact ehealth@seattlechildrens.org.