<?xml version="1.0" encoding="UTF-8"?>
<posts type="array">
  <post>
    <body>I came across this today:&lt;div class="CodeRay" style="width: 60%"&gt;&lt;source:css&gt;.purple { color: #000181; }&lt;/source&gt;&lt;/div&gt;

For reference, this is what "purple" is defined as:

&lt;div style="margin-left: auto; margin-right: auto; background: #000181; width: 200px; height: 50px;"&gt;&amp;nbsp;&lt;/div&gt;&lt;p style="margin-top: 1em;"&gt;CSS has been around long enough that hopefully it is obvious that this a terrible name for a class. That wasn't  enough to make me write about it. Even worse than the bad naming, is needing to change pages that use this class without changing the name to something sensible. Failing to do so will lead to what I found elsewhere. Purple had been redefined as:&lt;/p&gt;

&lt;div class="CodeRay" style="width: 60%"&gt;
&lt;source:css&gt;
.purple {
  color: #4B7C80;
}
&lt;/source&gt;
&lt;/div&gt;


which looks like:

&lt;div style="margin-left: auto; margin-right: auto; background: #4B7C80; width: 200px; height: 50px;"&gt;&amp;nbsp;&lt;/div&gt;&lt;p style="margin-top: 1em;"&gt;
Refactoring &lt;font style="text-decoration: line-through;"&gt;can&lt;/font&gt; should apply to CSS too. If you find a badly named class, it might seem to easier to just keep using it, but it only gets more confusing as time goes on.&lt;/p&gt;

To help make the point, I'll leave you to ponder this:

&lt;div class="CodeRay" style="width: 60%"&gt;
&lt;source:css&gt;
.big_purple {
  font-size: 18px;
  font-weight: bold;
}
&lt;/source&gt;
&lt;/div&gt;</body>
    <created-at type="datetime">2008-11-25T16:19:00-05:00</created-at>
    <id type="integer">12</id>
    <published type="boolean">true</published>
    <title>Refactoring applies to CSS too</title>
    <updated-at type="datetime">2008-11-25T16:19:00-05:00</updated-at>
    <url-title>refactoring-applies-to-css-too</url-title>
  </post>
  <post>
    <body>&lt;p&gt;I made some site changes today. Most were just internal code changes but there are some visible changes as well. The &lt;a href="/about"&gt;About Me&lt;/a&gt; page actually has some content now, including some random tweets pulled from Twitter.&lt;/p&gt;&lt;p&gt;Posts with actual content coming soon!&lt;/p&gt;</body>
    <created-at type="datetime">2008-11-23T07:34:00-05:00</created-at>
    <id type="integer">9</id>
    <published type="boolean">true</published>
    <title>Site updated</title>
    <updated-at type="datetime">2008-11-23T07:40:10-05:00</updated-at>
    <url-title>site-updated</url-title>
  </post>
</posts>
