Support for Drupal 7 is ending on 5 January 2025—it’s time to migrate to Drupal 10! Learn about the many benefits of Drupal 10 and find migration tools in our resource center.Innovation in Public Education Using Drupal 8
Fairfax County Public Schools (FCPS) is the largest school system in the Commonwealth of Virginia and the 10th largest in the United States, with more than 200 schools and centers serving 186,000 students in preschool through 12th grade, and employing 24,000 full-time staff. The FCPS.edu websites are a vital source of information for students, parents, teachers, employees, the community, and the general public. This multi-site platform gets more than 30 million visits and serves up over 23,000 pages each year, and is translated into eight languages.
Achieving Beauty and Functionality
Over the past year, FCPS has embarked on an effort to modernize its brand with an updated logo, tagline, and visual identity that reinforce its position as a forward thinking, inclusive, creative, dynamic, compassionate, and responsible organization that enriches and empowers students, both in and out of the classroom.
As part of an extensive brand refresh, Forum One completely reengineered and redesigned the FCPS.edu website in Drupal 8, with a focus on making it:
- easier for all users to find what they need;
- more efficient and cost effective for FCPS to maintain its large web presence; and
- a more flexible platform that can serve as a central communications channel for multiple, diverse audiences.
We worked with our infrastructure partner, Pantheon, and our language translation partner, Lingotek, to realize this vision.
The Results to Date
Today, the new easy-to-access, well-indexed main FCPS.edu site has become the go-to resource for parents, staff, and students, receiving 70% more sessions at the start of the 2016-2017 school year than the previous year. Clearly labeled, engaging content is encouraging users to explore the site 11% longer. And by implementing a fast and intuitive responsive design, the new FCPS main site has seen a 20% decline in mobile bounces from the previous year.
Why Drupal was chosen:
Studying Up to Re-Think the Experience
To redesign a site of this scale that serves such varied needs, Forum One led a series of in-person workshops to prioritize audiences, explore the paths they take to find information, and understand FCPS’ processes for creating, translating, publishing, updating, and archiving content.We also focused on how to make it easier for the school system’s 300+ web curators to create, edit, translate, and publish content in the new CMS.
Taking Notes to Ace the Content Strategy
Form One worked side-by-side with the FCPS redesign team to create a new content structure for the main FCPS site, as well as new structures for each type of school site (elementary, middle, secondary, and high school). Working closely with FCPS, the team developed or revised each page to fit the new structure in the GatherContent tool, which we used to assign each section to a specific FCPS content owner. The FCPS team reviewed, developed, edited, and finalized each new page, and we then worked with them to migrate more than 2,000 new and updated pages into the Drupal 8 CMS.
Finally, with the integration of the Lingotek Drupal module, all of the work translates seamlessly into multilingual content that speaks to each audience.
Describe the project (goals, requirements and outcome):
A Great User Experience: The Best Kind of Group Project
Since more than 50% of FCPS’ web traffic comes from mobile devices, we took a “mobile first” design approach to turn our site structure into a responsive design that is both beautiful to view and simple to use on any device, as well asaccessible in compliance with Section 508 and W3C standards. We reviewed and refined the design and front-end development in tandem by showing FCPS stakeholders responsive site prototypes in Webflow.
We took a modular approach to the site structure and the visual design system, creating reusable, flexible, and scalable elements FCPS can apply site wide. This gives FCPS greater design consistency across all of its school sites, while giving schools more options to customize their individual sites. FCPS also has a solid foundation in place to scale and extend to new pages and sites in the future.
Drupal 8 = Teacher’s Pet
Before the new Drupal 8 platform, each FCPS school and office website was managed and maintained separately, by a staff that not only needed to be excellent content creators, but also proficient in HTML coding – all on top of their normal day-to-day work activities.
To resolve these issues, Forum One created standard, pre-configured templates, workflows, site functions, security standards, navigation menus, and layouts to make it easier for FCPS to update and maintain their sites. We also implemented the Drupal Workbench module, making it possible for more FCPS staff to contribute content while also allowing FCPS to have a smaller core group of editors review and publish content that stays true to the overall brand.
Building a Public Education Website That’s In a Class By Itself
With the launch of the redesigned main FCPS.edu website for the 2016-2017 school year, the Forum One team is moving into the next phase of our work with FCPS to move its 200 school websites into the Drupal CMS.
Our technical team is architecting a single Drupal Install Profile that will allow FCPS to spin off fully functional Drupal websites for each of its schools and education centers. Global updates made once to the install profile will push out to all of the sites, allowing FCPS to implement system-wide updates, improvements, and new features more easily and cost effectively than ever. At the same time, each school will be able to choose from a pre-configured set of templates, layouts, color options, and starter content to personalize and tailor their individual sites, while giving all site users a consistent experience that reinforces the FCPS brand.
Technical specifications
Drupal version:
Drupal 8.x
Key modules/theme/distribution used:
Why these modules/theme/distribution were chosen:
FCPS had the need for being able to translate content into multiple languages including Arabic, Chinese, Farsi, Korean, Urdu, Vietnamese and Spanish. While Google Translation can sometimes fit the needs, FCPS required both machine translation and manual translation. We looked at several options to satisfy this requirement but in the end Lingotek provided the most robust solution. Forum One was able to provide several patches to allow for Lingotek translation to integrate better with Drupal 8 and Workbench moderation.
Workbench moderation allowed for FCPS to manage the content workflow based on their current organizational structure. Contributors were able to add content that was unpublished, Editors were able to review content and send it back and forth to contributors and publishers based on the state of the content. Publishers were able to publish content and if content needed to be translated they could either mark the content for machine translation or send the content to a Translation role to manually translate content for one or multiple languages.
FCPS had a lot of content to publish for the central site so it was key to provide a robust searching mechanism for users to easily find content. Forum One chose to implement Search API along with Search API Solr and Facets to develop varied listing pages and a global search that would satisfy the needs of its parents, teachers and students.
Having an accessible theme to display the rich content and images that FCPS provided was also a large focus area of development. Forum One is very proud to have a contributed theme called Gesso that focuses on best practices for Drupal 8, SMACSS and Accessibility. Gesso also provides the ability to componentize Drupal allowing for theming to take place parallel to development. Integrating such modules as Paragraphs and Twig Tweak allowed for an Atomic Design principle to be used. In the long run this ensures reusability and less technical debt.
Team members:
Project team:
Fairfax County Public Schools - https://www.fcps.edu/
Alex Ford
Adam Juran
Autumn Rose
Alex Klatsky
Brooke Heaton
Cynthia Canelas
Daniel Ferro
Corinne Stubbs
Sectors:
Education
