3

Ultimate Guide to Grid-Based Web Design

Posted November 17th, 2009 in Web Design Tutorials and tagged by Mike Wagan

grid-based-layout

Web design trends now point to one aspect of using CSS for the basic website wireframe – Grid-based layouts. I haven’t actually used this into my projects lately, but I’m really planning to jump into the bandwagon. I don’t wanna be left out! I stumbled upon this site called 960 Grid System which offers a CSS generator for your grid layout, as well as examples of websites that use the grid-based system. Since then I’ve tried to go deeper into knowing how grid layouts work.

Recently, web design blog Noupe has published a complete guide all about grid based layouts – including techniques and tools:

Virtually any website you design should be based on a grid. Grids lend a sense of structure to your site and improved usability for your visitors. And designing to a grid can simplify your design process and make you a more efficient designer. In a grid-based design, since the guides are already in place for you, your options are reduced, making it easier to decide on the width and height of different elements on your pages.

All in all, it is a really good article especially for someone like me who want to know more about the concept of grid-based layouts and how to use them. Visit the article: Ultimate Guide To Grid-Based Web Design: Techniques and Tools

Share and Enjoy:
  • Print
  • Digg
  • del.icio.us
  • Facebook
  • Google Bookmarks
  • Live
  • Netvibes
  • NewsVine
  • Ping.fm
  • Reddit
  • RSS
  • Slashdot
  • StumbleUpon
  • Technorati
  • Twitter
  • Yahoo! Buzz
  • BlinkList

Related posts:

  1. Finally, Web Design Rework Complete! Before and After pics of my blog After weeks and weeks of painstaking tweaking with the design of this site,...
  2. Ultimate List of Restaurant City Cheats, Hacks, Tips and Tricks I’ve collected all the things you need for hacks, cheats and tricks from Facebook’s popular game, Restaurant City (made by...
  3. 28 HTML5 Features, Tips, and Techniques you Must Know I am excited about learning HTML5 and probably soon enough, this technology will change the Internet’s face completely – forget...
  4. Must Read for Web Designers – 10 Useful Usability Findings and Guidelines I just stumbled upon this today and I wish I’ve read this before: 10 Useful Usability Findings and Guidelines. Smashing...
  5. 21 CSS Tricks You Should Know Web designers rely heavily on the use of CSS or Cascading Style Sheets to set the design specifications of each...
  6. 3 Ways To Easily Get Full Screenshot of A Website (Firefox Add-ons) Making full screenshots of websites have been a common task for web designers or developers, because sometimes the websites aren’t...
  7. 9 Tips for Improving Drupal Performance I’ve started working on a Drupal Project just last month and although the learning curve is quite steep, its also...
  8. MS Visual Web Developer 2008 Inaaral ko ang Visual Web Developer 2008 sa ngayon. Wala pa talaga akong experience in coding ASP, much more ASP.net....
  9. Create multiple-step forms using CCK Fieldgroups in Drupal Lately I’ve been working on a Drupal project, and one aspect in our priority list is the user-friendliness for the...
  10. I am Back Into Blogging Its been a while since I blogged here again in my home site. My very first blog. And I don’t...

3 Responses so far.

  1. James Smith says:

    Wow… I’m stunned you could do that.

  2. Hello there, I must say it truly is a clever content. I’ll certainly be searching in on this website again quickly….

  3. Anonymous says:

    Restaurant Design Guidelines…

    Restaurant Design Guidelines First, the owner or manager of the restaurant to determine their target audience for this restaurant. Had in mind the class A, class B or C? Class B customers, payroll professionals and skilled workers. Class C clients incl…

Leave a Reply