William & Mary

Keep Mobile in Mind

People are accessing the web from mobile devices now more than ever, so we always have to be thinking about how our content displays on devices other than our desktop screens. The responsive design of the W&M and graduate school sites ensures our content is flexible across all devices, but are you previewing how your content will display on mobile before publishing?

There are two simple ways to preview the mobile view of your site (and it doesn’t require testing it on a variety of different devices).

  1. When viewing your live website on desktop, resize your browser window by grabbing the corner and shrinking it down to see the responsive design in action. You can resize the window to be the size of a tablet screen or a mobile phone.
  2. When viewing your website in Cascade, you can also resize your browser window to preview mobile views. Depending on your computer’s screen size, you may already be seeing a tablet view of your website when the file tree is open – in this case, you’ll hide the file tree to see a desktop view. Use the arrow in the grey “Site Content” box to hide and unhide the file tree.
Demo

{{youtube:large|Fs9bL0qXXKw}}