Drupal GovCon 2024
Overview
Drupal GovCon is an annual event for users, developers, designers, and supporters of Drupal with a focus on government. Attendees are from federal, state, and local governments and private, non-profit, and education sectors. For those who aren’t familiar with Drupal, it is an open-source platform that allows users to build and maintain websites and digital content.
This year’s Drupal GovCon took place on Tues August 13 – Thurs August 15 at the Riggs Center at the University of Maryland. The conference is free to all in part to many sponsors and volunteers. It includes presentations of around 45 minutes each, extra registered training of around 3 hours each, coffee, lunch, and social events in the evenings. More information and slides on the sessions can be found on the schedule page of the Drupal GovCon website, and videos of the sessions can be found on the Drupal GovCon YouTube channel. Below I have highlighted some of the sessions I attended.
Unveiling Starshot: Drupal’s Next Big Leap
This talk was given by Mike Hershel, a Senior Front-end Developer at Agileana. The Starshot initiative was unveiled at this year’s DrupalCon. Named after JFK’s famous “Moonshot” speech, the Starshot initiative aims to create a much more user-friendly version of Drupal and may be available for use by the end of this year. The main goal of Starshot is to take away the high learning curve and lower the cost of ownership. A Drupal site can be installed and built completely from a browser, similar to platforms like Wiz and Squarespace.
This ambitious project encompasses several key sub-initiatives. Mike reviewed each sub-initiative, how they interconnect, and their current statuses.
- Drupal CMS – Starshot will become “Drupal CMS” and will include CMS and Drupal Core. This will be a new starting point. When installing Drupal users can decide between “Drupal CMS” and “Drupal Core”, which is what is in place now. “Drupal CMS” will also include a staging copy of your website.
- Recipes – Recipes allow developers to easily add features via the user interface and the Drupal recipe runner. It is a successor to installation profiles and is already in Core.
- Experience Builder – This is used for page and theme building and is friendly for developers and non-developers. This can be migrated from Site Builder. Unfortunately, it is not accessible yet.
- Project Browser – New user interface for Composer which will run in the background
- Automatic Updates – Updates can be automated for both modules AND Core
- Improved Documentation
Data Analysis of Drupal, Government, and Best Practices
This talk was given by Mike Gifford, a Senior Strategist at CivicActions and a thought leader on digital accessibility in the public sector. He is also a W3C Invited Expert and a recognized authoring tool accessibility expert.
Mike covered Digital.gov’s Site Scanning Program which tracks 26,000 publicly available federal .gov websites. By far the greatest number of sites listed are Drupal. The speaker wrote a script that pulls the latest CSV from the Site Scanning Program, uploads it to Google Sheets, and generates dashboard charts. He shared the gathered data and compared them to sites built on other platforms. Drupal’s accessibility and best practices are a bit better, but performance is a bit worse.
He also covered accessibility testers and noted that automated tests at best catch only about 33% of issues and that PDFs are terrible for user experience, especially on mobile. Government websites still rely a lot on PDFs and we should encourage our clients to put that content into pages rather than PDFs whenever possible.
The following are some useful links:
Open Source Analytics:
- Google Sheets
- GitHub
- Other Links
Accessibility tools:
- More detailed scans via the command line – PurpleA11y and Spidergram
- Deque’s Axe dev tools & Google Lighthouse + CrUX reports
Presentation Slides: Data Analysis of Drupal, Government, and Best Practices
Navigating Geographic Data: Simple Interactive Maps for Drupal
This session was given by Jason Murray, a Technical Supervisor with Mobomo. Jason created a module for the U.S. Dept of Education website that was released in June called Simple Interactive Maps. It was created because they needed a simple custom-defined map of a specific area but felt that a Google Maps or OpenStreetMaps implementation would be overkill. This module is a user-friendly (no coding) solution that allows you to define and view SVG-based maps to be used for navigating through your site. On installation, you will be provided with a U.S. map of the 50 states with hotspots for the major territories. There is also a U.S. state map of counties derived from U.S. Census shape files.
It also allows you to define user interactions individually for each region on the map, or create groups of regions that inherit the same interaction and styling options. Developers can also create custom base maps or map actions in response to user interaction using a simple plugin structure. Some features are tooltips, URLs, custom actions, styles, hiding regions, and import/export of data.
Actions are customizable with three basic actions:
- a Navigation plugin that turns the map into a visual navigation tool
- a Modal Content plugin with a popup to display content related to the region you clicked
- an AJAX map loader to allow one map to load another
The module is currently in beta and not “covered by Drupal’s security advisory policy”. Hopefully, that will change shortly. In the pipeline is a zoom feature, JSON support, a table view for accessibility, and 508 conformance.
Here is a preview of the default map:
Rapid prototyping using StorybookJS, USWDS, and Drupal Twig
This was a 3-hour training session I attended that covered how to use StorybookJS, Twig, and USWDS to speed up your frontend development process without a local development environment like Lando or DDEV. The training was taught by Charlie Mahoney and James Mejia from Bixal.
Storybook is an open-source frontend workshop for building UI components and pages in isolation. It helps you develop and share hard-to-reach states and edge cases without needing to run your whole app. You can design right in Storybook to create a theme without relying on a base theme. It is also great for showing clients how something will look, rather than telling them.
USWDS is a design system for the federal government, using accessible, mobile-friendly components. Twig is a modern template engine for PHP, and we also used Sass, which is a stylesheet language that’s compiled into CSS.
In anticipation of the training, we were required to first install Node.js LTS, which is a “free, open-source, cross-platform JavaScript runtime environment that lets developers create servers, web apps, command line tools, and scripts”. We also had to clone the Bixal Github repo with the class content and lessons and ensure “npm install” runs successfully.
Once class began, we opened the cloned repo directory in our code editor (I used VSCode). In the code editor, we opened a terminal and ran “npm run start” which opened a window in our browser for http://localhost:4040/. The page was running Storybook with the cloned repo files. From there, we worked through some hands-on exercises on how to set up a USWDS theme, add Twig USWDS components, and create a page template using those components.
Additional Resources:
Twig coding standards – Drupal Wiki
Steve Kinney – Building Design Systems in Storybook – Learn more about Storybook
Events – Digital.gov – USWDS Monthly Call is a technical discussion geared toward developers on the progress of USWDS. The team will answer questions and requests posted by the community.
https://designsystem.digital.gov/about/community/ – For help from the USWDS community, join the #uswds-public channel in Slack
This post was written by Fawn Kildoo
Contact us for more information on this post or our services.
