info343/homework/2/hw2_skeleton.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
   <!--
   Skeleton HTML file for INFO 343 Homework 2, Autumn 2012
   Morgan Doocy (mdoocy@uw.edu)
   6 October 2012
   -->
   <head>
      <title>INFO 343 (D)esign blog</title>
      <meta http-equiv="Content-type" content="text/html;charset=UTF-8" />
      
      <!-- this links to your stylesheet, as named for Part A (rename for Part B) -->
      <link href="a-designblog.css" type="text/css" rel="stylesheet" />
   </head>
   
   <body>
      <h1>INFO 343 D.</h1>
      
      <h1>the INFO 343 design blog</h1>
      
      <ul>
         <li><a href="#">Home</a></li>
         <li><a href="#">About</a></li>
         <li><a href="#">Archives</a></li>
         <li><a href="#">Links</a></li>
      </ul>
      
      <h3>Related Links</h3>
      <ul>
         <li><a href="http://www.markboulton.co.uk/journal/comments/five-simple-steps-to-designing-grid-systems-preface">Five Simple Steps to Designing Grid Systems</a> &mdash; Mark Boulton</li>
         <li><a href="http://mezzoblue.com/archives/2005/05/13/columns_gr/">Columns &amp; Grids</a> &mdash; Dave Shea</li>
         <li><a href="http://www.alistapart.com/articles/settingtypeontheweb">Setting Type on the Web to a Baseline Grid</a> &mdash; Wilson Miner</li>
         <li><a href="http://www.puidokas.com/portfolio/gridfox/">GridFox</a> &mdash; The Grid Layout Firefox Extension by <a href="http://www.puidokas.com/">Eric Puidokas</a></li>
      </ul>
      
      <h2><a href="http://www.smashingmagazine.com/2007/04/14/designing-with-grid-based-approach/">Smashing Magazine: Designing With Grid-Based Approach</a></h2>
      
      <div><img src="http://info343.ischool.uw.edu/homework/2/subtraction.png" alt="Screenshot of Subtraction.com" /></div>
      
      <p>Posted by <a href="http://courses.washington.edu/info343/#!/staff/josh-villars/">Josh Villars</a> on October 6, 2012</p>
      
      <p>A great article on grid-based designs:</p>
      
      <blockquote>
         <p>
            The main idea behind grid-based designs is a <strong>solid visual and structural balance of web-sites</strong> you can create with them. Sophisticated layout structures offer more flexibility and enhance the visual experience of visitors. In fact, users can easier follow the consistency of the page, while developers can update the layout in a well thought-out, consistent way. However, it’s quite hard to find your way through all the theory behind grid systems: it isn’t easy at all. Some important notions and related key-facts can help to learn basics and keep essential techniques in mind.
         </p>
      </blockquote>
      
      <p><a href="http://www.smashingmagazine.com/2007/04/14/designing-with-grid-based-approach/">Read more&hellip;</a></p>
      
      <h2><a href="http://24ways.org/2006/compose-to-a-vertical-rhythm">24 Ways: Compose to a Vertical Rhythm</a></h2>
      
      <div><img src="http://info343.ischool.uw.edu/homework/2/24ways.png" alt="Screenshot of 24 Ways article &quot;Compose to a Vertical Rhythm&quot;" /></div>
      
      <p>Posted by <a href="http://courses.washington.edu/info343/#!/staff/stephy-ma/">Stephy Ma</a> on October 4, 2012</p>
      
      <p>How to align type vertically to a grid:</p>
      
      <blockquote>
         <p>
            &ldquo;Space in typography is like time in music. It is infinitely divisible, but a few proportional intervals can be much more useful than a limitless choice of arbitrary quantities.&rdquo; So says the typographer Robert Bringhurst, and just as regular use of time provides rhythm in music, so regular use of space provides rhythm in typography, and without rhythm the listener, or the reader, becomes disorientated and lost.
         </p>
      </blockquote>
      
      <p class="more"><a href="http://24ways.org/2006/compose-to-a-vertical-rhythm">Read more&hellip;</a></p>
      
      <h2><a href="http://www.subtraction.com/2007/03/19/oh-yeeaahh">Grids Are Good (Right?)</a></h2>
      
      <div><img src="http://info343.ischool.uw.edu/homework/2/grids-are-good.png" alt="Screenshot of slide from presentation &quot;Grids are Good&quot;" /></div>
      
      <p>Posted by <a href="http://courses.washington.edu/info343/#!/staff/steven-markham/">Steven Markham</a> on Semptember 29, 2012</p>
      
      <p>Here&rsquo;s a great presentation on grid-based web design made by Khoi Vinh and Mark Boulton at SXSW Interactive 2007.</p>
      
      <ul>
         <li><a href="http://www.subtraction.com/2007/03/19/oh-yeeaahh">Blog entry</a></li>
         <li><a href="http://www.subtraction.com/pics/0703/grids_are_good.pdf">PDF Slideshow</a></li>
      </ul>
      
      <p>&copy; INFO 343 Autumn 2012. Webdev is great! Maintained by <a href="http://courses.washington.edu/info343/#!/staff/morgan-doocy/">Morgan Doocy</a>.</p>
      
   </body>
</html>