[Athen] Org Chart

[Jeanne Wielgus via athen-list]

Thanks for that feedback about the DOT example. Good to know.

I am trying to get our organization to move to a list view, but
acknowledging that indirect (dotted line) reports are harder to represent
(maybe just making a note in parenthesis that that someone is an indirect
report - thoughts on this?)

~jeanne


On Thu, Jun 27, 2024 at 10:59 AM Stager, Catherine <
Catherine.Stager at frontrange.edu> wrote:


> It is a very interesting approach – unfortunately the move to next heading

> (H) only works if you are using a screen reader so the alt text is a bit

> misleading. With read aloud you do get the alt text but you do not get the

> functionality.

>

>

>

> *From:* athen-list <athen-list-bounces at mailman12.u.washington.edu> *On

> Behalf Of *Jeanne Wielgus via athen-list

> *Sent:* Wednesday, June 26, 2024 5:28 PM

> *To:* Joshua Hori <jhori at ucdavis.edu>; Access Technology Higher Education

> Network <athen-list at u.washington.edu>

> *Subject:* Re: [Athen] Org Chart

>

>

>

> *EXTERNAL MAIL: athen-list-bounces at mailman12.u.washington.edu

> <athen-list-bounces at mailman12.u.washington.edu>:* Do not click links or

> open attachments unless you recognize the sender and know the content is

> safe. Please contact your college IT Help Desk if you have any questions

>

> The Colorado Department of Transportation approached this in an

> interesting way (see attached PDF). The Alt text for each box is: "The

> following org chart uses heading levels to indicate who supervises whom.

> Each supervisor is indicated as a heading level. Their direct reports are

> represented as a list. Press H to move to the next supervisor or shift plus

> H to move to the previous."

>

>

>

> ~jeanne

>

>

>

>

>

> On Wed, Jun 26, 2024 at 3:22 PM Joshua Hori via athen-list <

> athen-list at u.washington.edu> wrote:

>

> An interesting challenge. If it helps, there are 2 alternative ways to

> view org charts. Lists and Tables.

>

>

>

> There’s a few jQuery plug-ins that can simplify the process which I found

> online, but I have issues navigating some org charts once it starts getting

> into the third and fourth levels. It starts using column labels but doesn’t

> allow for scope to be applied to the list columns.

>

>

>

> An alternative would be to make a table and hide the table with CSS. You

> can group columns, scope the columns so they makes sense to screenreaders,

> and then apply CSS to make it a visual org chart.

>

>

>

> President (h1, group all columns, scope the columns)

>

> VP Sales (h2, group 2 columns, scope the columns)

>

> VP IT (h2, group 2 columns, scope the column)

>

> VP Security & Privacy (h2, group 2 columns, scope the column)

>

> Clients (h3, scope column)

>

> Support (h3, scope column)

>

> Desktop (h3, scope column)

>

> Web (h3, scope column)

>

> Security (h3, scope column)

>

> Privacy (h3, scope column)

>

> Staff 1

>

> Staff 3

>

> Staff 5

>

> Staff 7

>

> Staff 9

>

> Staff 11

>

> Staff 2

>

> Staff 4

>

> Staff 6

>

> Staff 8

>

> Staff 10

>

> Staff 12

>

>

>

> It’s the one time using a table for layout makes sense. I see more work in

> converting list formats into org charts, but I don’t see how you can make

> that accessible once it gets down to that “Staff” area unless in table

> format. There’s absolutely no way to perform that with lists without

> separating them and making the content messy. Or maybe you could create the

> messy lists and combine/organize it with CSS and classes.

>

>

>

> I have nothing to provide towards the CSS, my apologies.

>

>

>

> Best,

>

>

>

> Joshua Hori

>

> Accessible Technology Coordinator

>

> Information Educational Technology

>

> Academic Technology Services

>

> 50 Hutchison Dr.

>

> Davis, CA 95616

>

> 530-752-2439

>

> Schedule a meeting via Calendly <https://calendly.com/d/ytt-hsj-vbn>

>

>

>

>

>

> *From: *athen-list <athen-list-bounces at mailman12.u.washington.edu> on

> behalf of Emily Singer Lucio via athen-list <athen-list at u.washington.edu>

> *Date: *Wednesday, June 26, 2024 at 12:16 PM

> *To: *Access Technology Higher Education Network <

> athen-list at u.washington.edu>

> *Subject: *[Athen] Org Chart

>

> Any suggestions for making an Org chart accessible so that it can be put

> on a website?

>

>

>

> Thanks

>

>

> Respectfully,

>

>

>

> *Emily Singer Lucio She/Her/Hers*

>

> ADA/504 Coordinator

>

> University of Maryland, College Park

>

> Office of Diversity & Inclusion

>

> 0112 Lee Building

>

> 7809 Regents Drive

>

> College Park MD 20742

>

> Tel:301 405-2841 | Fax:301 314-9992

>

> Email: eslucio at umd.edu

>

> Website: accessibility.umd.edu

>

> Subscribe to the ADA Newsletter

> <https://mailchi.mp/97648624d43b/q07mkrxp6p>

>

> To schedule a training:  You can fill out our training form

> <https://diversity.umd.edu/training-education/training-consultation>

>

>

>

> “Just because a man lacks the use of his eyes doesn’t mean he lacks

> vision.” — Stevie Wonder

>

> Source: WeCapable

>

> _______________________________________________

> athen-list mailing list

> athen-list at mailman12.u.washington.edu

> http://mailman12.u.washington.edu/mailman/listinfo/athen-list

>

>

-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://mailman12.u.washington.edu/pipermail/athen-list/attachments/20240627/24727285/attachment.html>