CssGlance gallery » Grid

30+ examples of Newspapers/breaking news websites

Roberto — Tue, 07 Apr 2009 20:05:58 +0000

As well as an important resource of daily news, newspapers and news websites represent a source of inspiration for designers, especially for the solutions found in the use of typography and in the use of grids to paginate the different kind of content published on them.

Here 30+ examples of newspapers and breaking news sites from all around the world.

20minutes (France)

BBC (UK)

Bild (Germany)

Boston Globe (USA)

Cbs News (USA)

Chicago Tribune (USA)

Cnn (USA)

Corriere della Sera (Italy)

DN (Sweden)

El Mundo (Spain)

El Pais (Spain)

Faz (Germany)

Guardian (UK)

Irish Times (Ireland)

Jacksonville (USA)

LA Times (USA)

Le Monde (France)

Libération (France)

Msnbc (USA)

Ny Daily News (USA)

NY Times (USA)

San Francisco Gate (USA)

Smh (Australia)

Standaard (Belgium)

Telegraph (UK)

The Age (Australia)

The Sun (UK)

Times on line (UK)

Washington Post (USA)

Washington Times (USA)

Wall Street Journal (USA)

List of grid-based design resources

Roberto — Tue, 01 Apr 2008 07:12:08 +0000

On Vandelay’s website a collection of 65 resources about grid based design: handful tools to improve efficiency and effectiveness of your project, as well as some articles for advanced techniques.

“Design” tool

Roberto — Sun, 23 Dec 2007 10:51:52 +0000

Design is a suite of web-design and development assistive tools which can be utilised on any web-page. Encompassing utilities for grid layout, measurement and alignment, Design is a uniquely powerful JavaScript bookmarklet that could be really useful for analysing and creating grid-based websites.

Gridding Design

Andrea - CSSGlance Staff — Wed, 05 Sep 2007 20:21:05 +0000

Using grids for laying content out is one of the basic principle of graphic design, at least since the Medieval Age.

Much more recent is the bright idea of using grids for designing websites, in order to laying out harmonic website and increase the legibility of your designs.

For all those people who are interested in deepen gridding design for websites, please keep an eye on these slides, “Grids are Good (right?)“, kindly made available by the authors Mark Boulton, Mark Boulton Design, and Khoi Vinh, Design Director for NYTimes.com.

In the ppt presentation, the authors show a good example of website redisign. They redisign www.yahoo.com using grid design. What comes out is absolutely wonderful and fashinating, and gives a lot of useful tips for new design or simply redesign based on this bright technique.

The podcast related to the presentation was recorded during the Conference at Austin, Texas, May 9-18, 2007 (South by Southwest Conferences and Festivals) and is available online.

We hope you’ll find this reading interesting. We’ll make soon available some other useful resources on gridding design for harmonic websites.

Using a Background Image Grid to Lay Out Your Web Site

Andrea - CSSGlance Staff — Sat, 02 Jun 2007 09:42:36 +0000

Christian Watson, the author of Smiley Cat Web Design, explains this useful technique on his website incuding the Fireworks source file of the grid. You apply the grid to the body of your page as a background image so that it displays behind your site. Thus you can use it to precisely line up your layout.