Need a WordPress website this weekend? Start here...

WordPress and Thesis: Free as in beer, or Free as in speech?

(Reading time: 4 – 7 minutes)

I’m sitting here at Dos Palmas, Website In A Weekend central, wondering what to write about today. I’m listening to a new Deep House mix by my friend DJ Native State, who, sadly, just doesn’t do that “web thing.”

But life is good overall.

I could write about money. But everyone writes about money, what more could I say? (Probably a lot, but not right now.)

Let’s tackle something a little more difficult: software licensing.

Namely, why some software is free, and other software is not.

Actually, software licensing isn’t that hard to understand. Fundamentally,


Who writes the code specifies the license.

The details hinge on exactly what kind of license. Because there are a bunch of different free licenses.

First, some backstory.

What most people don’t get is that most of the first 10-15 years of the internet was built by people working for Big Government, Big Corporation or Big Education.

This is a fact.

I used to be a part of it. You can look me up at the Wayback machine if you’re so inclined. They have me back to 1996, at Tennessee.

Such folk have no need to make money on the internet, because their salaries are already paid. They built the internet on your tax dollars.

They are not your customers. They aren’t anyone’s online customers. Except maybe Amazon and O’Reilly.

Giving away everything for free not only made sense, it was the right thing to do.

By and largely, this is a good thing. The entire internet runs on freely available software such as Apache, MySQL and PHP. This software is the result of millions (or tens of millions) of dollars of investment value into programming and engineering.

Software with the capability of WordPress also requires millions of dollars worth of engineering and programming. At least initially. Once the problem is understood, and the tools are built, developing something like WordPress becomes much easier. It’s like that “overnight success” thing. You know, overnight success takes 10 years. But it takes that initial investment of time and money to get it figured out.

The private sector, with it’s command and control structure, isn’t really capable of producing this sort of self-organizing engineering. What you get ex nihilo from the private sector is software like (s)Lotus Notes. A good idea in theory, in practice, not so much. Or even Facebook, all built on free software, but the user interface is execrable.

Clearly, we have all benefitted from free software.

But I’m not being entirely clear about this notion of “free.”

Some software is “Free” as in free speech. Not free as in free beer.

Of course, other software is free as in free beer.

All depends on the license.

WordPress is free as in Free speech.

That means you can do whatever you want with WordPress, except deny your changes to WordPress to anyone you transmit your code to.

Want to create the most blazing fast WordPress installation ever and sell hosting? No problem. Optimize WordPress and sell as many hosting accounts as you like.

But if you decide you want to sell your code, you are required by US copyright law to transmit every change you made to the WordPress code.

And this makes perfect sense. The people that wrote WordPress decided that such a license was their Terms and Conditions for you to use WordPress. They wrote the code, they chose the license.

Themes and plugins

As it turns out, I like the Thesis theme quite a bit, and as a developer myself, have no problem paying for Thesis. It costs money to live.

As it also turns out, the Thesis developer apparently copied code directly from WordPress into Thesis.

Oups.

That code has subsequently been removed. The discussion resulting from that put Thesis (rightly or wrongly) under some pretty intense scrutiny from WordPress developers.

As a result, Thesis core code is now under a Free software license. “Core code” meaning all the code interacting directly with WordPress.

The styling and behavior of Thesis remains under the same proprietary license as usual.

Here’s whats important.

There is a fundamental legal issue that still hasn’t been resolved: Exactly what constitutes code derived from WordPress?

In my opinion, theme and plugin code should not be regarded as being derived code. However, my opinion doesn’t count for shit, and unless your name is Mullenweg or Jaquith (or other contributor to WordPress), your opinion doesn’t count either.

Before anyone starts hyperventilating… I’m cool with this.

Seriously, I’m cool with it. They wrote the code, they gave it away, I benefit massively. Unless a judge rules otherwise, that’s how it’s going to be. If you don’t like it, go write your own code.

The ramifications for you as a Thesis user: probably not much. Technically, none at all. Popular software going open source generally shows a step function in improvement shortly after the code is released. I know I have a few things I could change in the Thesis source.

How the whole issue plays out in a larger scale will be far more interesting. Web applications (please note date) aren’t quite the same as operating systems, code generators or dynamic libraries, so there is law still to be made.

Unleash WordPress: Quick tips for effective images

(Reading time: 5 – 8 minutes)

An effective image can make a good blog post great. An ineffective image always reduces the impact of of an article. Part of an image’s effectiveness is making sure it’s the correct size such that all the necessary information in the image is clear to the reader.

Does that sound complicated or vague?

