Feedback on page: /guides/v2.2/javascript-dev-guide/widgets/jquery-widgets-about.html

Would it be possible to add imagery to this part of the docs to show how each widget looks? And if they're used on the frontend or just the backend?

Also would be nice to have a code sample on each.
<div class="filter-options" id="narrow-by-list" data-role="content" data-mage-init='{"accordion":{"openedState": "active", "collapsible": true, "active": false, "multipleCollapsible": false}}'>