Re: Open-UI popups

+1 Mateus, which, to close the loop, is why I suggested to Tzviya that
using a popup with actual linked @longdesc descriptions (files which could
be appended at the "end" of a digital collection) might address that
concern.

(That, or a mechanism riffing off of Dirk's example - there is a WordPress
plugin which also echoes that treatment. See:
https://www.joedolson.com/2014/03/update-wp-accessibility-longdesc/)

JF

On Wed, Jul 14, 2021 at 12:32 PM Teixeira, Mateus <mteixeira@wwnorton.com>
wrote:

> Thank you for sharing this, John. Great point about the layout. Maybe the
> shifting behavior is not a pattern that’s out of place on Web content,
> where we’ve become used to “reflow” (hence why I overlooked it), but it
> does run up against usability constraints in systems that use e-ink and in
> paginated UIs that are common in ebook readers.
>
>
>
> Mateus
>
>
>
>
>
> *From: *John Foliot <john@foliot.ca>
> *Date: *Wednesday, July 14, 2021 at 9:02 AM
> *To: *"Teixeira, Mateus" <mteixeira@wwnorton.com>
> *Cc: *John Foliot <john@foliot.ca>, "Siegman, Tzviya" <tsiegman@wiley.com>,
> W3C Publishing Business Group <public-publishingbg@w3.org>, "
> public-publishingcg@w3.org" <public-publishingcg@w3.org>
> *Subject: *Re: Open-UI popups
>
>
>
>
> *EXTERNAL EMAIL*
>
> Hi Mateus,
>
>
>
> Yep, that seems to be the 'common' solution today (using <details>), but
> with it comes the fact that content on the 'page' moves (expands/contracts
> to expose the extended description) which has what some may consider
> negative implications on the layout.
>
> Many years ago (when I was up to my neck fighting the @longdesc battle at
> HTML5), I had a colleague spin up a Proof of Concept demo that used jQuery
> and the longdesc attribute in a 'solution' that did not impact the layout
> of a page. See:
> http://blog.ginader.de/dev/jquery/longdesc/examples/webaim/index.php
> <https://nam12.safelinks.protection.outlook.com/?url=http%3A%2F%2Fblog.ginader.de%2Fdev%2Fjquery%2Flongdesc%2Fexamples%2Fwebaim%2Findex.php&data=04%7C01%7C%7C99d456372a7f4388432608d946e0d849%7C2916ea148f244be68a2d3afc0c7a4892%7C0%7C0%7C637618753789821173%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C1000&sdata=Mpei9luXOdG1SZHVOXqNCJVw4ESgwJfXj0zkzf2S3UM%3D&reserved=0>
>
>
>
> (There remain a few accessibility issues with this PoC, but the quick and
> dirty is to "click" on the "i in the circle" icon in the bottom right
> corner)
>
>
>
> FWIW.
>
>
>
> JF
>
>
>
> On Wed, Jul 14, 2021 at 11:43 AM Teixeira, Mateus <mteixeira@wwnorton.com>
> wrote:
>
> One of my engineering colleagues here at Norton (Evan Yamanishi) worked
> with DIAGRAM on this exact problem at the Web4All code sprint—their
> solution did use <details>, but it would be an interesting idea to iterate
> on: https://github.com/diagram-codesprint/ExtendedImageDescriptions
> <https://nam12.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2Fdiagram-codesprint%2FExtendedImageDescriptions&data=04%7C01%7C%7C99d456372a7f4388432608d946e0d849%7C2916ea148f244be68a2d3afc0c7a4892%7C0%7C0%7C637618753789831129%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C1000&sdata=dwi4ToE3NG8yCZYXTBwoIy2UUKQpE3IgyyZm%2FXRTHPc%3D&reserved=0>
>
>
>
> Evan maintains Norton’s open-source design system, which might be another
> useful source of examples (in that it’s made by a publisher with ebook use
> cases): https://wwnorton.github.io/design-system/
> <https://nam12.safelinks.protection.outlook.com/?url=https%3A%2F%2Fwwnorton.github.io%2Fdesign-system%2F&data=04%7C01%7C%7C99d456372a7f4388432608d946e0d849%7C2916ea148f244be68a2d3afc0c7a4892%7C0%7C0%7C637618753789831129%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C1000&sdata=DcAHZZJ%2FeJQSYLZLJlgErfsvndnhIT8o51w2ZdC3Nq4%3D&reserved=0>
>
>
>
> Will share this with him, as well.
>
>
>
> Thanks,
> Mateus
>
>
>
>
>
> *From: *John Foliot <john@foliot.ca>
> *Date: *Wednesday, July 14, 2021 at 8:20 AM
> *To: *"Siegman, Tzviya" <tsiegman@wiley.com>
> *Cc: *W3C Publishing Business Group <public-publishingbg@w3.org>, "
> public-publishingcg@w3.org" <public-publishingcg@w3.org>
> *Subject: *Re: Open-UI popups
> *Resent-From: *<public-publishingcg@w3.org>
> *Resent-Date: *Wednesday, July 14, 2021 at 8:20 AM
>
>
>
>
> *EXTERNAL EMAIL*
>
> Hi Tzviya,
>
>
>
> My initial reaction was "...for rendering extended image descriptions"?
> (aka "longdesc" et. al.) - click on a complex image and launch a popup with
> the longer text? Without any user-testing at this point, it *may*
> nonetheless be a better experience than what we currently see/have with
> <details>. (???)
>
> Just a thought.
>
>
>
> JF
>
>
>
> On Wed, Jul 14, 2021 at 10:46 AM Siegman, Tzviya <tsiegman@wiley.com>
> wrote:
>
> Hi All,
>
>
>
> Open UI is a bunch of implementors coming together to design some
> extensible components for the Web. Here is their work on popups [1], which
> in the greater web context often refers to things like popup ads. We should
> take a look and see if there is anything we can add or use.
>
>
>
> [1] https://open-ui.org/components/popup.research
> <https://nam12.safelinks.protection.outlook.com/?url=https%3A%2F%2Fopen-ui.org%2Fcomponents%2Fpopup.research&data=04%7C01%7C%7C99d456372a7f4388432608d946e0d849%7C2916ea148f244be68a2d3afc0c7a4892%7C0%7C0%7C637618753789841087%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C1000&sdata=hcrlk4Nv%2Fae9GNNCXNm7Pu6IYqtvCa1v1Ux8LnkByS0%3D&reserved=0>
>
>
>
> *Tzviya Siegman*
>
> Information Standards Principal
>
> Wiley
>
> 201-748-6884
>
> tsiegman@wiley.com
>
>
>
>
>
>
> --
>
> *John Foliot* | Senior Industry Specialist, Digital Accessibility
>
> "I made this so long because I did not have time to make it shorter." -
> Pascal "links go places, buttons do things"
>
>
>
>
> --
>
> *John Foliot* | Senior Industry Specialist, Digital Accessibility
>
> "I made this so long because I did not have time to make it shorter." -
> Pascal "links go places, buttons do things"
>


-- 
*John Foliot* | Senior Industry Specialist, Digital Accessibility

"I made this so long because I did not have time to make it shorter." -
Pascal "links go places, buttons do things"