<?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 Busse &#187; Design</title>
	<atom:link href="http://mattbusse.com/cat/design/feed/" rel="self" type="application/rss+xml" />
	<link>http://mattbusse.com</link>
	<description>Journalism, technology and Web design</description>
	<lastBuildDate>Tue, 24 Aug 2010 13:59:09 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0.1</generator>
		<item>
		<title>Today in Wikipedia shows you the Wikipedia entry for today&#8217;s date</title>
		<link>http://mattbusse.com/today-in-wikipedia-shows-you-the-wikipedia-entry-for-todays-date/</link>
		<comments>http://mattbusse.com/today-in-wikipedia-shows-you-the-wikipedia-entry-for-todays-date/#comments</comments>
		<pubDate>Tue, 01 Jun 2010 17:00:31 +0000</pubDate>
		<dc:creator>Matt</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[Wikipedia]]></category>

		<guid isPermaLink="false">http://mattbusse.com/?p=959</guid>
		<description><![CDATA[Today in Wikipedia takes you to the current date's Wikipedia entry. Each day's entry is a list of links to Wikipedia articles about interesting events that happened on that day as well as notable births and deaths. If you're looking for a new home page, or just another site to add to your daily reading, check it out.]]></description>
			<content:encoded><![CDATA[<p>A new site I made, Today in Wikipedia, takes you to the current date&#8217;s Wikipedia entry.</p>
<p>Each day&#8217;s entry is a list of links to Wikipedia articles about interesting events that happened on that day as well as notable births and deaths.</p>
<p>If you&#8217;re looking for a new home page, or just another site to add to your daily reading, check it out.<br />
<span id="more-959"></span><br />
You can try it out here:</p>
<blockquote><p><a href="http://www.todayinwikipedia.com" title="Go to Today in Wikipedia">Today in Wikipedia</a></p></blockquote>
<h2>To set it as your home page:</h2>
<p><strong>Firefox:</strong></p>
<ul>
<li>Go to the &#8220;Tools&#8221; menu and choose &#8220;Options&#8221;</li>
<li>Click the &#8220;General&#8221; tab</li>
<li>Under &#8220;Home Page&#8221; enter <strong>http://todayinwikipedia.com</strong></li>
<li>Make sure &#8220;When Firefox starts&#8221; is set to &#8220;Show my home page&#8221;</li>
</ul>
<p><strong>Internet Explorer:</strong></p>
<ul>
<li>Go to the &#8220;Tools&#8221; men and choose &#8220;Internet Options&#8221;</li>
<li>In the &#8220;Home Page&#8221; box enter <strong>http://todayinwikipedia.com</strong></li>
</ul>
<h2>To bookmark it (if you don&#8217;t want it as your home page):</h2>
<ul>
<li>In Firefox, right-click this link &#8211; <a title="Go to Today in Wikipedia" href="http://www.todayinwikipedia.com">Today in Wikipedia</a> &#8211; and choose &#8220;Bookmark This Link.&#8221;</li>
<li>In Internet Explorer, right-click this link &#8211; <a title="Go to Today in Wikipedia" href="http://www.todayinwikipedia.com/">Today in Wikipedia</a> &#8211; and choose &#8220;Add to Favorites.&#8221;</li>
</ul>
<h2>How it works</h2>
<p>I made Today in Wikipedia using a simple bit of Javascript to retrieve the current date, create a URL based on that date and redirect you to it.</p>
<p>It works because the date is in the Wikipedia article URL. Example:</p>
<blockquote><p><a title="Go to the Wikipedia entry for June 1" href="http://en.wikipedia.org/wiki/June_1">http://en.wikipedia.org/wiki/June_1</a></p></blockquote>
<p>Here is the relevant code:</p>
<pre class="brush: jscript;">

today = new Date();

day = today.getDate();

month = today.getMonth();

if (month==0) x=(&amp;quot;January&amp;quot;);
 else if (month==1) x=(&amp;quot;February&amp;quot;);
 else if (month==2) x=(&amp;quot;March&amp;quot;);
 else if (month==3) x=(&amp;quot;April&amp;quot;);
 else if (month==4) x=(&amp;quot;May&amp;quot;);
 else if (month==5) x=(&amp;quot;June&amp;quot;);
 else if (month==6) x=(&amp;quot;July&amp;quot;);
 else if (month==7) x=(&amp;quot;August&amp;quot;);
 else if (month==8) x=(&amp;quot;September&amp;quot;);
 else if (month==9) x=(&amp;quot;October&amp;quot;);
 else if (month==10) x=(&amp;quot;November&amp;quot;);
 else x=(&amp;quot;December&amp;quot;);

window.location = &amp;quot;http://www.wikipedia.org/wiki/&amp;quot; + x + &amp;quot;_&amp;quot; + day;
</pre>
<p>That&#8217;s all there is to it. If you have any questions, please leave a comment or <a title="Go to Matt Busse's contact page" href="http://mattbusse.com/contact/">contact me</a>!</p>
]]></content:encoded>
			<wfw:commentRss>http://mattbusse.com/today-in-wikipedia-shows-you-the-wikipedia-entry-for-todays-date/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>5 tips for great Twitter background design</title>
		<link>http://mattbusse.com/5-tips-for-great-twitter-background-design/</link>
		<comments>http://mattbusse.com/5-tips-for-great-twitter-background-design/#comments</comments>
		<pubDate>Fri, 23 Oct 2009 16:42:18 +0000</pubDate>
		<dc:creator>Matt</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Social Media]]></category>
		<category><![CDATA[Photoshop]]></category>
		<category><![CDATA[Twitter]]></category>

		<guid isPermaLink="false">http://mattbusse.com/?p=418</guid>
		<description><![CDATA[Identify your goals before you begin, design for multiple screen sizes and other useful tips for Twitter background design.]]></description>
			<content:encoded><![CDATA[<p>Recently I made a new background for <a href="http://twitter.com/newsadvance">@newsadvance</a> on Twitter, the Twitter presence of <a href="http://newsadvance.com">The News &amp; Advance</a>.</p>
<p><span id="more-418"></span></p>
<p>Click the image below to see the full-size background.</p>
<p><a href="http://a1.twimg.com/profile_background_images/47373820/Twitter-BG-LNA.jpg"><img class="alignnone size-medium wp-image-419" title="Twitter-BG-LNA" src="http://mattbusse.com/wp-content/uploads/2009/10/Twitter-BG-LNA-300x185.jpg" alt="Twitter-BG-LNA" width="300" height="185" /></a></p>
<p>It was a fun process and I thought I would share some tips on Twitter background design.</p>
<p><!--more--></p>
<h2>1. Identify your goals</h2>
<p>Different people have different goals when designing a Twitter background. Some people want to wow visitors with stunning visuals; others simply want to convey information.</p>
<p>Regardless of what your goals are, you should at least have some. A Twitter background can make a big impression, especially when someone is seeing your profile for the first time.</p>
<p>The three main goals in designing the @newsadvance background were, in order of importance:</p>
<ol>
<li><strong>Provide additional contact information for our organization</strong>: This was satisfied by an info box on the left side that lists an e-mail address, two phone numbers and two physical addresses (one for visiting, one for mail).</li>
<li><strong>Keep the file size small for fast loading</strong>: Using Photoshop to optimize the image, I struck a balance between picture quality and file size. It&#8217;s about 95 kb, far lower than the maximum Twitter allows.</li>
<li><strong>Be visually appealing</strong>: A variety of free images from <a href="http://sxc.hu/">Stock.XCHNG</a> helped here.</li>
</ol>
<h2>2. Emphasize the upper left</h2>
<p>Twitter backgrounds are anchored at the upper left corner. No matter what your screen resolution, you will always see at least some of the upper left.</p>
<p>That&#8217;s why the infobox and graphic items are all there on the @newsadvance background.</p>
<p>The layer of less important graphic items &#8211; the binary code and the white streaks -  extends farther out until it fades into a solid color background.</p>
<h2>3. Design for multiple screen sizes</h2>
<p>The @newsadvance background is designed so that even people with smaller 1024&#215;768 screen resolutions can see the info box, the minimum requirement for this background.</p>
<p>Those with larger screens can see more of the background image.</p>
<p>Additionally, the bottom of the info box is only about 420 pixels from the top of the image, so it can be seen even on smaller netbooks.</p>
<p>An invaluable tool for making sure a Twitter background design works for 1024&#215;768, 1280&#215;1024 and other screen resolutions is Chris Spooner&#8217;s <a href="http://blogspoon.s3.amazonaws.com/wp-content/uploads/2009/twitter-theme/Twitter-BG-Template.psd.zip">Twitter background template</a>, which has layers that show you how much of your design is visible at various resolutions.</p>
<p>I found Spooner&#8217;s template while reading his excellent blog post, &#8220;<a href="http://www.blog.spoongraphics.co.uk/tutorials/twitter-background-design-how-to-and-best-practices">Twitter Background Design How-To and Best Practices.</a>&#8221;</p>
<h2>4. Use your visuals to send a message</h2>
<p>It&#8217;s great to have a visually appealing Twitter background, but it should also mean something.</p>
<p>One of The News &amp; Advance&#8217;s missions is to provide news and information to readers regardless of their choice of platform: print, computer, mobile device, etc.</p>
<p>On the Twitter background, the presence of the printed newspaper, the computer mouse and the cell phone are intended to suggest that philosophy.</p>
<h2>5. Don&#8217;t repeat yourself</h2>
<p>When designing the info box, I thought about including the logo, the name (either &#8220;The News &amp; Advance&#8221; or &#8220;Newsadvance.com&#8221;) and/or the Web URL.</p>
<p>However, these items are all, in one way or another, already a part of the Twitter sidebar information.</p>
<p>So why clutter up the background design with extra information?</p>
<p>Including those redundant elements may have increased the height of the info box to the point where it would have been cut off on some netbooks, some of which have screen heights smaller than 600 pixels.</p>
<p>As a bonus, the newspaper logo is partially visible anyway because of the paper&#8217;s positioning in the corner.</p>
<p><strong>That&#8217;s about it. Have any other tips you&#8217;d like to share? Leave a comment!</strong></p>
]]></content:encoded>
			<wfw:commentRss>http://mattbusse.com/5-tips-for-great-twitter-background-design/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
