WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: Jumbotrons

for

Number of posts in this thread: 3 (In chronological order)

From: Walker, Michael E
Date: Thu, Mar 29 2018 10:26AM
Subject: Jumbotrons
No previous message | Next message →

Hi,

Where can I find guidance on making jumbotrons accessible? Suppose that my app is built using Angular Material. When I Google, I find that the concept of a jumbotron comes from Bootstrap, and that the term "jumbotron" is Bootstrap terminology. How does this concept translate to native HTML, CSS, and JavaScript, or other frameworks based on these?

Thank you,
Mike

From: glen walker
Date: Thu, Mar 29 2018 11:36AM
Subject: Re: Jumbotrons
← Previous message | Next message →

I'm not familiar with that term other than large display screens at
sporting events or concerts. When I googled the boostrap version, it looks
like a simple container with a background color. I don't see it as
anything more special than anything else when it comes to accessibility.
Whatever html is in the container should have proper semantics. You might
want to use a landscape role on it.


On Thu, Mar 29, 2018 at 10:26 AM, Walker, Michael E <
= EMAIL ADDRESS REMOVED = > wrote:

> Hi,
>
> Where can I find guidance on making jumbotrons accessible? Suppose that my
> app is built using Angular Material. When I Google, I find that the concept
> of a jumbotron comes from Bootstrap, and that the term "jumbotron" is
> Bootstrap terminology. How does this concept translate to native HTML, CSS,
> and JavaScript, or other frameworks based on these?
>
> Thank you,
> Mike
> > > > >

From: Mallory
Date: Thu, Mar 29 2018 2:50PM
Subject: Re: Jumbotrons
← Previous message | No next message

So far as I know, "Jumbotron" is just Bootstrap's name for "hero image" which is a designy trendy hip design term for a large background image (sometimes full-screen with a scroll-jack button thing) and text laid on top (usually the h1).

The biggest a11y issues with them is that the text might actually need to be readable by humans, but often contrast with that background image fails.
I've recently ranted on them because they're almost guaranteed to piss me off. Don't do what these people did. Note I'm zoomed in, so sometimes what seems like it might be okay becomes a mess at different zoom levels so test that out.
https://twitter.com/stommepoes/status/960160475668537344

_mallory
On Thu, Mar 29, 2018, at 6:26 PM, Walker, Michael E wrote:
> Hi,
>
> Where can I find guidance on making jumbotrons accessible? Suppose that
> my app is built using Angular Material. When I Google, I find that the
> concept of a jumbotron comes from Bootstrap, and that the term
> "jumbotron" is Bootstrap terminology. How does this concept translate to
> native HTML, CSS, and JavaScript, or other frameworks based on these?
>
> Thank you,
> Mike
> > > >