<?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>The Content Strategist &#187; Movable Type</title>
	<atom:link href="http://contently.com/blog/tag/movable-type/feed/" rel="self" type="application/rss+xml" />
	<link>http://contently.com/blog</link>
	<description>Social media and content marketing tips and trends</description>
	<lastBuildDate>Fri, 17 May 2013 21:31:42 +0000</lastBuildDate>
	<language>en-US</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.4.2</generator>
		<item>
		<title>Build a Gorgeous Blog without a Design Degree</title>
		<link>http://contently.com/blog/2011/11/29/build-a-gorgeous-blog-without-a-design-degree/</link>
		<comments>http://contently.com/blog/2011/11/29/build-a-gorgeous-blog-without-a-design-degree/#comments</comments>
		<pubDate>Tue, 29 Nov 2011 11:12:44 +0000</pubDate>
		<dc:creator>Erik Sherman</dc:creator>
				<category><![CDATA[Content Design]]></category>
		<category><![CDATA[Cascading Style Sheets]]></category>
		<category><![CDATA[Copyblogger]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[Features]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[Movable Type]]></category>
		<category><![CDATA[personalization]]></category>
		<category><![CDATA[problogger.net]]></category>
		<category><![CDATA[Source code]]></category>
		<category><![CDATA[Tools]]></category>
		<category><![CDATA[WordPress]]></category>

		<guid isPermaLink="false">http://contently.com/blog/?p=1230</guid>
		<description><![CDATA[<p>A great blog communicates on all levels, including visual, to attract and retain an audience. Even if you&#8217;re not &#8220;artistic&#8221; and lack the budget for&#8230;</p><p><em><a href="http://contently.com/blog">The Content Strategist</a> is a daily magazine for forward-thinking publishers and content marketers, sponsored and created by <a href="http://contently.com/">Contently</a></em></p>]]></description>
			<content:encoded><![CDATA[<p>A great blog communicates on all levels, including visual, to attract and retain an audience. Even if you&#8217;re not &#8220;artistic&#8221; and lack the budget for a custom design, you can still have an attractive blog.</p>
<div id="attachment_1232" class="wp-caption alignright" style="width: 240px"><a href="http://contently.com/blog/wp-content/uploads/2012/04/images.jpeg"><img class="size-full wp-image-1232" title="images" src="http://contently.com/blog/wp-content/uploads/2012/04/images.jpeg" alt="" width="230" height="219" /></a><p class="wp-caption-text">image via banderdash.net</p></div>
<h2><strong>1. Know the Common Building Blocks</strong></h2>
<p>Learn the <a href="http://www.blogdesignblog.com/blog-design/how-to-blog-design-style-guide/">basic design elements</a>. You might not use them all (perhaps you don&#8217;t run ads, for example). But you need a header that says who you are, an area for your content, navigation, headlines for each post, a place for reader comments, social network and subscription links, a footer (the bottom-most area) for each post, and a site footer.</p>
<p>Also consider smart design from other publishing areas, like the magazine deck &#8212; the single sentence below the headline that both summarizes and sells an article&#8217;s content. It helps draw people in and works better than running each first sentence in a list of posts.</p>
<h2><strong>2. Plan It Out</strong></h2>
<p>Designers start with a plan. Create a list of what needs to appear on your blog. Do you plan separate sections for original and curated content? Will there be a blog roll? A feed from your Twitter account?  Next, take pencil and paper and do a <a href="http://www.pvmgarage.com/2010/03/how-to-design-a-better-blog-break-down-the-rules/">rough sketch</a> of what the blog should look like in the browser.</p>
<p>Don&#8217;t worry about your drawing ability. Just block out the major areas you need and label them. One-column, two-column, and three-column layouts offer trade-offs &#8212; additional columns give more options of where to put elements of the blog, but can look more cluttered. Try different arrangements and see what seems most appealing while making changes only means using an eraser.</p>
<h2><strong>3. Find Inspiration</strong></h2>
<p>Look at successful blogs, such as <a href="http://www.problogger.net/">Problogger</a>, <a href="http://www.copyblogger.com/">Copyblogger</a>, <a href="http://www.boingboing.net/">boingboing</a>, or <a href="http://gawker.com/">Gawker</a>. Find  blogs you admire that address a similar audience as yours. Consider why the site works visually, doing a block diagram as part of the analysis.</p>
<div id="attachment_1233" class="wp-caption aligncenter" style="width: 592px"><a href="http://contently.com/blog/wp-content/uploads/2012/04/Screen-Shot-2011-11-22-at-9.00.11-AM.png"><img class="size-full wp-image-1233  " title="Screen Shot 2011-11-22 at 9.00.11 AM" src="http://contently.com/blog/wp-content/uploads/2012/04/Screen-Shot-2011-11-22-at-9.00.11-AM.png" alt="" width="582" height="251" /></a><p class="wp-caption-text">Gawker&#39;s layout provides maximum opportunities for reading content</p></div>
<p>What appeals to you? Compare these layouts to the ones you previously sketched. What changes could improve them? Why do you like one header over another? Maybe it conveys an image of calm or, contrarily, excitement. You might respond to the color scheme or a powerful image. What does the use of fonts say to you? Modern? Solid and rooted in tradition? Eccentric? View the page source. See how large images are set and what typefaces the designer used.</p>
<div id="attachment_1234" class="wp-caption aligncenter" style="width: 550px"><a href="http://contently.com/blog/wp-content/uploads/2012/04/Screen-Shot-2011-11-22-at-9.01.57-AM.png"><img class="size-full wp-image-1234  " title="Screen Shot 2011-11-22 at 9.01.57 AM" src="http://contently.com/blog/wp-content/uploads/2012/04/Screen-Shot-2011-11-22-at-9.01.57-AM.png" alt="" width="540" height="301" /></a><p class="wp-caption-text">Boing Boing&#39;s approach is more visual then Gawker&#39;s</p></div>
<p>Don&#8217;t simply copy the site. Success comes from finding your own voice and look. Remember the famous saying: Good artists copy; great artists steal.&#8217;</p>
<p><strong>4. Learn the Code</strong></p>
<p>This step may take time, but the investment will be worthwhile. It&#8217;s easy to use a preexisting template or theme in a blog, but what you get isn&#8217;t unique &#8230; isn&#8217;t <em>you</em>. To adapt something already existing or to create your own using examples you can find means you&#8217;ll need to write some code.</p>
<div id="attachment_1235" class="wp-caption aligncenter" style="width: 519px"><a href="http://contently.com/blog/wp-content/uploads/2012/04/Screen-Shot-2011-11-22-at-9.06.12-AM.png"><img class="size-full wp-image-1235 " title="Screen Shot 2011-11-22 at 9.06.12 AM" src="http://contently.com/blog/wp-content/uploads/2012/04/Screen-Shot-2011-11-22-at-9.06.12-AM.png" alt="" width="509" height="206" /></a><p class="wp-caption-text">Simple tutorials like the ones at W3 schools can help you visualize your code, and help you fix your mistakes</p></div>
<p>You should start with learning some HTML, the basic language of the web. There are <a href="http://www.w3schools.com/html/">free online tutorials like this one</a>. Next, you&#8217;ll want to go through a<a href="http://www.1keydata.com/css-tutorial/">tutorial on CSS</a>, which stands for &#8220;cascading style sheets.&#8221; That will become the critical design layer for your blog.</p>
<p>You&#8217;ll also need to learn how code for your particular blogging system goes together. WordPress offers its <a href="http://codex.wordpress.org/Main_Page">codex</a>, which is the online manual. The <a href="http://codex.wordpress.org/WordPress_Lessons">lessons section</a> has tutorials for developers. There are many other online resources as well, including this <a href="http://themeshaper.com/modify-wordpress-themes/">guide to modifying WordPress themes</a>. Very handy.</p>
<p>Similarly, there is <a href="http://www.movabletype.org/documentation/">extensive documentation</a> on Movable Type and Google has <a href="http://www.google.com/support/blogger/?hl=en&amp;rd=1">information on customizing Blogger</a>.</p>
<h2><strong>5.  Time to Implement</strong></h2>
<p>You know what you want your blog to look like. Now you&#8217;re ready to actually put everything together.</p>
<p>Start with an existing theme or template that&#8217;s as close to your idea as you can find. Match the number of columns, basic layout, and typography if possible. This puts the essential code into place. Save a backup copy and then edit your working version. Find the images you want for the header. Change colors of everything to what suits you. Shift the column widths and header height. Swap out widgets. Soon enough, you&#8217;ll have made the design your own.</p>
<p>Yes, it&#8217;s a fair amount of work. But you&#8217;ll save money and be proud to know that your blog is really <em>yours</em>.</p>
<p>&nbsp;</p>
<p><span class="Apple-style-span" style="font-weight: bold;">Related articles</span></p>
<ul class="zemanta-article-ul">
<li class="zemanta-article-ul-li"><a href="http://contently.com/blog/10-tools-for-converting-your-blogs-new-visitors-into-fans/" target="_blank">The Best Tools on WordPress to make your Content Look Great </a>(contently.com)</li>
<li class="zemanta-article-ul-li"><a href="http://blog.hubspot.com/blog/tabid/6307/bid/28737/25-Must-Haves-for-a-Remarkable-Website.aspx?utm_source=feedburner&amp;utm_medium=feed&amp;utm_campaign=Feed%3A+HubSpot+%28HubSpot%29">25 Must-Haves for a Remarkable Website</a> (hubspot.com)</li>
<li class="zemanta-article-ul-li"><a href="http://contently.com/blog/how-big-should-your-blog-be-an-informal-formula/">How Big Should Your Blog Be? An Informal Formula</a> (contently.com)</li>
<li class="zemanta-article-ul-li"><a href="http://contently.com/blog/10-tools-for-converting-your-blogs-new-visitors-into-fans/" target="_blank">10 Tools For Converting Your Blog&#8217;s New Visitors Into Fans</a> (contently.com)</li>
</ul>
<div class="zemanta-pixie" style="margin-top: 10px; height: 15px;"><img class="zemanta-pixie-img" style="border: none; float: right;" src="http://img.zemanta.com/pixy.gif?x-id=6bcacfcb-6b70-4820-8157-757017e0d584" alt="" /></div>
<p><em><a href="http://contently.com/blog">The Content Strategist</a> is a daily magazine for forward-thinking publishers and content marketers, sponsored and created by <a href="http://contently.com/">Contently</a></em></p>]]></content:encoded>
			<wfw:commentRss>http://contently.com/blog/2011/11/29/build-a-gorgeous-blog-without-a-design-degree/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
