Inventory lists don't need to use the labels "Title" or "Note"

[johnjung]

Inventory lists don't need to use the labels "Title" or "Note"

[johnjung]

Right now, we're outputting this part of the inventory as a dl in HTML, which I think is the most appropriate way to mark this up from the perspective of screen readers, etc. It's not allowable to "skip" dt elements, but I could give the dt elements a class that can be hidden visually in CSS. Then, they'd work for screen readers, but sighted users wouldn't have to see labels like "Title" or "Note".

Does this sound ok? If I do it this way, Kathy may want to style dl elements so that the dt and dd children line up on the left- otherwise titles and notes will look a little weird if they're indented with nothing above them.

More about the dl element here.

[MomoMoses]

Sounds like a great solution!

…

On Thu, Oct 14, 2021, 3:16 PM John Jung ***@***.***> wrote: Right now, we're outputting this part of the inventory as a dl in HTML, which I think is the most appropriate way to mark this up from the perspective of screen readers, etc. It's not allowable to "skip" dt elements, but I could give the dt elements a class that can be hidden visually in CSS. Then, they'd work for screen readers, but sighted users wouldn't have to see labels like "Title" or "Note". Does this sound ok? If I do it this way, Kathy may want to style dl elements so that the dt and dd children line up on the left- otherwise titles and notes will look a little weird if they're indented with nothing above them. More about the dl element here <https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dl>. — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#46 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AA263WVB52GQJFTSU2PQFS3UG43ATANCNFSM5FY6AVDQ> . Triage notifications on the go with GitHub Mobile for iOS <https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675> or Android <https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub>.

[johnjung]

Also see #32.

[johnjung]

bmrcportal-test is now outputting extra HTML classes so we can identify things like this in CSS. I'm going to tag this as "design" so we can hide these labels in CSS.

[johnjung]

In a comment from another issue, @MomoMoses writes:

Rereading this I see that there may have been a misunderstanding. I don't think the labels need to appear in the table-row displays at all. With our without containers.

We should be able to hide those labels using CSS. I tagged this as "design" so Kathy can provide feedback and, if she thinks CSS is an appropriate place to do that too, to organize this in the CSS in whatever way makes the most sense.

[kzadrozny]

For ADA purposes you want to keep the dl elements readable by a screen reader and not use a display: none solution. Recommend you apply the "visually hidden" formula to these elements:

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
}

[MomoMoses]

https://uchicago.app.box.com/file/807084219878?s=86ze2stummldz0bma0ek278dl9k7nphr

We can use this method to hide <publisher> and child element data in the EAD that's included at the top of the finding aid so that we rely on the LH sidebar and name of the Archives in the Overview for informing the user about where the collection is held.

[johnjung]

Thanks very much, Kathy and Laurie.

In #49, we started displaying the labels in the descriptive summary at the top of each finding aid next to their values. Is that appropriate here too? (If so, it solves the indentation problem I mentioned above.)

(Please note that changes here may impact #35.)

[MomoMoses]

My thought was to drop the labels here in the container/inventory lists altogether. It's pretty obvious that there are "Dates" and if there's a line describing contents, we don't need to see "Title".

[johnjung]

It's easy enough to remove all of the labels from that part of the inventory- but it seems to me that they're useful in cases where each <did> has more child elements, or where the child elements might not be as easy to tell apart. Here is an example, where lots of those elements contain a size, title and note:

https://bmrcportal-test.lib.uchicago.edu/view/?id=BMRC.DEFENDER.INDIVIDUALS.xml

What do you think?

[MomoMoses]

This is quite an outlier, so hard to know if it's necessary to have labels. This does have "Size" but let's see how it will display without the labels. I still contend that entries such as: "35 items" or "Category: Sports" or "photo + press info" are easily understood without the signpost. Further thoughts??

I'd like to try ditching the labels, and then re-visit if user research warrants.

[johnjung]

This is now implemented in 214054f and live on the site. Please take a look and let me know what you think, if it looks good we can close this issue out.

[MomoMoses]

Looks great. Very clean.😃🥳