From 2d4466eaa4e574195dfdf1085564d9b82ea99f6c Mon Sep 17 00:00:00 2001 From: Jordan Wood <104526584+thejordanwood@users.noreply.github.com> Date: Mon, 9 Sep 2024 16:15:17 -0500 Subject: [PATCH 1/4] Update and rename ux-designer.md to designer.md @dmundra I'd like to remove all of the accordions and add this content onto the page. I'm not seeing where the accordions are controlled though? --- _roles/designer.md | 87 +++++++++++++++++++++++++++++++++++++++++++ _roles/ux-designer.md | 19 ---------- 2 files changed, 87 insertions(+), 19 deletions(-) create mode 100644 _roles/designer.md delete mode 100644 _roles/ux-designer.md diff --git a/_roles/designer.md b/_roles/designer.md new file mode 100644 index 00000000..7337129d --- /dev/null +++ b/_roles/designer.md @@ -0,0 +1,87 @@ +--- +layout: role +title: Designer +description: Learn the accessibility roles of designers in product development, including UX design, visual design, and user research. +excerpt: +sidenav: docs +categories: + - Design +hero: + image: + callout: + alt: + text: "Designer" + link: + text: Link to more about that priority + href: /link/ + content: Accessibility resources for designers. +--- + +The practice of design has an important role to play in moving accessibility thinking earlier in the product development process (“shifting left”). Design encompasses a wide variety of tasks and skills. Depending on their area of expertise, a designer could plan and write content, conduct research, or create visual mockups. These types of duties are usually broken down into three main categories. + +## User Experience (UX) Designer + +A UX designer focuses on how to best communicate information to users of their product. They improve accessibility by making content easy to understand. UX designers logically organize page content using headings and write in plain language to reduce cognitive load. + +Duties for this role include defining information architecture, creating journey maps, planning content strategy, or writing content. + +### Other titles for this role + +* Content Designer +* Content Strategist +* Information Architect +* Service Designer +* UX Writer + +### Accessibility resources for UX designers + +* [Accessibility for Everyone](https://abookapart.com/products/accessibility-for-everyone) +* [Agile Accessibility Explained](https://www.amazon.com/Agile-Accessibility-Explained-sustainable-development/dp/1689182733/ref=sr_1_2?dchild=1&keywords=Agile+Accessibility+Explained&qid=1615337578&sr=8-2) +* [Digital.gov Accessibility for UX Designers](https://digital.gov/guides/accessibility-for-teams/ux-design/#content-start) +* [Digital.gov Accessibility for Content Designers](https://digital.gov/guides/accessibility-for-teams/content-design/#content-start) + +## User Researcher + +User researchers study user needs and behaviors. They can gather feedback from all users, including those that have disabilities and use assistive technology. This feedback can help guide decisions on how to make a product more accessible. + +Duties for this role include conducting user interviews, testing designs for usability, and analyzing data collected from users. + +### Other titles for this role + +* Experience Researcher +* Human-Centered Researcher +* Product Researcher + +### Accessibility resources for user researchers + +* [Nielsen Norman Group's How to Conduct Usability Studies for Accessibility](https://www.nngroup.com/reports/how-to-conduct-usability-studies-accessibility/) +* [UK Department of Work and Pensions’ User Research Accessibility Manual](https://accessibility-manual.dwp.gov.uk/guidance-for-your-job-role/user-researcher) + +## Visual Designer + +Visual designers define how a product looks and feels. They create designs that are engaging and aesthetically distinct. To improve accessibility, they use colors that pass contrast requirements, consider visual layout and hierarchy, choose legible typefaces, and much more. + +Duties for this role include designing mockups and prototypes, creating user flows, and establishing style guides. + +### Other titles for this role + +* Graphic Designer +* Interaction Designer +* Product Designer +* UI Designer +* Web Designer + +### Accessibility resources for visual designers + +* [DigitalA11y’s Accessibility Tools and Resources for Designers](https://www.digitala11y.com/accessibility-tools-and-resources-for-designers/) +* [Digital.gov's Accessibility for Visual Designers](https://digital.gov/guides/accessibility-for-teams/visual-design/#content-start) +* [WAVE Browser Extensions](https://wave.webaim.org/extension/) + +## Next steps + +When you are ready to learn more, here are some further guides and resources that may help: + +* [Design Systems](https://accessibility.civicactions.com/guide/design) +* [Plain Language](https://accessibility.civicactions.com/guide/plain-language) +* [Trainings and Certifications](https://accessibility.civicactions.com/guide/training) + diff --git a/_roles/ux-designer.md b/_roles/ux-designer.md deleted file mode 100644 index 504138f5..00000000 --- a/_roles/ux-designer.md +++ /dev/null @@ -1,19 +0,0 @@ ---- -layout: role -title: UX designer -description: -excerpt: -sidenav: docs -categories: - - Design -hero: - image: - callout: - alt: - text: "UX designer" - link: - text: Link to more about that priority - href: /link/ - content: Accessibility resources for UX designers. ---- - From 6bb48dbe8c98b55547ad877945b7ceba33293d59 Mon Sep 17 00:00:00 2001 From: "pre-commit-ci[bot]" <66853113+pre-commit-ci[bot]@users.noreply.github.com> Date: Mon, 9 Sep 2024 21:16:37 +0000 Subject: [PATCH 2/4] [pre-commit.ci] auto fixes from pre-commit.com hooks for more information, see https://pre-commit.ci --- _roles/designer.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/_roles/designer.md b/_roles/designer.md index 7337129d..7f748b1e 100644 --- a/_roles/designer.md +++ b/_roles/designer.md @@ -17,7 +17,7 @@ hero: content: Accessibility resources for designers. --- -The practice of design has an important role to play in moving accessibility thinking earlier in the product development process (“shifting left”). Design encompasses a wide variety of tasks and skills. Depending on their area of expertise, a designer could plan and write content, conduct research, or create visual mockups. These types of duties are usually broken down into three main categories. +The practice of design has an important role to play in moving accessibility thinking earlier in the product development process ("shifting left"). Design encompasses a wide variety of tasks and skills. Depending on their area of expertise, a designer could plan and write content, conduct research, or create visual mockups. These types of duties are usually broken down into three main categories. ## User Experience (UX) Designer @@ -55,7 +55,7 @@ Duties for this role include conducting user interviews, testing designs for usa ### Accessibility resources for user researchers * [Nielsen Norman Group's How to Conduct Usability Studies for Accessibility](https://www.nngroup.com/reports/how-to-conduct-usability-studies-accessibility/) -* [UK Department of Work and Pensions’ User Research Accessibility Manual](https://accessibility-manual.dwp.gov.uk/guidance-for-your-job-role/user-researcher) +* [UK Department of Work and Pensions' User Research Accessibility Manual](https://accessibility-manual.dwp.gov.uk/guidance-for-your-job-role/user-researcher) ## Visual Designer @@ -73,7 +73,7 @@ Duties for this role include designing mockups and prototypes, creating user flo ### Accessibility resources for visual designers -* [DigitalA11y’s Accessibility Tools and Resources for Designers](https://www.digitala11y.com/accessibility-tools-and-resources-for-designers/) +* [DigitalA11y's Accessibility Tools and Resources for Designers](https://www.digitala11y.com/accessibility-tools-and-resources-for-designers/) * [Digital.gov's Accessibility for Visual Designers](https://digital.gov/guides/accessibility-for-teams/visual-design/#content-start) * [WAVE Browser Extensions](https://wave.webaim.org/extension/) From 72806116cb2aff20eb1619be40e1b963b481f9f4 Mon Sep 17 00:00:00 2001 From: Daniel Mundra Date: Mon, 9 Sep 2024 15:30:08 -0700 Subject: [PATCH 3/4] Added role default layout to match guide. Added roles sidebar to role pages. Updated designer page to use new layout and redirect the old page. Updated roles landing page. --- _data/roles.yml | 22 +++++++++++----------- _layouts/role-default.html | 30 ++++++++++++++++++++++++++++++ _layouts/role.html | 6 ++++++ _roles/designer.md | 13 +++---------- 4 files changed, 50 insertions(+), 21 deletions(-) create mode 100644 _layouts/role-default.html diff --git a/_data/roles.yml b/_data/roles.yml index c3a227ed..1e023a0c 100644 --- a/_data/roles.yml +++ b/_data/roles.yml @@ -3,40 +3,40 @@ docs: - title: Executive url: /executive - description: + description: icon: - title: Procurement url: /procurement - description: + description: icon: - title: Developer url: /developer - description: + description: icon: - title: Product manager url: /product-manager - description: + description: icon: - title: Project manager url: /project-manager - description: + description: icon: - title: Operations url: /operations - description: + description: icon: -- title: UX designer - url: /ux-designer - description: +- title: Designer + url: /designer + description: icon: - title: Content designer url: /content-designer - description: - icon: \ No newline at end of file + description: + icon: diff --git a/_layouts/role-default.html b/_layouts/role-default.html new file mode 100644 index 00000000..0e8f0321 --- /dev/null +++ b/_layouts/role-default.html @@ -0,0 +1,30 @@ +--- +layout: default +main: +class: +--- +{% include breadcrumbs.html %} + +
+
+
+
+ {% assign sidenav = site.data.navigation[page.sidenav] | default: page.sidenav %} + {% if sidenav %} +
+ {% include sidenav-roles.html links=sidenav %} +
+ {% endif %} +
+ {% if page.title %} +

