<?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>Eric Semling - Web Designer, Developer</title>
	<atom:link href="http://ericsemling.com/blog/?feed=rss2" rel="self" type="application/rss+xml" />
	<link>http://ericsemling.com/blog</link>
	<description></description>
	<lastBuildDate>Fri, 01 Apr 2011 16:52:32 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0</generator>
		<item>
		<title>Hipstamatic:  Fun with Photography</title>
		<link>http://ericsemling.com/blog/?p=42</link>
		<comments>http://ericsemling.com/blog/?p=42#comments</comments>
		<pubDate>Fri, 25 Mar 2011 18:47:29 +0000</pubDate>
		<dc:creator>Eric</dc:creator>
				<category><![CDATA[Photography]]></category>

		<guid isPermaLink="false">http://ericsemling.com/blog/?p=42</guid>
		<description><![CDATA[After recently hearing about a fun little photography app for the iPhone, &#8220;Hipstamatic&#8221; (http://www.hipstamaticapp.com), I decided to buy it.  I usually don&#8217;t spend more than the typical $0.99 on apps, but I had heard some good reviews from a number &#8230; <a href="http://ericsemling.com/blog/?p=42">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p><img class="alignnone size-full wp-image-50" title="woods-clipped" src="http://ericsemling.com/blog/wp-content/uploads/2011/03/woods-clipped.jpg" alt="" width="665" height="200" /></p>
<p>After recently hearing about a fun little photography app for the iPhone, &#8220;Hipstamatic&#8221; (<a href="http://www.hipstamaticapp.com">http://www.hipstamaticapp.com</a>), I decided to buy it.  I usually don&#8217;t spend more than the typical $0.99 on apps, but I had heard some good reviews from a number of people, so I figured, hey, why not?</p>
<p><span id="more-42"></span></p>
<p>The idea behind the app is this: turn your iPhone camera into an old-school plastic toy camera, in order to produce analog-looking/vintage photos.  Sure, this is really nothing new in that filters for these effects can be added after pictures are taken with any device.  However, what makes Hipstamatic unique is that these effects are added as the picture is taken, mimicking whatever lens/film/flash combination you have selected.</p>
<p>The $1.99 price tag sure turned out to be worth it.  Since installing it last week, I&#8217;ve spent hours playing with it, experimenting with the different lenses, flashes, and films that come with the app.  I have yet to purchase any of the additional ones available through the &#8220;HipstaMart,&#8221; but I plan on it eventually.</p>
<p>I was surprised with how neat some of the pictures look &#8212; the analog look really enhances the artistic value of just about any photo I&#8217;ve taken.  Check out some my photos, below.</p>
<p><a class="fancybox" href="http://ericsemling.com/blog/wp-content/uploads/2011/03/kitty.jpg"><img class="alignnone size-thumbnail wp-image-43" title="kitty" src="http://ericsemling.com/blog/wp-content/uploads/2011/03/kitty-150x150.jpg" alt="" width="150" height="150" /></a><a href="http://ericsemling.com/blog/wp-content/uploads/2011/03/woods.jpg"><img class="alignnone size-thumbnail wp-image-44" title="woods" src="http://ericsemling.com/blog/wp-content/uploads/2011/03/woods-150x150.jpg" alt="" width="150" height="150" /></a><a href="http://ericsemling.com/blog/wp-content/uploads/2011/03/bullet-holes.jpg"><img class="alignnone size-thumbnail wp-image-45" title="bullet-holes" src="http://ericsemling.com/blog/wp-content/uploads/2011/03/bullet-holes-150x150.jpg" alt="" width="150" height="150" /></a><a href="http://ericsemling.com/blog/wp-content/uploads/2011/03/deer.jpg"><img class="alignnone size-thumbnail wp-image-56" title="deer" src="http://ericsemling.com/blog/wp-content/uploads/2011/03/deer-150x150.jpg" alt="" width="150" height="150" /></a></p>
<p>A nice feature of the app is that it can be set up to upload your photos to Facebook or Flickr, making it super easy to share your fun photos with friends.</p>
<p>Hipstamatic is definitely a fun app.  It really demonstrates how emotion and beauty can be captured through the lens of a camera, no matter how &#8220;low-tech&#8221; or analog it is.  If you have an iPhone, it&#8217;s really worth checking out!</p>


<div class="shr-bookmarks shr-bookmarks-expand shr-bookmarks-center">
<ul class="socials">
		<li class="shr-twitter">
			<a href="http://twitter.com/home?status=Hipstamatic%3A++Fun+with+Photography+-+http://bit.ly/e0qfw1&amp;source=shareaholic" rel="nofollow" class="external" title="Tweet This!">Tweet This!</a>
		</li>
		<li class="shr-facebook">
			<a href="http://www.facebook.com/share.php?v=4&amp;src=bm&amp;u=http://ericsemling.com/blog/?p=42&amp;t=Hipstamatic%3A++Fun+with+Photography" rel="nofollow" class="external" title="Share this on Facebook">Share this on Facebook</a>
		</li>
		<li class="shr-delicious">
			<a href="http://delicious.com/post?url=http://ericsemling.com/blog/?p=42&amp;title=Hipstamatic%3A++Fun+with+Photography" rel="nofollow" class="external" title="Share this on del.icio.us">Share this on del.icio.us</a>
		</li>
		<li class="shr-stumbleupon">
			<a href="http://www.stumbleupon.com/submit?url=http://ericsemling.com/blog/?p=42&amp;title=Hipstamatic%3A++Fun+with+Photography" rel="nofollow" class="external" title="Stumble upon something good? Share it on StumbleUpon">Stumble upon something good? Share it on StumbleUpon</a>
		</li>
		<li class="shr-tumblr">
			<a href="http://www.tumblr.com/share?v=3&amp;u=http%3A%2F%2Fericsemling.com%2Fblog%2F%3Fp%3D42&amp;t=Hipstamatic%3A++Fun+with+Photography" rel="nofollow" class="external" title="Share this on Tumblr">Share this on Tumblr</a>
		</li>
		<li class="shr-comfeed">
			<a href="http://ericsemling.com/blog/?p=42&amp;feed=comments-rss2" rel="nofollow" class="external" title="Subscribe to the comments for this post?">Subscribe to the comments for this post?</a>
		</li>
		<li class="shr-googlebookmarks">
			<a href="http://www.google.com/bookmarks/mark?op=add&amp;bkmk=http://ericsemling.com/blog/?p=42&amp;title=Hipstamatic%3A++Fun+with+Photography" rel="nofollow" class="external" title="Add this to Google Bookmarks">Add this to Google Bookmarks</a>
		</li>
		<li class="shr-mail">
			<a href="mailto:?subject=%22Hipstamatic%3A%20%20Fun%20with%20Photography%22&amp;body=Link: http://ericsemling.com/blog/?p=42 (sent via shareaholic)%0D%0A%0D%0A----%0D%0A %0D%0A%0D%0AAfter%20recently%20hearing%20about%20a%20fun%20little%20photography%20app%20for%20the%20iPhone%2C%20%22Hipstamatic%22%20%28http%3A%2F%2Fwww.hipstamaticapp.com%29%2C%20I%20decided%20to%20buy%20it.%20%C2%A0I%20usually%20don%27t%20spend%20more%20than%20the%20typical%20%240.99%20on%20apps%2C%20but%20I%20had%20heard%20some%20good%20reviews%20from%20a%20number%20of%20people%2C%20so%20I%20figured%2C%20hey%2C%20why%20not%3F%0D%0A%0D%0A%0D%0A%0D" rel="nofollow" class="external" title="Email this to a friend?">Email this to a friend?</a>
		</li>
</ul>
<div style="clear:both;"></div>
</div>

]]></content:encoded>
			<wfw:commentRss>http://ericsemling.com/blog/?feed=rss2&amp;p=42</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>New Business Cards</title>
		<link>http://ericsemling.com/blog/?p=39</link>
		<comments>http://ericsemling.com/blog/?p=39#comments</comments>
		<pubDate>Wed, 23 Mar 2011 19:50:07 +0000</pubDate>
		<dc:creator>Eric</dc:creator>
				<category><![CDATA[Uncategorized]]></category>

		<guid isPermaLink="false">http://ericsemling.com/blog/?p=39</guid>
		<description><![CDATA[I finally got around to working on something I have been desperately needing &#8212; business cards.  I have been needing them for so long, yet I&#8217;m always busy with school work, work projects, or freelance projects, so it&#8217;s hard to find &#8230; <a href="http://ericsemling.com/blog/?p=39">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p><img class="alignnone size-full wp-image-70" title="business-card-preview" src="http://ericsemling.com/blog/wp-content/uploads/2011/03/business-card-preview.png" alt="" width="665" height="200" /></p>
<p>I finally got around to working on something I have been desperately needing &#8212; business cards.  I have been needing them for so long, yet I&#8217;m always busy with school work, work projects, or freelance projects, so it&#8217;s hard to find time to set aside to work on them.  Well, I finally have done just that.  It took quite a number of hours to get everything exactly how I wanted.</p>
<p><span id="more-39"></span></p>
<p>After researching different business card printing services, I decided to go with <a href="http://www.uvcards.com">UVCards</a>.  A few months back, I actually had a few companies send me some examples so I could be sure they did quality work (see picture).  After sorting through all the examples, I decided upon the silk laminated with spot UV variety.<img class="alignright size-medium wp-image-71" title="business-cards" src="http://ericsemling.com/blog/wp-content/uploads/2011/03/business-cards-300x199.jpg" alt="" width="300" height="199" /></p>
<p>The &#8220;silk laminated&#8221; part basically provides a silky texture to the card, and the &#8220;spot UV&#8221; is a coating put over certain areas, or &#8220;spots&#8221;, which make said areas shiny/reflective.</p>
<p>UVCards offers Photoshop templates for designing business cards (not really design templates, but basically empty files which are the proper dimensions, resolution, and have guides for bleed, etc).  This is extremely nice because it cuts out a lot of the background research that goes into designing business cards, allowing more time to be spent on the actual design.</p>
<p>I went with a design that matches my website (I&#8217;m trying to keep my brand consistent).  So, this means I used a blue, dark gray, and white color scheme.  I adjusted my logo slightly, to be more readable at a small size, which actually got me thinking about doing the same for the logo I use across all other forms of media as well.</p>
<p>Anyway, to get right to it, check below for the final designs.  They&#8217;re meant to be simple, clean, and effective.  I hope I hit the mark.</p>
<p><img class="aligncenter size-full wp-image-72" title="business-cards" src="http://ericsemling.com/blog/wp-content/uploads/2011/03/business-cards.png" alt="" width="650" height="650" /></p>
<p>Now I just have to wait for them to arrive (and cross my fingers that they turn out well).  Otherwise, I will have 500 useless pieces of cardboard that cost me $90.</p>


<div class="shr-bookmarks shr-bookmarks-expand shr-bookmarks-center">
<ul class="socials">
		<li class="shr-twitter">
			<a href="http://twitter.com/home?status=New+Business+Cards+-+http://bit.ly/fazlf7&amp;source=shareaholic" rel="nofollow" class="external" title="Tweet This!">Tweet This!</a>
		</li>
		<li class="shr-facebook">
			<a href="http://www.facebook.com/share.php?v=4&amp;src=bm&amp;u=http://ericsemling.com/blog/?p=39&amp;t=New+Business+Cards" rel="nofollow" class="external" title="Share this on Facebook">Share this on Facebook</a>
		</li>
		<li class="shr-delicious">
			<a href="http://delicious.com/post?url=http://ericsemling.com/blog/?p=39&amp;title=New+Business+Cards" rel="nofollow" class="external" title="Share this on del.icio.us">Share this on del.icio.us</a>
		</li>
		<li class="shr-stumbleupon">
			<a href="http://www.stumbleupon.com/submit?url=http://ericsemling.com/blog/?p=39&amp;title=New+Business+Cards" rel="nofollow" class="external" title="Stumble upon something good? Share it on StumbleUpon">Stumble upon something good? Share it on StumbleUpon</a>
		</li>
		<li class="shr-tumblr">
			<a href="http://www.tumblr.com/share?v=3&amp;u=http%3A%2F%2Fericsemling.com%2Fblog%2F%3Fp%3D39&amp;t=New+Business+Cards" rel="nofollow" class="external" title="Share this on Tumblr">Share this on Tumblr</a>
		</li>
		<li class="shr-comfeed">
			<a href="http://ericsemling.com/blog/?p=39&amp;feed=comments-rss2" rel="nofollow" class="external" title="Subscribe to the comments for this post?">Subscribe to the comments for this post?</a>
		</li>
		<li class="shr-googlebookmarks">
			<a href="http://www.google.com/bookmarks/mark?op=add&amp;bkmk=http://ericsemling.com/blog/?p=39&amp;title=New+Business+Cards" rel="nofollow" class="external" title="Add this to Google Bookmarks">Add this to Google Bookmarks</a>
		</li>
		<li class="shr-mail">
			<a href="mailto:?subject=%22New%20Business%20Cards%22&amp;body=Link: http://ericsemling.com/blog/?p=39 (sent via shareaholic)%0D%0A%0D%0A----%0D%0A %0D%0A%0D%0AI%20finally%20got%20around%20to%20working%20on%20something%20I%20have%20been%C2%A0desperately%20needing%20--%20business%20cards.%20%C2%A0I%20have%20been%20needing%20them%20for%20so%20long%2C%20yet%20I%27m%20always%20busy%20with%20school%20work%2C%20work%20projects%2C%20or%20freelance%20projects%2C%20so%20it%27s%20hard%20to%20find%20time%20to%20set%20aside%20to%20work%20on%20them.%20%C2%A0Well%2C%20I%20finally%20have%20done" rel="nofollow" class="external" title="Email this to a friend?">Email this to a friend?</a>
		</li>
</ul>
<div style="clear:both;"></div>
</div>

]]></content:encoded>
			<wfw:commentRss>http://ericsemling.com/blog/?feed=rss2&amp;p=39</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>MIT Red Ink Project</title>
		<link>http://ericsemling.com/blog/?p=17</link>
		<comments>http://ericsemling.com/blog/?p=17#comments</comments>
		<pubDate>Fri, 29 Oct 2010 18:32:27 +0000</pubDate>
		<dc:creator>Eric</dc:creator>
				<category><![CDATA[Red Ink]]></category>
		<category><![CDATA[Web Design]]></category>

		<guid isPermaLink="false">http://ericsemling.com/blog/?p=17</guid>
		<description><![CDATA[So, as a &#8220;small&#8221; classroom project (actually more for fun and the experience it will give me), I decided to jump on board the Red Ink project team.  Red Ink (http://www.make-them-think.org) is an open-source social financial analytics tool being developed &#8230; <a href="http://ericsemling.com/blog/?p=17">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<h2><img class="alignnone size-full wp-image-84" title="red-ink-preview" src="http://ericsemling.com/blog/wp-content/uploads/2010/10/red-ink-preview.jpg" alt="" width="665" height="200" /></h2>
<p>So, as a &#8220;small&#8221; classroom project (actually more for fun and the experience it will give me), I decided to jump on board the Red Ink project team.  Red Ink (<a href="http://www.make-them-think.org">http://www.make-them-think.org</a>) is an open-source social financial analytics tool being developed by Ryan O&#8217;Toole of MIT (Future Civic Media at the MIT Media Lab).</p>
<p>As Ryan is collaborating with The Community Foundation of South Wood County, the opportunity for a MIT-UW-Stevens Point has been made possible.  A group of UW-SP students (Spencer Schill, Drew Frisk, Pat Daus, Scott Gerstl and I) make up the &#8220;Wisconsin&#8221; portion of the team.</p>
<p><span id="more-17"></span></p>
<h2>Saturday Project Work:</h2>
<p>After nearly two months of strictly email contact with Ryan, last Saturday, the UW-SP students got to meet him face-to-face for the first time.  A day-long brainstorming session took place with the goal of dividing up the work load and focusing on a direction for Red Ink.</p>
<p>The brainstorming session involved:</p>
<ul>
<li> Developing personas for the project.</li>
<li> Prototyping user interface.</li>
<li> Brainstorming ideas for graphing user data.</li>
<li> A nice Chinese lunch (thank you Community Foundation!).</li>
<li> Fun times.</li>
</ul>
<p><img class="size-full wp-image-20 alignnone" title="persona-ing-sm" src="http://ericsemling.com/blog/wp-content/uploads/2010/10/persona-ing-sm.jpg" alt="Persona Work" width="160" height="120" /><img class="size-full wp-image-19 alignnone" title="board-graphs-sm" src="http://ericsemling.com/blog/wp-content/uploads/2010/10/board-graphs-sm.jpg" alt="Graph Prototyping" width="160" height="120" /><img class="size-full wp-image-18 alignnone" title="teamwork-sm" src="http://ericsemling.com/blog/wp-content/uploads/2010/10/teamwork-sm.jpg" alt="Teamwork" width="160" height="120" /></p>
<p>After devastating our minds for an entire day, the session concluded and we all finally had a clear picture of what Red Ink was and how its future development would go.</p>
<h2>A New Week, More Work to Do:</h2>
<p>A few short days later, we all met with Ryan again on Monday morning/afternoon.  We were quite a bit further along, as Drew had done some design mock-up work.  I was not available to meet until the afternoon, but the rest of the guys worked on tweaking the mock-ups:</p>
<p><img class="size-full wp-image-22 alignnone" title="drew-mock-sm" src="http://ericsemling.com/blog/wp-content/uploads/2010/10/drew-mock-sm.jpg" alt="Drew's Mock-up" width="400" height="465" /></p>
<p>On Tuesday, we got to meet for one final time before Ryan had to head back to MIT.  Already, we had made even more progress, as Drew had completed an HTML skeleton of his mock-up and I had made a mock-up of my take at the user interface:</p>
<p><img class="alignnone size-full wp-image-26" title="eric-red-ink-1-sm" src="http://ericsemling.com/blog/wp-content/uploads/2010/10/eric-red-ink-1-sm1.jpg" alt="Eric's First Mock-up" width="400" height="400" /></p>
<h2>The First Week Winds Down:</h2>
<p>After saying goodbye to Ryan, the Wisconsin team continued to work.  Pat did some work on the Red Ink logo and also came up with his version of the design mock-up (a modified version of Drew’s mock-up):</p>
<p><img class="alignnone size-full wp-image-24" title="pat-prototype-sm" src="http://ericsemling.com/blog/wp-content/uploads/2010/10/pat-prototype-sm.jpg" alt="Pat's Mock-up" width="400" height="267" /></p>
<p>Inspired by the others’ work, I still wasn’t fully satisfied with my original mock-up, so I decided to boot up Photoshop and see what I could do.  After many hours of work, I came away with a design I felt satisfied with.  It incorporated elements of everyone’s work, including:</p>
<ul>
<li>The current Red Ink layout/color scheme.</li>
<li>The mock-up done by the rest of the team in the lab.</li>
<li>Drew&#8217;s HTML mock-up.</li>
<li>My original mock-up.</li>
<li>Pat&#8217;s logo suggestions.</li>
<li>Ryan&#8217;s color scheme suggestions.</li>
<li>Ryan&#8217;s request for the current ink splash graphic to be incorporated into the design.</li>
</ul>
<p>Here is what my final design mock-up looks like:</p>
<p><em>Home Page</em></p>
<p><img class="alignnone size-full wp-image-25" title="redink-red-emphasis" src="http://ericsemling.com/blog/wp-content/uploads/2010/10/redink-red-emphasis.jpg" alt="Eric's Final Mock-Up - Home Page" width="575" height="575" /></p>
<p><em>User Dashboard Page:</em></p>
<p><em><img class="alignnone size-full wp-image-21" title="redink-red-emphasis-logged-" src="http://ericsemling.com/blog/wp-content/uploads/2010/10/redink-red-emphasis-logged-.jpg" alt="Eric's Mock-Up Logged In" width="575" height="575" /></em></p>
<h2>HTML/CSS Templating:</h2>
<p>I also took the time out to hand code the design mock-ups so that we could get the real experience a user would get, instead of just looking at a static version.  While not fully completed, you can still check out the templates I made for the <a href="http://ericsemling.com/red-ink/">home page</a> and the <a href="http://ericsemling.com/red-ink/user.html">user dashboard</a> area.</p>
<h2>End of the First Week:</h2>
<p>It was amazing to see how we all could work together and get so much accomplished within the first real week of work.  As Ryan stated on our group message board:</p>
<blockquote><p>&#8220;I&#8217;m even more impressed with how we were all able to work together to get to this point. Everyone&#8217;s contributions have gotten us here.&#8221;</p></blockquote>
<p>I completely agree with him.</p>
<p>Not only am I excited because this is a great project to work on, but also because of the valuable collaboration work/skills experience we will all gain from this.</p>
<p>A big thanks goes out to The Community Foundation of South Wood County, Ryan, and the MIT Center for Future Civic Media for making this all possible!</p>


<div class="shr-bookmarks shr-bookmarks-expand shr-bookmarks-center">
<ul class="socials">
		<li class="shr-twitter">
			<a href="http://twitter.com/home?status=MIT+Red+Ink+Project+-+http://b2l.me/a28nae&amp;source=shareaholic" rel="nofollow" class="external" title="Tweet This!">Tweet This!</a>
		</li>
		<li class="shr-facebook">
			<a href="http://www.facebook.com/share.php?v=4&amp;src=bm&amp;u=http://ericsemling.com/blog/?p=17&amp;t=MIT+Red+Ink+Project" rel="nofollow" class="external" title="Share this on Facebook">Share this on Facebook</a>
		</li>
		<li class="shr-delicious">
			<a href="http://delicious.com/post?url=http://ericsemling.com/blog/?p=17&amp;title=MIT+Red+Ink+Project" rel="nofollow" class="external" title="Share this on del.icio.us">Share this on del.icio.us</a>
		</li>
		<li class="shr-stumbleupon">
			<a href="http://www.stumbleupon.com/submit?url=http://ericsemling.com/blog/?p=17&amp;title=MIT+Red+Ink+Project" rel="nofollow" class="external" title="Stumble upon something good? Share it on StumbleUpon">Stumble upon something good? Share it on StumbleUpon</a>
		</li>
		<li class="shr-tumblr">
			<a href="http://www.tumblr.com/share?v=3&amp;u=http%3A%2F%2Fericsemling.com%2Fblog%2F%3Fp%3D17&amp;t=MIT+Red+Ink+Project" rel="nofollow" class="external" title="Share this on Tumblr">Share this on Tumblr</a>
		</li>
		<li class="shr-comfeed">
			<a href="http://ericsemling.com/blog/?p=17&amp;feed=comments-rss2" rel="nofollow" class="external" title="Subscribe to the comments for this post?">Subscribe to the comments for this post?</a>
		</li>
		<li class="shr-googlebookmarks">
			<a href="http://www.google.com/bookmarks/mark?op=add&amp;bkmk=http://ericsemling.com/blog/?p=17&amp;title=MIT+Red+Ink+Project" rel="nofollow" class="external" title="Add this to Google Bookmarks">Add this to Google Bookmarks</a>
		</li>
		<li class="shr-mail">
			<a href="mailto:?subject=%22MIT%20Red%20Ink%20Project%22&amp;body=Link: http://ericsemling.com/blog/?p=17 (sent via shareaholic)%0D%0A%0D%0A----%0D%0A %0D%0ASo%2C%20as%20a%20%22small%22%20classroom%20project%20%28actually%20more%20for%20fun%20and%20the%20experience%20it%20will%20give%20me%29%2C%20I%20decided%20to%20jump%20on%20board%20the%20Red%20Ink%20project%20team.%C2%A0%20Red%20Ink%20%28http%3A%2F%2Fwww.make-them-think.org%29%20is%20an%20open-source%20social%20financial%20analytics%20tool%20being%20developed%20by%20Ryan%20O%27Toole%20of%20MIT%20%28Future%20Civic%20Medi" rel="nofollow" class="external" title="Email this to a friend?">Email this to a friend?</a>
		</li>
</ul>
<div style="clear:both;"></div>
</div>

]]></content:encoded>
			<wfw:commentRss>http://ericsemling.com/blog/?feed=rss2&amp;p=17</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>My HTML5 Site Re-design</title>
		<link>http://ericsemling.com/blog/?p=13</link>
		<comments>http://ericsemling.com/blog/?p=13#comments</comments>
		<pubDate>Fri, 22 Oct 2010 00:03:58 +0000</pubDate>
		<dc:creator>Eric</dc:creator>
				<category><![CDATA[CSS3]]></category>
		<category><![CDATA[Ericsemling.com Design]]></category>
		<category><![CDATA[HTML5]]></category>
		<category><![CDATA[Web Design]]></category>

		<guid isPermaLink="false">http://ericsemling.com/blog/?p=13</guid>
		<description><![CDATA[Well, I finally decided that my website needed a new look.  I had been meaning to do some final tweaks to my old design, but then (of course), I decided that it would be better to just do a whole &#8230; <a href="http://ericsemling.com/blog/?p=13">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p><img class="alignnone size-full wp-image-14" title="Website Re-Design" src="http://ericsemling.com/blog/wp-content/uploads/2010/10/site-redesign.jpg" alt="ericsemling.com re-design" width="500" height="300" /></p>
<p>Well, I finally decided that my website needed a new look.  I had been meaning to do some final tweaks to my old design, but then (of course), I decided that it would be better to just do a whole re-design.  I also figured it would be a great opportunity to learn HTML5 and more CSS3.</p>
<p>After reading a couple books on HTML5 (<a href="http://books.alistapart.com/products/html5-for-web-designers">HTML5 for Web Designers</a> and <a href="http://introducinghtml5.com/">Introducing HTML5</a>), I felt I had a decent basic understanding of HTML5 and how it should be used.  I had been playing around with CSS3 stuff for the past year or so, so I was much more familiar with that aspect of what was my site re-design-to-be.</p>
<p>I used my normal work flow to create my new design: color scheme selection, typical Photoshop design mock-up, structural markup (HTML skeleton), and then the styling at a high level of detail.  The only difference this time, was I started with Paul Irish&#8217;s <a href="http://html5boilerplate.com/">HTML5 Boilerplate</a>, an amazing &#8220;boilerplate,&#8221; or starting point for using HTML5 today.</p>
<p>According to the official website, the &#8220;HTML5 Boilerplate is the professional badass&#8217;s base HTML/CSS/JS template for a fast, robust and future-proof site.&#8221;  What it basically is, is a combination of tools and resources for making HTML5 completely functional (or as close to it as possible) in all major browsers.  Yes, even IE.  You can read more about it in detail on the website.</p>
<p>With HTML5 Boilerplate, I was able to use all the new HTML5 elements I needed, semantically:  header, nav, hgroup, section, article, aside, footer, etc.  I was quite happy with how easy working with the boilerplate was.  If you &#8220;view source&#8221; on any of my main site pages, you can see these elements being used (although the blog pages are a bit sloppy &#8212; as I modified a stripped-down HTML5 theme for WordPress &#8212; but that&#8217;s for a separate post).</p>
<p>The re-design was a great learning experience, as I thought it would be.  I continue to read books and articles on HTML5, and am extremely excited about the future it holds for web design.  I&#8217;m sure my site will go through many more tweaks and re-designs as I become more and more comfortable with HTML5 and CSS3.</p>


<div class="shr-bookmarks shr-bookmarks-expand shr-bookmarks-center">
<ul class="socials">
		<li class="shr-twitter">
			<a href="http://twitter.com/home?status=My+HTML5+Site+Re-design+-+http://b2l.me/azsmet&amp;source=shareaholic" rel="nofollow" class="external" title="Tweet This!">Tweet This!</a>
		</li>
		<li class="shr-facebook">
			<a href="http://www.facebook.com/share.php?v=4&amp;src=bm&amp;u=http://ericsemling.com/blog/?p=13&amp;t=My+HTML5+Site+Re-design" rel="nofollow" class="external" title="Share this on Facebook">Share this on Facebook</a>
		</li>
		<li class="shr-delicious">
			<a href="http://delicious.com/post?url=http://ericsemling.com/blog/?p=13&amp;title=My+HTML5+Site+Re-design" rel="nofollow" class="external" title="Share this on del.icio.us">Share this on del.icio.us</a>
		</li>
		<li class="shr-stumbleupon">
			<a href="http://www.stumbleupon.com/submit?url=http://ericsemling.com/blog/?p=13&amp;title=My+HTML5+Site+Re-design" rel="nofollow" class="external" title="Stumble upon something good? Share it on StumbleUpon">Stumble upon something good? Share it on StumbleUpon</a>
		</li>
		<li class="shr-tumblr">
			<a href="http://www.tumblr.com/share?v=3&amp;u=http%3A%2F%2Fericsemling.com%2Fblog%2F%3Fp%3D13&amp;t=My+HTML5+Site+Re-design" rel="nofollow" class="external" title="Share this on Tumblr">Share this on Tumblr</a>
		</li>
		<li class="shr-comfeed">
			<a href="http://ericsemling.com/blog/?p=13&amp;feed=comments-rss2" rel="nofollow" class="external" title="Subscribe to the comments for this post?">Subscribe to the comments for this post?</a>
		</li>
		<li class="shr-googlebookmarks">
			<a href="http://www.google.com/bookmarks/mark?op=add&amp;bkmk=http://ericsemling.com/blog/?p=13&amp;title=My+HTML5+Site+Re-design" rel="nofollow" class="external" title="Add this to Google Bookmarks">Add this to Google Bookmarks</a>
		</li>
		<li class="shr-mail">
			<a href="mailto:?subject=%22My%20HTML5%20Site%20Re-design%22&amp;body=Link: http://ericsemling.com/blog/?p=13 (sent via shareaholic)%0D%0A%0D%0A----%0D%0A %0D%0A%0D%0AWell%2C%20I%20finally%20decided%20that%20my%20website%20needed%20a%20new%20look.%20%C2%A0I%20had%20been%20meaning%20to%20do%20some%20final%20tweaks%20to%20my%20old%20design%2C%20but%20then%20%28of%20course%29%2C%20I%20decided%20that%20it%20would%20be%20better%20to%20just%20do%20a%20whole%20re-design.%20%C2%A0I%20also%20figured%20it%20would%20be%20a%20great%20opportunity%20to%20learn%20HTML5%20and%20more%20CSS3.%0D%0A%0D%0AAfter%20" rel="nofollow" class="external" title="Email this to a friend?">Email this to a friend?</a>
		</li>
</ul>
<div style="clear:both;"></div>
</div>

]]></content:encoded>
			<wfw:commentRss>http://ericsemling.com/blog/?feed=rss2&amp;p=13</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Welcome!</title>
		<link>http://ericsemling.com/blog/?p=1</link>
		<comments>http://ericsemling.com/blog/?p=1#comments</comments>
		<pubDate>Fri, 10 Sep 2010 00:08:16 +0000</pubDate>
		<dc:creator>Eric</dc:creator>
				<category><![CDATA[Web Design]]></category>
		<category><![CDATA[Wordpress]]></category>

		<guid isPermaLink="false">http://ericsemling.com/blog/?p=1</guid>
		<description><![CDATA[Welcome to my blog! I am just finalizing the template, so don&#8217;t mind some of the styling issues (comments, etc.) at the present time. I plan on writing frequent posts dealing with anything web-related &#8212; especially information and updates on &#8230; <a href="http://ericsemling.com/blog/?p=1">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>Welcome to my blog!</p>
<p>I am just finalizing the template, so don&#8217;t mind some of the styling issues (comments, etc.) at the present time.</p>
<p>I plan on writing frequent posts dealing with anything web-related &#8212; especially information and updates on projects I&#8217;m working on.  I hope some of what I post will be either interesting or helpful (or both!).</p>
<p>I hope to make my first official post soon.  It will likely be about my HTML5 website re-design (of this site), or about modifying<a title="WordPress Toolbox Theme" href="http://wordpress.org/extend/themes/toolbox" target="_self"> the Toolbox WordPress theme</a>, a stripped down HTML5-based template, for this blog.</p>
<p>Until then, please enjoy finding your way around my new website! <img src='http://ericsemling.com/blog/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> </p>


<div class="shr-bookmarks shr-bookmarks-expand shr-bookmarks-center">
<ul class="socials">
		<li class="shr-twitter">
			<a href="http://twitter.com/home?status=Welcome%21+-+http://b2l.me/as4y4k&amp;source=shareaholic" rel="nofollow" class="external" title="Tweet This!">Tweet This!</a>
		</li>
		<li class="shr-facebook">
			<a href="http://www.facebook.com/share.php?v=4&amp;src=bm&amp;u=http://ericsemling.com/blog/?p=1&amp;t=Welcome%21" rel="nofollow" class="external" title="Share this on Facebook">Share this on Facebook</a>
		</li>
		<li class="shr-delicious">
			<a href="http://delicious.com/post?url=http://ericsemling.com/blog/?p=1&amp;title=Welcome%21" rel="nofollow" class="external" title="Share this on del.icio.us">Share this on del.icio.us</a>
		</li>
		<li class="shr-stumbleupon">
			<a href="http://www.stumbleupon.com/submit?url=http://ericsemling.com/blog/?p=1&amp;title=Welcome%21" rel="nofollow" class="external" title="Stumble upon something good? Share it on StumbleUpon">Stumble upon something good? Share it on StumbleUpon</a>
		</li>
		<li class="shr-tumblr">
			<a href="http://www.tumblr.com/share?v=3&amp;u=http%3A%2F%2Fericsemling.com%2Fblog%2F%3Fp%3D1&amp;t=Welcome%21" rel="nofollow" class="external" title="Share this on Tumblr">Share this on Tumblr</a>
		</li>
		<li class="shr-comfeed">
			<a href="http://ericsemling.com/blog/?p=1&amp;feed=comments-rss2" rel="nofollow" class="external" title="Subscribe to the comments for this post?">Subscribe to the comments for this post?</a>
		</li>
		<li class="shr-googlebookmarks">
			<a href="http://www.google.com/bookmarks/mark?op=add&amp;bkmk=http://ericsemling.com/blog/?p=1&amp;title=Welcome%21" rel="nofollow" class="external" title="Add this to Google Bookmarks">Add this to Google Bookmarks</a>
		</li>
		<li class="shr-mail">
			<a href="mailto:?subject=%22Welcome%21%22&amp;body=Link: http://ericsemling.com/blog/?p=1 (sent via shareaholic)%0D%0A%0D%0A----%0D%0A Welcome%20to%20my%20blog%21%0D%0A%0D%0AI%20am%20just%20finalizing%20the%20template%2C%20so%20don%27t%20mind%20some%20of%20the%20styling%20issues%20%28comments%2C%20etc.%29%20at%20the%20present%20time.%0D%0A%0D%0AI%20plan%20on%20writing%20frequent%20posts%20dealing%20with%20anything%20web-related%20--%20especially%20information%20and%20updates%20on%20projects%20I%27m%20working%20on.%20%C2%A0I%20hope%20some%20of%20what%20I%20pos" rel="nofollow" class="external" title="Email this to a friend?">Email this to a friend?</a>
		</li>
</ul>
<div style="clear:both;"></div>
</div>

]]></content:encoded>
			<wfw:commentRss>http://ericsemling.com/blog/?feed=rss2&amp;p=1</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

