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.
By Aten Design Group on
Human Rights Watch sought to create a beautifully impactful, user-centered digital experience with a strong focus on readability–on all modern devices. They needed authoring tools to facilitate timely publishing and a platform that was both flexible and powerful.
Human Rights Watch defends the rights of people everywhere. Established in 1978, its in-depth reports and analysis have long been an essential resource for journalists, policymakers and activists worldwide.
When this project began, Human Rights Watch was seeking help with an important transition. It had been through several major iterations of its web presence over the years, but had seen much of that work as complementary to print. More recently, the organization had begun a major shift toward a digital-first publishing strategy. The need for timely content to help shape global public debates as they were actually happening was bigger than ever. Equally important, Human Rights Watch was directly experiencing the explosion of modern devices as its audience was increasingly mobile.
Human Rights Watch sought to create a beautifully impactful, user-centered digital experience with a strong focus on readability–on all modern devices. They needed authoring tools to facilitate timely publishing and a platform that was both flexible and powerful.
Why Drupal was chosen:
Human Rights Watch has a long history of working with Drupal. The platform helps to support multiple tiers of translation and localization and helps create a consistent, unified approach to content management for roughly twenty unique content types.
Describe the project (goals, requirements and outcome):
From day one, user-centered design and advocating an approach that would keep users at the center of the process was a primary goal. A strategy was created for reaching HRW.org’s primary audience of journalists and policymakers, identifying key personas and mapping user stories critical for delivering on goals.
Given the critical role of in-depth reports for delivering on Human Rights Watch mission, readability was a huge focus for the project. We designed simple, effective interfaces for exploring articles by country and topic, and surfacing related and trending content. In-page navigation helps users move efficiently through lengthy reports. Social optimizations like sharing tools and promoting most-shared content directly empower users to amplify Human Rights Watch’s reach.
With mobile users being a large and growing segment of HRW.org traffic, designing for the full breadth of modern devices was critical. The experience couldn’t simply work on mobile; it had to be compelling and readable. Interface elements adjust gracefully for smaller devices. Navigation slides quickly away when not needed. The design is as friendly for touch and swipe as it is for click and scroll.
Technical specifications
Drupal version:
Drupal 7.x
Key modules/theme/distribution used:
Why these modules/theme/distribution were chosen:
Human Rights Watch reports in over 40 languages to countries all over the world. Internationalization was pivotal to the success of the project. The internationalization module, along with a handful of other modules (i18n_boxes, i18n_menu_overview) allowed their content managers to display their content in a number of languages in order to reach a global audience.
Human Rights Watch wanted to show relevant and engaging content throughout their site. Radioactivity weights content based on engagement and gives granular configuration control to site-builders in the Drupal administrative UI.
The modifier “responsive” in “responsive web design” is redundant today: all web design should be responsive. One issue this raises is the need for multiple image styles to be placed on the page — a hero image that is one size and aspect ratio on desktop is entirely another when displayed on mobile. Drupal core handles image styles poorly for the responsive use case, for example cutting off a subject’s head when resizing an image. Focal Point gave control to our content editors to set the most important part of the image so the image displays appropriately in whatever size viewport the user is engaging.
The Field Group module allows site-builders to group fields by relevance to one another. In the case of Human Rights Watch, we used Field Group to organize fields on node edit pages to make an intuitive authoring experience for their content managers.
Organizations involved:
Project team:
Aten Design Group
Sectors:
Non-profit
Publishing
