Simon Griffee

What: Website Design

• Arguman #

  Open source argument analysis platform for critical thinking using argument maps. Love the design that uses American Typewriter.

• Designers That Code #

  Jenifer Tidwell:

  So, it’s possible to be seen as both a designer and a coder. But it requires very, very careful management of your personal brand. Set expectations clearly, and defend your personal boundaries — if you’re doing more coding than you like, you’ll have to decide when and how to push back or ask for more design responsibility.

• Website Redesign

  Ferns in spring in Inwood Hill Park, New York City, May 2016. After eleven years apart, hypertexthero.com (design) and simongriffee.com (photography) were combined into one — this — website. If you came here looking for photographs, don’t worry, those are not going away and regular entries depicting the streets of New York will resume shortly right here in the Notebook (the front page). A mailing list is still available for my six faithful subscribers, as is an RSS syndication feed, and you can now browse content by keyword, time, location and the randomness of life thanks to Hugo’s wonderful Taxonomies system. …continue

• Websites

  A few websites I have made in the past. …continue

• International Plant Protection Convention Website

  …continue

• TODO Useful Links in Printed Webpages #

  <!-- URLs in printed page - http://stevelosh.com/blog/2010/09/making-my-site-sing/ -->
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
  <script type="text/javascript" charset="utf-8">
      $(function() {
          $('#content p:has(a)').add('#content ol:has(a)').add('#content ul:has(a)').each(function() {
              var printing_links = $(this).find('a')
                                          .not("[href^='#']")
                                          .not(":has(img)")
                                          .clone();
              $(this).after(printing_links);
  
              printing_links.wrap('<li></li>')
                            .parent()
                            .wrapAll('<ul class="print-links"></ul>');
  
              printing_links.each(function() {
                  var href = $(this).attr('href');
                  if (href.match("^/")) {
                      href = 'http://hypertexthero.com' + href;
                  }
                  $(this).after(': ' + href);
              });
          });
      });
  </script>
  

• Web Design: Where to Begin

  To make good websites you need good writing skills. Clear writing is good web design. You also need to know some Hypertext Markup Language (HTML) to define your content (text, images, etc) in a way a web browser can understand, and some Cascading Style Sheets (CSS) to control how this content is presented. Begin by reading the classic article on web design: A Dao of Web Design. Then: On the Web Any of the following resources (I particularly like Simple & Useful) are good ways forward: …continue

• IT Wishlist Web Application

  …continue

• Earth Among the Stars

  

  HTML, CSS, Monospaced Font

  I was reading Carl Sagan and Olaf Stapledon and decided to make a simple HTML and CSS experiment. See also: A typography template.

• Food News Web Application

  …continue

• Web Typography Template

  Good web design involves good writing and good typography. To offer the latter to anybody looking to make reading easy on a web browser or a mobile device, I made an HTML & CSS template using the first chapter of Olaf Stapledon’s Star Maker as example text and the Georgia typeface. Here’s the HTML and CSS code, and here’s a preview image:

  See also: Another template using the Roboto typeface.

  …continue

• Australian Plant Biosecurity Program Website & Graphic Design

  …continue

• F*!@#$% Accessible FAQ

  …continue

• Angelo Paionni Photographer Website

  …continue

• Pasta Clock

  

  Pasta Clock

  Graphic design, website design, copywriting

  Problem

  Overcooked pasta.

  Solution

  I worked with Jimmy Boss to cobble together a website that helps everyone cook pasta al dente rather than al mush.

  Work Done

  Graphic design, HTML markup, CSS, JavaScript hacking. Visit site →