Add and test sign language video in the container page

[seokho-son]

Describe your changes

This testing PR is to support #3044
Will see and discuss about the layout from the preview.

Related issue number or link (ex: resolves #issue-number)

• Tasks for adding Sign Language feature to the Glossary #3044

Checklist before opening this PR (put x in the checkboxes)

• This PR does not contain plagiarism
  • don’t copy other people’s work unless you are quoting and contributing it to them.
• I have signed off on all commits
  • signing off (ex: git commit -s) is to affirm that commits comply DCO. If you are working locally, you could add an alias to your gitconfig by running git config --global alias.ci "commit -s".

[netlify]

✅ Deploy Preview for cncfglossary ready!

Name	Link
🔨 Latest commit	ca40cbe
🔍 Latest deploy log	https://app.netlify.com/sites/cncfglossary/deploys/66e03aa5bf53e400084286fe
😎 Deploy Preview	https://deploy-preview-3194--cncfglossary.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[seokho-son]

Preview: https://deploy-preview-3194--cncfglossary.netlify.app/container/

[github-actions]

Wait, please do not proceed with this yet.

[github-actions]

To see where this is in the review pipeline and follow the progress, please look at the definition review board.

[seokho-son]

hold

• this PR is WIP. :)

[seokho-son]

Note: {{< youtube YOUTUBE-VIDEO-LINK-ID >}} is HUGO built-in feature. :)

[chalin]

I'd suggest using something like one of the following, instead of introducing new sections:

• A <summary> element
• A Bootstrap Accordion

Of course the latter is graphically nicer, but would require that this repo be using the latest Docsy (and possibly wait for an accordion shortcode to land -- a PR is ready, it just hasn't been accepted yet). <summary> is immediately accessible

For example:

Sign language

[video goes here]

Also, given that the video is prominent when shown, using either a summary element or an accordion hides the video until a reader wishes to consult it. That feels like a better overall page design and general UX to me.

WDYT @nate-double-u @seokho-son et al?

[nate-double-u]

## Further Reading may not be a necessary header, but I added it to separate the In sign language section from the content above.

I agree. If we're going to roll out a new template with ## Further Reading as a header, I feel like we should specify what it's for. Otherwise, it may become a bit of a junk drawer, which would undermine the effort we're making to highlight the sign language section.

Let us consider dropping "Further reading" in favour of @chalin's suggestion of a "Sign language" section (how ever we want to render that).

[CathPag]

I still have maintainer rights, so I went ahead and made the H2 updated 😜

[jtjackson]

LGTM 😄

[seokho-son]

Hello @chalin @nate-double-u,
Thank you for sharing your thoughts. The reason I did not use <summary> or another style in the initial proposal was that I hoped the sign language videos would become visible to people more quickly. (It was also the initial layout proposal from the glossary-sign-language and deaf-and-hard-of-hearing WG)
For now, I've uploaded a version that incorporates both of your feedback for testing on this page.
It would be great if we could all review it together and align our thoughts.

https://deploy-preview-3194--cncfglossary.netlify.app/container/

• Using <summary> to hide/open the video content:

  • Pros: Emphasizes the main content of the glossary.
  • Cons: Requires an additional click to access the sign language video. (It might not be immediately apparent on the page that the glossary has started supporting sign language)

• Providing it at the end under an H2 or H3 header:

  • Pros: The opposite of the above method.
  • Cons: The opposite of the above method.

I would also appreciate the opinions of others like @CathPag @jtjackson.

[chalin]

Thanks for showing both alternatives.

I'd be ok either way. What do the WG members have to say about it?

My suggestion would be to create a Hugo shortcode that accepts an YouTube video ID as argument, and then displays whichever solution is adopted here (summary or heading).

I get the impression that there is a preferences for a regular H2 heading at the end of the page. As I mentioned, that works for me. The advantage of using a shortcode is that if we change our mind later, it will be easy to adjust across the board.

WDYT?

Also see inline suggested adjustments.

[iamNoah1]

I prefer the second option. What do we need to proceed here? @seokho-son @nate-double-u @CathPag

[Deafveloper]

I prefer the second option. What do we need to proceed here? @seokho-son @nate-double-u @CathPag

I would like to be notified as well for the next steps.