When you’re creating content for the company website, laying out a physical document or developing a portal for collaborating with partners or clients, it’s easy to let competing communication goals get the better of effective interface design. Is it more important to be functional or stylish? Why does the site look bad in different browsers?
Effective interface design starts with understanding what’s most important on your page and then conveying that hierarchy clearly to your audience. To do this, interface design often uses a markup language, such as HTML or XHTML, to describe the role of each piece of content. With that foundation, it’s relatively easy to apply style rules (such as a “cascading style sheet,” or CSS) in order to emphasize key points and make the content visually coherent, even when you move to different browsers or screen sizes.
The good news is that taking the time for effective interface design has lots of benefits in terms of readability, organization and — for public webpages — search-engine ranking. To get you started, here are five interface design tips for everyone, especially non-designers.
- Describe and organize your content with markup: One challenge in writing content is distinguishing between the structure of the information and its style or visual appearance. In Microsoft Word, for example, it’s easy to apply different font sizes and formatting to your text for visual effect. But that formatting is purely stylistic; it doesn’t convey the content hierarchy like HTML would. If you were to use the Headings styles in Word, however, you’re formatting the text both visually and structurally: Heading 1 describes the overall page; Heading 2 indicates a section; Heading 3 indicates a subsection; and so on.While these Headings styles aren’t quite useful as HTML tags, they add an extra layer of structural description that makes your content more reader-friendly. The structure helps lead the user’s eye and gives them a sense of how different elements are interrelated.
- Use emphasis sparingly: Headings, bullet points and other special formatting are great ways to emphasize and contextualize your content — as long as you don’t overuse them. Think about your user as starting with 100 percent of their concentration to give, and that concentration gets divided every time you emphasize another element on the page. Certain types of text formatting demand attention, and by using them sparingly, you’re able to contextualize your information and emphasize main points. When you overuse these types of formatting, you end up emphasizing everything, impeding rather than improve comprehension.
- Plan your image strategy: Often, people think of stock images as a way to “jazz up” the page, or as a decoration instead of an element in your interface design. The problem is that when generic stock photography shows up repeatedly, it acts like white noise. To avoid this problem, it’s helpful to recognize the value of imagery as communication, and take a more intentional approach to selecting images that contribute to your larger design. If you spend some time up front defining your communication strategy, it’s easier to find appropriate, distinctive photography that matches your content and corporate culture.
- Use white space to communicate: White space is often a misunderstood principle in design by non-designers. When the non-designer is in critique mode, they’re forced to think about design in a way they never would as a user, and they see white space as part of a canvas to fill as opposed to something that intentionally frames and shapes the design. White space is very much a part of the design, and helps give context and shape to your content.
- Think “big picture”: Non-designers may find it helpful to familiarize themselves with the Gestalt principles of design. These help you lead the user’s eye and clarify the relationships within your content, using principles of simplicity, closure, symmetry, order, figure and ground.
By applying these tips, you’ll immediately improve the usability and effectiveness of your communications, and start creating content that’s both stylish and functional.
Learn more about how to improve the user experience by contacting Withum.
