On the new CSUMB.EDU website, editors have a new tool for presenting content: Columns. Columns can look great and help pages from getting incredibly long on desktop displays, and can be very helpful in grouping information. But you'll want to think carefully about how you set up your page when using columns, and....
Remember Mobile
Because the new site is responsive, think about how your content will look on a phone-sized screen. At some point, it is all going to be displayed as one column, and your columns will be stacked. Column A will appear first, then Column B, then column C.
Does the relationship you set up between columns work for mobile?
In this case, no.
Someone viewing the content on a phone would see a list of all the employers, followed by a list of all the industries, and finally a list of websites.
So how to fix this?
Sometimes it takes re-imagining your content. Does this really need to be a table? What is most important to the end users?
In this case, we grouped the content differently. Each industry became a heading, with the employers representing that industry listed below. Rather than list the websites separately, we just hyperlinked the names of the employer to the website. Finally, we moved these groupings of content into columns to maximize the space available on desktops.
This resulted in a cleaner interface that works on mobile as well as desktops, and conveys all the same information.
Comments
Post a Comment