Simulate background-clip: text for browsers that don't support it

Move the heading generating to a partial that iteratively wraps each character
of the heading in a <span>. The CSS for the site heading uses :nth-child to
color each span a different color.

layouts/partials/header.html

@@ -3,7 +3,7 @@
 <header class="site">
   <div class="platter grid">
     <h1 class="site">
-      <a class="site-name" href="{{ `` | absURL }}">Eryn Wells</a>
+      <a class="site-name" href="{{ `` | absURL }}">{{ partial "site_name.html" site.Params.shortTitle }}</a>
     </h1>
     <nav class="site bulleted">
     {{ with site.Menus.main }}

layouts/partials/site_name.html

@@ -0,0 +1 @@
+{{ range (split . "") }}<span>{{ . }}</span>{{ end }}