10 Best News Site Designs [+ What We Like About Them]

Download Now: Free Website Design Inspiration
Anna Fitzgerald
Anna Fitzgerald

Published:

News websites attract millions of visitors every month. CNN, for example, got 399.4 million monthly visits in December 2021.

Best news site design example on a tablet

Since they get so many visitors, news sites must showcase as much of their content as possible in a way that’s as easy to read and access, and make the rest easy to find. This means typography that’s legible across all device types, detailed navigation menus that clearly display all its categories and subcategories, and clean layouts with lots of white space.

Below we’ll look at some of the best modern and simple news websites that check off all these boxes and more.

Get Inspired: 77 Examples of Exceptional Web Design  [Free Download]

1. Beautiful News

Beautiful News website features full-width video with pink button featuring duration time of video

Beautiful News is a simple news site that publishes one video story every day. These stories are meant to provide comfort, relief, and motivation. In addition to its publishing cadence and exclusive video content, Beautiful News is unique because it uses a black background, white text, and neon pink accent color.

What we like: The black background of Beautiful News makes the video thumbnails, newsletter opt-in form, and other elements pop.

2. De Morgen

De Morgen news website design uses different typography for advertisements

De Morgen is a Flemish newspaper that covers politics, economy, science, opinion, sports, and other categories. Its website combines bold typography with high-quality images for maximum readability. It also uses a different font and colored label for advertisements to clearly differentiate them from articles.

What we like: De Morgen uses different typography for its advertisements to subtly differentiate them from news articles without disrupting the layout.

3. Healthline Transform

Healthline Transform news website design features animations and other effects

Healthline Transform is an interactive website dedicated to providing coverage of breakthrough innovations and technologies shaping the future of health. Its website design is as modern as the innovations and technologies it writes about, using animations and colors to engage and delight users.

What we like: Healthline Transform invites visitors to read their featured articles by clicking and holding the animated cursor, or clicking the next icon.

4. The Art Newspaper

The Art Newspaper news website design has clean layout thanks to generous white space

The Art Newspaper provides international news and events related to the visual arts world. Its website uses a simple black-and-white design with a maroon accent color for categories and links on hover. This color scheme complements the minimalist layout that uses whitespace to clearly separate different sections and articles from each other.

What we like: The Art Newspaper uses a generous amount of white space to maximize readability.

5. Badische Neueste Nachrichten

BNN news website design uses iconography to denote premium articles for paying subscribers only

Badische Neueste Nachrichten, or BNN, is a regional newspaper in Karlsruhe, Germany. Its black-and-white design is complemented by colorful icons. One — the yellow badge — denotes articles for paying subscribers. The other depicts an open book and draws attention to the reading time of each article.

What we like: BNN uses iconography to clearly denote the reading time of each article, and which are exclusive to subscribers.

6. The New York Times

The New York Times news website design features a vertical navigation menu collapses behind hamburger button

The homepage of The New York Times features their primary navigation menu just below the header and above the content, like most news websites. But it also includes it in the upper-left corner of each page. If you click the hamburger button in the corner, a vertical menu will appear. If you hover over one of these navigation links, like Arts, a secondary drop-down menu will appear. This makes it easier for visitors to navigate to a very specific section or to browse.

What we like: The New York Times features a vertical navigation menu for visitors who want to skip to a specific subsection and for those who want to browse.

7. Fast Company

Fast Company news website design features four articles in animated slider

Fast Company has a more modern design than traditional news sites like NYT. It uses several fonts and colors, and images that feature illustration and graphic design elements. Its hero section includes an animated slider that rotates through four articles, with a slightly transparent dark navigation menu overlaid on top.

What we like: Fast Company features four articles in an animated slider above the fold to immediately grab the reader’s eye.

8. Los Angeles Times

Los Angeles Times news website design uses white space and divider lines to organize sections

Los Angeles Times is a leading source of breaking news, entertainment, science, sports, and more. Its website has a clean layout that makes strategic use of typography, white space, images, and divider lines to organize its different sections. For example, the Science section is divided into recent headlines, most read articles, and major subcategories.

What we like: Los Angeles Times uses visual hierarchy and divider lines to create a clean, organized layout.

9. Blavity News

Blavity news website design features full-width slider of featured articles in hero section

Blavity News provides culturally relevant news, insights, and commentary by and for Black millenials. Its hero section is designed to draw visitors in: featured articles are showcased in a slider with full-width images, large titles, and pops of color. For readers who aren’t interested in the featured articles, they can navigate to other sections using the navigation bar at the top of the screen or they can click on one of the headlines featured in the scrolling banner below.

What we like: Blavity News immediately captures readers’ attention with its slider of featured articles with full-width images.

10. TIME

TIME news website design features brand color red to draw attention to CTAs and other elements

TIME provides coverage of breaking news and analysis in politics, science, health, entertainment, and more. Its black and white design incorporates pops of red. This not only aligns with its brand identity, as shown by the logo in the top left corner — it also subtly draws the reader’s eye to elements on the page, like the sign-in and subscribe CTA buttons.

What we like: TIME uses red as an accent color to strengthen its brand identity and subtly draw readers’ attention to CTA buttons and other elements.

News Site Designs to Inspire Your Own

The news site designs above are some of the best on the internet because they are centered around the principles of readability, simplicity, and user centricity. If you’re creating your own news site, take inspiration from them to ensure you’re showcasing your best and latest content and making the rest easily accessible.

examples of brilliant homepage, blog, and landing page design

Related Articles

We're committed to your privacy. HubSpot uses the information you provide to us to contact you about our relevant content, products, and services. You may unsubscribe from these communications at any time. For more information, check out our Privacy Policy.

77 of blog and website page design examples.

CMS Hub is flexible for marketers, powerful for developers, and gives customers a personalized, secure experience

START FREE OR GET A DEMO