<?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>Webblog &#187; Presentation Layer Design</title>
	<atom:link href="http://blog.craigwebbart.com/topics/presentation-layer-design/feed/" rel="self" type="application/rss+xml" />
	<link>http://blog.craigwebbart.com</link>
	<description>Communication creates the context necessary for the transition to a true global community.</description>
	<lastBuildDate>Wed, 02 Mar 2011 03:40:18 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3</generator>
		<item>
		<title>Re-doing my presentation layer (again)</title>
		<link>http://blog.craigwebbart.com/2009/01/26/re-doing-my-presentation-layer-again/</link>
		<comments>http://blog.craigwebbart.com/2009/01/26/re-doing-my-presentation-layer-again/#comments</comments>
		<pubDate>Tue, 27 Jan 2009 04:30:24 +0000</pubDate>
		<dc:creator>cwebba</dc:creator>
				<category><![CDATA[Craig Webb Art Capabilities]]></category>
		<category><![CDATA[Presentation Layer Design]]></category>
		<category><![CDATA[Blueprint]]></category>

		<guid isPermaLink="false">http://blog.craigwebbart.com/?p=25</guid>
		<description><![CDATA[I spoke to another developer last week about his work. I learned that he uses templates to design his web pages. He said something about &#8220;why bother trying to reinvent the wheel&#8221;. Something about the conversation struck me. As a designer, I think that it is important for me to know the code. So I [...]]]></description>
			<content:encoded><![CDATA[<p>I spoke to another developer last week about his work. I learned that he uses templates to design his web pages. He said something about &#8220;why bother trying to reinvent the wheel&#8221;.</p>
<p>Something about the conversation struck me. As a designer, I think that it is important for me to know the code. So I embarked on re-working on the website. I&#8217;m glad that I did.</p>
<p>My intention was to create some new content. Instead, I got involved with attempting to manage my most recent slew of bookmarks, and I started re-reading material about Blueprint.</p>
<p>I found a page that has an AJAX tool that allows people to <a href="http://kematzy.com/blueprint-generator/">re-program</a> their blueprint code. I played with the tool, punched numbers on a calculator, and came up with something that I like. The new iteration of my website (the front end) is built with it.</p>
<div id="attachment_26" class="wp-caption alignright" style="width: 299px"><a href="http://blog.craigwebbart.com/wp-content/uploads/2009/01/blueprint888setup1.jpg"><img src="http://blog.craigwebbart.com/wp-content/uploads/2009/01/blueprint888setup1-289x300.jpg" alt="Setup Tool for Blueprint set to 888" title="blueprint online setup tool set to 888" width="289" height="300" class="size-medium wp-image-26" /></a><p class="wp-caption-text">Setup Tool for Blueprint set to 888</p></div>
<p>Not many people still measure in picas but I sure do. My history reaches back to line-o-type and hand paste-up. I like a design that can divide, as easily into thirds as in half, so I like my numbers to count in twelve&#8217;s, sixes, threes and twos.</p>
<p>The page layout that I came up with 888px wide, 30 18px columns and 12px wide gutters. One thing about picas over inches is picas are smaller units and therefore more accurate. 18px wide columns give me much more flexibility than Blueprint&#8217;s default 30px. I like my 12px gutters as well. They provide a little more white space.</p>
<p>I spent a day and a half on building the first page. I did 12 more today and posted them. The content is the same as before – I am re-arraigning the chairs on the Titanic – but it is necessary to have the structure flat. There is a lot of &#8220;fudging&#8221; going on right now. I don&#8217;t believe in having &#8220;the site is down for reconstruction,&#8221; signs go up on my site.</p>
<p>Now, I can work on content development with clarity of the parameters of the site.</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.craigwebbart.com/2009/01/26/re-doing-my-presentation-layer-again/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Re-working my website presentation layer</title>
		<link>http://blog.craigwebbart.com/2008/12/01/re-working-my-website-presentation-layer/</link>
		<comments>http://blog.craigwebbart.com/2008/12/01/re-working-my-website-presentation-layer/#comments</comments>
		<pubDate>Tue, 02 Dec 2008 04:25:56 +0000</pubDate>
		<dc:creator>cwebba</dc:creator>
				<category><![CDATA[Presentation Layer Design]]></category>
		<category><![CDATA[browser reset]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[element tags]]></category>
		<category><![CDATA[Google Blueprint]]></category>
		<category><![CDATA[graceful degradation]]></category>
		<category><![CDATA[Presentation Layer Architect]]></category>
		<category><![CDATA[Redesign]]></category>

		<guid isPermaLink="false">http://blog.craigwebbart.com/?p=17</guid>
		<description><![CDATA[I figured out that a Presentation Layer Architect designs websites at the code level, and that this design structure is critical for desirable traits such incorporating flexibility, expandability, Progressive enhancement, usability, graceful degradation, search optimization, semantic design and so forth.]]></description>
			<content:encoded><![CDATA[<p>Just like most designers, I rarely get time (make time) to work on my own website. This past Thanksgiving I holed up in my cave and worked on a major revision of my style sheet.</p>
<p>It has been a year since I last made a major effort at redesign and I have been chomping at the bit for months to do it – writing little notes to myself about what I want to do.</p>
<p>I find my inspiration from working on my client&#8217;s projects, and from my seemingly endless search for a job. Most of my recent job search has been conducted on LinkedIn.com, and as I go I Google terms and phrases which I don&#8217;t know or somehow hook me.</p>
<p>This is an inexpensive way to get an education and I&#8217;m learning quite a lot. I know way more than is indicated by my work and credentials.</p>
<p>One example of a &#8220;find&#8221; occurred when applying for a Presentation Layer Architect position at Avenue A | Razorfish (no they never called). Well, what is a Presentation Layer Architect?</p>
<p>With more Googling I figured out that a Presentation Layer Architect designs websites at the code level, and that this design structure is critical for desirable traits such incorporating flexibility, expandability, Progressive enhancement, usability, graceful degradation, search optimization, semantic design and so forth. The list of programming  code that Razorfish required was massive. *I hope they call me anyway*. I want to work for a company that thinks about things like this. I want to BE a company who thinks about things like this.</p>
<p>I heard somewhere that the difference between Google and Microsoft is that the leadership of Google is all engineers, while the leadership of Microsoft is MBAs. I want to be a Creative that is informed. I want to know the code.</p>
<p>What I am doing to my code in this go-round is restructuring the CSS design to direct its energy toward standard HTML elements. In my previous CSS version,  I created code that targeted classes. So the intent of this redesign is that if I isolate the HTML page from the CSS, the page will still work. It may be butt-ugly, but it will work.</p>
<p>Theoretically, the flip-side benefit will be that my website will be easier to expand or update or restyle. It will also be simple and user-friendly and handicapped accessible.</p>
<p>There are other considerations that I have in mind as I perform this redesign. Cross-browser compatibility ought also be a benefit of this redesign. Somewhere I stumbled across the phrase &#8220;browser reset&#8221; while trying to hack code for MicroSuck. </p>
<p>My redesign started by integrating reset style sheets from five or more sources, including the CSS of my Xeiro blog template. My resources are the Base style sheet from <a href="http://www.RichInStyle.com">RichInStyle.com</a>, the Base style sheet from <a href="http://nealgrosskopf.com">nealgrosskopf.com</a>, Base style sheet suggestions from <a href="http://tantek.com">tantek.com</a>, and of course the Base style sheet from <a href="http://meyerweb.com/eric/tools/css/reset/">meyerweb.com/eric/tools/css/reset/</a> .</p>
<p>This witches-brew of reset was picked through to create my own Swiss-army knife of all things reset – my MO is to use all of the crayons. I will test it out with use and eliminate stuff later. Right now, EVERY element seems to be at least listed in my CSS. </p>
<p>Along my job-search way, I discovered Blueprint Google code. I added bits of their reset and implemented the Blueprint structure, which I have tested and decided to modify. Already, I have been creating bits of classes, which I modify within one tag. CSS code .ml20, .tleft, and .tinytext becomes XHTML
<p class="tinytext ml20 tleft"> [Note that the p tag element is the focus of the styling].</p>
<p>.tinytext = font structure and color<br />
.ml20 = margin left 20px;<br />
tleft = text-align:left;</p>
<p>Cool, I think. The thing is, old printer that I am, I like to design in twelve&#8217;s [divisible by either two or three] and Blueprint&#8217;s code is 30px columns +10px margins x number of columns &#8211; last 10px – and that does not divide by both two and three – so I&#8217;m fudging the column widths and using classes like .w201 instead. Other than that I recommend it OK.</p>
<p>What else? I suppose that I ought to speak of intent. My website started as a portfolio of my graphic design. The portfolio will continue to persist, but it is about to drop into the background of my website.</p>
<p>The entire &#8220;I want a job&#8221; mentality of the website will be superseded by and new focus on content. I want to be more like <a href="http://www.ivillage.com">ivillage.com</a> (yes I applied there too – call me, OK?) – more like a news magazine. I want to be a PR site. a Brand. </p>
<p>Recruiters are always asking me &#8220;what [one single thing] do you really want to be?&#8221; I distrust that question. It is a stupid question. I want to use all of the crayons. That is my MO.</p>
<p>This CSS code redesign is preparing the way for integration of all that new programming stuff – Drupal, JQuery, Smarty Php MVC Frameworks, MooTools, Script.aculo.us, ajax CRUD and Google code!</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.craigwebbart.com/2008/12/01/re-working-my-website-presentation-layer/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

