<?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>Jon Knapp &#187; CSS</title>
	<atom:link href="http://jonknapp.com/tag/css/feed/" rel="self" type="application/rss+xml" />
	<link>http://jonknapp.com</link>
	<description>byte artist</description>
	<lastBuildDate>Sat, 20 Aug 2011 07:48:35 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.2.1</generator>
		<item>
		<title>Square Records</title>
		<link>http://jonknapp.com/2010/08/square-records/</link>
		<comments>http://jonknapp.com/2010/08/square-records/#comments</comments>
		<pubDate>Sat, 07 Aug 2010 14:24:25 +0000</pubDate>
		<dc:creator>jon</dc:creator>
				<category><![CDATA[portfolio]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[Easter Egg]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[image replacement]]></category>
		<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[jQuery]]></category>
		<category><![CDATA[SEO]]></category>

		<guid isPermaLink="false">http://www.jonknapp.com/?p=124</guid>
		<description><![CDATA[Square Records is a small, independent record and cd shop in the Highland Square area of Akron, Ohio.  They are celebrating their 7th anniversary today and I am happy to unveil their first website! The owners are really good friends of mine, and we have been working on this site for awhile.  We designed all [...]]]></description>
			<content:encoded><![CDATA[<p>Square Records is a small, independent record and cd shop in the Highland Square area of Akron, Ohio.  They are celebrating their 7th anniversary today and I am happy to unveil their first website!</p>
<p>The owners are really good friends of mine, and we have been working on this site for awhile.  We designed all of the pages of the site to match the look of some of their favorite album covers.  There is a lot of image replacement that occurs on the site to match the album design, while still allowing indexable content for search engines and screen readers.</p>
<p>I am really happy with how the site came out and its character helps to accentuate the business that Dave and Juniper have created over the past 7 years.</p>
]]></content:encoded>
			<wfw:commentRss>http://jonknapp.com/2010/08/square-records/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>The L-Train</title>
		<link>http://jonknapp.com/2009/12/ltrain/</link>
		<comments>http://jonknapp.com/2009/12/ltrain/#comments</comments>
		<pubDate>Sun, 06 Dec 2009 16:34:30 +0000</pubDate>
		<dc:creator>jon</dc:creator>
				<category><![CDATA[portfolio]]></category>
		<category><![CDATA[ActionScript 2]]></category>
		<category><![CDATA[ActionScript 3]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[Flash]]></category>
		<category><![CDATA[Flex]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[jQuery]]></category>
		<category><![CDATA[MySQL]]></category>
		<category><![CDATA[PHP]]></category>

		<guid isPermaLink="false">http://www.jonknapp.com/?p=33</guid>
		<description><![CDATA[The L-Train is a Flash-based learning management software (LMS) application and it is probably the largest software product I have created to date. The front end is Flash which allows every experience to deliver the same look and feel no matter what operating system or web browser. The project was based around design, ease of [...]]]></description>
			<content:encoded><![CDATA[<p>The L-Train is a Flash-based learning management software (LMS) application and it is probably the largest software product I have created to date. The front end is Flash which allows every experience to deliver the same look and feel no matter what operating system or web browser.</p>
<p>The project was based around design, ease of use, and trying to get rid of the stigma that e-learning has to be the <em>same old boring thing</em>.</p>
<p>My role was to create the entire application from scratch, using only still photo mock-ups. This involved chopping out the assets, integrating them into Flash or HTML, adding appropriate animations, and tweaking the design as functionality and usability were introduced&#8230; and that&#8217;s just to get the artwork into the project.</p>
<ul class="list">
<li>I built the application with a PHP and MySQL backend to handle all of the server side functionality.</li>
<li>There is a CRON job that calculates client statistics every few hours so we have an idea of how the system is being operated.</li>
<li>There is a PHP class for dynamically developing PDF files for course certificates which I integrated into the system.</li>
<li>System alerts are delivered using jQuery in a Growl-like fashion.</li>
<li>Part of the admins side is a Flex-based application for creating quiz pools, including picture uploads, that can be randomly drawn from during quizzes on the user side.</li>
</ul>
<p>The project was a great learning experience and helped solidify larger project ideals, such as how to handle continued feature and support requests, how to take a project from design to web, and how to best manage the available resources for the project.</p>
]]></content:encoded>
			<wfw:commentRss>http://jonknapp.com/2009/12/ltrain/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Caffeinated Solutions</title>
		<link>http://jonknapp.com/2009/11/caffeinated-solutions/</link>
		<comments>http://jonknapp.com/2009/11/caffeinated-solutions/#comments</comments>
		<pubDate>Sun, 29 Nov 2009 21:28:01 +0000</pubDate>
		<dc:creator>jon</dc:creator>
				<category><![CDATA[portfolio]]></category>
		<category><![CDATA[ActionScript 2]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[Flash]]></category>
		<category><![CDATA[HTML]]></category>

		<guid isPermaLink="false">http://www.jonknapp.com/?p=74</guid>
		<description><![CDATA[The home of my freelancing career, Caffeinated Solutions holds a special spot in my heart. The site is designed as an electronic portfolio that I constructed the last few years of college. I created it in Flash, but loaded the client and project descriptions from separate XML files on the server so that I could [...]]]></description>
			<content:encoded><![CDATA[<p>The home of my freelancing career, Caffeinated Solutions holds a special spot in my heart.  The site is designed as an electronic portfolio that I constructed the last few years of college.  I created it in Flash, but loaded the client and project descriptions from separate XML files on the server so that I could dynamically add/remove/modify the content without having to rebuild the Flash file.</p>
<p>Since I haven&#8217;t been keeping the site up to date as much as I should have I now redirect traffic to <a href="http://www.jonknapp.com">jonknapp.com</a>.</p>
]]></content:encoded>
			<wfw:commentRss>http://jonknapp.com/2009/11/caffeinated-solutions/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>STAMM Contracting</title>
		<link>http://jonknapp.com/2009/11/stamm-contracting/</link>
		<comments>http://jonknapp.com/2009/11/stamm-contracting/#comments</comments>
		<pubDate>Sun, 29 Nov 2009 20:00:37 +0000</pubDate>
		<dc:creator>jon</dc:creator>
				<category><![CDATA[portfolio]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[Google maps]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[PHP]]></category>

		<guid isPermaLink="false">http://www.jonknapp.com/?p=70</guid>
		<description><![CDATA[STAMM&#8217;s website was quite outdated when we first met. They had lost touch with the original designer of the website and wanted to start over from scratch. After meeting with them in person and collecting all of their pictures and print assets, I came up with a mock-up design that they liked. Soon I had [...]]]></description>
			<content:encoded><![CDATA[<p>STAMM&#8217;s website was quite outdated when we first met.  They had lost touch with the original designer of the website and wanted to start over from scratch.</p>
<p>After meeting with them in person and collecting all of their pictures and print assets, I came up with a mock-up design that they liked.  Soon I had their entire site designed with updated pictures and a good HTML/CSS design combo.  I also implemented a random testimonial that pulls from a collection on the server and an embedded Google map of their location on their contact page.</p>
]]></content:encoded>
			<wfw:commentRss>http://jonknapp.com/2009/11/stamm-contracting/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Blue Jazz Java</title>
		<link>http://jonknapp.com/2009/11/blue-jazz-java/</link>
		<comments>http://jonknapp.com/2009/11/blue-jazz-java/#comments</comments>
		<pubDate>Sun, 29 Nov 2009 19:05:38 +0000</pubDate>
		<dc:creator>jon</dc:creator>
				<category><![CDATA[portfolio]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[SEO]]></category>

		<guid isPermaLink="false">http://www.jonknapp.com/?p=68</guid>
		<description><![CDATA[A small website that I converted from a static Photoshop file to an HTML/CSS implementation. I designed the site to have all of the text fully searchable by search engines, however it was replaced by images once the site was loaded to present the look and feel the client wanted. The image replacement was done [...]]]></description>
			<content:encoded><![CDATA[<p>A small website that I converted from a static Photoshop file to an HTML/CSS implementation. I designed the site to have all of the text fully searchable by search engines, however it was replaced by images once the site was loaded to present the look and feel the client wanted. The image replacement was done using CSS, including the rollover states for the links, which are also images.</p>
]]></content:encoded>
			<wfw:commentRss>http://jonknapp.com/2009/11/blue-jazz-java/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Castle Engraving</title>
		<link>http://jonknapp.com/2009/11/castle-engraving/</link>
		<comments>http://jonknapp.com/2009/11/castle-engraving/#comments</comments>
		<pubDate>Sun, 29 Nov 2009 16:04:28 +0000</pubDate>
		<dc:creator>jon</dc:creator>
				<category><![CDATA[portfolio]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[PHP]]></category>
		<category><![CDATA[WordPress]]></category>

		<guid isPermaLink="false">http://www.jonknapp.com/?p=65</guid>
		<description><![CDATA[This is a website that I created for a building supply company in my hometown. Their business is custom engraving rocks, brick, and other materials, and they wanted to create an online presence to extend their business. To allow them to manage their content and images on their own, I created the site using WordPress. [...]]]></description>
			<content:encoded><![CDATA[<p>This is a website that I created for a building supply company in my hometown. Their business is custom engraving rocks, brick, and other materials, and they wanted to create an online presence to extend their business.</p>
<p>To allow them to manage their content and images on their own, I created the site using WordPress. By working closely with the client, I was able to find a theme that resembled the design they were looking for, then modified it to meet their needs.</p>
<p>The main feature of the site is the ability for clients to easily browse the available design patterns and choose a custom engraving design form the comfort of their home.</p>
]]></content:encoded>
			<wfw:commentRss>http://jonknapp.com/2009/11/castle-engraving/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>iPhone Portfolio for Expand</title>
		<link>http://jonknapp.com/2009/11/iphone-portfolio-for-expand/</link>
		<comments>http://jonknapp.com/2009/11/iphone-portfolio-for-expand/#comments</comments>
		<pubDate>Sun, 01 Nov 2009 21:49:58 +0000</pubDate>
		<dc:creator>jon</dc:creator>
				<category><![CDATA[portfolio]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[iui]]></category>
		<category><![CDATA[mobile]]></category>
		<category><![CDATA[SEO]]></category>

		<guid isPermaLink="false">http://www.jonknapp.com/?p=92</guid>
		<description><![CDATA[Using iui as for the mobile framework, I created a mobile web optimized site for a version of Expand&#8217;s portfolio. Instead of having to learn how to create an application for displaying video files natively on the iPhone, I used a JavaScript/CSS model for creating an experience that mimics the iPhone&#8217;s controls. The project link [...]]]></description>
			<content:encoded><![CDATA[<p>Using <a href="http://code.google.com/p/iui/">iui</a> as for the mobile framework, I created a mobile web optimized site for a version of Expand&#8217;s portfolio.</p>
<p>Instead of having to learn how to create an application for displaying video files natively on the iPhone, I used a JavaScript/CSS model for creating an experience that mimics the iPhone&#8217;s controls.</p>
<p>The project link is to a backup of the site since we didn&#8217;t plan on keeping the mobile portfolio up to date in the long run.</p>
]]></content:encoded>
			<wfw:commentRss>http://jonknapp.com/2009/11/iphone-portfolio-for-expand/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Expand Portfolio Re-Design</title>
		<link>http://jonknapp.com/2009/11/expand-portfolio-re-design/</link>
		<comments>http://jonknapp.com/2009/11/expand-portfolio-re-design/#comments</comments>
		<pubDate>Sun, 01 Nov 2009 21:34:41 +0000</pubDate>
		<dc:creator>jon</dc:creator>
				<category><![CDATA[portfolio]]></category>
		<category><![CDATA[ActionScript 3]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[Flash]]></category>
		<category><![CDATA[Flex]]></category>
		<category><![CDATA[HTML]]></category>

		<guid isPermaLink="false">http://www.jonknapp.com/?p=90</guid>
		<description><![CDATA[Before we settled on a WordPress installation, we were playing around with a Flex-based version of our portfolio site. All information for the &#8220;Our Work&#8221; and &#8220;What&#8217;s Fresh&#8221; sections is read in from external XML files so that projects, pictures, and descriptions could be changed without having to recompile the project. The initial video shown [...]]]></description>
			<content:encoded><![CDATA[<p>Before we settled on a WordPress installation, we were playing around with a Flex-based version of our portfolio site. All information for the &#8220;Our Work&#8221; and &#8220;What&#8217;s Fresh&#8221; sections is read in from external XML files so that projects, pictures, and descriptions could be changed without having to recompile the project.</p>
<p>The initial video shown when you first visit the site is a Flash SWF that is loaded in by Flex, but is able to be controlled by Flex through a class interface. That way, I can tell the piece to stop playing and restart if the user decides to go to another portion of the site.</p>
<p>The pictures for each of the items on the site are only loaded in when they are to the left or right of the current piece. That way images are requested as needed instead of being embedded into the Flex application (which bloats the filesize) or being requested as soon as the application starts (which slows down the user&#8217;s bandwidth of the current piece).</p>
<p>The project link is to a backed up version of the site, since Expand didn&#8217;t end up going in this direction.</p>
]]></content:encoded>
			<wfw:commentRss>http://jonknapp.com/2009/11/expand-portfolio-re-design/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

