<?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>Thought Lateral &#187; web design</title>
	<atom:link href="http://thoughtlateral.com/tag/web-design/feed/" rel="self" type="application/rss+xml" />
	<link>http://thoughtlateral.com</link>
	<description>Looking at the world laterally, but that's beside the point ;-)</description>
	<lastBuildDate>Thu, 20 Oct 2011 06:57:00 +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>#24 Grid design for your to-do list, ToDoMatrix by REXwireless</title>
		<link>http://thoughtlateral.com/2010/08/11/24-grid-design-for-your-to-do-list-todomatrix-by-rexwireless/</link>
		<comments>http://thoughtlateral.com/2010/08/11/24-grid-design-for-your-to-do-list-todomatrix-by-rexwireless/#comments</comments>
		<pubDate>Wed, 11 Aug 2010 20:16:14 +0000</pubDate>
		<dc:creator>Denver</dc:creator>
				<category><![CDATA[Life Hack 169]]></category>
		<category><![CDATA[blackberry]]></category>
		<category><![CDATA[calendar]]></category>
		<category><![CDATA[day]]></category>
		<category><![CDATA[design]]></category>
		<category><![CDATA[device]]></category>
		<category><![CDATA[email]]></category>
		<category><![CDATA[grid]]></category>
		<category><![CDATA[life hack]]></category>
		<category><![CDATA[list]]></category>
		<category><![CDATA[matrix]]></category>
		<category><![CDATA[phone]]></category>
		<category><![CDATA[productivity]]></category>
		<category><![CDATA[REXwireless]]></category>
		<category><![CDATA[to-do]]></category>
		<category><![CDATA[todo]]></category>
		<category><![CDATA[ToDoMatrix]]></category>
		<category><![CDATA[web design]]></category>
		<category><![CDATA[work-flow]]></category>

		<guid isPermaLink="false">http://thoughtlateral.com/?p=308</guid>
		<description><![CDATA[Part of the influence to get a Blackberry phone was due to this software product offering. It is to a to-do list what a grid is to design. Highly integrated with the Blackberry device, ToDoMatrix from REXwireless offers increased productivity from a David Allen GTD and Covey based application. It works on the premise that your input [...]]]></description>
			<content:encoded><![CDATA[<p>Part of the influence to get a Blackberry phone was due to this software product offering.</p>
<blockquote><p>It is to a to-do list what a grid is to design.</p></blockquote>
<p>Highly integrated with the Blackberry device, <a target="_blank" title="What is ToDoMatrix" href="todomatrix.com/">ToDoMatrix from REXwireless</a> offers increased productivity from a <a target="_blank" title="What is GTD?" href="http://www.davidco.com/what_is_gtd.php">David Allen GTD</a> and <a target="_blank" title="Stephen Covey's THE 7 HABITS OF HIGHLY EFFECTIVE PEOPLE" href="https://www.stephencovey.com/7habits/7habits.php">Covey</a> based application.<br />
It works on the premise that your input recording device should always be at hand no matter where you are. If using your PC, you may not always have it booted up at the time you need to record an input item. Utilising the mobility of the phone, combined with its flexibility and additional feature set of calendar/ email it allows for greatly enhanced work-flows. It is to a to-do list what a grid is to design.</p>
<p>For example it is possible to assign tasks to delegates and email the task to them, or inject into the to-do list for calendar an email for timely action in the future.</p>]]></content:encoded>
			<wfw:commentRss>http://thoughtlateral.com/2010/08/11/24-grid-design-for-your-to-do-list-todomatrix-by-rexwireless/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Pixeless Pixel Buttons</title>
		<link>http://thoughtlateral.com/2009/06/03/pixeless-pixel-buttons/</link>
		<comments>http://thoughtlateral.com/2009/06/03/pixeless-pixel-buttons/#comments</comments>
		<pubDate>Wed, 03 Jun 2009 20:48:01 +0000</pubDate>
		<dc:creator>Denver</dc:creator>
				<category><![CDATA[Information Technology]]></category>
		<category><![CDATA[Web]]></category>
		<category><![CDATA[alternative]]></category>
		<category><![CDATA[antipixel]]></category>
		<category><![CDATA[badge]]></category>
		<category><![CDATA[button]]></category>
		<category><![CDATA[concept]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[html]]></category>
		<category><![CDATA[idea]]></category>
		<category><![CDATA[pixel]]></category>
		<category><![CDATA[pixeless]]></category>
		<category><![CDATA[pixie]]></category>
		<category><![CDATA[pixies]]></category>
		<category><![CDATA[thinking]]></category>
		<category><![CDATA[thought]]></category>
		<category><![CDATA[web design]]></category>

		<guid isPermaLink="false">http://thoughtlateral.com/?p=108</guid>
		<description><![CDATA[On an obscure night in 2008 whilst creating a design using pixel buttons (which also go by the names of pixel badges, and antipixel, etc)  I thought &#8220;Wouldn&#8217;t it be a great idea if no pixels were used? Instead the button (or badge) is composed entirely by Cascading Style Sheet (CSS) code!&#8221; Yeah, fantastic! My [...]]]></description>
			<content:encoded><![CDATA[<div id="attachment_111" class="wp-caption alignright" style="width: 223px"><a rel="attachment wp-att-111" href="http://thoughtlateral.com/2009/06/03/pixeless-pixel-buttons/pixeless_badge/"><img class="size-full wp-image-111" title="pixeless_badge" src="http://thoughtlateral.com/wp-content/uploads/2009/06/pixeless_badge.jpg" alt="We love Pixies!" width="213" height="58" /></a><p class="wp-caption-text">We love Pixies!</p></div>
<p>On an obscure night in 2008 whilst creating a design using pixel buttons (which also go by the names of pixel badges, and antipixel, etc)  I <a title="thought" href="http://thoughtlateral.com">thought</a> &#8220;Wouldn&#8217;t it be a great idea if no pixels were used? Instead the button (or badge) is composed entirely by Cascading Style Sheet (CSS) code!&#8221;</p>
<p>Yeah, fantastic! My web fortune is upon me and I can retire in the lap of luxury!</p>
<p>In the sober light of day however, I find the idea is <em>sooo fantastic</em> it had been thought of  <strong>years </strong>ago (going back as far as 2002 I discovered). So I kept the day job.</p>
<p>Even so,  I&#8217;ve not yet come across CSS badges (pixeless buttons) that mimic the style of their pixel counterparts. This may be because no one has tried it, or more likely because my browser doesn&#8217;t  get about much. So I set about constructing a demo of a CSS badge (pixeless pixel button) that would look like a pixel button.</p>
<p>The CSS has &#8216;scope for refinement&#8217; &#8211; which is a kinder way of saying it was a quick kludge.<strong><strong>
<dt class="wp-caption-dt"><strong><a rel="attachment wp-att-132" href="http://thoughtlateral.com/2009/06/03/pixeless-pixel-buttons/pixeless_button_ie_firefox/"><img class="size-full wp-image-132 alignright" title="pixeless_button_ie_firefox" src="http://thoughtlateral.com/wp-content/uploads/2009/06/pixeless_button_ie_firefox.jpg" alt="Pixeless button examples in Firefox and Internet Explorer browsers" width="283" height="470" /></a></strong></dt>
<p> </strong></strong></p>
<p><strong><strong> </strong></strong></p>
<p><strong><strong> </strong></strong></p>
<p><strong><strong></strong></strong></p>
<p><code>/*CSS code */<br />
table.badge {<br />
border-style:solid;<br />
border-width: 1px;<br />
border-color: #666;<br />
font-size: 8px;<br />
font-family: sans-serif;<br />
color: #fff;<br />
line-height: 6px;<br />
background-color: #fff;<br />
}<br />
table.badge tr {<br />
background-color: #888;<br />
text-align: center;<br />
text-transform:uppercase;<br />
margin: 0px;<br />
padding: 0px;<br />
}<br />
table.badge td.main {<br />
background-color:#f60;<br />
}</code><strong><strong>
<dt class="wp-caption-dt"> </dt>
<p> </strong></strong></p>
<p><strong><strong> </strong></strong></p>
<p><strong><strong> </strong></strong></p>
<p><strong><strong></strong></strong></p>
<p>&lt;!&#8211; html code &#8211;&gt;<br />
&lt;table cellspacing=1 cellpadding=0  class=&#8221;badge&#8221; width=&#8221;88px&#8221; height=&#8221;15px&#8221;"&gt;<br />
&lt;tr&gt;&lt;td class=&#8221;main&#8221;&gt;px&lt;/td&gt;&lt;td&gt;free&lt;/td&gt;&lt;/tr&gt;<br />
&lt;/table&gt;</p>
<p><strong>Some examples I made earlier can be found <a target="_blank" title="Pixeless pixel button demo" href="http://www.denverreynolds.co.uk/pixies_a_pixeless_pixel_button.html" target="_blank">here</a>.</strong></p>
<p><strong></strong></p>
<p><strong></strong></p>
<p>I refer to these pixeless pixel buttons as &#8220;Pixies&#8221; because it sounds cute, and is less likely to leave your tongue in a knot when saying it.</p>
<p>Other related sites:</p>
<p><a target="_blank" title="Pixel button" href="http://www.pixelbutton.com">www.pixelbutton.com</a> &#8211; the pixel button website where you can create pixel graphics.</p>
<p><a target="_blank" class="external text" title="http://www.zwahlendesign.ch/en/node/19" rel="nofollow" href="http://www.zwahlendesign.ch/en/node/19">ZwahlenDesign, &#8220;Web Badges / Buttons&#8221;</a> &#8211; the site containing CSS web buttons</p>
<p><a target="_blank" title="Antipixel" href="http://www.antipixel.com/blog/archives/2002/10/22/steal_these_buttons.html">http://www.antipixel.com/blog/archives/2002/10/22/steal_these_buttons.html</a> &#8211; the original antipixel blog post</p>]]></content:encoded>
			<wfw:commentRss>http://thoughtlateral.com/2009/06/03/pixeless-pixel-buttons/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>Is Web 3.0 here already?</title>
		<link>http://thoughtlateral.com/2009/04/02/is-web-30-here-already/</link>
		<comments>http://thoughtlateral.com/2009/04/02/is-web-30-here-already/#comments</comments>
		<pubDate>Thu, 02 Apr 2009 07:05:59 +0000</pubDate>
		<dc:creator>Denver</dc:creator>
				<category><![CDATA[Information Technology]]></category>
		<category><![CDATA[Web]]></category>
		<category><![CDATA[accessible]]></category>
		<category><![CDATA[AR]]></category>
		<category><![CDATA[augmented reality]]></category>
		<category><![CDATA[content]]></category>
		<category><![CDATA[development]]></category>
		<category><![CDATA[facebook]]></category>
		<category><![CDATA[google]]></category>
		<category><![CDATA[history]]></category>
		<category><![CDATA[idea]]></category>
		<category><![CDATA[Internet]]></category>
		<category><![CDATA[prediction]]></category>
		<category><![CDATA[trends]]></category>
		<category><![CDATA[UI]]></category>
		<category><![CDATA[UID]]></category>
		<category><![CDATA[user interface]]></category>
		<category><![CDATA[Web 1.0]]></category>
		<category><![CDATA[Web 2.0]]></category>
		<category><![CDATA[Web 3.0]]></category>
		<category><![CDATA[Web 4.0]]></category>
		<category><![CDATA[web design]]></category>

		<guid isPermaLink="false">http://thoughtlateral.com/?p=100</guid>
		<description><![CDATA[I believe there is a new trend developing in web design in early 2009. Having had this feeling for many months I&#8217;m now seeing evidence to support it. Having been on the web before the days of inline jpeg images, Internet Explorer, and Yahoo, I&#8217;ve seen many trends and development and I can see another [...]]]></description>
			<content:encoded><![CDATA[<div id="attachment_103" class="wp-caption alignright" style="width: 242px"><a rel="attachment wp-att-103" href="http://thoughtlateral.com/2009/04/02/is-web-30-here-already/web30/"><img class="size-full wp-image-103" title="Web 3.0" src="http://thoughtlateral.com/wp-content/uploads/2009/04/web30.jpg" alt="Web 3.0 arrives in 2009" width="232" height="232" /></a><p class="wp-caption-text">Web 3.0 arrives in 2009</p></div>
<p>I believe there is a new trend developing in web design in early 2009. Having had this feeling for many months I&#8217;m now seeing evidence to support it.</p>
<p>Having been on the web before the days of inline jpeg images, Internet Explorer, and Yahoo, I&#8217;ve seen many trends and development and I can see another transformation taking place once more.</p>
<p><strong>Web &#8217;1.0&#8242; was about accessible content</strong>. &#8220;Content is King&#8221; is the mantra that still rings true in web design today.</p>
<p>(Ever heard of a site called <a target="_blank" title="Google" href="http://www.google.com">Google</a>? This is why &#8211; Google&#8217;s goal was to be the Internet content King <img src='http://thoughtlateral.com/wp-includes/images/smilies/icon_wink.gif' alt=';-)' class='wp-smiley' /> .</p>
<p><strong>Web 2.0 was all about social interaction</strong>. Given that you already have some content how do you enrich it? By leveraging the link power of the web and allowing many users to interact with that data, even modifying or adding to it.</p>
<p>(Have you ever heard of a website called <a target="_blank" title="Facebook" href="http://www.facebook.com">Facebook</a>? It is popular because it allows people to interact with data from their network of friends)</p>
<p>I believe <strong>Web 3.0 has arrived and it will revolve around user interface design. </strong>The way that we access the web will change, browsers will evolve. For example, your clothing could be a &#8216;browser&#8217;, or your hands may be the &#8216;mouse device&#8217;. Why?</p>
<p>O.K. Here&#8217;s why&#8230;</p>
<p>In building a house the initial priority is not where to put the T.V. in the living room. It may be about the depth of the foundations or some such.<br />
Similarly the web started with access then content &#8211; accessible content, out of which the <a target="_blank" title="World Wide Web Consortium (W3C)" href="http://www.w3c.org"> World Wide Web Consortium (W3C</a>) (dealing with web standards) was seen to grow. Then later, true to it&#8217;s name &#8220;the web&#8221; was about creating a web of  links to data in the form of social networking.</p>
<p>So, now that the data exists (Web 1.0) and there are meaningful links between the data items (Web 2.0)  the next &#8216;fashion&#8217; I believe is in the way that data is accessed &#8211; Web 3.0. Augmented reality systems and intuitive navigation is what lies on the road ahead. Then after, perhaps, the much disscussed semantic web will arrive in Web 4.0</p>
<p>Some early examples of what I believe to be Web 3.0 are as follows:</p>
<p>Google maps on a mobile device</p>
<p>General Electric augmented reality website <a target="_blank" title="GE augmented reality website" href="http://ge.ecomagination.com/smartgrid/?c_id=Matter#/augmented_reality">http://ge.ecomagination.com/smartgrid/?c_id=Matter#/augmented_reality</a></p>
<p>BMW mini augmented reality advert  <a target="_blank" title="BMW augmented reality website" href="http://technabob.com/blog/2008/12/17/mini-augmented-reality-ads-hit-newstands/">http://technabob.com/blog/2008/12/17/mini-augmented-reality-ads-hit-newstands/</a> (English article about the German BMW mini website)</p>]]></content:encoded>
			<wfw:commentRss>http://thoughtlateral.com/2009/04/02/is-web-30-here-already/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Breaking the Bandwith Barrier</title>
		<link>http://thoughtlateral.com/2008/09/22/breaking-the-bandwith-barrier/</link>
		<comments>http://thoughtlateral.com/2008/09/22/breaking-the-bandwith-barrier/#comments</comments>
		<pubDate>Mon, 22 Sep 2008 22:18:47 +0000</pubDate>
		<dc:creator>Denver</dc:creator>
				<category><![CDATA[Information Technology]]></category>
		<category><![CDATA[alternative]]></category>
		<category><![CDATA[bandwidth]]></category>
		<category><![CDATA[compression]]></category>
		<category><![CDATA[concept]]></category>
		<category><![CDATA[idea]]></category>
		<category><![CDATA[lateral]]></category>
		<category><![CDATA[web design]]></category>

		<guid isPermaLink="false">http://thoughtlateral.com/?p=4</guid>
		<description><![CDATA[Bandwidth. How big is yours? Do you care? Well apparently, we are all demanding more of the stuff with streaming video from the BBC iPlayer and other video casting sites. The pessimists write about how it could break the Internet, how it could change the price of a loaf of bread, and even cause your [...]]]></description>
			<content:encoded><![CDATA[<div id="attachment_14" class="wp-caption alignright" style="width: 310px"><a rel="attachment wp-att-14" href="http://thoughtlateral.com/2008/09/22/breaking-the-bandwith-barrier/487693_slow/"><img class="size-full wp-image-14" title="Breaking the bandwidth barrier" src="http://www.denverreynolds.co.uk/blog/wp-content/uploads/2008/09/487693_slow.jpg" alt="Lateral thinking can prevent slow speeds online" width="300" height="198" /></a><p class="wp-caption-text">Lateral thinking can prevent slow speeds online</p></div>
<p>Bandwidth. How big is yours? Do you care? Well apparently, we are all demanding more of the stuff with streaming video from the BBC iPlayer and other video casting sites. The pessimists write about how it could break the Internet, how it could change the price of a loaf of bread, and even cause your mother to say &#8220;I told you so.&#8221; (OK, well maybe not as bad as that, but I&#8217;m sure it sold a few more papers anyhow).</p>
<p>This causes me to have that 1000pixel stare and get flashbacks when I sleep at night. You see, as a Web veteran from the last century, remembering the day Yahoo (all one page of it) appeared on the Web, and the onset of Flash I get a deja vu feeling about it all.</p>
<p>Back in those Halcyon days, when &#8220;surfing the net&#8221; meant annoying a fisherman while catching waves, bandwidth was a most precious commodity. Not precious in the way of kilobits, but bits. Yes, <strong>every</strong> bit counted.. and there wasn&#8217;t that many of them to count either!</p>
<p>Having a 56kbps line was a veritable storm drain in the plumbing of data transfer, and web designers pushed out the boat, or graphic content to be exact. In addition to this, more people were getting ensnared in the web daily. How could this fledgling Web grow when so many &#8216;flies&#8217; were trying to ensnare themselves therein?</p>
<p>Well the answer, other than &#8220;very quickly, actually&#8221;, is smartly. Smart how? You see, the problem was tackled from two directions, above and below. Capacity was increased by modernising infrastructure and laying new &#8216;spider threads&#8217; as you&#8217;d expect &#8211; the tackling from above bit, and this is the main* thrust of the current debate being discussed in the media. (* &#8216;main&#8217; as in &#8216;only&#8217;)</p>
<p>Now here&#8217;s the &#8216;but&#8217;; the problem was <em>also </em>tackled from below by web designers. They created pages more appropriate to the available bandwidth &#8211; bandwidth optimisation. To see just how effective this is, compare and contrast the effect of a bumblebee at full kilter hitting a web to that of a midge fly reversing round a bend and nudging a web.</p>
<p>The savings when optimising, compressing, trimming off the fat, paring down to the essentials can be substantial. It&#8217;s worthwile. Consider shaving 1% of data off downloading a web page ( this seems a modest task as a quick check of my current 22Kb web page shows I could save about 2kb just by removing extraneous spaces in the code &#8211; which is nearer 10% of shaving-savings than 1%!). Multiply this up by the amount of <span style="text-decoration: line-through;">people sucking content out of your server</span> users and your savings just keep stacking up. The more users the more savings.</p>
<p>Every designer and his pet goldfish is using javascript frameworks, CSS, and all other manner of unclean meat in websites these days. Isn&#8217;t it time to bring on the code obfuscators that reduce variable name lengths down to a character, and all other manner of compression enabling technologies we can throw into the mix? I think so, in fact, <em>I know so</em>. Optimisation worked very well before and helped the Web become what it is today.</p>
<p>Gone on, impress your wallet, compress your code. You know it makes sense when breaking the bandwidth barrier. <img src='http://thoughtlateral.com/wp-includes/images/smilies/icon_wink.gif' alt=';-)' class='wp-smiley' /> </p>]]></content:encoded>
			<wfw:commentRss>http://thoughtlateral.com/2008/09/22/breaking-the-bandwith-barrier/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

