H1 Convention for Multi-Screen Sims

[arouinfar]

Single-screen sims have a single H1, which is the sim name. Each screen of a multi-screen sim (including home screen) has its own H1. Initially, we had simply tacked on the screen name to the H1, so it followed the pattern "{{Sim Name}}, {{Screen Name}}". For example:

H1: Coulomb's Law, Macro Scale Screen

When reviewing Coulomb's Law, @terracoda suggested flipping the order to "{{Screen Name}}, {{Sim Name}}", as it forefronts the new information.

H1: Macro Scale Screen, Coulomb's Law

I really like this suggestion for the actual sim screens, but the Home Screen may need to remain "{{Sim Name}}, {{Home Screen}}" since this is the first place students would encounter the sim name.

Any thoughts @terracoda @emily-phet @amanda-phet?

[terracoda]

@arouinfar, this issue is related to #94, and #104, as well.

[terracoda]

I worked on the HomeScreen.md file. It would be great to get designer feedback for how we handle the H1 content for each sim screen, and eventually the intro paragraph (adding) for each screen.

[terracoda]

If you look carefully in the code example for Build an Atom in the HomeScreen.md, you'll see two examples for the intro paragraph.

• One for the Atom Screen, and
• One for the Symbol Screen.

If that is too much information to process, we can just focus on how to populate each screen's H1 for now.

[terracoda]

@arouinfar, @emily-phet, @amanda-phet, I have updated the HomeScreen.md file.

I added two examples using the same pattern, so you can ignore https://github.com/phetsims/a11y-research/issues/112#issuecomment-398507914

I think it is better just to see if this one pattern works, and if not, we can iterate. The {{double curly braces}} surround the potential string parameters that would be sim specific.

[terracoda]

@arouinfar, note that I intentionally left off "Home Screen" from the actual Home Screen. I think the function of being a home screen is kind of obvious. On a typical website, you just get the website's name, you don't generally get "Website name, Home Page".

I think users will tell us if they need "Home Screen".

[terracoda]

I am un-assigning myself for now. Please re-assign if you have questions.

[amanda-phet]

I looked at the md file and think the structure you identified for h1s makes sense to me!

[arouinfar]

@terracoda thanks for all of your work on this! The examples in HomeScreen.md are very clear to me, and I think the h1 structure looks great. I'll update the a11y docs I'm working on.

[terracoda]

There is a visual example of Ratio and Proportion's final description design in issue #104