<?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>Coffee on the Keyboard &#187; Standards</title>
	<atom:link href="http://coffeeonthekeyboard.com/category/standards/feed/" rel="self" type="application/rss+xml" />
	<link>http://coffeeonthekeyboard.com</link>
	<description>by James Socol</description>
	<lastBuildDate>Mon, 06 Feb 2012 23:33:42 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
<atom:link rel="hub" href="http://pubsubhubbub.appspot.com"/>		<item>
		<title>Chrome Is Not A Browser</title>
		<link>http://coffeeonthekeyboard.com/chrome-is-not-a-browser-111/</link>
		<comments>http://coffeeonthekeyboard.com/chrome-is-not-a-browser-111/#comments</comments>
		<pubDate>Wed, 03 Sep 2008 15:34:53 +0000</pubDate>
		<dc:creator>James</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[Standards]]></category>
		<category><![CDATA[Browsers]]></category>
		<category><![CDATA[chrome]]></category>
		<category><![CDATA[google]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[Web 2.0]]></category>

		<guid isPermaLink="false">http://coffeeonthekeyboard.com/chrome-is-not-a-browser-111/</guid>
		<description><![CDATA[If you somehow haven&#8217;t heard of it, Google&#8217;s Chrome is a neat, quick, Acid2-compliant &#8220;browser&#8221; designed to work with web applications, not web pages. Chrome certainly looks like a modern browser, with tabs along the top and an address bar and a &#8220;Most visited&#8221; home screen, it will seem familiar to anyone who&#8217;s moved past [...]]]></description>
			<content:encoded><![CDATA[<p>If you <a href="http://search.twitter.com/search?q=chrome">somehow haven&#8217;t heard of it</a>, Google&#8217;s <a href="http://www.google.com/chrome">Chrome</a> is a neat, quick, Acid2-compliant &#8220;browser&#8221; designed to work with web <em>applications</em>, not web <em>pages</em>.</p>
<p>Chrome certainly looks like a modern browser, with tabs along the top and an address bar and a &#8220;Most visited&#8221; home screen, it will seem familiar to anyone who&#8217;s moved past Internet Explorer 6.</p>
<p>And yet, my Twittersphere has been full of comments like &#8220;Nice, but not nice enough to make me drop Firefox/Safari.&#8221;</p>
<p>While there are some visual improvements, such as an extremely small &#8220;chrome&#8221; (the parts of the browser <em>around</em> the page area) footprint, the big changes are &#8220;under the hood.&#8221; Chrome is built for tabs—each tab is an isolated process; no one tab can take down the whole browser—and is built for JavaScript-heavy &#8220;web 2.0&#8243; apps—Chrome&#8217;s new V8 JavaScript engine executes a full order of magnitude faster than the current browsers, in my experience.</p>
<p>And all of those &#8220;under the hood&#8221; changes are <strong>open source</strong>.</p>
<p>Chrome is not a browser.</p>
<p>Chrome is Google&#8217;s way of making a point: modern web browsers have <a href="http://www.youtube.com/watch?v=7RSHMheDIrM">not kept up with the web</a> itself.</p>
<p>More and more, the web is becoming an interactive application, and most browsers are not built for it. They display pages, and running applications is an afterthought. While we&#8217;ve seen huge improvements in JavaScript execution in the past few years, speed is still a limitation for developers. Applications are also much more likely to crash than static pages (go ahead, just try to crash a browser with just malformed HTML) and isolating tabs will give necessary boosts to speed, stability, and security.</p>
<p><a href="http://krisabel.ctv.ca/blog/_archives/2008/9/2/3866151.html">Kris Abel</a> of <a href="http://krisabel.ctv.ca/">CTV.ca</a> said it best: &#8220;Google’s entire business takes place throughout the internet itself and so they see their interests served regardless of which company takes web browsing to the next level, in fact they see their interests served if all companies do exactly that.&#8221;</p>
<p>I&#8217;m not switching to Chrome. I doubt very many people will find it useful as a primary browser. I don&#8217;t expect many user-interface improvements, like Firefox&#8217;s vast add-on library or the accessibility features of Firefox 3, Opera or IE8.</p>
<p>I do expect any future version to have more &#8220;under the hood&#8221; improvements, and I hope that the makers of Firefox, Opera, Internet Explorer, and any new browsers that spring from this, will re-evaluate their own products and move in this direction.</p>
<p>Because when the browsers get better, the web gets better.</p>
]]></content:encoded>
			<wfw:commentRss>http://coffeeonthekeyboard.com/chrome-is-not-a-browser-111/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>Organizing CSS</title>
		<link>http://coffeeonthekeyboard.com/organizing-css-105/</link>
		<comments>http://coffeeonthekeyboard.com/organizing-css-105/#comments</comments>
		<pubDate>Mon, 23 Jun 2008 13:22:16 +0000</pubDate>
		<dc:creator>James</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[Design]]></category>
		<category><![CDATA[Standards]]></category>
		<category><![CDATA[Code]]></category>
		<category><![CDATA[Front-end]]></category>
		<category><![CDATA[organization]]></category>
		<category><![CDATA[readability]]></category>

		<guid isPermaLink="false">http://coffeeonthekeyboard.com/organizing-css-105/</guid>
		<description><![CDATA[Looking at WordPress themes usually makes me cringe. It&#8217;s as if there was a memo on semantic markup and the community of WP developers didn&#8217;t get it. Some themes waste kilobytes of HTML source on something that could be achieved with 75% less markup. Some use blatantly non-compliant code. Almost none use semantic names. But [...]]]></description>
			<content:encoded><![CDATA[<p>Looking at WordPress themes usually makes me cringe. It&#8217;s as if there was a memo on semantic markup and the community of WP developers didn&#8217;t get it.</p>
<p><a href="http://themes.wordpress.net/columns/2-columns/2991/autumn-concept-10/">Some themes</a> waste kilobytes of HTML source on something that could be achieved with 75% less markup. Some use blatantly non-compliant code. Almost none use <a href="http://coffeeonthekeyboard.com/use-semantics-to-guide-design-53/" title="semantic names">semantic names</a>.</p>
<p>But what really irks me—I&#8217;ll cop to using meaningless code to make it look good—is the style of CSS that seems to be spreading: breaking up definitions into a half-dozen chunks, no line breaks, lack of organization. I think their heart is in the right place (a section for colors, so don&#8217;t have to worry about layout; a section for typography, so the precious padding is protected) but the result is a horrid mess.</p>
<p>I <a href="http://coffeeonthekeyboard.com/the-new-blog-89/" title="blame Michael Heilemann">blame Michael Heilemann</a>, the designer behind the bland and semantic-free default WordPress theme. I imagine theme developers, many just starting with HTML and CSS, started by looking at his code, and thought that was the way to do it. Then it spread like a virus.</p>
<p>Here&#8217;s an example from &#8220;Autumn Concept 1.0&#8243;:</p>
<pre>#topbar {background-color: #4b7c44;}
#footer {background-color: #4b7c44;}
#mainpicinner {height: 250px; background: «
  url(images/mainpic01.jpg) top left «
  no-repeat #fff; border: 1px solid #fff;}
/* typography */
#logo a {color: #3a4032;}
.textbkg {border-left: 4px solid #ebf0cf;}</pre>
<p class="note">(« is an inserted linebreak.)</p>
<p>Wow. Line breaks? Readability? Was this passed through a bad version of <a href="http://www.crockford.com/javascript/jsmin.html">JSMin</a>?</p>
<p>This is from the &#8220;Color Scheme&#8221; section, but the first directive for <code>#mainpicinner</code> is <code>height</code>. It also has a <code>border</code>, not just <code>border-color</code> but the whole thing. What&#8217;s the point of having sections if you proceed to ignore them immediately?</p>
<p>The rest is filled with classes like <code>cols01</code> and <code>box01</code> (while there are other <code>cols##</code>, there is no <code>box02</code>).</p>
<p>But that isn&#8217;t my real problem. My real problem is about 20 lines further down:</p>
<pre>body {position: relative; background: #1f1f1f; «
  font: 70% Verdana, Arial, Helvetica, «
  sans-serif; text-align: center; letter-spacing: 0;}
#container {float: left; display: block; width: 100%;}
#topbar {float: left; display: block; width: «
  100%; background-image: url(images/topbar.png); «
  background-position: top; background-repeat: «
  repeat-x; text-align: left; padding: 13px 0 6px 0;}
#topbar div {padding-bottom: 0;}</pre>
<p>#container is back. (As are backgrounds. Pick a spot, already!)</p>
<p>This kind of CSS is hard to read, hard to maintain, and hard to customize. Even if the initial version is perfect—which doesn&#8217;t exist—things will start to break as soon as someone opens the file. Even in this published style sheet, the <em>author</em> couldn&#8217;t decide if background images and borders belonged in &#8220;Color Scheme&#8221; or &#8220;General Styles.&#8221; What chance does a maintainer have?</p>
<p>I am, admittedly, obsessively strict with <a href="http://coffeeonthekeyboard.com/wp-content/themes/default/style.css">my style sheets</a>. I like to make very sure that every style affects only what I intend it to affect. But I never let the styles for one element single get broken into two places. Instead, what I try to do is keep similar styles in a similar order inside those blocks:</p>
<pre>blockquote.dropquote {
  float: right;  font-family: Arial, «
    Helvetica, sans-serif;
  font-size: 130%;

color: #662020;
  background-color: #ddd;
}

div.login {
  position: absolute;
  top: 0;
  left: 0;

  font-size: 80%;

  color: #fff;
}</pre>
<p>Get the idea? Within each selector, I try to keep things in the same order. I almost always keep positioning styles first and then do either typography or color. To me, this is much more readable and maintainable. If my header div is 3 pixels too wide, I don&#8217;t have to comb through all the <code>#header</code> sections. I go to <em>one</em> place and fix it.</p>
<p>I like to <a href="http://coffeeonthekeyboard.com/work-pattern-designing-web-sites-93/" title="extract the CSS order from the document order">extract the CSS order from the document order</a>. This doesn&#8217;t necessarily stay complete or strict, especially when you have classes that can be used anywhere or you&#8217;re controlling tags directly. The header styles do come <em>before</em> the content styles, though, which come <em>before</em> the footer styles. That just makes <em>sense</em>.</p>
<p>Am I the only one who can&#8217;t stand this &#8220;style&#8221; of CSS? Do you use it? Why?</p>
]]></content:encoded>
			<wfw:commentRss>http://coffeeonthekeyboard.com/organizing-css-105/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>The W3C Sucks</title>
		<link>http://coffeeonthekeyboard.com/the-w3c-sucks-92/</link>
		<comments>http://coffeeonthekeyboard.com/the-w3c-sucks-92/#comments</comments>
		<pubDate>Thu, 22 May 2008 22:54:53 +0000</pubDate>
		<dc:creator>James</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[Design]]></category>
		<category><![CDATA[Standards]]></category>
		<category><![CDATA[Code]]></category>
		<category><![CDATA[dom]]></category>
		<category><![CDATA[html]]></category>
		<category><![CDATA[mathml]]></category>
		<category><![CDATA[things that suck]]></category>
		<category><![CDATA[w3c]]></category>
		<category><![CDATA[xhtml]]></category>
		<category><![CDATA[xml]]></category>

		<guid isPermaLink="false">http://coffeeonthekeyboard.com/the-w3c-sucks-92/</guid>
		<description><![CDATA[&#8220;If you wish to be a success in the world, promise everything, deliver nothing.&#8221; If you want to remain the standard-setting body for the web, promise new recommendations, never deliver. A decade ago, the W3C was actively working to improve the standards we designers and developers use every day. Sure there were some controversial things [...]]]></description>
			<content:encoded><![CDATA[<p>&#8220;If you wish to be a success in the world, promise everything, deliver nothing.&#8221;</p>
<p>If you want to remain the standard-setting body for the web, promise new recommendations, never deliver.<span id="more-92"></span></p>
<div class="image left"><img src="http://coffeeonthekeyboard.com/wp-content/uploads/2008/05/css.png" alt="CSS 2.1 is not even a published recommendation. Off with their (the W3C) heads." style="float: left" /></div>
<p>A decade ago, the <abbr title="World Wide Web Consortium">W3C</abbr> was actively working to improve the standards we designers and developers use every day. Sure there were some controversial things (<abbr title="HyperText Markup Language">HTML</abbr> 3.0, <abbr title="eXtensible Markup Language">XML</abbr> 1.1) that never caught on, but at least there was discussion, thought, and sometimes even action.</p>
<p>The W3C started work on the <abbr title="Cascading Style Sheets">CSS</abbr>3 specification the same year they published CSS2—1998. Ten years later, CSS2.1 is still not technically a published recommendation.</p>
<p>Between 1995, when the W3C was founded, and 1999, HTML went from version 2, an <abbr title="Request For Comments">RFC</abbr>, to version 4.01. Where is 5? In January of <em>this year</em> it became a Working Draft.</p>
<p>When was <abbr title="eXtensible HyperText Markup Language">XHTML</abbr> last updated? 2001. The <abbr title="Document Object Model">DOM</abbr>? 2004. <abbr title="Math Markup Language">MathML</abbr>? 2003.</p>
<p>What happened?</p>
<p>When did &#8220;do nothing group&#8221; replace &#8220;working group&#8221; over there? (Probably around 2004.)</p>
<p>I realize that implementing new standards is not trivial. I also realize that standards are crucial to the continued growth of the web—this site is valid XHTML and uses valid CSS.</p>
<p>However, without updates, these &#8220;standards&#8221; will get old and die. Something else, or someone else, will replace them. We&#8217;ve already used CSS2 for a decade. Will we use it for another? (I want my drop shadows! I want my opacity! I want my rounded corners!)</p>
<p>I lead with a quote from Napoleon, so I&#8217;ll finish with the French Revolution: Off with their heads. The W3C needs a change in leadership or a vigorous shakedown to get off their asses and do something.</p>
<p>If they&#8217;re not willing to put forth the effort, then let them eat cake while someone else does.</p>
]]></content:encoded>
			<wfw:commentRss>http://coffeeonthekeyboard.com/the-w3c-sucks-92/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>The New Blog</title>
		<link>http://coffeeonthekeyboard.com/the-new-blog-89/</link>
		<comments>http://coffeeonthekeyboard.com/the-new-blog-89/#comments</comments>
		<pubDate>Mon, 19 May 2008 00:03:06 +0000</pubDate>
		<dc:creator>James</dc:creator>
				<category><![CDATA[Articles]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[Design]]></category>
		<category><![CDATA[Standards]]></category>
		<category><![CDATA[advice]]></category>
		<category><![CDATA[blogging]]></category>
		<category><![CDATA[My Site]]></category>
		<category><![CDATA[theft]]></category>

		<guid isPermaLink="false">http://coffeeonthekeyboard.com/the-new-blog-89/</guid>
		<description><![CDATA[I made myself sit down today and finish work on the blog design. I am very happy with how it came out. This design is a hybrid, pulling elements from some of better-looking sites and blogs. The three-column layout was inspired by Felicia Day&#8217;s &#8220;Flog&#8221; and Problogger, the thin header comes from a post on [...]]]></description>
			<content:encoded><![CDATA[<p>I made myself sit down today and finish work on the blog design. I am very happy with how it came out.<span id="more-89"></span></p>
<p>This design is a hybrid, pulling elements from some of better-looking sites and blogs. The three-column layout was inspired by Felicia Day&#8217;s &#8220;<a href="http://feliciaday.net/blog/">Flog</a>&#8221; and <a href="http://www.problogger.net/">Problogger</a>, the thin header comes from <a href="http://www.chrisbrogan.com/make-your-blog-design-work-for-you/">a post on Chris Brogan&#8217;s blog</a>, the heading style is cribbed from <a href="http://www.guardian.co.uk/">The Guardian</a>.</p>
<p>There are two things I learned here that I want to pass along.</p>
<p><strong>T</strong><strong>heft is not wrong</strong>. Just because a design element exists on another site does not mean you can&#8217;t use it. I don&#8217;t mean you should steal the entire layout, images and all, or steal code (unless it&#8217;s under a free license, then steal away). But if you like the way your favorite blog does headings, there&#8217;s no shame in modeling your headings the same way.</p>
<p><strong>Unfinished <em>is</em> wrong.</strong> I regret leaving the blog unfinished for so long. I would have been better served by using the Kubrick theme until I was really ready to switch. If you&#8217;re starting a blog and want to get to writing right away, go ahead and use some free templates. It&#8217;s much better than starting a theme and leaving it unfinished.</p>
<p>A corollary to that is &#8220;while incremental changes are fine in testing, only big, <em>complete</em> changes are OK in production.&#8221; In other words, don&#8217;t edit your live site, except small tweaks and bug fixes. When you upload new templates they should be tested and ready to deploy.</p>
<p>That being said, there are a few small things that aren&#8217;t quite finished. I need to write a short paragraph about myself and decide if I want to add a Problogger-/Chris Brogan-style link to the feed right at the top.</p>
<p>Well, what do you think?</p>
]]></content:encoded>
			<wfw:commentRss>http://coffeeonthekeyboard.com/the-new-blog-89/feed/</wfw:commentRss>
		<slash:comments>5</slash:comments>
		</item>
		<item>
		<title>Microsoft Listened</title>
		<link>http://coffeeonthekeyboard.com/microsoft-listened-72/</link>
		<comments>http://coffeeonthekeyboard.com/microsoft-listened-72/#comments</comments>
		<pubDate>Mon, 07 Apr 2008 20:58:17 +0000</pubDate>
		<dc:creator>James</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[Design]]></category>
		<category><![CDATA[Standards]]></category>
		<category><![CDATA[8]]></category>
		<category><![CDATA[Browsers]]></category>
		<category><![CDATA[ie]]></category>
		<category><![CDATA[microsoft]]></category>
		<category><![CDATA[version targeting]]></category>

		<guid isPermaLink="false">http://coffeeonthekeyboard.com/microsoft-listened-72/</guid>
		<description><![CDATA[We all complained, and Microsoft listened to the community: IE8 will now render in IE8-mode by default, and &#8220;developers who want their pages shown using IE8’s “IE7 Standards mode” will need to request that explicitly.&#8221; Obviously, this is good news for all forward-looking, standards-aware, progressively-enhancing developers out there. But even more important is the action [...]]]></description>
			<content:encoded><![CDATA[<p><a href="http://coffeeonthekeyboard.com/ie8-and-version-targeting-70/" title="We all complained">We all complained</a>, and Microsoft listened to the community: <a href="http://blogs.msdn.com/ie/archive/2008/03/03/microsoft-s-interoperability-principles-and-ie8.aspx">IE8 will now render in IE8-mode by default</a>, and &#8220;developers who want their pages shown using IE8’s “IE7 Standards mode” will need to request that explicitly.&#8221;</p>
<p>Obviously, this is good news for all forward-looking, standards-aware, progressively-enhancing developers out there.</p>
<p>But even more important is the action from Microsoft: the community voiced an opinion and Microsoft listened and responded. To see any major corporation rethink their position because of community pressure is rare enough, but to see a complete reversal is truly an occasion to celebrate.</p>
<p>Hopefully this is indicative of a new attitude at Microsoft, one that supports or even embraces standards and the goals of progressive enhancement.</p>
<p>Now that we&#8217;ve seen what community outrage can do, we should turn our attention to the closed platforms of the iPhone and PSP. It&#8217;s a long shot but we can try!</p>
]]></content:encoded>
			<wfw:commentRss>http://coffeeonthekeyboard.com/microsoft-listened-72/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>IE8 and Version Targeting</title>
		<link>http://coffeeonthekeyboard.com/ie8-and-version-targeting-70/</link>
		<comments>http://coffeeonthekeyboard.com/ie8-and-version-targeting-70/#comments</comments>
		<pubDate>Wed, 12 Mar 2008 21:50:00 +0000</pubDate>
		<dc:creator>James</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[Standards]]></category>
		<category><![CDATA[Browsers]]></category>
		<category><![CDATA[IE8]]></category>
		<category><![CDATA[version targeting]]></category>

		<guid isPermaLink="false">http://coffeeonthekeyboard.com/ie8-and-version-targeting-70/</guid>
		<description><![CDATA[Two months after the whole of the internet has had their say, I thought I&#8217;d throw some new kindling on the fire of Internet Explorer 8&#8242;s version-targeting mechanism. It&#8217;s crap. The key issue is the default behavior: if I never change my server configuration or every page on my site, they will &#8220;forever&#8221; be locked [...]]]></description>
			<content:encoded><![CDATA[<p>Two months after the whole of the internet has had their say, I thought I&#8217;d throw some new kindling on the fire of Internet Explorer 8&#8242;s version-targeting mechanism. It&#8217;s crap.</p>
<p>The key issue is the default behavior: if I never change my server configuration or every page on my site, they will &#8220;forever&#8221; be locked in IE7 mode. This is a blow to the heart of the idea of progressive enhancement, or even graceful degradation, and will certainly not encourage developers to make their sites IE8—and thus Acid2—compatible.</p>
<p>Why worry about learning the rules when you have a broken version &#8220;forever?&#8221;</p>
<p>And what of this &#8220;forever?&#8221; How long can Microsoft reasonably include <em>every previous version of IE</em> in their new releases? Five years? Say to IE 9? 10 years to IE 10 or 11? At that point there will be 5 separate rendering engines, IE 6 and up, embedded in that increasingly large, increasingly slow program.</p>
<p>Of course, there is also the issue of implementation: Microsoft has said unto us that this shall be. If they really want to get on the standards bandwagon, shouldn&#8217;t this have been brought to the W3C, at least for advice?</p>
<p>I have a much more radical suggestion they may not like. Microsoft should abandon &#8220;Internet Explorer.&#8221; Not the product, but the name, and specifically the abbreviation &#8220;MSIE&#8221; in the browser string.</p>
<p>They&#8217;ll also need to dump the <code>window.ActiveXObject</code> class, perhaps replacing it with a <code>window.ActiveXControl</code> or <code>window.AXObject</code> class. These are the most common ways of identifying IE. If IE shows up like any other standards-compliant browser, there should be no problems for older pages.</p>
<p>I tried to find something good to say about this, but I can&#8217;t. It&#8217;s a bad idea from the bottom up. Unfortunately, we&#8217;re stuck with it.</p>
<p>So I will take Microsoft&#8217;s built-in cheat—a not-so-tacit admission that this idea is not viable in the long-term—and adjust my server to send <code>IE=edge</code> with every page. That way I get to keep the progressive enhancement that has served me so well.</p>
]]></content:encoded>
			<wfw:commentRss>http://coffeeonthekeyboard.com/ie8-and-version-targeting-70/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