It’s not, really, but it’s not often discussed either… which is your opportunity to get yet another advantage in your WordPress skills.

Image scaling considerations

Bitmapped images such as bmps, pngs and gifs typically don’t scale well. Such images are best viewed at 1:1 scale. That is, each pixel of the image corresponds to a pixel on the viewers screen. At smaller scales, pixelation becomes apparent and ugly. At larger scales, linear elements such as letters and lines start to get jagged. But at the right scale, close or at 1:1, bitmapped images are superior to modeled images such as jpgs which have artifacts radiating away from linear elements.

The reason for both these effects is mathematical. In the case of bitmaps, reducing the size of the bitmap forces arbitrary sampling of pixels. In the case of modeled images, the mathematical model provides the artifacts.

When you can, provide the reader or viewer with bitmap images at 1:1 resolution… such that the image fits conveniently into your text or display location. Here’s how.

Each block element in WordPress has either a declared width, or a computed width implied from a declared width. Find out these values:

  • main column width
  • padding and margin widths

then make your image the same or very similar in size.

How big are your blocks?

One way to figure out block sizes is to use the Firefox extension Firebug, which will allow you to measure the width of each element on a web page. These are the values you want to use in your image editing program for cropping down images, or as discussed shortly, in your screenshot program if possible.

In the image just below, you can see the 480 pixel width of the current Thesis text column outlined by the red box, pointed to by blue arrow [1].

Grab the width of your text block using Firebug extension for Firefox

Grab the width of your text block using Firebug extension for Firefox


As it turns out, I could determine this using the Thesis options menu as well, which is another great reason to use Thesis, but examining the delivered content is applicable to any theme (or any web page). You can also examine the raw CSS file, often available using “View Source” (Ctrl-U) from your web browser, then clicking on the CSS link in the document head. In the case you have a fully fluid layout, you will have to determine what your minimum image size will be. There’s now way around it. If users want to read your site at some ridiculous 100 pixel width, well, that’s not your lookout.

Resizing your image

You have two good options dealing with an arbitrary image: 1. resize the image in your image editing program (not MS Paint), which is almost guaranteed to have better algorithms for reducing bitmaps than any web browser, or 2. crop your image effectively to fit your final width. (Or both.)

With very large images such as photos, I typically scale them down by half to get them fully onto the screen, then crop them down to size. If the whole image is useful, or the cropping is very small, I’ll often reduce the size of an image by 75-80% for web display.

When your image is a screenshot, you can’t get away with nearly as much reduction as when it’s a photographic image. First, the screenshot is going to be at 1:1 with your screen already, and second screenshots typically contain a lot of sharp lines, which look crappy when reduced. In these cases, try (hard) to take exactly the screenshot that packs the exact information, no more and no less, into the smallest space possible.

My usual solution for screenshots is using a dedicated application, Jing, which I’m happy to tell you about right now.

Jing makes screenshots much easier

Techsmith’s Jing is a pretty good piece of gear. It fits into that category of “small tools” or “little languages:” it does one thing and does it well. Actually, it’s two things (video and screenshot), but just consider a single screenshot as a single frame video, and we’re back to that one thing again. Jing has two huge advantages for taking rapid screenshots:

  1. Screenshots are what Jing was expressly designed to do.
  2. Jing gives you exactly the tools you need simple annotation, and no more.

Jing is a free download with a professional upgrade and comes to you courtesy of the fine folks at Techsmith. Get your copy of Jing now. (Note: I am not affiliated with Techsmith.)

Jing doing it’s screenshot thing

When you take your screenshot using Jing, watch the width of the sizing or cropping rectangle. Crop your screenshot a little narrower to account for margin, padding (10-20 pixels is usually fine if you want to wing it.) Here’s a much larger screenshot taken using Windows Vista showing Jing in action. The lighter area bounded by yellow border is the cropping window; the darker areas are outside Jing’s screenshot. Jing’s sizing box is down in the lower right corner of the yellow guidelines. It’s solid black and shows the outlined screenshot would be 622×299 pixels.

Jing doing it's thing

Jing doing it's thing


In this case, it was difficult to fit everything necessary for illustrating this article into the 480 pixel width of this column, so the screenshot is considerably wider. These things happen. Note that the first screenshot was taken with Jing, and it’s 470 pixel width fits very nicely in the center of the 480 pixel column.

Adding images and screenshots isn’t difficult, but really nailing it takes a bit of practice and thought. Think about exactly what you want to communicate with each image, either information or emotion. Images communicating information need supporting text, and may benefit from annotation. For images providing emotional context, supporting text isn’t as important. But add captions in both cases.