My ancient landing page, re-written in “FML.”

index.fml

html
   (xmlns http://www.w3.org/1999/xhtml
    xml:lang en)
   head
      title elliottcable
      link(rel copyright
         , href http://creativecommons.org/licenses/by-nc-sa/3.0/, type text/html;charset=utf-8)
    
      link(, rel openid.server, href http://www.myopenid.com/server)
      link(, rel openid.delegate, href http://elliott.cable.myopenid.com/)
      link(, rel openid2.local_id, href http://elliott.cable.myopenid.com)
      link(, rel openid2.provider, href http://www.myopenid.com/server)
      meta(, name microid, content mailto+http:sha1:dd5d6b0bc85a5932dd8b630ba505bde075e6b9ee)
      link(, rel pavatar, href http://elliottcable.name/pavatar.png)
    
      link(, rel alternate, title elliottcable
           , href http://elliottcable.name/index.xml, type application/atom+xml)
    
      link(rel stylesheet
         , href http://resources.yreality.net/Design/960/reset.css, type text/css;charset=utf-8)
      link(rel stylesheet
         , href http://resources.yreality.net/Design/960/text.css, type text/css;charset=utf-8)
      
      script(type text/javascript)
       """ if(typeof xmlNS === 'undefined') {
             var xmlNS = document.lastChild.namespaceURI };
           if(typeof _gaq === 'undefined') { _gaq = new(Array) };
           
           _gaq.push(['_setAccount', "UA-5294724-1"]);
           _gaq.push(['_trackPageview']);
           
           (function() {
             var ga = document.createElementNS(xmlNS, 'script');
             ga.type = "text/javascript"; ga.async = true;
             ga.src = "http://www.google-analytics.com/ga.js";
             
             document.getElementsByTagNameNS(xmlNS, 'head')[0].appendChild(ga);
           })(); """
      
      style
       """ @import url('http://resources.yreality.net/Design/Typography/Typography.css') screen, print;
           
           html {
             height: 100%;
             background: white;
           }
           body {
             height: 95%;
             font: 100 125%/1.6 "Diavlo";
             color: black;
           }
           
           a { color: blue; text-decoration: none; }
           a:hover {
             color: black;
             text-decoration: none;
           }
           
           a:visited { color: #581C90; }
           a:visited:hover {
             text-decoration: none;
           }
           
           #acontlol {
             height: 100%;
             display: table !important;
             margin: auto
           }
           #acontlol > * {
             display: table-cell !important;
             vertical-align: middle !important
           }
           
           /* ... etceteras */ """
   
   body
      
      div(id header)
         a(, id download, rel me
             href http://elliottcable.name/elliottcable.vcf)
            span download my vCard
      
      div(id acontlol)
         address(, id hcard-elliott-cable, class vcard)
            ul(id navigation)
             > li >> a(  href http://blog.elliottcable.name/) blog
             > li >> a(  href http://by.elliottcable.name/) projects
             > li >> a(, href http://elliottcable.name/resume.xhtml, class emphasized) hire me!
            h1(class title)
               a(, class url fn uid, rel me openid.delegate
                   href http://elliottcable.name) elliottcable
            h2(class subtitle) of
               a(, class org url, href http://yreality.net, rel me) yreality
            
            div(class adr)
               > span(class type) Home >> span(class type invisible) pref
               a(href http://maps.google.com/maps?q=5258+Christian+Drive+Wilmington+N.C.+28403&t=h&z=17)
                  span(class street-address) 5258 Christian Drive
               a(href http://maps.google.com/maps?q=Wilmington+N.C.+28403&t=m&z=8)
                > span(class locality) Wilmington > span(class region) N.C. > span(class postal-code) 28403
               a(href http://maps.google.com/maps?q=U.+S.+A.&t=m&z=4)
                  span(class country-name) United States
            
            div(class tel preferred)
               > span(class type) Google Voice > span(class type invisible) pref
               > a(href skype:+19196364204?call) >> span(class value) +1.919.636.4204
            div(class ims)
               span(class label) Instant Messengers
               a(, class url preferred, rel me, href xmpp:me@ell.io) Jabber
               a(, class url, rel me, href aim:goim?screenname=me@ell.io) AIM
            div(class sites)
               span(class label) Elsewhere
               a(, class url preferred, rel me, href http://plus.google.com/u/0/102182587983077730488) Google+
               a(, class url preferred, rel me, href http://github.com/elliottcable) GitHub
               a(, class url preferred, rel me, href http://flickr.com/photos/elliottcable/) Flickr
               a(, class url preferred, rel me, href http://open.spotify.com/user/elliottcable) Spotify
               a(, class url preferred, rel me, href http://last.fm/user/elliottcable) Last.fm
               a(, class url, rel me, href http://twitter.com/elliottcable) Twitter
               a(, class url, rel me, href http://dribbble.com/elliottcable) Dribbble
               a(, class url, rel me, href https://foursquare.com/elliottcable) foursquare
            address(class emails)
               a(, class email preferred, rel me, href mailto:me@ell.io) me@ell.io
               a(, class email, rel me, href mailto:elliottcable@yreality.net) elliottcable@yreality.net
      
         div(id footer)
          > a(, href http://www.josbuivenga.demon.nl/index.html, rel acquaintance colleague) typophility
          > abbr(title Microformats) >> a(href http://microformats.org/) µformats
          > a(, href http://no>www.org/, title The no-www project: www. is deprecated!) no‐www
          > abbr(title XHTML Friends Network) >> a(, rel profile, href http://gmpg.org/xfn/11) XFN
          > a(, href http://openid.net/, title You're looking at my identity URI) OpenID