CSS Lint

CSS Lint. It’s an open-source online tool to check for typos, bad practices, incorrect properties for rules, inefficiencies, and other potential problems in your code.

I pasted in the primary style sheet I use for my work website. CSS Lint returned one error and 173 warnings.  The error was a missing colon in one selector. As for the warnings, they could be grouped into the three main problem areas: using IDs in selectors, broken box models, and qualified headings.

It’s an instructional and helpful tool, especially for lengthy style sheets that have been used and abused for years. While you may not need or want to take action on every warning, CSS Lint will help you write better code moving forward. Users are welcome to contribute new rules to the tool.

Xyle scope now free

Xyle scope for free. Not sure when this happened. Used to cost $20. I’m guessing this choice has a lot to do with the great success of Things. I wrote about Xyle scope in Jan. 2008. My conclusion then:

I almost bought this application but, in the end, I decided to stick with two free tools that perform most of the same feats as Xyle, even though I think they are much less elegant. I use Firefox when I’m working on websites, and have grown to rely on Chris Pederick’s Web Developer and Joe Hewitt’s Firebug.

I’m definitely adding Xyle scope to my toolbox now.

Get a $30 CSS book for free

For the next 14 days, you can download The Art & Science Of CSS (a $29.95 value) for free.

There are two ways to get it:

– follow @sitepointdotcom on Twitter
– visit twitaway.com

Here’s an excerpt from the email I just received from SitePoint.com:

Freebies like this are few and far between, so help us spread the word. Tell everyone you think might be interested in a FREE CSS book about the SitePoint 14-day Twitaway!

Ok, there you go. It’s a good deal. You’ll get 227 pages of CSS goodness. If you don’t know much about CSS, it may be especially useful. And, hey, it’s free.

MacRabbit Espresso

EspressoGrab a cup of coffee. We already have Bean, the excellent and free rich text editor. Soon, we will have Espresso from MacRabbit, creator of the best-in-class CSS editor, CSSEdit.

Reading through the features, it looks like Espresso will be a hybrid application that combines many of the coding-friendly features of BBEdit or TextMate with the great UI and navigation of CSSEdit (to include CSSEdit’s live preview functionality). It also offers built-in publishing tools. It is geared towards web development, so it will surely be a strong Panic Coda alternative as well. Can’t wait to test it out.

I’ve signed up for the beta.

Two apps to check out: Iguania, Flux

Here are two apps that recently caught my interest:

1. Iguania:

I heard about Iguania while listening to Adam Christianson’s MacCast, which is incidentally one of the best general-interest Mac podcasts out there. Iguania is a novel application to edit your photos without all of those popup boxes and sliders. Instead, you use the keyboard to select the function you want, then adjust that value with your mouse. I’ve tried it out and love it. I found it to be quite intuitive. I couldn’t help but think of how this idea could be applied to the iPhone/iPod Touch 3-axis accelerometer and the new Apple multi-touch trackpad. Some real innovation happening here. It’s still in Beta, so give it a try and send some feedback to the developer.

2. Flux:

I came across Flux the other day while perusing my RSS feeds. It’s a new website design tool just out of Beta (…and yet already at 1.1.1). I downloaded it, then went to the developer’s site to read more. I have to admit it was a bit disconcerting to see the developer blog hosted on a Blogger site. Then I clicked on ‘About’ and landed on apple.com. Hmm. Still, I pressed on. Thirty minutes later, I concluded that the app has potential but still needs work. It just didn’t feel complete to me. I pondered if I should post this or not, but decided I would. I think there are some interesting ideas here — the CSS view alone is worth a look.

Cultured Code comments

A friend emailed me last night to ask if I had tried ‘Things‘ from Cultured Code. I have — this is one of the GTD-based task management applications I will review in the coming weeks. So far, I’ve written about iGTD and OmniFocus, both excellent applications. The View from the Dock ‘Getting Things Done’ task manager series is taking more time than I anticipated, mainly because it takes a while to understand and fully evaluate each application.

But that’s not really what I want to talk about. In this same email, I was also asked if I had tried Cultured Code’s other product, Xyle scope. I thought I’d post a few thoughts on this.

I tried out the full-featured trial of Xyle scope this past summer. I think it’s is a really great application, especially if you’re learning HTML and CSS. What is it? I think of it as an all-in-one tool to dissect a web page. It offers a quick, clean and tidy way to view underlying code, which is very handy if you’re trying to figure out ‘how’d they do that?’ for a particular website that you like. It’s also great if you’re trying to match selectors with elements on a really complex page, or if you’re trying to locate a bug.

I really like how Xyle scope displays HTML in a hierarchical view (a tree structure). It’s much easier to grasp the structure of a page with this handy view. And if you click on any element on the page, you can readily see the code for just that element in the HTML pane. It’s a very well-ordered, visual way to present code. The CSS views built into this tool are also very well designed, easy to navigate and powerful.

What strikes me most about Xyle scope is how attractively it’s designed. I really like how it combines the ‘what you see’ on a given web page with the ‘what’s behind what you see’ in the code. It’s a real pleasure to use.

I almost bought this application but, in the end, I decided to stick with two free tools that perform most of the same feats as Xyle, even though I think they are much less elegant. I use Firefox when I’m working on websites, and have grown to rely on Chris Pederick’s Web Developer and Joe Hewitt’s Firebug.

Given that these two tools perform similar functions for free, I decided to stick with them. I also found that I preferred Firefox integration to opening up a separate stand-alone application when I want or need to quickly dissect a web page. It’s just easier, and I’m lazy.

What would convince me to reconsider? First, I should make it clear that I want Xyle scope in my toolbox for web development. I love it, I really do. Yet, I’m held back. It’s not really the price ($19.95). I think, rather, it’s that Xyle scope stops short of what could be a great all-in-one application. In other words, I want to use it to edit XHTML and CSS, too.

I would like to be able to use Xyle as an analysis tool with tight browser integration: I want all of Xyle’s power available within Firefox. Then, when I’m ready to edit, I’d like to flip a switch and start editing in a companion stand-alone application that integrates seamlessly with the analysis tools. Given the great design and sense of style of Xyle scope, I would love to see what Cultured Code could do if they took it to the next level. I would consider buying that — and I’d be willing to pay a higher price for it.

Up and running on my new host

The site is back in full working order now. Since I had to re-create much of my style sheet, I couldn’t resist tweaking the design a bit, too. I think I’m really done tinkering with it for now. Now on to the content!

Come back tomorrow for a discussion about my experience transferring this WordPress installation and a MySQL database to a new host. It was easier than I thought it would be. I’ll also share why I switched from 1&1 to Bluehost.