<?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>David Beck&#039;s Blog &#187; Web Development</title>
	<atom:link href="http://davidbeckblog.com/category/web-development/feed/" rel="self" type="application/rss+xml" />
	<link>http://davidbeckblog.com</link>
	<description>The ramblings of an obsessed programmer</description>
	<lastBuildDate>Thu, 22 Jul 2010 18:01:18 +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>Correct Paging</title>
		<link>http://davidbeckblog.com/2009/11/correct-paging/</link>
		<comments>http://davidbeckblog.com/2009/11/correct-paging/#comments</comments>
		<pubDate>Tue, 17 Nov 2009 20:59:49 +0000</pubDate>
		<dc:creator>David Beck</dc:creator>
				<category><![CDATA[User Experience]]></category>
		<category><![CDATA[Web Development]]></category>
		<category><![CDATA[WordPress]]></category>

		<guid isPermaLink="false">http://davidbeckblog.com/?p=168</guid>
		<description><![CDATA[Paging is separating out content to multiple pages, and it is a really common task for websites. The problem is that like oh so many things on the web, it is rarely done well. Come with me on this journey (rant?) on the correct way to implement paging. Each page should have a &#8220;Next&#8221; and [...]]]></description>
			<content:encoded><![CDATA[<p>Paging is separating out content to multiple pages, and it is a really common task for websites. The problem is that like oh so many things on the web, it is rarely done well. Come with me on this journey (rant?) on the correct way to implement paging.</p>
<p>Each page should have a &#8220;Next&#8221; and &#8220;Previous&#8221; button. If you are referring to chronological content, such as blog posts, use &#8220;Newer&#8221; and &#8220;Older&#8221; to be more specific. They should be the most prominent part of the paging area, since anyone interacting with that area of the page will most likely be going back and forth through the results.</p>
<p>There should also be a list of the pages in between the next/previous button.</p>
<p>Here is an example from <a href="http://bubble.davidbeckblog.com" onclick="pageTracker._trackPageview('/outgoing/bubble.davidbeckblog.com?referer=');">Bubble Burster website</a>:</p>
<div id="attachment_169" class="wp-caption aligncenter" style="width: 356px"><img class="size-full wp-image-169 " title="Newer and Previous" src="http://davidbeckblog.com/wp-content/uploads/Screen-shot-2009-11-17-at-12.31.33-PM.png" alt="An example of using Newer and Previous buttons" width="346" height="53" /><p class="wp-caption-text">An example of using Newer and Previous buttons</p></div>
<p><span id="more-168"></span></p>
<p>Here I am using <a href="http://wordpress.org/extend/plugins/wp-page-numbers/" onclick="pageTracker._trackPageview('/outgoing/wordpress.org/extend/plugins/wp-page-numbers/?referer=');">WP Page Numbers</a>.</p>
<p>When the page is at the beginning or the end, leave the Next/Previous buttons in place, but disable the one that is no longer valid.</p>
<div id="attachment_171" class="wp-caption aligncenter" style="width: 322px"><img class="size-full wp-image-171 " title="Disable Previous" src="http://davidbeckblog.com/wp-content/uploads/Screen-shot-2009-11-17-at-12.32.38-PM.png" alt="Example of a disabled Newer button" width="312" height="55" /><p class="wp-caption-text">Example of a disabled Newer button</p></div>
<p>&#8220;First&#8221; and &#8220;Last&#8221; buttons should be 1&#8230; and &#8230;(last page number) because they are smaller than the entire word and more obvious than a symbol. This is best described by a picture:</p>
<div id="attachment_173" class="wp-caption aligncenter" style="width: 442px"><img class="size-full wp-image-173  " title="First and Last Example" src="http://davidbeckblog.com/wp-content/uploads/Screen-shot-2009-11-17-at-12.34.00-PM.png" alt="An example of using the first and last page number for first and last" width="432" height="56" /><p class="wp-caption-text">An example of using the first and last page number for first and last</p></div>
<p>Here you see that the first and last page numbers are present, even when they are many pages away from the current page. This replaces the need for first and last buttons and is a bit more obvious what they do. Clicking 1 goes to page 1. Just like clicking page 3 goes to page 3. You may not think about these kinds of things but every user has to learn how to user your interface and even if it only takes 10 seconds to understand what clicking &#8220;First&#8221; does, it is one more thing that makes your interface easier to use.</p>
<p>Also, it is more common for a user to want to go back or forward than to the first page. This is because they will only go to page 1 once (that is unless you have some really addictive content on page one that people keep trying to stop looking at but just can&#8217;t resist). If they were to go through your content page by page though, they would be hitting the &#8220;Next&#8221; button every page.</p>
<p>Finally, put a little padding on the numbers. This example is a little big and bubbly (for a <a href="http://bubble.davidbeckblog.com" onclick="pageTracker._trackPageview('/outgoing/bubble.davidbeckblog.com?referer=');">big and bubbly site</a>) but realize that you are putting a dozen links right next to each other. And while I&#8217;m at it, put a little effort into the appearance. Don&#8217;t just through raw links on a page, that&#8217;s ugly.</p>
]]></content:encoded>
			<wfw:commentRss>http://davidbeckblog.com/2009/11/correct-paging/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Lunarpages Review</title>
		<link>http://davidbeckblog.com/2009/10/lunarpages-review/</link>
		<comments>http://davidbeckblog.com/2009/10/lunarpages-review/#comments</comments>
		<pubDate>Fri, 09 Oct 2009 20:00:44 +0000</pubDate>
		<dc:creator>David Beck</dc:creator>
				<category><![CDATA[Web Development]]></category>
		<category><![CDATA[Hosting]]></category>
		<category><![CDATA[Lunarpages]]></category>
		<category><![CDATA[PHP]]></category>

		<guid isPermaLink="false">http://davidbeckblog.com/?p=114</guid>
		<description><![CDATA[I have been using Lunarpages for over a year now and I really love it. I first started using it for work, and then for my personal sites like this one. I have really enjoyed it and will definitely be using it for a long time to come. It is what I recommend to anyone [...]]]></description>
			<content:encoded><![CDATA[<p>I have been using <a href="http://www.lunarpages.com/id/davbeck" target="_blank" onclick="pageTracker._trackPageview('/outgoing/www.lunarpages.com/id/davbeck?referer=');">Lunarpages</a> for over a year now and I really love it. I first started using it for work, and then for my personal sites like this one. I have really enjoyed it and will definitely be using it for a long time to come. It is what I recommend to anyone that dare ask my opinion.</p>
<p><span id="more-114"></span></p>
<p>The reason I first was attracted to <a href="http://www.lunarpages.com/id/davbeck" target="_blank" onclick="pageTracker._trackPageview('/outgoing/www.lunarpages.com/id/davbeck?referer=');">Lunarpages</a> is their cheap unlimited plan. For $5/month, you can get their basic hosting plan that includes <em>unlimited</em> storage space, bandwidth, email accounts, databases, add-on domains, sub-domains and ftp accounts. Basically, I don&#8217;t need to worry about any of that stuff. Even if I didn&#8217;t reach the limits of some more stingy providers, I would no doubt keep myself awake at night worrying about the possibility of one of my sites not appearing tomorrow because the bandwidth limit was reached.</p>
<p>The other reason I chose to risk a 2 year contract with yet another company is the long list of supported technologies. PHP in particular, and all of it&#8217;s libraries and extensions. Being that PHP is my language of choice when creating a site, it was a must. But they don&#8217;t stop at the bare minimum. Pretty much whatever your platform desires be, they have it.</p>
<p>Lunarpages also has many technologies that are a relief when dealing with a company. For instance their support for unlimited email storage (see above) combined with their support for IMAP and webmail make giving companies their own email address rather than that hobo looking Gmail account they have been printing on their business cards, a treat rather than a hassle. They also support forwarding to any other email address, so no one has to have several different email addresses and passwords and log in pages and and etc. This in particular has been a relief for me given that I maintain several dozen email addresses.</p>
<p>The uptime on the server is pretty good given the price of the service. I would be lying through my teeth if I told you I have never had a few hours of downtime. Luckily, when I do have a problem, I can call their customer support and get through in less than 15 minutes and usually they are already aware of the problem and on their way to fixing it.</p>
<p>Ever since I first saw <a href="http://www.lunarpages.com/id/davbeck" target="_blank" onclick="pageTracker._trackPageview('/outgoing/www.lunarpages.com/id/davbeck?referer=');">Lunarpages</a> I have been asking myself, &#8220;What&#8217;s the catch&#8221;. After a year of using them every day, I have yet to find one. The price really is that low. The space really is unlimited. They really are that good. I was even presently surprised the other day when they extended their free Facebook advertising promotion to current customers, otherwise known as me.</p>
]]></content:encoded>
			<wfw:commentRss>http://davidbeckblog.com/2009/10/lunarpages-review/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Bubble Burster website now live</title>
		<link>http://davidbeckblog.com/2009/09/bubble-burster-website-now-live/</link>
		<comments>http://davidbeckblog.com/2009/09/bubble-burster-website-now-live/#comments</comments>
		<pubDate>Mon, 14 Sep 2009 21:33:58 +0000</pubDate>
		<dc:creator>David Beck</dc:creator>
				<category><![CDATA[Web Development]]></category>
		<category><![CDATA[Bubble Burster]]></category>
		<category><![CDATA[PHP]]></category>
		<category><![CDATA[WordPress]]></category>

		<guid isPermaLink="false">http://davidbeckblog.com/?p=98</guid>
		<description><![CDATA[I finished up the Bubble Burster website today. You can find it at bubble.davidbeckblog.com. I built it with WordPress (same as this site) but I made the theme myself and wrote and edited several plugins to get it just right. I use to make sites by hand using PHP. I always figured any prebuilt package would [...]]]></description>
			<content:encoded><![CDATA[<p>I finished up the Bubble Burster website today. You can find it at <a href="http://bubble.davidbeckblog.com" onclick="pageTracker._trackPageview('/outgoing/bubble.davidbeckblog.com?referer=');">bubble.davidbeckblog.com</a>. I built it with WordPress (same as this site) but I made the theme myself and wrote and edited several plugins to get it just right.<br />
<span id="more-98"></span><br />
I use to make sites by hand using PHP. I always figured any prebuilt package would take you longer to learn the custom weirdness of the system that it would be quicker to do it yourself. But with wordpress, it is done so well that that isn&#8217;t really the truth. I plan to make all my sites with it from now on.</p>
]]></content:encoded>
			<wfw:commentRss>http://davidbeckblog.com/2009/09/bubble-burster-website-now-live/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>That pesky white space</title>
		<link>http://davidbeckblog.com/2009/09/that-pesky-white-space/</link>
		<comments>http://davidbeckblog.com/2009/09/that-pesky-white-space/#comments</comments>
		<pubDate>Fri, 11 Sep 2009 16:10:02 +0000</pubDate>
		<dc:creator>David Beck</dc:creator>
				<category><![CDATA[Web Development]]></category>
		<category><![CDATA[HTML]]></category>

		<guid isPermaLink="false">http://davidbeckblog.com/?p=87</guid>
		<description><![CDATA[If your OCD like myself, and also suffer from the need to make websites, you may have run into this pesky problem when you lay out images and what not on a page. The problem comes when you try to mathematically determine the exact right padding so that all the objects are laid out evenly [...]]]></description>
			<content:encoded><![CDATA[<p>If your OCD like myself, and also suffer from the need to make websites, you may have run into this pesky problem when you lay out images and what not on a page. The problem comes when you try to mathematically determine the exact right padding so that all the objects are laid out evenly only to find that the last one falls off the end to the next line.<br />
<span id="more-87"></span><br />
What&#8217;s happening? You forgot about html white space. If you put any kind of space, tab or line break between elements, it ads a space. Even worse, you may try to adjust the padding so that it looks correct in your browser, and you go to a different computer and it is a completely different distance. This is because different browsers may have different font rendering.</p>
<p>The solution? Remove the white space.</p>
<pre>&lt;img src="first.png" /&gt;&lt;img src="second.png" /&gt;</pre>
<p>Make sure not to put any space in between.</p>
]]></content:encoded>
			<wfw:commentRss>http://davidbeckblog.com/2009/09/that-pesky-white-space/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
