From 42b74aab7e4bb4a58644b0c517dec52a38f8d091 Mon Sep 17 00:00:00 2001 From: camillemorrow Date: Thu, 2 Jan 2025 11:31:59 -0500 Subject: [PATCH 01/28] archive-hurricane_milton.md --- .../resources/hurricane-milton-guidance-for-us-government.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/content/resources/hurricane-milton-guidance-for-us-government.md b/content/resources/hurricane-milton-guidance-for-us-government.md index c7f17c86c6..f67ca95e8a 100644 --- a/content/resources/hurricane-milton-guidance-for-us-government.md +++ b/content/resources/hurricane-milton-guidance-for-us-government.md @@ -9,6 +9,8 @@ title: "Hurricane Milton guidance for U.S. government websites and social media" deck: "Addressing web and digital communications related to Hurricane Milton" summary: "Addressing web and digital communications related to Hurricane Milton" +expirydate: "2025-01-01" + aliases: - /hurricane-milton/ From a58c80ef55fca30754ba0364620cfdd9dab98cef Mon Sep 17 00:00:00 2001 From: camillemorrow Date: Thu, 2 Jan 2025 11:52:38 -0500 Subject: [PATCH 02/28] deleted hurricane milton alert.yml --- data/sitewide_alert.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/data/sitewide_alert.yml b/data/sitewide_alert.yml index d6fc6db542..cf41c82a29 100644 --- a/data/sitewide_alert.yml +++ b/data/sitewide_alert.yml @@ -20,4 +20,4 @@ data: header: "Hurricane guidance for U.S. government websites and social media" alerts: - "[digital.gov/hurricane-helene](/hurricane-helene)" - - "[digital.gov/hurricane-milton](/hurricane-milton)" + From 77384745f6429b1d3ad72c28860516694d0acf19 Mon Sep 17 00:00:00 2001 From: Naomi Baumgold <153678805+nbaumgold@users.noreply.github.com> Date: Thu, 2 Jan 2025 16:08:09 -0500 Subject: [PATCH 03/28] Add event script to Dec. monthly call page --- ...-12-19-uswds-monthly-call-december-2024.md | 167 ++++++++++++++++++ 1 file changed, 167 insertions(+) diff --git a/content/events/2024/12/2024-12-19-uswds-monthly-call-december-2024.md b/content/events/2024/12/2024-12-19-uswds-monthly-call-december-2024.md index ce3c6eb923..55c6e3347f 100644 --- a/content/events/2024/12/2024-12-19-uswds-monthly-call-december-2024.md +++ b/content/events/2024/12/2024-12-19-uswds-monthly-call-december-2024.md @@ -28,6 +28,173 @@ primary_image: 2024-uswds-monthly-call-dec-title-card {{< asset-static file="uswds-monthly-call-december-2024.pptx" label="View the slides (Powerpoint presentation, 2.5 MB, 39 slides)">}} +{{< accordion kicker="Slide by Slide" title="USWDS Monthly Call - Presentation Script for December 2024" icon="content_copy" >}} **Slide 1.** Thanks Kate, and welcome, everyone, to the U.S. Web Design System monthly call for December 2024. Today the USWDS logo is in a classic wreath form for the holiday season, with evergreen panels and a bright poinsettia-red segment like a bow. + +**Slide 2.** My name is Dan Williams, he/him, and I'm the USWDS project lead — and here on-screen is my avatar: dark hair, blue sweater, collared shirt, glasses —today I'm wearing a red checked collared shirt and a blue workshirt. And bright green socks, for luck. + +As Kate mentioned, we are recording this call, and I'm happy to say we're able to share the recordings of these monthly calls publicly. You can find pretty much everything back to January 2023 on our website, at [**designsystem.digital.gov/about/monthly-calls**](http://designsystem.digital.gov/about/monthly-calls). We typically post videos shortly after the monthly call and we also link out to the slides and the script, hosted at Digital.gov. We've posted a link to our monthly calls page in the chat. + +We'll be posting other links and references into the chat as we go along. And today we're continuing something we've been doing the last couple calls when it comes to chats and questions. Today, in your Zoom window you'll find a Q&A button in addition to a chat button, possibly under a "More" button. We'd like to encourage folks to ask questions in the Q&A section instead of the chat. Take a sec now to find the Q&A section and open it up. If any member of our team can answer your question in the Q&A section, we'll do so. Otherwise, there'll be some time for questions and answers at the end of the hour. But the chat's *still* nice too! Let's use the chat for introducing ourselves, or for any other comments or discussion. Be sure to introduce yourself in the chat — it's nice to know who's here. It's good to have you here today. + +For those of you who find the chat distracting, you’re welcome to close or hide those discussions during the main presentation. You can reopen them later during the Q&A session at the end of this call. + +And one final note that starting with this call, we're going to try to end a couple minutes before the top of the hour to give folks at least a moment before they move on to the next thing in their day. + +So thanks! And, with that, let's get started! + +**Slide 3.** So what's our agenda for today? + +Well, first we'll check out a handful of product updates. Then we'll hear from the Federal Website Standards team about the new website standards, followed by a discussion about the relationship between the standards and the design system which should also leave time for your questions at the end. + +**Slide 4.** Let’s kick it off with a number of product updates! + +**Slide 5.** First, USWDS 3.11.0, our December USWDS release, out now. + +**Slide 6.** This is a nice little release and it has a couple of notable updates and improvements. + +- First, **we added more consistent styling for table headers.** Now table headers will get consistent styling no matter where they appear in a table, not just in column headers. +- We also made a couple updates based on community contributions. **We fixed the display of focus outlines in the identifier.** Now, focus outlines don’t get clipped when they appear in some locations in the identifier's list of required links. +- And finally, **we added a more modern CSS reset**. We're left some of the older IE11-constrained reset techniques behind and moved to a slimmer reset. + +[And that's USWDS 3.11.0](https://www.google.com/url?q=https://github.com/uswds/uswds/releases/tag/v3.11.0&sa=D&source=docs&ust=1735663244394200&usg=AOvVaw3W0afwmnr0C9MqAS_utR2G). + +**Slide 7.** We've also released a good quality-of-life update to USWDS Compile, in USWDS Compile 1.2.1. + +In its next major release, Sass is changing how it handles mixed declaration style definitions to match new CSS patterns. Because of this, users are getting alarming warnings during compilation. + +The pattern is *not* currently deprecated, and we are on track to update the related USWDS code. But these current warnings are alarming and noisy — they can distract folks from the release-related notifications we hope devs *do* notice from release to release. + +So, in USWDS Compile 1.2.1 we're introducing a new setting, enabled by default, that silences these warnings that originate in the USWDS codebase. + +This approach will mute USWDS warnings, including any future warnings that come up, while allowing warnings from custom Sass to still be triggered in the terminal. + +This will allow Sass to notify users of impending deprecations in their custom code without the noise of hearing about what's happening in USWDS. And, of course, users can decide to manually turn on these deprecation warnings back on with a single setting if they would like additional context on the upcoming deprecations. + +And that's USWDS Compile 1.2.1: [out now!](https://github.com/uswds/uswds-compile/releases/tag/v1.2.1) + +**Slide 8.** December is a big month for accessibility test pages. We've got five new pages out now: + +- [Process list](https://designsystem.digital.gov/components/process-list/accessibility-tests/) +- [Summary box](https://designsystem.digital.gov/components/summary-box/accessibility-tests/) +- [Collection](https://designsystem.digital.gov/components/collection/accessibility-tests/) +- [Icon list](https://designsystem.digital.gov/components/icon-list/accessibility-tests/) +- …and [Button group](https://designsystem.digital.gov/components/button-group/accessibility-tests/) + +And that wraps 2024 for accessibility test pages! We've published 34 pages this year and just have 11 more prepped for publication in the coming months. This has been a great accomplishment for our accessibility team, and for the team effort with content and engineering to consistently publish these pages from month to month! + +Next in the queue are Date picker, Date range picker, Alert, and Site alert, coming in January. + +**Slide 9.** We've also released an updated version of the USWDS beta design kit for Figma. This new version tidies up the layers and directories in our components, better conforming to naming best practices and also making it a bit more straightforward to select layers. We've posted [a link to the USWDS design kit for Figma](https://www.figma.com/community/file/1440921849343185329/uswds-design-kit-beta) in the chat. + +**Slide 10.** There are three public discussions to highlight this month: + +- The first is an active discussion about [providing support for user preferences](https://github.com/uswds/uswds/discussions/5798). The original discussion topic raises a few user browser preferences: **prefers-color-scheme**, **prefers-contrast**, and **prefers-reduced-motion**. USWDS has done a lot of work over the last year in supporting high contrast and forced color mode, though this is through the mechanism of the **forced-colors** media query and not via **prefers-contrast**. We also prefer solutions with reduced motion, so we haven't spent much time investigating reduced motion solutions, but **prefers-color-scheme** is a media query–speak for supporting Dark Mode, and that's a place where we could use some more opinions. If you want to support dark mode, or have tried to implement support for a dark mode scheme inside of USWDS or not, we'd be interested in hearing from you in this discussion. +- Beyond dark mode, we'd also like to direct folks to this month's Accessibility discussion: on [**HTML titles and accessibility**](https://github.com/uswds/uswds/discussions/6243). Providing good HTML titles is also one of the new draft federal website standards, which we'll hear more about later in this call, so I think folks would benefit from more discussion about what's working when it comes to the accessibility and usability of titles. +- And finally, we've posted a public version of last month's monthly call Q&A in discussions as well. You can check that out via [the link in the chat](https://github.com/uswds/uswds/discussions/6252) if you missed last month's call. + +**Slide 11.** We're also moving ahead in the world of pattern and component proposals. + +- We're happy to announce that at long last, we've [decided to move ahead with the Tabs component proposal](https://github.com/uswds/uswds/discussions/5765#discussioncomment-11487203). We’ll publish the [approved formal proposal](https://github.com/uswds/uswds/discussions/5765#discussioncomment-11487203) once we’ve finalized it. *We’ll* be taking on experimental development for that component, and will use the Tabs component to work out engineering, accessibility, usability, and documentation *requirements* for experimental components. More to come on Tabs as we move into 2025 and toward the release of USWDS Elements and USWDS Core in the spring. +- We've also decided to move forward with a pattern proposal for **Helping users to know when their information is prefilled**. We'll be drafting a formal proposal for community comment shortly, including how exactly we should add this to the USWDS pattern library, working with the team from the VA who proposed it. +- And we're deciding *not* to proceed with a proposal for a Toast component. Our accessibility and usability review of this component revealed consistent accessibility issues with implementations of Toast that make this component less of a good match for USWDS applications. You can find our research and reasoning in the Toast [discussion](https://github.com/uswds/uswds/discussions/5770#discussioncomment-11419226) — we're posting that link in the chat. + +**Slide 12.** And our last product update is on our development work for USWDS Elements, the new Web Components flavor of the design system we'll start to roll out in the spring. + +We've taken some time over the last month to test out interoperability between our *Elements* (composed using a light layer of the Lit library) and both the other big Web Components library — StencilJS — and React 19. And while there may still be some need for a custom React wrapper in versions older than 19, we're happy to report that we're finding successful practical interop with both Stencil and React 19. More to come on this in the coming months, but delivering components that pass attributes and properties seamlessly between differing development frameworks — in addition to reliable event handling and predictable lifecycle methods — is one of our goals with USWDS Elements, so teams can use these components all kinds of existing tech stacks. + +And that's it for this month's product updates! + +**Slide 13.** As I'm sure many of the folks on this call are aware, there's been a bit of a change over the last few months when it comes to the website standards referenced in the 21st Century Integrated Digital Experience Act (or 21st Century IDEA). Starting in January 2020, the USWDS website held the canonical version of the website standards referenced in 21st Century IDEA. This first set of standards directed teams to use the USWDS maturity model to deliver a great digital experience. Starting in September, USWDS no longer maintains this standard, and, going forward, a new Federal Website Standards team is responsible for a new set of standards. + +So there have been a lot of changes in the world of federal website standards, and this month we wanted to talk with the Federal Website Standards team to hear about what's changed in the standards, and how that team is approaching the work of developing standards. + +We also wanted to leave some space for a discussion about how USWDS and the Federal Website Standards relate, how they're different, and how they work together. + +**Slide 14.** So to that end, let me introduce Renata Phillippi (she/her). Renata is the Acting Program Manager for the Federal Website Standards. Renata, take it away! + +**Slide 15.** Renata: Thank you, Dan, for the introduction. My name is Renata Phillippi. I am a White House Presidential Innovation Fellow who has been working on building website standards to help agencies provide high-quality, consistent digital experiences for anyone. I am a white woman with shoulder length dark blonde hair. I have on purple rimmed glasses and a navy blue shirt. + +**Slide 16.** Today we’ll go over why we need standards, the 90 day pilot we ran and the standards we launched with. + +**Slide 17.** Let’s start with the background. + +**Slide 18.** Per [analytics.usa.gov](https://analytics.usa.gov/), Federal government websites see 1.75 billion web sessions per month. + +**Slide 19.** Per a White House fact sheet on Building Digital Experiences for the American People these sessions represent over 80 million hours of interactions with the public. You can access the fact sheet through the link we posted in the chat. + +**Slide 20.** Per [analytics.usa.gov](https://analytics.usa.gov/), 57% of that traffic is from mobile devices. + +**Slide 21.** Per the same White House fact sheet, 60% of federal websites are not accessible to all people. + +**Slide 22.** And 45% of federal websites are not mobile friendly. + +**Slide 23.** And only 2% of federal forms have been digitized for the web. + +**Slide 24.** Back in 2018, 21st Century Integrated Digital Experience Act commonly known as 21st Century IDEA passed. It requires all agencies to modernize their public-facing websites and digital services, digitize services and forms, accelerate use of e-signatures, improve customer experience and standardize and transition to centralized shared services. + +**Slide 25.** It meant that digital services should be: + +- Accessible to people of diverse abilities +- Have consistent visual design and agency brand identity +- Content that is authoritative and easy to understand +- Information and services that are discoverable and optimized for search +- Secure by design, secure by default +- User-centered and data-driven design +- Customized and dynamic user experiences +- Mobile-first design that scales across a variety of device sizes + +Through our user research, we heard from agency practitioners that they were not sure exactly what this meant for them. When 21st Century IDEA was passed, digital teams government-wide worked to meet the spirit of the law and improve the public’s experience on government websites. + +**Slide 26.** Fast forward to 2023, agencies still needed more concrete guidance on how to implement the law. On the slide, we are showing 21st Century IDEA moving to the new policy guidance in the OMB memo M-23-22 (Delivering a Digital-First Public Experience). The memo contains over one hundred actions, including a small set of timed actions. The one we are talking about today is updating the website standards. M-23-22 says “GSA, in coordination with OMB and relevant interagency bodies and stakeholders, will review and update, as necessary, the existing Federal website standards to align with this guidance. These updates will include guidelines for branding, content, and search.” + +**Slide 27.** We worked with OMB to develop a pilot to learn about what we could do to standardize the digital experience. Let’s talk about that pilot. + +**Slide 28.** Our goal was to propose an initial set of evidence-based, auditable standards that will help agencies meet the public’s expectations for digital experiences. + +**Slide 29.** Stakeholders from OMB and TTS started with a list of 30 potential standards that came from user research and used the RICE framework to score them. RICE stands for reach, impact, confidence, and effort. Or said another way, how much reach and impact will this feature have, how confident are we that we can deliver, and how much effort will it take to do so. We got the list down to 8 that we started with. + +We reached out to the members of the CIO Council’s Digital Experience Council, which is a group of agency leaders who are all focused on improving the digital experience of their agency. + +We partnered with the VA, USAID, SSA, State, Air Force, CMS, DHS, and internal partner, Cloud.gov Pages. + +We did user research with the public and with agencies and desk research about industry best practices. We built prototypes, tested the content, got feedback and iterated. Then we launched with 3 new standards. + +**Slide 30.** Let’s talk about the standards. + +**Slide 31.** We defined standards as actions that will help agencies meet the public’s evolving expectations for digital experiences. The standards are evidence-based, auditable and lead to a consistent digital experience. + +**Slide 32.** We launched our website ([standards.digital.gov](http://standards.digital.gov)) with 3 pending standards that will be tracked for compliance at some point in the future. + +The government banner which has the line “this is a federal government website”, with the flag, and the "this is how you know" dropdown, which is an item we found the public looks for to know if they can trust the website. + +There are also pending standards for HTML page title and meta page description. + +**Slide 33.** Standards that are currently in draft status and will become pending standards after a period of review are the contact page, content timeliness indicator, and site search. + +**Slide 34.** And we have two that are currently in research and continuing to be explored. That’s the external link. (We’ve had questions about what an external link is? Does it link outside of the government or outside of your website but to another government page? Just a couple of questions we are exploring.) And then the language selector. + +You'll find on every standard page on our website we have listed the why, where it applies, the acceptance criteria, and how to implement the standard. + +**Slide 35.** If you have any questions or want to see more, you can go to our website (standards.digital.gov), check out our GitHub discussions (https://github.com/GSA-TTS/federal-website-standards/discussions) or email ([website.standards@gsa.gov](mailto:website.standards@gsa.gov)). We may also have office hours sometime in the future. + +**Slide 36.** Thank you. + +Dan: Thanks Renata. This is Dan. I do have some questions! Here, we're going to stop the recording and have some time for discussion. + +For that, Anne Petersen will be joining us. Anne? + +Anne: Thanks Dan. I’m Anne Petersen, the USWDS Experience Design Lead, and I’ll help route our questions today. My pronouns are they/them, and in case anyone’s not looking at their screen, I’m a white person with short brown hair, small glasses and large headphones. + +**Slide 37.** Dan: Now I'd like to open it up to questions from the audience for some public Q&A. + +**Slide 38.** Thanks for joining today’s USWDS monthly call. Next month we'll be giving a special presentation mostly focussed on introducing folks who are new to USWDS to the design system. We'll try to make it interesting and useful for everyone, but it'll be particularly useful for new folks! So if you know anyone interested in where to start with the design system, point them to January's monthly call. + +Please look out for an event feedback survey from Digital.gov. You'll get this in your email, and there's also a link in the chat. Your feedback makes a difference to us, so we appreciate the extra time it takes you to provide it. + +And if you have a question we weren't able to answer in the call, or thought of later, please head into our public Slack and ask it there. We'll be there after the call to answer questions. + +Have a great day. We'll see you in 2025! {{< /accordion >}} + This month, the U.S. Web Design System team hosts the Federal Website Standards team who will share more about the standards, their origin, the research backing them, and what standards are coming next. In this session, you’ll: From c0c50ceadac3d7dcf1ee0e5b60fd8f4f70623b0d Mon Sep 17 00:00:00 2001 From: Makayla Hipke Date: Fri, 3 Jan 2025 08:54:34 -0500 Subject: [PATCH 04/28] Build introduction to data viz resource --- .../an-introduction-to-data-visualization.md | 58 +++++++++++++++++++ 1 file changed, 58 insertions(+) create mode 100644 content/resources/an-introduction-to-data-visualization.md diff --git a/content/resources/an-introduction-to-data-visualization.md b/content/resources/an-introduction-to-data-visualization.md new file mode 100644 index 0000000000..d059c467ef --- /dev/null +++ b/content/resources/an-introduction-to-data-visualization.md @@ -0,0 +1,58 @@ +--- +date: 2025-01-03 +source: "" +title: An introduction to data visualization +deck: Understand how to tell a story using data and design +summary: Use data visualization to communicate insights, tell a story, and share actionable information. +# See all topics at https://digital.gov/topics + +topics: + - data-visualization + - design + - analytics + - multimedia + +# Controls how this page appears across the site +# 0 -- hidden +# 1 -- visible +# 2 -- highlighted +weight: 1 +--- +## What is data visualization? + +[Data visualization](https://digital.gov/topics/data-visualization/) is the visual and graphic representation of data through charts, graphs, maps, interactive dashboards, and other visual imagery. Data visualization can help [simplify large or complex datasets](https://datascience.cancer.gov/training/learn-data-science/visualize-data-basics) to encourage broader interest on an issue or topic. Common types of data visualization include pie charts, bar charts, maps, tables, and line charts. Dashboards or infographics may feature multiple data visualizations. + +## Why is data visualization important? + +Data visualization can facilitate shared understanding. Visualizing data supports the rapid interpretation of information; reveals patterns, trends, and relationships; and provides evidence-based insights to improve decision-making. + +There are no firm or set rules for how to create or design data visualizations, but there are recommendations and best practices that can help ensure a visualization communicates effectively. [Effective data visualizations](https://nces.ed.gov/forum/pub_2017016.asp) are: + +- **Appropriate** for the intended audience. +- **Accurate** in the presentation of data and its meaning. +- **Actionable**, because the information is clarifying or useful. + +## How can I create data visualizations? + +When you create a data visualization, your goal should be to transform data into actionable information. This process can take many forms, but making a visualization typically involves the following steps: + +1. **Establish and understand the research question.** A clear, focused [research question](https://guides.18f.gov/ux-guide/research/plan/#research-questions) will guide the scope of your analysis. You may need to break down your research question into multiple components, which may be more clear to address in more than one visualization. + +{{< note >}} + [The 18F User Experience Guide](https://guides.18f.gov/ux-guide/research/plan/#research-questions) provides examples of research questions. While centered on user research, you can use the definition and principles to guide your own brainstorming. +{{< /note >}} + +2. **Identify data sources.** Determine if you can get data that will address your question. You may need to use multiple data sources to validate and cross-check, to get a holistic view of the subject. +3. **Clean and explore your data.** Verify your data is complete, consistent, and standardized. To ensure consistency, establish clear data strategies and governance, use standardized procedures and data dictionaries, and invest in data quality tools. This will allow you to carry out a comprehensive analysis. +4. **Analyze the data and choose a visual.** The chart type you use should support your research goal and fit the type of data you are showing. For example, pie charts are useful to emphasize proportions between a few categories that are parts of a whole. [Bar charts](https://designsystem.digital.gov/components/data-visualizations/#bar-charts-2), meanwhile, are ideal for displaying data in categories and effective at showing comparisons across multiple categories. +5. **Check your visualization for bias.** Identify any limitations in the way the data was collected. Approaching visualization with [a lens of empathy and equity](https://www.nnlm.gov/training/class/do-no-harm-data-viz) can ensure visualizations are more well-justified, accurate, and impactful. +6. **Ensure that your data is accessible.** Carefully consider the [language, icons, colors, and category order](https://www.nnlm.gov/training/class/do-no-harm-data-viz) you use. Design your visualization with a focus on [accessibility](https://digital.gov/resources/an-introduction-to-accessibility/) from the start to ensure everyone can understand and navigate your data. +7. **Identify and customize your message or story based on your audience — and get feedback.** Help your audience understand your intent by including enough metadata (such as title, caption, and labels) for them to follow the information in your visualization. Use [plain language](https://digital.gov/resources/an-introduction-to-plain-language/) for clarity. You can also test your visualization: ask someone from your intended audience (preferably) or a colleague (if needed, or with early drafts) to review your visualization. Gathering feedback can help you understand if people will be able to grasp the story you are trying to tell. + +## What can I do next? + +Explore resources on [data visualization](https://digital.gov/topics/data-visualization/), [design](https://digital.gov/topics/design/), and [analytics](https://digital.gov/topics/analytics/) on Digital.gov. + +You can join the Digital.gov [Web Analytics and Optimization Community of Practice](https://digital.gov/communities/web-analytics-and-optimization/) to connect with government professionals and learn best practices, tips, and tools for web analytics, search, and search engine optimization. + +You can also join the Digital.gov [User Experience Community of Practice](https://digital.gov/communities/user-experience/) to connect with practitioners interested in producing efficient, effective, and useful user experiences and technologies. \ No newline at end of file From 6ed587141b72f76a5eff31e5839bbb84994d4285 Mon Sep 17 00:00:00 2001 From: Makayla Hipke Date: Fri, 3 Jan 2025 08:57:19 -0500 Subject: [PATCH 05/28] Add author to front matter --- content/resources/an-introduction-to-data-visualization.md | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/content/resources/an-introduction-to-data-visualization.md b/content/resources/an-introduction-to-data-visualization.md index d059c467ef..aecc0f8c56 100644 --- a/content/resources/an-introduction-to-data-visualization.md +++ b/content/resources/an-introduction-to-data-visualization.md @@ -6,6 +6,9 @@ deck: Understand how to tell a story using data and design summary: Use data visualization to communicate insights, tell a story, and share actionable information. # See all topics at https://digital.gov/topics +authors: + - katie-chan + topics: - data-visualization - design @@ -55,4 +58,4 @@ Explore resources on [data visualization](https://digital.gov/topics/data-visual You can join the Digital.gov [Web Analytics and Optimization Community of Practice](https://digital.gov/communities/web-analytics-and-optimization/) to connect with government professionals and learn best practices, tips, and tools for web analytics, search, and search engine optimization. -You can also join the Digital.gov [User Experience Community of Practice](https://digital.gov/communities/user-experience/) to connect with practitioners interested in producing efficient, effective, and useful user experiences and technologies. \ No newline at end of file +You can also join the Digital.gov [User Experience Community of Practice](https://digital.gov/communities/user-experience/) to connect with practitioners interested in producing efficient, effective, and useful user experiences and technologies. From a15125607de59a6b88433f41c1bf3d08a6705827 Mon Sep 17 00:00:00 2001 From: Ammie Date: Fri, 3 Jan 2025 08:58:22 -0500 Subject: [PATCH 06/28] Update to CPC to sentence case --- content/topics/challenges-and-prize-competitions/_index.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/topics/challenges-and-prize-competitions/_index.md b/content/topics/challenges-and-prize-competitions/_index.md index 04c900a675..cbb54e6d42 100644 --- a/content/topics/challenges-and-prize-competitions/_index.md +++ b/content/topics/challenges-and-prize-competitions/_index.md @@ -5,7 +5,7 @@ slug: "challenges-and-prize-competitions" # Topic Title -title: "Challenges & Prize Competitions" +title: "Challenges and prize competitions" # description — keep it short and clear deck: "Prize competitions can advance the missions of federal agencies." From 2eba8ceac7c89fc23dc4ac31d54afa76d7802b42 Mon Sep 17 00:00:00 2001 From: Ammie Date: Fri, 3 Jan 2025 09:03:20 -0500 Subject: [PATCH 07/28] Update CCS to sentence case --- content/topics/crowdsourcing-and-citizen-science/_index.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/topics/crowdsourcing-and-citizen-science/_index.md b/content/topics/crowdsourcing-and-citizen-science/_index.md index 43cac640eb..a9ff7dd843 100644 --- a/content/topics/crowdsourcing-and-citizen-science/_index.md +++ b/content/topics/crowdsourcing-and-citizen-science/_index.md @@ -5,7 +5,7 @@ slug: "crowdsourcing-and-citizen-science" # Topic Title -title: "Crowdsourcing and Citizen Science" +title: "Crowdsourcing and citizen science" # description — keep it short and clear deck: "Crowdsourcing and citizen science can accelerate discovery across the U.S. government." From 588c2a2b9b1150f125bf3236278cddd5e906a147 Mon Sep 17 00:00:00 2001 From: Makayla Hipke Date: Fri, 3 Jan 2025 09:08:04 -0500 Subject: [PATCH 08/28] Fix punctuation --- content/resources/an-introduction-to-data-visualization.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/content/resources/an-introduction-to-data-visualization.md b/content/resources/an-introduction-to-data-visualization.md index aecc0f8c56..026b1a5596 100644 --- a/content/resources/an-introduction-to-data-visualization.md +++ b/content/resources/an-introduction-to-data-visualization.md @@ -31,9 +31,9 @@ Data visualization can facilitate shared understanding. Visualizing data support There are no firm or set rules for how to create or design data visualizations, but there are recommendations and best practices that can help ensure a visualization communicates effectively. [Effective data visualizations](https://nces.ed.gov/forum/pub_2017016.asp) are: -- **Appropriate** for the intended audience. -- **Accurate** in the presentation of data and its meaning. -- **Actionable**, because the information is clarifying or useful. +- **Appropriate** for the intended audience +- **Accurate** in the presentation of data and its meaning +- **Actionable**, because the information is clarifying or useful ## How can I create data visualizations? From 076f6298d7759bba92af3e975f2c3ba426c62dfe Mon Sep 17 00:00:00 2001 From: Ammie Date: Fri, 3 Jan 2025 09:09:02 -0500 Subject: [PATCH 09/28] Update SEO to sentence case --- content/topics/search-engine-optimization/_index.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/content/topics/search-engine-optimization/_index.md b/content/topics/search-engine-optimization/_index.md index c7c07b9744..a0ef934818 100644 --- a/content/topics/search-engine-optimization/_index.md +++ b/content/topics/search-engine-optimization/_index.md @@ -5,7 +5,7 @@ slug: "search-engine-optimization" # Topic Title -title: "Search Engine Optimization" +title: "Search engine optimization" deck: "Search engine optimization (SEO) is the practice of enabling search engines to index and surface content." # description — keep it short and clear @@ -27,4 +27,4 @@ featured_communities: - "web-managers-forum" - "web-analytics-and-optimization" ---- \ No newline at end of file +--- From ca1aa3e23cc1829015dd46d240657ed7b707097a Mon Sep 17 00:00:00 2001 From: Ammie Date: Fri, 3 Jan 2025 09:14:38 -0500 Subject: [PATCH 10/28] Update ToS to sentence case --- content/topics/terms-of-service/_index.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/topics/terms-of-service/_index.md b/content/topics/terms-of-service/_index.md index bc8c192d44..b0387845ab 100644 --- a/content/topics/terms-of-service/_index.md +++ b/content/topics/terms-of-service/_index.md @@ -5,7 +5,7 @@ slug: "terms-of-service" # Topic Title -title: "Terms of Service" +title: "Terms of service" # description — keep it short and clear deck: "Agreements negotiated between the federal government and vendors who offer digital tools and services." From 0926361fdd9ceadeaffeef8309ccd7f86d5835a3 Mon Sep 17 00:00:00 2001 From: Ammie Date: Fri, 3 Jan 2025 09:16:00 -0500 Subject: [PATCH 11/28] Update CS to sentence case --- content/topics/content-strategy/_index.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/topics/content-strategy/_index.md b/content/topics/content-strategy/_index.md index d2448ad314..94f9cae6a8 100644 --- a/content/topics/content-strategy/_index.md +++ b/content/topics/content-strategy/_index.md @@ -5,7 +5,7 @@ slug: "content-strategy" # Topic Title -title: "Content Strategy" +title: "Content strategy" deck: "Make use of content strategy to deliver great digital experiences." summary: "Content strategy involves planning, creating, delivering, and governing content that meets the needs of its users and achieves an organization's goals. Content strategy is an essential element of effective digital web services and communication for government agencies." From 799b7a3539fc8097270abb646201c6737b24a3aa Mon Sep 17 00:00:00 2001 From: Ammie Date: Fri, 3 Jan 2025 09:17:24 -0500 Subject: [PATCH 12/28] Update PL to sentence case --- content/topics/plain-language/_index.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/topics/plain-language/_index.md b/content/topics/plain-language/_index.md index 7cdb4bd290..326e78f5f9 100644 --- a/content/topics/plain-language/_index.md +++ b/content/topics/plain-language/_index.md @@ -10,7 +10,7 @@ aliases: slug: "plain-language" # Topic Title -title: "Plain Language" +title: "Plain language" # description — keep it short and clear summary: "Plain language is communication that is clear and easy to understand for your target audience, regardless of the medium used to deliver it. It is communication your audience can understand the first time they encounter it. Using plain language on government websites is one of the best ways to reach your target audience. A clear, concise message builds trust with users because they can understand your call to action and complete their tasks and meet their needs." From fdb89c815b30ba07a35d6f57f38a5b11255348e4 Mon Sep 17 00:00:00 2001 From: Ammie Date: Fri, 3 Jan 2025 09:19:07 -0500 Subject: [PATCH 13/28] Update DM to sentence case --- content/topics/domain-management/_index.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/topics/domain-management/_index.md b/content/topics/domain-management/_index.md index 590f7b812c..54cd629ba7 100644 --- a/content/topics/domain-management/_index.md +++ b/content/topics/domain-management/_index.md @@ -5,7 +5,7 @@ slug: "domain-management" # Topic Title -title: "Domain Management" +title: "Domain management" deck: "Clear and consistent use of .gov and .mil domains is essential to maintaining public trust." summary: "It should be easy to identify government websites on the internet. Using a .gov or .mil domain increases security, trust, and accountability, while ensuring the public can clearly identify official government services and information." From fbd8bdbc6111492f8107ace46f13712add69e366 Mon Sep 17 00:00:00 2001 From: Ammie Date: Fri, 3 Jan 2025 09:20:31 -0500 Subject: [PATCH 14/28] Update OS to sentence case --- content/topics/open-source/_index.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/topics/open-source/_index.md b/content/topics/open-source/_index.md index d3517a82b6..fa7a5610b7 100644 --- a/content/topics/open-source/_index.md +++ b/content/topics/open-source/_index.md @@ -5,7 +5,7 @@ slug: "open-source" # Topic Title -title: "Open Source" +title: "Open source" # description — keep it short and clear summary: "" From f2928a4ac450a341fd87a6c0423b0d8e27d2a2f9 Mon Sep 17 00:00:00 2001 From: Ammie Date: Fri, 3 Jan 2025 09:21:51 -0500 Subject: [PATCH 15/28] Update SE to sentence case --- content/topics/software-engineering/_index.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/topics/software-engineering/_index.md b/content/topics/software-engineering/_index.md index 38096586af..dfb8c7e723 100644 --- a/content/topics/software-engineering/_index.md +++ b/content/topics/software-engineering/_index.md @@ -5,7 +5,7 @@ slug: "software-engineering" # Topic Title -title: "Software Engineering" +title: "Software engineering" deck: "Develop websites and services that are secure, reliable, and easy to maintain." summary: "Federal websites are essential tools for unifying and communicating government information with the public in a timely manner. A well-developed website builds public trust in government and provides users with access to information when they need it. From 6bd6f9c472c28ddeebacc910fbba7a12e5866c52 Mon Sep 17 00:00:00 2001 From: camillemorrow Date: Fri, 3 Jan 2025 10:54:29 -0500 Subject: [PATCH 16/28] archive-bbtr.md --- content/guides/public-policy/_index.md | 3 +++ 1 file changed, 3 insertions(+) diff --git a/content/guides/public-policy/_index.md b/content/guides/public-policy/_index.md index 5697983b6e..febba9ea87 100755 --- a/content/guides/public-policy/_index.md +++ b/content/guides/public-policy/_index.md @@ -3,6 +3,9 @@ date: 2024-06-14 09:00:00 -0500 title: "Building by the rules: A crash course for federal technologists" deck: "" summary: "A guide for web and digital practitioners on why public policy matters." + +expirydate: "2025-01-02" + guide: public-policy image: guide-public-policy primary_image: guide-public-policy From e7d73d0b74e989adc3be71daba0a5fe5dbde6bfb Mon Sep 17 00:00:00 2001 From: camillemorrow Date: Fri, 3 Jan 2025 10:54:56 -0500 Subject: [PATCH 17/28] archive bbtr- accessibility.md --- content/guides/public-policy/accessibility.md | 3 +++ 1 file changed, 3 insertions(+) diff --git a/content/guides/public-policy/accessibility.md b/content/guides/public-policy/accessibility.md index 12000cf8cd..3eb0954e08 100644 --- a/content/guides/public-policy/accessibility.md +++ b/content/guides/public-policy/accessibility.md @@ -3,6 +3,9 @@ date: 2024-06-14 09:00:00 -0500 title: "Accessibility" deck: "" summary: "An introduction to Section 508 of the Rehabilitation Act of 1973, and related laws and policies." + +expirydate: "2025-01-02" + guide: public-policy primary_image: guide-public-policy From c6db1fa3e83c8aae223f70c0ba67a17895a59298 Mon Sep 17 00:00:00 2001 From: camillemorrow Date: Fri, 3 Jan 2025 10:55:14 -0500 Subject: [PATCH 18/28] archive bbtr -conclusion.md --- content/guides/public-policy/conclusion.md | 3 +++ 1 file changed, 3 insertions(+) diff --git a/content/guides/public-policy/conclusion.md b/content/guides/public-policy/conclusion.md index 70dd0b7420..7ed5436875 100644 --- a/content/guides/public-policy/conclusion.md +++ b/content/guides/public-policy/conclusion.md @@ -3,6 +3,9 @@ date: 2024-06-14 09:00:00 -0500 title: "Conclusion" deck: "" summary: "" + +expirydate: "2025-01-02" + guide: public-policy primary_image: guide-public-policy From 6e0e46e280a5169a14c58dbd081c8545ae08accf Mon Sep 17 00:00:00 2001 From: camillemorrow Date: Fri, 3 Jan 2025 10:55:34 -0500 Subject: [PATCH 19/28] archive bbtr- information-collection.md --- content/guides/public-policy/information-collection.md | 3 +++ 1 file changed, 3 insertions(+) diff --git a/content/guides/public-policy/information-collection.md b/content/guides/public-policy/information-collection.md index 3b63e51fa0..7457f89aa3 100644 --- a/content/guides/public-policy/information-collection.md +++ b/content/guides/public-policy/information-collection.md @@ -3,6 +3,9 @@ date: 2024-06-14 09:00:00 -0500 title: "Information collection" deck: "" summary: "The Paperwork Reduction Act (PRA) is a key federal statute. Learn when and how it applies." + +expirydate: "2025-01-02" + guide: public-policy primary_image: guide-public-policy From b79959e7bcf8ef246bf9a40804946d5837d93996 Mon Sep 17 00:00:00 2001 From: camillemorrow Date: Fri, 3 Jan 2025 10:55:52 -0500 Subject: [PATCH 20/28] archive bbtr- policy-types.md --- content/guides/public-policy/policy-types.md | 3 +++ 1 file changed, 3 insertions(+) diff --git a/content/guides/public-policy/policy-types.md b/content/guides/public-policy/policy-types.md index e2e325cf2f..be6358da31 100644 --- a/content/guides/public-policy/policy-types.md +++ b/content/guides/public-policy/policy-types.md @@ -3,6 +3,9 @@ date: 2024-06-14 09:00:00 -0500 title: "Policy types" deck: "" summary: "Learn about different types of public policy, and explore the policy framing for Findsupport.gov as a case study." + +expirydate: "2025-01-02" + guide: public-policy primary_image: guide-public-policy From eeb692e0e3afe28c68ccb786ef19388d270293a9 Mon Sep 17 00:00:00 2001 From: camillemorrow Date: Fri, 3 Jan 2025 10:56:16 -0500 Subject: [PATCH 21/28] archive bbtr- privacy-and-security.md --- content/guides/public-policy/privacy-and-security.md | 3 +++ 1 file changed, 3 insertions(+) diff --git a/content/guides/public-policy/privacy-and-security.md b/content/guides/public-policy/privacy-and-security.md index 75afae20fb..a27e8f6093 100644 --- a/content/guides/public-policy/privacy-and-security.md +++ b/content/guides/public-policy/privacy-and-security.md @@ -3,6 +3,9 @@ date: 2024-06-14 09:00:00 -0500 title: "Privacy and security" deck: "" summary: "Public policy influences technology projects as a force both for and against change." + +expirydate: "2025-01-02" + guide: public-policy primary_image: guide-public-policy From 7e6a3d5a0090bdebdf3d3a688c3cb0c1985bb26b Mon Sep 17 00:00:00 2001 From: camillemorrow Date: Fri, 3 Jan 2025 11:00:55 -0500 Subject: [PATCH 22/28] add aliases_index.md --- content/topics/policy/_index.md | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/content/topics/policy/_index.md b/content/topics/policy/_index.md index 66dab7e011..ac9fe0664f 100644 --- a/content/topics/policy/_index.md +++ b/content/topics/policy/_index.md @@ -12,6 +12,14 @@ deck: "The relevant laws and policies for delivering better digital services." summary: "Public policy plays a vital role in how federal programs serve the public. More than 100 laws, memos, and other policies impact federal websites, covering topics such as accessibility, privacy, security, design, and user experience. It is important for web and digital practitioners to understand the policy framework." +aliases: +- content/guides/public-policy/ +- content/guides/public-policy/accessibility +- content/guides/public-policy/conclusion +- content/guides/public-policy/information-collection +- content/guides/public-policy/policy-types +- content/guides/public-policy/privacy-and-security + # Weight weight: 2 From 9bde7cbc968eb73c889b726edb98ba1f09da64f1 Mon Sep 17 00:00:00 2001 From: camillemorrow Date: Fri, 3 Jan 2025 11:15:32 -0500 Subject: [PATCH 23/28] Update aliases _index.md edited alias to remove "content" --- content/topics/policy/_index.md | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/content/topics/policy/_index.md b/content/topics/policy/_index.md index ac9fe0664f..f4082a3433 100644 --- a/content/topics/policy/_index.md +++ b/content/topics/policy/_index.md @@ -13,12 +13,12 @@ deck: "The relevant laws and policies for delivering better digital services." summary: "Public policy plays a vital role in how federal programs serve the public. More than 100 laws, memos, and other policies impact federal websites, covering topics such as accessibility, privacy, security, design, and user experience. It is important for web and digital practitioners to understand the policy framework." aliases: -- content/guides/public-policy/ -- content/guides/public-policy/accessibility -- content/guides/public-policy/conclusion -- content/guides/public-policy/information-collection -- content/guides/public-policy/policy-types -- content/guides/public-policy/privacy-and-security +- /guides/public-policy/ +- /guides/public-policy/accessibility +- /guides/public-policy/conclusion +- /guides/public-policy/information-collection +- /guides/public-policy/policy-types +- /guides/public-policy/privacy-and-security # Weight weight: 2 From c29a0c7c487dbe0d92744c4fdf3573327783a502 Mon Sep 17 00:00:00 2001 From: Makayla Hipke Date: Fri, 3 Jan 2025 12:14:37 -0500 Subject: [PATCH 24/28] Formatting and grammar --- .../12/2024-12-19-uswds-monthly-call-december-2024.md | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/content/events/2024/12/2024-12-19-uswds-monthly-call-december-2024.md b/content/events/2024/12/2024-12-19-uswds-monthly-call-december-2024.md index 55c6e3347f..29e3e2c878 100644 --- a/content/events/2024/12/2024-12-19-uswds-monthly-call-december-2024.md +++ b/content/events/2024/12/2024-12-19-uswds-monthly-call-december-2024.md @@ -30,7 +30,7 @@ primary_image: 2024-uswds-monthly-call-dec-title-card {{< accordion kicker="Slide by Slide" title="USWDS Monthly Call - Presentation Script for December 2024" icon="content_copy" >}} **Slide 1.** Thanks Kate, and welcome, everyone, to the U.S. Web Design System monthly call for December 2024. Today the USWDS logo is in a classic wreath form for the holiday season, with evergreen panels and a bright poinsettia-red segment like a bow. -**Slide 2.** My name is Dan Williams, he/him, and I'm the USWDS project lead — and here on-screen is my avatar: dark hair, blue sweater, collared shirt, glasses —today I'm wearing a red checked collared shirt and a blue workshirt. And bright green socks, for luck. +**Slide 2.** My name is Dan Williams, he/him, and I'm the USWDS project lead — and here on-screen is my avatar: dark hair, blue sweater, collared shirt, glasses — today I'm wearing a red checked collared shirt and a blue workshirt. And bright green socks, for luck. As Kate mentioned, we are recording this call, and I'm happy to say we're able to share the recordings of these monthly calls publicly. You can find pretty much everything back to January 2023 on our website, at [**designsystem.digital.gov/about/monthly-calls**](http://designsystem.digital.gov/about/monthly-calls). We typically post videos shortly after the monthly call and we also link out to the slides and the script, hosted at Digital.gov. We've posted a link to our monthly calls page in the chat. @@ -56,7 +56,7 @@ Well, first we'll check out a handful of product updates. Then we'll hear from t - We also made a couple updates based on community contributions. **We fixed the display of focus outlines in the identifier.** Now, focus outlines don’t get clipped when they appear in some locations in the identifier's list of required links. - And finally, **we added a more modern CSS reset**. We're left some of the older IE11-constrained reset techniques behind and moved to a slimmer reset. -[And that's USWDS 3.11.0](https://www.google.com/url?q=https://github.com/uswds/uswds/releases/tag/v3.11.0&sa=D&source=docs&ust=1735663244394200&usg=AOvVaw3W0afwmnr0C9MqAS_utR2G). +[And that's USWDS 3.11.0](https://github.com/uswds/uswds/releases/tag/v3.11.0). **Slide 7.** We've also released a good quality-of-life update to USWDS Compile, in USWDS Compile 1.2.1. @@ -89,7 +89,7 @@ Next in the queue are Date picker, Date range picker, Alert, and Site alert, com **Slide 10.** There are three public discussions to highlight this month: - The first is an active discussion about [providing support for user preferences](https://github.com/uswds/uswds/discussions/5798). The original discussion topic raises a few user browser preferences: **prefers-color-scheme**, **prefers-contrast**, and **prefers-reduced-motion**. USWDS has done a lot of work over the last year in supporting high contrast and forced color mode, though this is through the mechanism of the **forced-colors** media query and not via **prefers-contrast**. We also prefer solutions with reduced motion, so we haven't spent much time investigating reduced motion solutions, but **prefers-color-scheme** is a media query–speak for supporting Dark Mode, and that's a place where we could use some more opinions. If you want to support dark mode, or have tried to implement support for a dark mode scheme inside of USWDS or not, we'd be interested in hearing from you in this discussion. -- Beyond dark mode, we'd also like to direct folks to this month's Accessibility discussion: on [**HTML titles and accessibility**](https://github.com/uswds/uswds/discussions/6243). Providing good HTML titles is also one of the new draft federal website standards, which we'll hear more about later in this call, so I think folks would benefit from more discussion about what's working when it comes to the accessibility and usability of titles. +- Beyond dark mode, we'd also like to direct folks to this month's Accessibility discussion: on [HTML titles and accessibility](https://github.com/uswds/uswds/discussions/6243). Providing good HTML titles is also one of the new draft federal website standards, which we'll hear more about later in this call, so I think folks would benefit from more discussion about what's working when it comes to the accessibility and usability of titles. - And finally, we've posted a public version of last month's monthly call Q&A in discussions as well. You can check that out via [the link in the chat](https://github.com/uswds/uswds/discussions/6252) if you missed last month's call. **Slide 11.** We're also moving ahead in the world of pattern and component proposals. @@ -130,7 +130,7 @@ We also wanted to leave some space for a discussion about how USWDS and the Fede **Slide 23.** And only 2% of federal forms have been digitized for the web. -**Slide 24.** Back in 2018, 21st Century Integrated Digital Experience Act commonly known as 21st Century IDEA passed. It requires all agencies to modernize their public-facing websites and digital services, digitize services and forms, accelerate use of e-signatures, improve customer experience and standardize and transition to centralized shared services. +**Slide 24.** Back in 2018, 21st Century Integrated Digital Experience Act, commonly known as 21st Century IDEA, passed. It requires all agencies to modernize their public-facing websites and digital services, digitize services and forms, accelerate use of e-signatures, improve customer experience and standardize and transition to centralized shared services. **Slide 25.** It meant that digital services should be: @@ -163,7 +163,7 @@ We did user research with the public and with agencies and desk research about i **Slide 31.** We defined standards as actions that will help agencies meet the public’s evolving expectations for digital experiences. The standards are evidence-based, auditable and lead to a consistent digital experience. -**Slide 32.** We launched our website ([standards.digital.gov](http://standards.digital.gov)) with 3 pending standards that will be tracked for compliance at some point in the future. +**Slide 32.** We launched our website ([standards.digital.gov](http://standards.digital.gov)) with three pending standards that will be tracked for compliance at some point in the future. The government banner which has the line “this is a federal government website”, with the flag, and the "this is how you know" dropdown, which is an item we found the public looks for to know if they can trust the website. From 052d6fb46754f84a4c907f100c9d6b7de4f2581e Mon Sep 17 00:00:00 2001 From: Makayla Hipke Date: Fri, 3 Jan 2025 12:30:21 -0500 Subject: [PATCH 25/28] Added primary_image to front matter --- content/resources/an-introduction-to-data-visualization.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/content/resources/an-introduction-to-data-visualization.md b/content/resources/an-introduction-to-data-visualization.md index 026b1a5596..ade3f876d7 100644 --- a/content/resources/an-introduction-to-data-visualization.md +++ b/content/resources/an-introduction-to-data-visualization.md @@ -9,6 +9,8 @@ summary: Use data visualization to communicate insights, tell a story, and share authors: - katie-chan +primary_image: "charts-graphs-bestforbet-istock-getty-images-2154975217" + topics: - data-visualization - design From 93541c122622b0c3b3e31cc291e3f05765d66a91 Mon Sep 17 00:00:00 2001 From: Ammie Date: Fri, 3 Jan 2025 12:52:52 -0500 Subject: [PATCH 26/28] Updated OL to H3s --- .../an-introduction-to-data-visualization.md | 33 ++++++++++++++----- 1 file changed, 25 insertions(+), 8 deletions(-) diff --git a/content/resources/an-introduction-to-data-visualization.md b/content/resources/an-introduction-to-data-visualization.md index ade3f876d7..cd627a141e 100644 --- a/content/resources/an-introduction-to-data-visualization.md +++ b/content/resources/an-introduction-to-data-visualization.md @@ -39,20 +39,37 @@ There are no firm or set rules for how to create or design data visualizations, ## How can I create data visualizations? -When you create a data visualization, your goal should be to transform data into actionable information. This process can take many forms, but making a visualization typically involves the following steps: +When you create a data visualization, your goal should be to transform data into actionable information. This process can take many forms, but making a visualization typically involves the following seven steps. -1. **Establish and understand the research question.** A clear, focused [research question](https://guides.18f.gov/ux-guide/research/plan/#research-questions) will guide the scope of your analysis. You may need to break down your research question into multiple components, which may be more clear to address in more than one visualization. +### Step 1. Establish and understand the research question. + +A clear, focused [research question](https://guides.18f.gov/ux-guide/research/plan/#research-questions) will guide the scope of your analysis. You may need to break down your research question into multiple components, which may be more clear to address in more than one visualization. {{< note >}} [The 18F User Experience Guide](https://guides.18f.gov/ux-guide/research/plan/#research-questions) provides examples of research questions. While centered on user research, you can use the definition and principles to guide your own brainstorming. {{< /note >}} -2. **Identify data sources.** Determine if you can get data that will address your question. You may need to use multiple data sources to validate and cross-check, to get a holistic view of the subject. -3. **Clean and explore your data.** Verify your data is complete, consistent, and standardized. To ensure consistency, establish clear data strategies and governance, use standardized procedures and data dictionaries, and invest in data quality tools. This will allow you to carry out a comprehensive analysis. -4. **Analyze the data and choose a visual.** The chart type you use should support your research goal and fit the type of data you are showing. For example, pie charts are useful to emphasize proportions between a few categories that are parts of a whole. [Bar charts](https://designsystem.digital.gov/components/data-visualizations/#bar-charts-2), meanwhile, are ideal for displaying data in categories and effective at showing comparisons across multiple categories. -5. **Check your visualization for bias.** Identify any limitations in the way the data was collected. Approaching visualization with [a lens of empathy and equity](https://www.nnlm.gov/training/class/do-no-harm-data-viz) can ensure visualizations are more well-justified, accurate, and impactful. -6. **Ensure that your data is accessible.** Carefully consider the [language, icons, colors, and category order](https://www.nnlm.gov/training/class/do-no-harm-data-viz) you use. Design your visualization with a focus on [accessibility](https://digital.gov/resources/an-introduction-to-accessibility/) from the start to ensure everyone can understand and navigate your data. -7. **Identify and customize your message or story based on your audience — and get feedback.** Help your audience understand your intent by including enough metadata (such as title, caption, and labels) for them to follow the information in your visualization. Use [plain language](https://digital.gov/resources/an-introduction-to-plain-language/) for clarity. You can also test your visualization: ask someone from your intended audience (preferably) or a colleague (if needed, or with early drafts) to review your visualization. Gathering feedback can help you understand if people will be able to grasp the story you are trying to tell. +### Step 2. Identify data sources. + +Determine if you can get data that will address your question. You may need to use multiple data sources to validate and cross-check, to get a holistic view of the subject. +### Step 3. Clean and explore your data. + +Verify your data is complete, consistent, and standardized. To ensure consistency, establish clear data strategies and governance, use standardized procedures and data dictionaries, and invest in data quality tools. This will allow you to carry out a comprehensive analysis. + +### Step 4. Analyze the data and choose a visual. + +The chart type you use should support your research goal and fit the type of data you are showing. For example, pie charts are useful to emphasize proportions between a few categories that are parts of a whole. [Bar charts](https://designsystem.digital.gov/components/data-visualizations/#bar-charts-2), meanwhile, are ideal for displaying data in categories and effective at showing comparisons across multiple categories. +### Step 5. Check your visualization for bias. + +Identify any limitations in the way the data was collected. Approaching visualization with [a lens of empathy and equity](https://www.nnlm.gov/training/class/do-no-harm-data-viz) can ensure visualizations are more well-justified, accurate, and impactful. + +### Step 6. Ensure that your data is accessible. + +Carefully consider the [language, icons, colors, and category order](https://www.nnlm.gov/training/class/do-no-harm-data-viz) you use. Design your visualization with a focus on [accessibility](https://digital.gov/resources/an-introduction-to-accessibility/) from the start to ensure everyone can understand and navigate your data. + +### Step 7. Identify and customize your message or story based on your audience — and get feedback. + +Help your audience understand your intent by including enough metadata (such as title, caption, and labels) for them to follow the information in your visualization. Use [plain language](https://digital.gov/resources/an-introduction-to-plain-language/) for clarity. You can also test your visualization: ask someone from your intended audience (preferably) or a colleague (if needed, or with early drafts) to review your visualization. Gathering feedback can help you understand if people will be able to grasp the story you are trying to tell. ## What can I do next? From c3532c61a24ce5db9f0cc4d29f89aee9afd96bc4 Mon Sep 17 00:00:00 2001 From: Ammie Date: Fri, 3 Jan 2025 12:58:58 -0500 Subject: [PATCH 27/28] Remove periods on H3s --- .../an-introduction-to-data-visualization.md | 16 +++++++++------- 1 file changed, 9 insertions(+), 7 deletions(-) diff --git a/content/resources/an-introduction-to-data-visualization.md b/content/resources/an-introduction-to-data-visualization.md index cd627a141e..7fd6632252 100644 --- a/content/resources/an-introduction-to-data-visualization.md +++ b/content/resources/an-introduction-to-data-visualization.md @@ -41,7 +41,7 @@ There are no firm or set rules for how to create or design data visualizations, When you create a data visualization, your goal should be to transform data into actionable information. This process can take many forms, but making a visualization typically involves the following seven steps. -### Step 1. Establish and understand the research question. +### Step 1. Establish and understand the research question A clear, focused [research question](https://guides.18f.gov/ux-guide/research/plan/#research-questions) will guide the scope of your analysis. You may need to break down your research question into multiple components, which may be more clear to address in more than one visualization. @@ -49,25 +49,27 @@ A clear, focused [research question](https://guides.18f.gov/ux-guide/research/pl [The 18F User Experience Guide](https://guides.18f.gov/ux-guide/research/plan/#research-questions) provides examples of research questions. While centered on user research, you can use the definition and principles to guide your own brainstorming. {{< /note >}} -### Step 2. Identify data sources. +### Step 2. Identify data sources Determine if you can get data that will address your question. You may need to use multiple data sources to validate and cross-check, to get a holistic view of the subject. -### Step 3. Clean and explore your data. + +### Step 3. Clean and explore your data Verify your data is complete, consistent, and standardized. To ensure consistency, establish clear data strategies and governance, use standardized procedures and data dictionaries, and invest in data quality tools. This will allow you to carry out a comprehensive analysis. -### Step 4. Analyze the data and choose a visual. +### Step 4. Analyze the data and choose a visual The chart type you use should support your research goal and fit the type of data you are showing. For example, pie charts are useful to emphasize proportions between a few categories that are parts of a whole. [Bar charts](https://designsystem.digital.gov/components/data-visualizations/#bar-charts-2), meanwhile, are ideal for displaying data in categories and effective at showing comparisons across multiple categories. -### Step 5. Check your visualization for bias. + +### Step 5. Check your visualization for bias Identify any limitations in the way the data was collected. Approaching visualization with [a lens of empathy and equity](https://www.nnlm.gov/training/class/do-no-harm-data-viz) can ensure visualizations are more well-justified, accurate, and impactful. -### Step 6. Ensure that your data is accessible. +### Step 6. Ensure that your data is accessible Carefully consider the [language, icons, colors, and category order](https://www.nnlm.gov/training/class/do-no-harm-data-viz) you use. Design your visualization with a focus on [accessibility](https://digital.gov/resources/an-introduction-to-accessibility/) from the start to ensure everyone can understand and navigate your data. -### Step 7. Identify and customize your message or story based on your audience — and get feedback. +### Step 7. Identify and customize your message or story based on your audience — and get feedback Help your audience understand your intent by including enough metadata (such as title, caption, and labels) for them to follow the information in your visualization. Use [plain language](https://digital.gov/resources/an-introduction-to-plain-language/) for clarity. You can also test your visualization: ask someone from your intended audience (preferably) or a colleague (if needed, or with early drafts) to review your visualization. Gathering feedback can help you understand if people will be able to grasp the story you are trying to tell. From 4d3369b03c101d0543d110123bbd3de745e7543c Mon Sep 17 00:00:00 2001 From: Ammie Date: Fri, 3 Jan 2025 13:05:56 -0500 Subject: [PATCH 28/28] Update research questions links --- content/resources/an-introduction-to-data-visualization.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/content/resources/an-introduction-to-data-visualization.md b/content/resources/an-introduction-to-data-visualization.md index 7fd6632252..ffaeb36104 100644 --- a/content/resources/an-introduction-to-data-visualization.md +++ b/content/resources/an-introduction-to-data-visualization.md @@ -43,10 +43,10 @@ When you create a data visualization, your goal should be to transform data into ### Step 1. Establish and understand the research question -A clear, focused [research question](https://guides.18f.gov/ux-guide/research/plan/#research-questions) will guide the scope of your analysis. You may need to break down your research question into multiple components, which may be more clear to address in more than one visualization. +A clear, focused research question will guide the scope of your analysis. You may need to break down your research question into multiple components, which may be more clear to address in more than one visualization. {{< note >}} - [The 18F User Experience Guide](https://guides.18f.gov/ux-guide/research/plan/#research-questions) provides examples of research questions. While centered on user research, you can use the definition and principles to guide your own brainstorming. + The 18F User Experience Guide provides [examples of research questions](https://guides.18f.gov/ux-guide/research/plan/#research-questions). While centered on user research, you can use the definition and principles to guide your own brainstorming. {{< /note >}} ### Step 2. Identify data sources