{"id":765,"date":"2007-07-02T23:58:17-04:00","date_gmt":"2007-07-03T03:58:17+00:00","guid":{"rendered":"http:\/\/peterjanes.ca\/blog\/2007\/07\/02\/true-blue\/"},"modified":"2007-07-02T23:58:17-04:00","modified_gmt":"2007-07-03T03:58:17+00:00","slug":"true-blue","status":"publish","type":"post","link":"https:\/\/peterjanes.ca\/blog\/2007\/07\/02\/true-blue\/","title":{"rendered":"True&nbsp;Blue"},"content":{"rendered":"<div class='e-content'><p>After a <em>long<\/em> development period, last week I finally relaunched my <a href=\"http:\/\/peterjanes.ca\/LenniFan\/\">fan site for Lenni Jabour<\/a> and her compatriots.  It&#8217;s even got a title now&#8212;<cite class=\"title\">True Blue: The Music of Lenni Jabour<\/cite>&#8212;and a theme to match, and there&#8217;s a whole whack of new content with more appearing on a regular basis.<\/p>\r\n\r\n<p>As part of the redevelopment I&#8217;ve been able to take advantage of various tricks and methods I&#8217;ve found around the web:<\/p>\r\n\r\n<ul>\r\n<li><a href=\"http:\/\/cssplay.co.uk\/layouts\/background.html\">Stretchy backgrounds<\/a>.  After <a href=\"http:\/\/peterjanes.ca\/blog\/2007\/05\/20\/stretchy-background-images\/\">trying<\/a> to create a markup-free version I gave in and changed the page template.<\/li>\r\n<li>The <a href=\"http:\/\/www.1pixelout.net\/code\/audio-player-wordpress-plugin\/\">1pixelout audio player<\/a>, in <a href=\"http:\/\/www.macloo.com\/examples\/audio_player\/index.html\">standalone mode<\/a>.  I found this via <a href=\"http:\/\/www.scottandrew.com\/wordpress\/archives\/2007\/06\/getting_more_listens.html\">Scott Andrew<\/a>, whose <a href=\"http:\/\/www.scottandrew.com\/weblog\/articles\/cbs-events\">addEvent function<\/a> (also present) might be the most widely-used JavaScript routine in the history of the web.<\/li>\r\n<li><a href=\"http:\/\/www.stringify.com\/words\/javascript\/class_attributes_javascript_and_you.html\">CSS manipulation and utility functions<\/a> from <a href=\"http:\/\/www.stringify.com\/\">Stringify<\/a>.<\/li>\r\n<li>Display of <code>blockquote<\/code> attributes which browsers generally don&#8217;t make visible.  I hacked <a href=\"http:\/\/www.1976design.com\/blog\/archive\/2003\/11\/10\/updates\/\">Dunstan Orchard&#8217;s original version<\/a> to work in XHTML and to support the <code>title<\/code> attribute.<\/li>\r\n<\/ul>\r\n\r\n<p>I&#8217;ve also availed myself of <a href=\"http:\/\/flickr.com\/creativecommons\/\">Flickr&#8217;s Creative Commons Search<\/a>, specifically images using the <a href=\"http:\/\/creativecommons.org\/licenses\/by\/2.0\/\">Attribution license<\/a>.  Credit is provided using a (slight) variation of <a href=\"http:\/\/diveintomark.org\/archives\/2007\/02\/15\/cc-vs-gpl\">Mark Pilgrim&#8217;s template<\/a>.  In places where I&#8217;ve used my own photographs I&#8217;ve licensed them either under <a href=\"http:\/\/creativecommons.org\/licenses\/by\/2.0\/\">Attribution<\/a> or <a href=\"http:\/\/creativecommons.org\/licenses\/by-nc-nd\/2.0\/\">Attribution-NonCommercial-NoDerivs<\/a>.<\/p>\r\n\r\n<p>As part of the redesign I chose to change the URL structure slightly; although it&#8217;s not <a href=\"http:\/\/www.w3.org\/Provider\/Style\/URI\">cool<\/a> to do so, I think it&#8217;s a lot more future-proof.  To keep the web happy I&#8217;ve put <a href=\"http:\/\/www.w3.org\/Protocols\/rfc2616\/rfc2616-sec10.html#sec10.3.2\">permanent redirects<\/a> in place so that <em>every old-style link will continue to work<\/em>, something I wish more <a href=\"http:\/\/www.insidethecbc.com\/technology\/the-worlds-smallest-broadcast-quality-recorder\/\">sites<\/a> <a href=\"http:\/\/fucoder.com\/code\/permalink-redirect\/\">would do<\/a>.  I think it&#8217;s worth mentioning that the coolness that <em>was<\/em> present in the original structure&#8212;above all, the <a href=\"http:\/\/www.w3.org\/Provider\/Style\/URI#remove\">avoidance of technology-revealing\/limiting extensions<\/a> except where necessary&#8212;is still present.<\/p>\r\n\r\n<p>A less-obvious change is that in several places I&#8217;ve taken a single lengthy page and split it out into many shorter ones.  The original sections were all marked with anchors so they could be accessed directly, so I wrote a quick little function that would direct any <samp>#fragment-id<\/samp> links to those sections to the new pages.  For example, <a href=\"http:\/\/peterjanes.ca\/LenniFan\/thirdfloor\/#alex\">Alex McMaster<\/a> and <a href=\"http:\/\/peterjanes.ca\/LenniFan\/thirdfloor\/#claire\">Claire Jenkins<\/a> (as well as the rest of the <a href=\"http:\/\/peterjanes.ca\/LenniFan\/thirdfloor\/\">members of The Third Floor<\/a>) now have their <a href=\"http:\/\/peterjanes.ca\/LenniFan\/alex\/\">own<\/a> <a href=\"http:\/\/peterjanes.ca\/LenniFan\/claire\/\">pages<\/a>; a browser with JavaScript enabled will be directed to the individual page, while others will be taken to the location on the page as before.<\/p>\r\n\r\n<p>Finally, there are a couple of spam-prevention measures in place, one of my own devising and one from the web at large.  (I could tell you what they are, but then I&#8217;d have to kill you.)  The former has been remarkably successful in the five-plus years I&#8217;ve had it in place, but I decided to add the latter to be a little more proactive.<\/p>\r\n\r\n<p>The new site has been a labour of love, to put it mildly, and I&#8217;m very pleased with how it&#8217;s turned out.  Thanks to those who&#8217;ve looked at preliminary versions and provided feedback, particularly and especially <a href=\"http:\/\/www.myspace.com\/joeyjojoba\">Jo-Ann<\/a>, <a href=\"http:\/\/edjanes.ca\/\">Ed<\/a>, and of course <a href=\"http:\/\/www.lennijabour.com\/\">Miss Lenni Jabour of The Third Floor<\/a>.<\/p><\/div><div class=\"syndication-links\"><\/div>","protected":false},"excerpt":{"rendered":"After a long development period, last week I finally relaunched my fan site for Lenni Jabour and her compatriots. It&#8217;s even got a title now&#8212;True Blue: The Music of Lenni Jabour&#8212;and a theme to match, and there&#8217;s a whole whack of new content with more appearing on a regular basis. As part of the redevelopment&hellip;","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"mf2_syndication":[],"venue_id":0},"categories":[2,3],"tags":[],"kind":false,"_links":{"self":[{"href":"https:\/\/peterjanes.ca\/blog\/wp-json\/wp\/v2\/posts\/765"}],"collection":[{"href":"https:\/\/peterjanes.ca\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/peterjanes.ca\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/peterjanes.ca\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/peterjanes.ca\/blog\/wp-json\/wp\/v2\/comments?post=765"}],"version-history":[{"count":0,"href":"https:\/\/peterjanes.ca\/blog\/wp-json\/wp\/v2\/posts\/765\/revisions"}],"wp:attachment":[{"href":"https:\/\/peterjanes.ca\/blog\/wp-json\/wp\/v2\/media?parent=765"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/peterjanes.ca\/blog\/wp-json\/wp\/v2\/categories?post=765"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/peterjanes.ca\/blog\/wp-json\/wp\/v2\/tags?post=765"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}