Background

The 138 year old Hindu, is among India’s most venerated dailies. An early adopter of the web, the old site no longer reflected its younger reader’s idea of a newspaper’s web front. A more contemporary, and capable site was needed, to work as well on mobiles as on larger screens.

In close collaboration with the editorial team we set about understanding The Hindu’s unique connect with its readers, and why it occupies such a key place in the news landscape.

Our Approach

The path to renewed relevance obviously passed through modernisation, but it was not an easy one. Long time loyalists’ preferences had to be negotiated alongside the expectations of a younger reader for whom the Hindu is a valued, but not exclusive read.

The Hindu offers an extremely rich bouquet of content, from archived material to developing stories; statistics, sports features, city-specific content (it has 16 editions) and the like, each of which has distinct uses for sets of readers. Our goal had to be to make this visible, drawing the eye to it without derailing the scanning process.
Second, a large number of content vehicles were designed to contain each kind of news, a backbreaking task, across several screen resolutions.

Our visual approach balances energy and stability, ensuring that this valuable and reliable content is bolstered by contemporary design, multimedia value additions, smarts technology and easy readability via good typographic and graphic decisions and easy findability by devising smarts widgets.

Process

The first things to keep in mind were the analytics results and extrapolate information from them about user behaviour.

The second was to plan and design an extensive new information architecture (IA) for the site, which made finding information easy and predictable.

After extensive discussions and finalisation of the IA we moved to designing a detailed wireframe of every page to map the user flow, simplify navigation, making sure that the reader gets value for his two clicks and increasing page / site stay with the right editorial and design interventions.

Content

Key sections were identified for better personalisation possibilities in future and new ones were added accordingly.
The entire site was devised in horizontal sections to give a reader a distinct feel of zone and allows the reader to hide, follow or go to a more detailed landing page of the that section right away.

Handy navigation via sticky header, correct placement of subscription requests and proper placement of the social media sharing options will ensure that while the reader is on the page, any of these impulses are quickly catered to. Therefore making personalisation and social media referrals more active and probable.

Home everywhere

Section pages, topic pages and artsicle pages were treated and given the same importance as the home page. Since now a reader encounters a site from either social media, email referrals or by organic search, each page and section were designed and planned to be a complete experience.

The main masthead is designed to help a reader access any material on the site in a neat, predictable and very accessible manner. It also allows the editorial team to highlight a key trending topic, which has special coverage for a reader to be attracted and informed.

As more and more readers come from social media or email referrals to an artsicle, the same masthead in articles pages also now allows all the JUST IN artsicle headlines to appear. This makes the page give a complete 360 degree view of the site content at a glance.

Form follows content

To help The Hindu establish itself in the minds of new readers and old patrons as a creator of superior, diverse content, we devised a section called Hindu Specials. it will house four types of special content that the old site failed to highlight and display. Packages, Series were old specials, to which we proposed, and added Case Files and a Microsite.

These specials will allow a reader to choose a longform topic being investigated and subjects of cultural importance to follow and get all news related to it in one place. It cements the reader’s loyalty to the site for its content, and the value the site puts on its information display.

As The Hindu is a paper of record for elections and data, microsites would attract readers, researchers and advertisers looking for current and accurate news in one place.

The same template should be used for big happenings across all categories like sports, entertainment, environmental, social issues.

Visual Design

Cardified news headlines and lede text approach, where each headline has the possibility of being individually shared on social media, makes it a compelling design.

The specials are treated differently to draw attention and stand out. The right hand side column houses the more important articles, trending and editor’s choice of the certain section, making the whole horizontal section, rich, complete and satisfying as a unit for the reader.

The mobile view was simplified for better navigation and user engagement while keeping the key decisions same across devices.

Engaging widgets for stories were device and entertainment and sports were given a livelier look by colour change and dynamic carrousel design.

Typography

Two fonts were chosen to balance the Hindu personality with the need to cue change. Fira Sans and Modern Sans serif typeface was chosen to highlight current and happening news. Larger font sizes, bolder and the occasional use of colour are signals its new relevance for new Hindu readers.

This was juxtaposed with Tundra, a serif font, designed lately for great reading experience for the web and mobile devices. Its larger x-height and yet the humanist touch of old school serif fonts made it the right choice for this site.
All font decisions across the site were taken after testing and keeping in mind great readability on desktop and mobile both.

Given the constraint of designing within a 1000 px width the right choice of typeface was crucial to allow great throw and a smooth reading experience.

www.thehindu.com