Trends in News and Magazine-Style Web Design
by Vandelay Website Design on April 5, 2010
News and magazine-style sites tend to follow some specific trends. In this post we’ll take a detailed look at the design trends of news sites with plenty of examples, and the end of the post includes a showcase of sites.
If you’re working on designing a magazine-style site or blog theme, taking these trends into consideration may help.
White (or Light) Backgrounds
Like most content-heavy sites, news and magazine-style sites tend to have white or light-colored backgrounds, which is generally better for readability. Of course, there are exceptions to this, but especially among the major news sites, white backgrounds rule.
Grid-Based
Layouts of news sites are often grid-based. Grids are especially effective for these types of sites because there are generally several columns and lots of articles excerpts and sub-sections throughout the front page. The grid helps to keep the content well-spaced and scannable.
Typography as a Design Element
News sites have to fit a lot of content onto the page. There is of course text and headlines, images, navigation, advertisements, and it all results in pages that frequently don’t have a lot of excess design elements. the grid layout and typography wind up being a significant design element on many news and magazine sites.
Image Thumbnails
Most news or magazine-style sites include links to a lot of articles or posts from the front page. It’s very common for these articles to have a thumbnail image associated with them, especially for lead stories.
Prominent Site Search
With so much content on the site, a site-wide search is critical to helping visitors find what they are looking for. Most news or magazine sites will include a site search in a prominent location that can be found quickly and easily. In many cases it is at the top of the page. Having a site search that is easy to find and effective at providing accurate results will help to keep visitors on the site and to improve usability.
Category-Based Navigation
With lots of content on a site it becomes necessary to have navigation that is logical and simple. Most news sites categorize the articles and allow visitors to find what they are looking for by providing category-based navigation.
Horizontal Navigation Menus
Although horizontal navigation menus are rather common on almost any type of site, they are especially common on news sites. Vertical menus are sometimes used for sub-navigation, but very few news sites use them for the primary navigation.
Drop Down Menus
Many of these horizontal menus are drop down or mega menus that expand to provide visitors with more options. With lots of content in various categories and su-categories, these types of menus can make it easier for visitors if they know where they want to go.
Sections for Video Content
In recent years as video has become more common online more news sites have established specific sections for video content. Often times the front page or the sidebar will include a section that showcases recent videos added to the site.
Popular Content Sections
With content that is added very quickly and frequently, helping visitors to find something is an important part of usability. Many news sites choose to show links to articles that are currently popular, this is frequently in the sidebar.
Social Media Integration
Like many blogs, most news sites are now including social media and social networking integration. In some cases it may be voting buttons, or it could be links to Twitter and Facebook profiles.
Righthand Sidebars
Although some news sites use a sidebar at the left side, the typical layout is to have a right sidebar. In most cases this applies to the front page and to content pages.
Showcase of Magazine-Style Websites:
Here is a look at 25 well-designed sites with a magazine-style. For more see our previous posts 25 Outstanding Magazine Style Website Designs and 25 Magazine-Style Layouts for Your Design Inspiration.
Singapore International Foundation
For more design inspiration please see:
- 50 of the Best Church Website Designs
- 40 of the Best Websites of Non-Profit Organizations
- 37 of the Best Designs from the Travel Industry
- 25 of the Best Websites for Educational Institutions
- 25 of the Best Photographer Portfolio Websites



































