Using Responsive Elements to Improve Reading on Phones and Computers
Introduction
A professionally written document can be comfortable to read on a phone and still leave important information difficult to recognize. In this demonstration, we revisit four passages from a fictional Northline Research & Advisory report. Each original passage was already readable in a responsive publication. We then selected a different presentation where it could help readers see the findings, relationships, or structure more clearly.
The wording and findings are retained in the comparisons. The difference is how the information is presented. Try narrowing your browser window on a computer or rotating your phone to see how the revised elements adapt to available space.
Make important findings easier to recognize
The original survey findings were reported together in a conventional paragraph. The information was accurate and readable, but the four percentages were easy to pass over.
Before—narrative text
--
Principal feedback from the survey indicates that 73% of respondents frequently ask colleagues for information, 64% struggle to locate guidance, 59% question whether guidance is current, and 52% find guidance difficult to apply.
--
After—Key Metrics
Bringing the four findings together makes their relative importance easier to recognize. The figures have not changed; their presentation gives readers a quicker view of the results on both narrow and wide screens.
Make relationships between ideas clearer
The original report explained two complementary requirements in separate paragraphs. Both were clear, but the relationship between them depended on the reader connecting the ideas.
Before—narrative text
--
Finding information requires clear topics, consistent terminology, logical navigation, and effective search to help employees reach relevant material.
Knowing it is the right information requires visible ownership, review dates, version information, and scope to help employees decide whether to rely on it.
--
After—Narrative + Narrative
Clear topics, consistent terminology, logical navigation, and effective search help employees reach relevant material.
Visible ownership, review dates, version information, and scope help employees decide whether to rely on it.
Placing the requirements together makes the distinction immediately visible: finding guidance is not the same as knowing whether to trust it. When space permits, the two ideas appear side by side; on narrower screens, they stack while retaining their headings and relationship.
Make complex information easier to scan
The original report presented five reported barriers in a single paragraph. A reader could extract the results, but comparing the categories and percentages required more effort.
Before—narrative text
--
Employees reported several difficulties in finding and using internal guidance. The most common was locating relevant information, a problem identified by 159 respondents, representing 64% of those surveyed. Uncertainty about whether guidance was current followed closely, affecting 146 respondents, or 59%.
Applying general guidance to specific situations was another significant challenge, reported by 129 respondents (52%). Questions about who owned or authorized the information were raised by 104 respondents (42%), while 89 respondents (36%) reported difficulty finding someone who could provide clarification.
--
After—Table
| Difficulty | Respondents | Share |
|---|---|---|
| Locating relevant guidance | 159 | 64% |
| Knowing whether it is current | 146 | 59% |
| Applying general guidance | 129 | 52% |
| Identifying ownership or authority | 104 | 42% |
| Finding someone to clarify it | 89 | 36% |
The table aligns each barrier with its respondent count and share. Readers can locate a particular result or compare the five responses without repeatedly parsing the sentence. On smaller screens, the table retains its columns rather than squeezing them into unreadable text.
Make a process easier to understand
The original recommendation expressed three related actions in running prose. Presenting them as distinct stages makes the framework easier to recognize and remember.
Before—narrative text
--
Improving internal guidance requires attention to several related challenges. Employees need recognizable headings, consistent terminology, and navigation that helps them locate relevant information. Once they find a document, they need to establish whether they can rely on it. Clear ownership, review dates, version information, and statements of scope help them make that judgment.
Guidance must also help employees determine what action to take. That means explaining applicable requirements, available choices, relevant exceptions, and circumstances that call for escalation or specialist advice. Together, these considerations help employees move from locating information to using it confidently.
--
After—Cards
Use recognizable headings, navigation, and terminology
Show the owner, review date, version, and scope
Explain requirements, choices, exceptions, and escalation
Find, Verify, and Apply now read as three parts of a connected process. The stages can sit alongside one another when space allows and stack when it does not. Their sequence and meaning remain clear in either arrangement.
The editorial choice comes first
None of these changes required shortening the report or simplifying its findings. Each Responsive Element was selected for a particular communication purpose: to reveal important numbers, clarify a relationship, organize comparable information, or show a process.
These choices can improve the experience on a desktop as well as on a phone. Cross-Screen Creator preserves the author’s intended presentation and adapts it to the available screen width. The author decides which information deserves a different treatment; the software handles the responsive layout.
Explore Cross-Screen Creator at interopsystems.com.