{{ page.title }}

+ {% endif %} + + {% include anchor_headings.html html=content anchorBody="Anchor link" anchorClass="anchor-link" anchorAttrs="aria-labelledby=%html_id%" h_max=3 %} +
+
+
+
+
diff --git a/_layouts/role.html b/_layouts/role.html index ed41dcfe..3b69d222 100644 --- a/_layouts/role.html +++ b/_layouts/role.html @@ -18,6 +18,12 @@
+ {% assign sidenav = site.data.navigation[page.sidenav] | default: page.sidenav %} + {% if sidenav %} +
+ {% include sidenav-roles.html links=sidenav %} +
+ {% endif %}
diff --git a/_roles/designer.md b/_roles/designer.md index 7f748b1e..4477d6ee 100644 --- a/_roles/designer.md +++ b/_roles/designer.md @@ -1,20 +1,13 @@ --- -layout: role +layout: role-default title: Designer description: Learn the accessibility roles of designers in product development, including UX design, visual design, and user research. excerpt: sidenav: docs +redirect_from: + - /roles/ux-designer categories: - Design -hero: - image: - callout: - alt: - text: "Designer" - link: - text: Link to more about that priority - href: /link/ - content: Accessibility resources for designers. --- The practice of design has an important role to play in moving accessibility thinking earlier in the product development process ("shifting left"). Design encompasses a wide variety of tasks and skills. Depending on their area of expertise, a designer could plan and write content, conduct research, or create visual mockups. These types of duties are usually broken down into three main categories. From 54e2502325f1064cdf2b5bf066aa84593c3bfec4 Mon Sep 17 00:00:00 2001 From: Daniel Mundra Date: Tue, 10 Sep 2024 09:27:14 -0700 Subject: [PATCH 4/4] Deleted content-designer. --- _data/roles.yml | 5 ----- _roles/content-designer.md | 19 ------------------- _roles/designer.md | 1 + 3 files changed, 1 insertion(+), 24 deletions(-) delete mode 100644 _roles/content-designer.md diff --git a/_data/roles.yml b/_data/roles.yml index 1e023a0c..90621366 100644 --- a/_data/roles.yml +++ b/_data/roles.yml @@ -35,8 +35,3 @@ docs: url: /designer description: icon: - -- title: Content designer - url: /content-designer - description: - icon: diff --git a/_roles/content-designer.md b/_roles/content-designer.md deleted file mode 100644 index 196ba8da..00000000 --- a/_roles/content-designer.md +++ /dev/null @@ -1,19 +0,0 @@ ---- -layout: role -title: Content designer -description: -excerpt: -sidenav: docs -categories: - - Design -hero: - image: - callout: - alt: - text: "Content designer" - link: - text: Link to more about that priority - href: /link/ - content: Accessibility resources for content designers. ---- - diff --git a/_roles/designer.md b/_roles/designer.md index 4477d6ee..8aa20810 100644 --- a/_roles/designer.md +++ b/_roles/designer.md @@ -6,6 +6,7 @@ excerpt: sidenav: docs redirect_from: - /roles/ux-designer + - /roles/content-designer categories: - Design ---