Best Practices for Mobile

Review the information below to ensure your webpage can be easily viewed on smaller screens, like tablets and smartphones, for users on the go.

Fonts

ECLKC fonts are standardized across the board, which prevents issues that may otherwise arise:

  • Title: Roboto, 2em, #264b65
  • Heading: Roboto, 1.5em, #264b65
  • Sub-heading: Roboto, 1.123em, #264b65
  • Body: Lato, 1em, #333333

Images

  • Images should disappear on the mobile viewport
    • Exception: An image that is key to the content discussed should remain visible (e.g., infographic, results chart, etc.)

Interaction

It is important that user interaction occur even on the mobile platform. Since "hover" isn't available, actions such as "active" or touch technology, swipe, and screen movement are critical. They acknowledge the user and ease use of the site.

Load Time

Even with faster load time, image file sizes should be very low for mobile. There is no standard file size requirement, but you must optimize all images prior to use.

Modal Windows

Windows should resize themselves according to the viewport.