<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>matt jones* &#187; Web</title>
	<atom:link href="http://mattjon.es/blog/category/web/feed/" rel="self" type="application/rss+xml" />
	<link>http://mattjon.es</link>
	<description></description>
	<lastBuildDate>Thu, 08 Mar 2012 22:51:38 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
		<item>
		<title>★ Google Goes Bing</title>
		<link>http://mattjon.es/blog/2010/06/google-goes-bing/</link>
		<comments>http://mattjon.es/blog/2010/06/google-goes-bing/#comments</comments>
		<pubDate>Fri, 11 Jun 2010 00:07:41 +0000</pubDate>
		<dc:creator>Matt</dc:creator>
				<category><![CDATA[Media]]></category>
		<category><![CDATA[Web]]></category>

		<guid isPermaLink="false">http://mattjon.es/blog/?p=3922</guid>
		<description><![CDATA[Yesterday saw the biggest change to the Google homepage since 1998. They replaced the minimal, functional and revolutionary design of the original - which has remained largely unchanged for 12 years - by adding a Bing-like background image that you &#8230; <p><a class="btn small" href="http://mattjon.es/blog/2010/06/google-goes-bing/">Continue reading <span class="meta-nav">&#8594;</span></a></p>]]></description>
			<content:encoded><![CDATA[<p><a href="http://mattjon.es/blog/wp-content/uploads/2010/06/goog.jpg"><img class="size-full wp-image-3923" title="Google" src="http://mattjon.es/blog/wp-content/uploads/2010/06/goog.jpg" alt="Google goes bing" width="500" height="377" /></a></p>
<p>Yesterday saw the biggest change to the Google homepage since 1998. They replaced the minimal, functional and revolutionary design of the original - which has remained largely unchanged for 12 years - by adding a Bing-like background image that you could change, but not remove.</p>
<p>Now, a few hours later, Google normality is restored; the 'Change background image' link is there, but it's something you opt into rather than not being able opt out of.</p>
<p>So it turns out this was a '24 hour experiment' to publicise the feature which, when you think about it, had to be the case otherwise Google's famous themed logos would have become redundant, and that would seem very odd given their popularity.</p>
<p>Still, it's surprising that Google appears to be so afraid of the growth of Microsoft's search engine that they decided to do this.<br />
﻿</p>
]]></content:encoded>
			<wfw:commentRss>http://mattjon.es/blog/2010/06/google-goes-bing/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>★ Getting Typekit to work with Chromium and Namoroka</title>
		<link>http://mattjon.es/blog/2009/11/getting-typekit-to-work-with-chromium-and-namoroka/</link>
		<comments>http://mattjon.es/blog/2009/11/getting-typekit-to-work-with-chromium-and-namoroka/#comments</comments>
		<pubDate>Fri, 27 Nov 2009 12:15:17 +0000</pubDate>
		<dc:creator>Matt</dc:creator>
				<category><![CDATA[Linux]]></category>
		<category><![CDATA[Web]]></category>

		<guid isPermaLink="false">http://mattjon.es/blog/?p=3518</guid>
		<description><![CDATA[Typekit really need to improve the way they do their user-agent detection. At the moment, it seems that if the user-agent-string doesn't contain either 'Firefox' or 'Safari', then Typekit won't work, even when the rendering engine is capable of rendering &#8230; <p><a class="btn small" href="http://mattjon.es/blog/2009/11/getting-typekit-to-work-with-chromium-and-namoroka/">Continue reading <span class="meta-nav">&#8594;</span></a></p>]]></description>
			<content:encoded><![CDATA[<p><a href="http://www.typekit.com">Typekit</a> really need to improve the way they do their user-agent detection. At the moment, it seems that if the user-agent-string doesn't contain either 'Firefox' or 'Safari', then Typekit won't work, even when the rendering engine is capable of rendering the fonts.</p>
<p>This isn't an issue for many. But it is if you're using a development build of a browser, or you're using a Linux distribution with a modified version of Firefox that, due to licensing restrictions, can't use the Firefox branding. In this case, the user-agent string will contain the development name of the browser, such as 'Shiretoko' or 'Namoroka'.</p>
<p>In Firefox, changing the user-agent string in about:config to 'Firefox' will solve this problem. In <a href="http://code.google.com/chromium/">Chromium</a> (the development build of Google Chrome), you'll need to launch the browser with a command something like this:</p>
<p><code>chromium-browser --user-agent="Firefox/3.5.5" --enable-remote-fonts</code></p>
<p>Recent builds of Chromium now support @font-face, so you might not need the -enable-remote-fonts option.</p>
<p>Hopefully, Typekit will improve their browser detection by checking the rendering engine in the user-agent string, rather than simply the browser name.</p>
]]></content:encoded>
			<wfw:commentRss>http://mattjon.es/blog/2009/11/getting-typekit-to-work-with-chromium-and-namoroka/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>★ The freedom to offend in 140 characters</title>
		<link>http://mattjon.es/blog/2009/11/the-freedom-to-offend-in-140-characters/</link>
		<comments>http://mattjon.es/blog/2009/11/the-freedom-to-offend-in-140-characters/#comments</comments>
		<pubDate>Sun, 01 Nov 2009 00:02:23 +0000</pubDate>
		<dc:creator>Matt</dc:creator>
				<category><![CDATA[Freedom]]></category>
		<category><![CDATA[Web]]></category>

		<guid isPermaLink="false">http://mattjon.es/blog/?p=3333</guid>
		<description><![CDATA[We cannot have a web on which a 140 character utterance of criticism against someone else causes a torrent of abuse against the offender and a front-page BBC article about the offendee's intention to quit because of it. Yesterday, Twitter &#8230; <p><a class="btn small" href="http://mattjon.es/blog/2009/11/the-freedom-to-offend-in-140-characters/">Continue reading <span class="meta-nav">&#8594;</span></a></p>]]></description>
			<content:encoded><![CDATA[<p>We cannot have a web on which a 140 character utterance of criticism against someone else causes a torrent of abuse against the offender and a front-page <a href="http://news.bbc.co.uk/1/hi/entertainment/8335793.stm">BBC article</a> about the offendee's intention to quit because of it. </p>
<p>Yesterday, Twitter user <a href="http://www.twitter.com/brumplum">Brumplum</a> criticised <a href="http://www.twitter.com/stephenfry/">Stephen Fry</a> by calling his tweets boring, and Stephen Fry reacted by threatening to quit Twitter. We'll look back on this and see how silly it all is, and in future BBC editors with publish more important news.</p>
]]></content:encoded>
			<wfw:commentRss>http://mattjon.es/blog/2009/11/the-freedom-to-offend-in-140-characters/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>★ HTML Five-O</title>
		<link>http://mattjon.es/blog/2009/08/html-five-o/</link>
		<comments>http://mattjon.es/blog/2009/08/html-five-o/#comments</comments>
		<pubDate>Sat, 01 Aug 2009 12:08:41 +0000</pubDate>
		<dc:creator>Matt</dc:creator>
				<category><![CDATA[Development]]></category>
		<category><![CDATA[Media]]></category>
		<category><![CDATA[Web]]></category>

		<guid isPermaLink="false">http://mattjon.es/blog/?p=2911</guid>
		<description><![CDATA[At last, I've finally knocked this site into a shape I'm happy with. You'll find no crufty div soup round here. It's all HTML5 goodness and it works on IE8 and IE7 using Remy Sharp's magic HTML5 enabling script. I &#8230; <p><a class="btn small" href="http://mattjon.es/blog/2009/08/html-five-o/">Continue reading <span class="meta-nav">&#8594;</span></a></p>]]></description>
			<content:encoded><![CDATA[<p>At last, I've finally knocked this site into a shape I'm happy with. You'll find no crufty div soup round here. It's all <a href="http://en.wikipedia.org/wiki/HTML_5">HTML5</a> goodness and it works on IE8 and IE7 using Remy Sharp's magic <a href="http://remysharp.com/2009/01/07/html5-enabling-script/">HTML5 enabling script</a>.</p>
<p>I found HTML5 to be a bit odd at first, but as I started experimenting with it, the simplicity and meaningfulness of HTML5 mark-up started to sink in. The best way to think of the new elements is something like this:</p>
<ul>
<li>use &lt;header&gt; and &lt;footer&gt; in the obvious places, this negates the need for &lt;div id="header"&gt; and &lt;div id="footer"&gt;</li>
<li>use &lt;section&gt; for the main sections of the page eg. &lt;div id="content"&gt;</li>
<li>use &lt;article&gt; where you would have &lt;div class="post"&gt;</li>
<li>use &lt;aside&gt; where you would have information related to an article, eg. &lt;div class="date"&gt;</li>
<li>use &lt;nav&gt; for your navigation links</li>
</ul>
<p>Then, instead of using IDs and classes, you use CSS selectors to select parts of the document tree to style. I found the W3C's <a href="http://www.w3.org/TR/css3-selectors/#selectors">table of CSS3 selectors</a> invaluable for this. I've mainly used CSS2 selectors for compatibility with IE and older versions of Firefox.</p>
<p>I've also made use of the @font-face selector to embed <a href="http://www.josbuivenga.demon.nl/museo.html">Museo</a> font for the heading styles. There's a good list of free fonts available for embedding on the <a href="http://www.webfonts.info/wiki/index.php?title=Fonts_available_for_%40font-face_embedding">Web Fonts Wiki</a>.</p>
<p>I must give credit to <a href="http://www.camendesign.com">Croc Camen</a> and <a href="http://www.alexgdesign.com">Alex Gibson</a> for their inspiring work with HTML5. I haven't had this much fun with web design in years.</p>
]]></content:encoded>
			<wfw:commentRss>http://mattjon.es/blog/2009/08/html-five-o/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>★ Pushing my Luck</title>
		<link>http://mattjon.es/blog/2001/02/pushing-my-luck/</link>
		<comments>http://mattjon.es/blog/2001/02/pushing-my-luck/#comments</comments>
		<pubDate>Fri, 23 Feb 2001 12:25:00 +0000</pubDate>
		<dc:creator>Matt</dc:creator>
				<category><![CDATA[Development]]></category>
		<category><![CDATA[Web]]></category>

		<guid isPermaLink="false">http://web-design-and-development/pushingmyluck</guid>
		<description><![CDATA[Dammit&#8230; I knew I was pushing my luck with IE5/Win and that graphic to the left. For those of you using IE5.0, you&#8217;ll notice that this image has gone a bit awry. This is because I decided to put a &#8230; <p><a class="btn small" href="http://mattjon.es/blog/2001/02/pushing-my-luck/">Continue reading <span class="meta-nav">&#8594;</span></a></p>]]></description>
			<content:encoded><![CDATA[<p><dull_entry>Dammit&#8230; I knew I was pushing my luck with <a href="http://www.microsoft.com/windows/ie/default.htm">IE5/Win</a> and that graphic to the left. For those of you using IE5.0, you&#8217;ll notice that this image has gone a bit awry. This is because I decided to put a drop shadow on the image and the only way to blend it in was to incorporate some of the table formatting in the bitmap itself. Of course, if <a href="http://www.microsoft.com">Microsoft</a> bothered to implement <a href="http://www.w3.org/Graphics/PNG/">png</a> compatibility into IE5.x/Win, I wouldn&#8217;t have this problem; I&#8217;d just create an image with partial transparency in <a href="http://www.macromedia.com/fireworks/">Fireworks</a>, save it as a 32bit png file and Bob&#8217;s your uncle. I might just do it anyway and suggest that people on a PC use <a href="http://home.netscape.com/download/">Netscape 6</a> instead. It also looks as though IE5/Win is resizing the table cells on the left even though I have told it not to. Hmmmm. Bare with me while I iron out the flaws&#8230; normal service will resume soon. </dull_entry></p>
]]></content:encoded>
			<wfw:commentRss>http://mattjon.es/blog/2001/02/pushing-my-luck/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>★ Almost There</title>
		<link>http://mattjon.es/blog/2001/02/almost-there/</link>
		<comments>http://mattjon.es/blog/2001/02/almost-there/#comments</comments>
		<pubDate>Thu, 22 Feb 2001 11:44:00 +0000</pubDate>
		<dc:creator>Matt</dc:creator>
				<category><![CDATA[Development]]></category>
		<category><![CDATA[Web]]></category>

		<guid isPermaLink="false">http://web-design-and-development/almostthere</guid>
		<description><![CDATA[OK. So it&#8217;s redesigned and it validates, but I&#8217;m not there yet. Now I&#8217;ve got a layout done in HTML tables, I&#8217;m going to replace them with CSS formatting in the near future. I suppose I&#8217;ve been working with tables &#8230; <p><a class="btn small" href="http://mattjon.es/blog/2001/02/almost-there/">Continue reading <span class="meta-nav">&#8594;</span></a></p>]]></description>
			<content:encoded><![CDATA[<p>OK. So it&#8217;s redesigned and it <a href="http://validator.w3.org/check/referer">validates</a>, but I&#8217;m not there yet. Now I&#8217;ve got a layout done in HTML tables, I&#8217;m going to replace them with CSS formatting in the near future. I suppose I&#8217;ve been working with tables for so long, it&#8217;s tricky to stop using them. </p>
]]></content:encoded>
			<wfw:commentRss>http://mattjon.es/blog/2001/02/almost-there/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>★ All New</title>
		<link>http://mattjon.es/blog/2001/02/all-new/</link>
		<comments>http://mattjon.es/blog/2001/02/all-new/#comments</comments>
		<pubDate>Thu, 22 Feb 2001 02:44:00 +0000</pubDate>
		<dc:creator>Matt</dc:creator>
				<category><![CDATA[Development]]></category>
		<category><![CDATA[Web]]></category>

		<guid isPermaLink="false">http://web-design-and-development/allnew</guid>
		<description><![CDATA[Phew&#8230; it&#8217;s been a struggle, but here it is: the all new frownland.com. This site is now more standards compliant than ever before [validated to XHTML1.0] and should load like the proverbial &#8216;muck&#8217; off a shovel now that I have &#8230; <p><a class="btn small" href="http://mattjon.es/blog/2001/02/all-new/">Continue reading <span class="meta-nav">&#8594;</span></a></p>]]></description>
			<content:encoded><![CDATA[<p>Phew&#8230; it&#8217;s been a struggle, but here it is: the all new frownland.com. This site is now more standards compliant than ever before [<a href="http://validator.w3.org/check/referer">validated to XHTML1.0</a>] and should load like the proverbial &#8216;muck&#8217; off a shovel now that I have streamlined everything. However, I have absolutely no idea what the page looks like on anything other that <a href="http://www.microsoft.com/mac/products/ie/">IE5 for the Mac</a>... I&#8217;ve only got the <a href="http://validator.w3.org/">W3C HTML Validator</a> to trust. In an ideal world, this should be all I need&#8230; unfortunately, life isn&#8217;t like that is it? Maybe one day. <br/>I&#8217;ve still got a bit more work to do though, like get the archives linked up, replace those images on the right [stuff from the old design], and add some more content to the bottom of the page, but that&#8217;s about it. Overall, I think it&#8217;s an improvement&#8230; more &#8216;chunky&#8217; I reckon. Anyway&#8230; enough geek talk, standby for more of the usual &#8211; comment and links on stuff that matters: art, design, photography, science, technology, music, everything.  </p>
]]></content:encoded>
			<wfw:commentRss>http://mattjon.es/blog/2001/02/all-new/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>★ AltSense</title>
		<link>http://mattjon.es/blog/2001/02/altsense/</link>
		<comments>http://mattjon.es/blog/2001/02/altsense/#comments</comments>
		<pubDate>Wed, 21 Feb 2001 12:58:00 +0000</pubDate>
		<dc:creator>Matt</dc:creator>
				<category><![CDATA[Photography]]></category>
		<category><![CDATA[Web]]></category>

		<guid isPermaLink="false">http://online-society-and-culture/altsense</guid>
		<description><![CDATA[New stuff at altsense.net: A Eulogy for DesignPreview Goree &#8211; an experiment using javascript and photography.]]></description>
			<content:encoded><![CDATA[<p>New stuff at <a href="http://www.altsense.net">altsense.net</a>: <br/><a href="http://www.altsense.net/library/factual/design.html">A Eulogy for Design</a><br/><a href="http://www.altsense.net/library/interactive/goree/goree.html">Preview Goree</a> &#8211; an experiment using javascript and photography.</p>
]]></content:encoded>
			<wfw:commentRss>http://mattjon.es/blog/2001/02/altsense/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>★ Back Burner</title>
		<link>http://mattjon.es/blog/2001/01/back-burner/</link>
		<comments>http://mattjon.es/blog/2001/01/back-burner/#comments</comments>
		<pubDate>Fri, 26 Jan 2001 16:24:00 +0000</pubDate>
		<dc:creator>Matt</dc:creator>
				<category><![CDATA[Web]]></category>

		<guid isPermaLink="false">http://web-design-and-development/backburner</guid>
		<description><![CDATA[subsist.org [a site that has been on the back burner for a year and a half now] is going to be collaborative, jam packed with content, eXtensible [as soon I get my head round all this DOM, XML, CSS, PHP &#8230; <p><a class="btn small" href="http://mattjon.es/blog/2001/01/back-burner/">Continue reading <span class="meta-nav">&#8594;</span></a></p>]]></description>
			<content:encoded><![CDATA[<p><a href="http://www.subsist.org">subsist.org</a> [a site that has been on the back burner for a year and a half now] is going to be collaborative, jam packed with content, eXtensible [as soon I get my head round all this DOM, XML, CSS, PHP stuff) and anti-commercial. Over the last year or so, I&#8217;ve designed and re-designed almost to the point of completion and then given up. Version 1 of the design can be seen <a href="http://www.subsist.org/version1/">here</a> [complete with usual DHTML scroller] and here are the beginnings of <a href="http://www.subsist.org/version2">version 2</a> of the design [I was getting really ambitious with this one]. I soon realised the site was getting just too big for one person to manage&#8230; so I gave up and started doing this site instead [I also wanted to stop playing it safe with greyscale palettes and decided on this stupid yellow]. So&#8230; I&#8217;m in the the process of re-designing <a href="http://www.subsist.org">subsist.org</a> yet again and this time I&#8217;m going to do something that is within my reach.</p>
]]></content:encoded>
			<wfw:commentRss>http://mattjon.es/blog/2001/01/back-burner/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>★ PNG Support</title>
		<link>http://mattjon.es/blog/2001/01/png-support/</link>
		<comments>http://mattjon.es/blog/2001/01/png-support/#comments</comments>
		<pubDate>Wed, 24 Jan 2001 17:04:00 +0000</pubDate>
		<dc:creator>Matt</dc:creator>
				<category><![CDATA[Web]]></category>

		<guid isPermaLink="false">http://web-design-and-development/pngsupport</guid>
		<description><![CDATA[So when is IE5/Win going to have full support for PNG (Portable Network Graphic) files? This format is far superior to the common GIF format because it generates smaller file sizes, renders more quickly on browsers and supports neato tricks &#8230; <p><a class="btn small" href="http://mattjon.es/blog/2001/01/png-support/">Continue reading <span class="meta-nav">&#8594;</span></a></p>]]></description>
			<content:encoded><![CDATA[<p>So when is <a href="www.microsoft.com/windows/ie/default.htm"><span class="caps">IE5</span>/Win</a> going to have full support for <a href="http://www.w3.org/Graphics/PNG/"><span class="caps">PNG</span></a> (Portable Network Graphic) files? This format is far superior to the common <a href="http://webopedia.internet.com/TERM/G/GIF.html"><span class="caps">GIF</span></a> format because it generates smaller file sizes, renders more quickly on browsers and supports neato tricks like alpha transparency [which means you can create fancy &#8216;see-through&#8217; graphics]. At the moment, <span class="caps">PNG</span> is the graphic format of choice for <a href=http://www.macromedia.com/flash/>Flash</a> developers as the Flash plugin has full support for this format. But for non-flash web designers, it&#8217;s not looking too good. Whereas <a href="http://home.netscape.com">Netscape 6</a>* [for all platforms] and <a href="www.microsoft.com/mac/ie/default.htm"><span class="caps">IE5</span>/Mac</a> does have full support for <span class="caps">PNG</span>, <a href="www.microsoft.com/windows/ie/default.htm"><span class="caps">IE5</span>/Win</a> doesn&#8217;t &#8211; which means it will be a long time before <span class="caps">PNG</span> has its day [and it&#8217;s been waiting for about 4 years].<br />
For more on <span class="caps">PNG</span>, read:</p>
<p><a href="http://hotwired.lycos.com/webmonkey/99/09/index0a.html?tw=design">Whatever happened to <span class="caps">PNG</span>?</a> [<a href="http://hotwired.lycos.com/webmonkey/">Webmonkey</a>]<br />
<a href="http://slashdot.org/articles/99/03/18/0958203.shtml">The Story of <span class="caps">PNG</span></a> [<a href="http://www.slashdot.com">slashdot</a>]</p>
<p>
*OK&#8230; so Netscape 6 is particularly bug-ridden, but in my opinion, it is the second best browser out there after <span class="caps">IE5</span>/Mac. </p>
]]></content:encoded>
			<wfw:commentRss>http://mattjon.es/blog/2001/01/png-support/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

