Premium DOM Component
Pique their interestby Read Write Tools
The Piqueme DOM component is a just-in-time continuous feed of articles featuring collapsable/expandable UI cards.
Visitors appreciate the compact beauty of UI cards. They provide so much more than a simple hyperlink.
UI cards typically have some combination of these elements: image, headline and/or lede paragraph. UI cards give visitors the gist of hyperlinked articles without the effort — for visitors, there's no forward navigation to check out a new page; and there's no back navigation to continue where they left off.
UI cards keep visitors on the same page, and keep them reading your content.
The rwt-piqueme goes two steps further than the classic UI card: 1) it allows the visitor to read the entire article without ever leaving the original document, and 2) it saves network bandwidth by fetching articles only when needed.
The rwt-piqueme component has these features:
- Articles are initially displayed in UI card format with splash image, caption, kicker, headline, subhead, byline, dateline and lede.
- Visitors can choose to read the full article in situ, that is, without ever leaving the host page.
- UI cards can be toggled between collapsed and expanded states, to show just the UI card, or the full article.
- Articles are fetched just-in-time, when the visitor scrolls down to that part of the document.
- A document that contains a large set of potential UI cards will only fetch what's needed, and only when it's needed.
- Each component instance handles a single on-demand article.
In the wild
To see examples of this component in use, visit any of these sites, and be sure to look under-the-hood at the source code to see how easy it is to use the component.
|grok.readwritetools.com||READ WRITE GROK|
|Documentation||READ WRITE HUB|
|Component catalog||DOM COMPONENTS|
|Publication venue||READ WRITE STACK|