Neatly Sliced

The Symptoms

Lost data, tearshedding, massive re-writes

The Diagnosis

Moronic failure to back-up your data on a regular basis.

The Antidote

Write your drafts in word documents so that you have a backup on your machine even after publishing an article. Additionally, or concurrently, run regular backups of your database.

Why should I care?

Just today, I learned that my database had been switched over to a new server weeks ago and that the site was still pointing to the old server’s database. Today, the old database was shut down, leading to downtime and the erasing of recent posts. The recent posts were easily restored via the cached copy in my feed, but the unpublished drafts waiting for publish are, sadly, lost.

So, be smarter than me and don’t rely on your server’s database to protect your data.

My brother sent You’re A Standardista If… to me before I left. I had to nod and smile at a few of the items listed. My personal addition:

You’re a standardista if… you draw with pen and paper the various id and class selectors and elements of a page before ever laying a finger on your keyboard.

It takes ten minutes or less.

This blog still uses WordPress version 2.0.2.

2.0.2. The current version is 2.1.2. I am a whole number behind.

Here’s the deal: I’m installing the latest version soon. I thought I was content with v2.0.2. However, I have been using 2.1 (not 2.1.2) on a different installation/site, and it is magnificent by leaps and bounds over 2.0.2. Ack, I exclaim, for this current server I am sure will give me much woe in my attempts to upgrade. Equally frustrating, this version of WordPress does not have an easy way to export (unlike 2.1), so I fear wreck and ruin. Yes, wreck and ruin, to the woe of my 12 readers.

On a lighter note, GoDaddy lets you click-click-click a couple times and WordPress is automagically installed. It is a wonderful thing.

I almost started writing a post explaining about list-style-type. Then, I oddly discovered that Safari does not support the very list-style-type that I was highlighting: decimal-leading-zero. Upon this discovery, I wondered what other list-style-types Safari does not support.

I thus happened upon quirksmode. It features beautiful charts comparing the different CSS properties, selectors, and values and their support in various browsers. It is quite comprehensive. I am bookmarking it to make it a constant reference.

I was admiring the CSS for the section headings on BuzzFeed, although I do not necessarily love the content of the site (no offense, just not my thing).
View it in action.

The method to overlay the captions is alarmingly simple. Essentially, the image and caption are contained in a div, and corresponding classes are applied to the nested elements. The caption has styling featuring a negative margin-top to pull the caption up, thus making an overlay. BuzzFeed overkills the divs and puts the caption and image in their own subsequent nested divs when they could merely apply classes to the corresponding < a > tags. I will explain my modified method.

The HTML:

PLAIN TEXT
HTML:




<div class="image-unit">


   <a class="image" href="#">


      <img width="125" height="127" alt="Yum!" src="http://blog.neatlysliced.com/orangeslice.jpg" />


   </a>


   <a class="num-links" href="#">9 Links</a>


</div> 

The CSS:

(I'll comment explanations on pertinent lines)

.image-unit is your block that contains both the image and the caption.

The .image class is applied to the link that wraps around the image.

a.num-links refers to the link that contains the caption overlay. The link should match whatever link the image has, so that the whole block functions as one linking entity.

A cool-looking effect that it not very difficult to pull off. I often wish that more designers knew the capabilities of CSS so that they could incorporate these cool, simple effects in their designs.

View it in action.

If you notice any errors, amendments, or improvements, please leave a comment for the betterment of web development.

Utom Box created the most beautiful Web 2.0 icons. I have implemented a few of them in this site. There is currently no Digg icon, but one of the icons provided by Digg looks Web 2.0 enough to match.

I also started using FeedBurner for my RSS feed. I was confused regarding FeedBurner before. I had thought that it was automagically creating its own feed. In reality, FeedBurner takes the feed that your blog already generates and processes it all fancylike. For example, with FeedBurner I have added the feature to "Email This", "Save to del.icio.us", or "Digg This" right in the RSS feed itself. Additionally, I can derive other statistics regarding the feed. As the user, you receive no significant additional benefit other than the "Email This" and bookmarking links.

One day I will change .htaccess so that the old feed automatically rewrites to the FeedBurner feed, per the instructions in this "Using FeedBurner" WP post. In the meantime, update the feed at your discretion - it makes little difference to me.