Posts From January 2008

MarsEdit 2.1

MarsEdit 2.1 -

In summary, MarsEdit 2.1 has a new search feature, a new capsule-based tags editor, support for Movable Type tags, support for saving drafts to the server, massively improved preview performance and usability, and a bunch of other performance boosts and feature tweaks.

The first major update to MarsEdit since 2.0 came out last fall. I had the privilege to help with the beta testing and I’ll tell you that there are some great additions and improvements.

And if you’re wondering, yes I have a review coming out shortly.

Redesign of openswitch

Redesign of openswitch -

It looks great, Ben. So what are you up to now? Version 18b1?

Coda’s Developer Zone

The dudes at Panic recently created a Developer Zone for Coda, with video tutorials, quick tips, overviews and more. If you’ve been looking at or using Coda lately this is a great resource to check out.

Though Steven may have the loudest key taps and mouse clicks I’ve ever heard on a screencast.

NNW 3.1 (part two: reading stuff)

Brent Simmons, Things you may not know about NetNewsWire 3.1 (part two: reading stuff) -

More stuff you may not know about NetNewsWire

Sean Sperte’s Intro to EE

Sean Sperte’s Awesome Introduction to Expression Engine -

I mentioned that one of the primary reasons to choose Expression Engine is because it’s easy to learn, deploy and use; and that’s true. But the main reason I use it is because of its power and flexibility — most of which is found in features exclusive to EE.

To me, EE users seem like this quiet bunch who are walking around with a secret and a hop in their step. If you happen to ask them about it they will proudly brag on how much they love their CMS.

Brent Simmons, NNW Tips

Brent Simmons kicks off Things you may not know about NetNewsWire 3.1 (part one: browser stuff) with a ton of useful info.

If you’re using NNW as your feed-reader, and I recommend you do, then you probably want to read this article.

Michael Mistretta:

I cleaned out my RSS feeds. I cleaned out my twitter. I cleaned out my blog. I was tired of being bombarded by all the senseless information of the Internet. I unsubscribed from the hundreds of news blogs, and subscribed to blogs whose content I enjoyed reading. I cleaned out my digital life, and now I have a sense of freedom that I’ve never felt before. It felt good.

This is the kind of thing I think we all want to see: Less cranking out of vanilla weblog-rhetoric and more genuine content.

Dear Readers,

When publishing a weblog with comments disabled there are a handful unique scenarios which can arise amongst the readership. Primarily that you, the reader, has to go to a little bit more effort to give your feedback.

Albeit, only a small amount of extra effort is needed because you have to write an email instead of just post to a contact form, but still. The slightly extra effort means quite a few of you will read a sans-comments-weblog without ever giving feedback; even if that feedback would only ever be, “Nice article. I enjoyed reading it.”

Or you may assume the author (in this case: me) has comments disabled because he doesn’t want feedback. And when you, the reader, don’t give feedback it becomes slightly more difficult to connect with the author.

I have personally found that the websites I look forward to reading the most are not only those with interesting content but are also published by folks whom I feel connected to in some way.

Since there has been quite a bit of readership growth over the past month – with RSS subscribers more than doubling in the past 5 weeks – I not only wanted to take an opportunity to say hi to those of you who are new, but to give you all an open invitation to say hi back.

If you are new here, welcome.

And please, feel free to take this opportunity to say hi back, and introduce yourself, (even if you’re not new).

May I also recommend you follow me on Twitter. When I’m not publishing here I am tweeting there.

— Shawn

NNW: Your RSS Router

Brent Simmons on NetNewsWire’s compatibility with other Desktop Apps: Your RSS Router -

One of my favorite features of NetNewsWire is how it works with a bunch of other desktop apps. The idea is this: news comes in to NetNewsWire, and then you route stuff to wherever it should go.

$29M for WordPress

Matt Mullenweg on the recent investment funding for WordPress -

Automattic is now positioned to execute on our vision of a better web not just in blogging, but expanding our investment in anti-spam, identity, wikis, forums, and more — small, open source pieces, loosely joined with the same approach and philosophy that has brought us this far.

Great news for everyone with a weblog being Proudly Powered by WordPress.

Slugger Plugin for WordPress

If you use MarsEdit for posting to WordPress a good solution for customizing your slug is with the Slugger Plugin.

UPDATE: This happened to be a test post, and waddayaknow: it worked like a charm.

UPDATE 2: Somehow I completely overlooked the slug field in MarsEdit. Just go to “View” and select “Slug Field”. It shows up right underneath the title field. (Thanks to Josh and Chris for pointing it out.)

Post-Macworld Wrap-up Parts I, II, III & IV

Today was a good day thanks to the notorious Daring Fireball linked list. Sometimes John Gruber links to something smart, and sometimes he links to something that is a great read. And then, sometimes he points out an article that is smart and a really great read.

I’m talking about Lonelysandwich and his Post-Macworld Wrap-up, Part I, Part II, Part III and Part IV; in which he writes about the MacBook Air, iTunes movie rentals, the iPhone update and Google Maps, but not like you think it’s being written about.

Adam Lisagor is a crazy-good writer and thinker. And by that I mean I just read four articles in a row chuckling so hard my wife was looking over her shoulder at me with the raised eyebrows thing going on, and I’m thinking to myself “Wow. Funny. Wow. This guy is smart.”

I can’t believe I didn’t know about Lonelysandwich until just now. Ah well; thanks John, and hi Adam.

Coda: The One-Window Wonder

Coda is a text-editing, CSS-styling, WebKit previewing, file-managing, FTPing, terminal-accessing, web-site-building and publishing application for the Macintosh.

And, Coda has no duct tape.

All Inclusive Applications

If you are going to write an application that has and does “everything” there are a few key dynamics you have to keep in mind.

First of all you need to make it easy, simple and clear for the user to do all their work in your “one window”. This is where usability and interface make or break the application. And, fortunately for Coda, this is where Panic excels in, and Coda does a superb job as a “one-window application”.

Before Coda I always had at least three windows open at any given time when doing web-design: Transmit, TextWrangler and Safari. And I know that for those who are more web-design and development savvy people than I, only three apps open would be like a vacation.

For the past several weeks as I’ve been writing this article I have used nothing but Coda for web designing, and it has broken my age-old habits of CMD+TABbing between multiple apps.

Using Coda’s one-window interface has been especially wonderful when I am away from my home office and thus coding on my 12″ PowerBook’s 1024×768 screen resolution. But even on my 23″ display at home, I prefer to have Coda’s window sized to about 85% of my screen and make use of the Text Editor and the Preview panes rather than have two apps running side-by-side at 45% screen-realestate each.

Another reason Coda has helped break my habit of multiple-app web designing is the way it saves your previous work session, but more on that later.

Coda’s use of tabbed windows plays a critical part in its claim to fame as a one-window tool. Nowadays tabs come standard with good apps. Therefore, just having tabs is not enough. You have to have tabs that are above the norm of other applications and which meet the user’s expectations. Especially when it’s the tabs which are part of the foundation of your “one-window” application.

There seem to be three major ingredients which make up a good tabbed-window interface. First is design. One of the reasons I have never used NetNewsWire’s built in browser is the slighly odd look and feel of the tabs. They just feel clunky to me. Coda’s tabs are clean, subtle and easily identifiable. They are intelligently placed, and don’t go weird places when you have 20 of them open. (Though if you have 20 tabs open, you probably have bigger things to worry about than tab placement.)

The second ingredient is navigation. If you’re working in tabs you must be able to get from one to the other quickly and easily. Coda’s tabs work identical to virtually all other tabbed interface apps in that you can hot-key between them with the standard CMD+SHIFT+[ or CMD+SHIFT+] keys.

Finally, and most important, is user-interface. This seems like a moot issue, but there are still many apps that don’t utilize it. Coda does utilize it, and utilizes it well.

The most important user-interface aspect of tabbed-windows is the ability to re-order the tabs. A simple click and drag does the trick just perfectly. Moreover, Coda has more than just hot-key commands for new tabs. There is a “plus” symbol just under the toolbar, to the right of the file browser that you can click on to create new tabs. And to the far right is the “split window” symbol. A click on that and your current window gets split vertically or horizontally.

So at the end of the day, Coda’s claim to be a one-window app is valid. Coda is a great one-window application.

But there’s more to it than that…

The second challenge for a do-it-all application is to avoid overwhelming the user with too many options; i.e. “bloating” your app.

Coda is most certainly not bloated. If anything it could be argued the opposite – that Coda’s features are too skimpy.

However, put yourself in the developer’s shoes for moment. You’re going to take a Text Editor, CSS Editor, FTP client and a Terminal app. Then bundle them together, add a WebKit based prievewer and debugger, and offer some good documentation of PHP, CSS, Javascript and HTML. And finally: sell it for less than the cost of just a good text editor.

Panic didn’t set out to make the best text editor, CSS editor, etc… They set out to make one single application that contains all you need to build a website. And Panic has done a great job at keeping each of Coda’s components concise, powerful and focused – giving you the features you need while not requiring you to learn 4 or 5 new applications simultaneously to be able to use Coda efficiently. Sometimes good development decisions are about what you don’t put in.

An Aside Regarding Dreamweaver

When talking about one-window website development applications it’s hard not to mention Adobe Dreamweaver. And though Coda may easily be compared to the features Dreamweaver offers, Coda is much less bloated, much more snappy and infinitely more Macintosh-like.

In his Coda review for MacUser, Nik Rawlinson says,

“[Coda] could teach Adobe a thing or two, as it puts Dreamweaver’s multi-paged dialog to shame, and beats its sidebar-based CSS designer hands down. [...] If you’re…ready to step up from Dreamweaver’s built-in code-based environment, Coda is an excellent choice.”

Coda was developed for people who work at the raw code level to build their websites. In contrast to Dreamweaver there are no pre-fabbed templates or WYSIWYG editors in Coda. Anyone who uses Dreamweaver would do well to look at Coda. Especially those in the market to buy, since Coda’s price tag is 5 times less than Dreamweaver CS3′s.

Starting With 1.0

On Monday, April 23rd, 2007 – exactly 10 years and a day after Panic was born – Coda 1.0 was launched, and it received quite a bit of buzz all about the internets.

  • Cabel Sasser
    This was by far the most complicated program we’ve ever built. I realized this when it dawned on me that I had never stopped doing design work for it. With most of our prior applications, I may spend a month or two creating a all-purpose Photoshop layout, cut up any important art, and then hand it over to the guys, possibly coming back to make a tweak every now and then. With Coda, the number of features and the scope of the project meant that even as soon as yesterday I was cranking out some interface pieces as .pdf’s
  • John Gruber -
    One way to judge the scope of an app is to think about how much time you’re intended to spend using it. There’s plenty of room for apps you use here and there for a few minutes at a time, or which you launch just once or twice a week. There’s hardly any room at all, though, for apps you work in for hours at a time, every day. By this measure, Coda, the new app from Panic, is an epic.
  • MacUpdate’s Review Forum is full of ravings –
    Wow. Do the folks at Panic ever make a mistake. Everything in Coda is amazing, it’s so intuitive it’s scary. Auto completion works great, the sites page is amazing, inline ftp, preview, all of it amazing. One thing I did notice, doesn’t seem to like flash, but hardly a dealbreaker. Bought and paid for this morning about an hour after release.

Moreover, April 23rd was also the submission deadline for the 2007 Apple Design Awards. And, waddayaknow but a few months later at the WWDC07, Coda won the award for Best Mac OS X User Experience -

Coda is a unique web development environment that offers a complete file browser (both locally and remotely), publishing, full-featured text editor, WebKit-based preview, CSS editor with visual tools, full-featured terminal, built-in reference material, and much more. Coda is the Mac’s first one-window Web development application that integrates numerous modules into one cohesive user experience. Coda is a great Mac OS X citizen…

User experience has always been one of Panic’s fortés, and Coda is no exception. It truly is a beautiful, powerful, intelligently designed, all-in-one website building tool.

However, it’s important to note that there is something interesting I have seen in many of the reviews I’ve read about Coda. There seems to be this relatively universal love/hate relationship with the people who use it.

Even in my own experience with Coda it just doesn’t quite cross over from, “Wow! This is smart, incredible and beautiful!” to, “How will I ever live without this?”.

Joe Kissell says -

…it’s like buying your dream car, only to find out that the seats are kind of uncomfortable and there’s no heater. Coda comes so close to being great that its shortcomings are especially annoying. Having tried this way of working, I’m loath to return to having four applications open all the time – and yet I keep running into issues that irritate me almost enough to give it up.

Yet, let’s not forget Coda is still only a 1.x product, it is extremely affordable for the features it offers and Panic has a fantastic reputation for producing outstanding software for the Mac.

Coda’s components are all masterfully crafted and seamlessly integrated. It has all you need to code, debug, validate, stare at, drool over and then publish your website.

Steven Frank says that when the beta-testers were asked what their favorite feature was they all replied: “The integration. The way it all fits together. How everything’s somehow right where you need it when you need it.

“Sites”

When you launch Coda this is where you start. Coda uses “Sites” the same way Transmit uses “Favorites”, and when opening Coda for the first time you are given the option to import some or all of your Transmit favorites if you like. You can also import them later.

Each “Site” is basically a collection of info and details about a website you’re working on or maintaining. Your “Sites” are represented by taped-up pieces of paper with a picture of your home-page drawn on the front: Coda's Site's

Coda gets the icon images by taking a screenshot of your site’s homepage / root URL, which you can designate in the site’s info pane.

Having the visual icons to represent your sites is a nice touch, but a problem may arise if you have more than one saved site for the same root URL. Such as shawnblanc.net and shawnblanc.net/images. Both of those icons would display the same image on the taped up piece of paper. However, I don’t have my /images/ folder saved as a site, so it’s not a problem for me. And I think it’s clear that Coda wasn’t intended to replace your dedicated FTP client, so I doubt it will be a problem for many others.

But if you do encounter that problem the good news is you can choose custom images for each “Site”. To put your own image onto the taped-up paper, simply control-click on the site and “Change Image” to browse your finder for the image of your choice.

When you double-click on a “Site” the page flips around and expands into the full width of Coda’s window, revealing your previous workspace layout. Files, tabs, splits, everything is just the way you last left it and it is all ready to go. (Unless you left it in a mess. Try not to do that.)

The restored work session is one of my favorite features in Coda. It seems that most of the time I am opening up the same files for a site over and over. I can’t describe how wonderful it is to simply open up a “site” and have my previous session restored right the way I left it.

John Gruber expounds -

In terms of historical user interface traditions and conventions, Unix and the Mac could hardly be more different, but there is one similar philosophy shared by both cultures — a preference for using a collection of smaller, dedicated tools that work well together rather than using monolithic do-it-all apps. Coda seemingly swims in the face of this tradition, in that it ostensibly replaces a slew of dedicated apps. Coda’s premise, though, isn’t so much that it is one app that obviates several others, but rather that web development can and should be treated, conceptually, as a single task. That you don’t think, I need to download, edit, save, upload, and preview a change to the web site; you think, I need to make a change to the web site.

There is something else that has stuck out to me in my use of Coda, which I don’t quite know where to talk about, so I’ll bring it up here: When using Transmit I always disconnect before quitting. I press CMD+D to disconnect and then CMD+Q to quit out. But the same key combo doesn’t disconnect you from your site in Coda. (Pressing CMD+D or CMD+SHIFT+D moves you to the next or previous symbols within a text document.)

If you want to disconnect from your “Site” before quitting not only are there no hot-keys to do so, you have to click the circle-encompassed “x” next to the name of your site up in the top left corner of the application. Coda's Disconnect X

And as many of you “don’t use the mouse if you don’t have to” / “I love Quicksilver” nerds will agree: clicking the disconnect button is too much. Therefore, since I can’t disconnect with a hot-key I find myself just quitting out, and it feels a bit like I’m unplugging my computer without powering it down first.

The Text Editor

For most users the text editor will be one of the two most-used features in Coda. (The other obviously being the Transmit turbo-engine-powered file manager / FTP client.)

Coda’s text editor is not a blow-your-brains-out-the-back-of-your-head kind of text editor. It wasn’t meant to be.

Coda’s text editor is its own licensed version of SubEthaEdit, which is one of few text editors which prides itself in being “a high-performance, sleek editor”; i.e. minimalism. To say the least, Coda’s text editor is powerful, clean and smart. It even comes with its own font, “Panic Sans”.

When it comes to text editors there are those who live and breath inside theirs, and everything else is just details. These people know every feature, every bug, every nook and every cranny of their editor and they use it for virtually everything. And these people just may pull their hair out when they try using Coda and discover it doesn’t have the ability to search within all the files on a site - Coda's Search Scope

What Coda majors on is taking the most important features and implementing them in an intuitive, no-nonsense way.

For instance the bracket highlight feature: When your cursor passes through the beginning or end bracket a little blue beacon pops out at the other bracket, letting you know where the current symbol begins or ends. Simple, smart features like this are peppered all throughout Coda.

And not only are Coda’s little features smart, their interface is beautiful. Coda's Auto Complete

Compare Coda’s auto-complete pop-up list above to Dreamweaver’s below: Dreamweaver's Auto Complete

Not only is Dreamweaver’s box clunky and sports a drop shadow straight from 1997, but it brings up the entire code listing with empty brackets next to each tag. There is way too much going on. Notice how Coda only shows the tags that begin with ‘f’?

CSS Editor

CSS editors are becoming more and more popular. And for good reason. If I could remember everything I would much prefer to write my CSS from scratch by hand. But editing and writing CSS that way requires a bit more jujitsu than I have.

Coda’s CSS editor, much like its text editor, is simple and straight forward. You don’t have to examine it for an hour before you can figure out what you’re doing with it and how to work it.

If you already have a style sheet you’re working with you can open it in the CSS editor. It will display all the style elements on the left column with the built-in editor on the right-hand side. Click on an element to edit its type, margins, padding, color, border, etc… All the CSS properties are available for you to use and master.

You can build a style-sheet from the ground up as well; creating each element as you go. Or if you prefer, use the text editor to hand write all the elements you will be using then use the CSS editor to set the styles of those elements.

With Coda there’s no reason you shouldn’t have a fully-functionable and beautiful style sheet.

In addition to tabbed windows, Coda also allows you to split a window vertically or horizontally, and I’ve found that splitting the window vertically is extremely useful when working on a style sheet. I can then see and edit my CSS file’s text by using the text editor on the right, and then on the left split I put the dedicated CSS editor with a list of all my symbols and the visual style-selector; giving me the best of both worlds in one window.

“Preview”

Coda has its own internal browser so you can view the changes you make to your website right within the app.

It is a WebKit based browser, so your site will look virtually identical in Coda as it does in Safari. But nobody does browser testing in only Safari. To preview the same page in other browsers you simply click the icon to the right of the Coda’s Address Bar and highlight the browser you want to launch. Previewing a site in another browser from Coda.

DOM Hierarchy Inspector

While in a Preview window you can activate Coda’s Document Object Model Hierarchy Inspector by clicking the magnifying glass icon at the bottom of the screen when in Preview mode. You may then scroll over the various modules in your webpage to see them highlighted in blue with their logical structure outlined below. Coda's DOM Hierarchy Inspection

Not only is the DOM hierarchy inspector fun to play with as you watch blue boxes pop up here and there while you fling your mouse all over the place, but it is also a great way to get a visual grasp on how your code actually plays itself out, and is especially helpful for debugging and finding goofy errors with Javascript and HTML.

FTP Client and File Manager

Coda has Panic’s new “Transmit Turbo Engine”. (Get it?) For basic file transfers Coda actually claims to be quicker. It’s not a dedicated FTP client, but is certainly does the job it needs to do. The file-browser/Transmit combo works so seamlessly you may forget you’re working on a remote server.

When you click on a file either remote or local, that file opens up in a new tab. You can then tinker away to your heart’s content. If you are working on a file from your server, when you save will automatically upload the updated file.

When working on local files you can keep them local or choose to upload them to the current folder you have open on your server. Control-clicking gives you the option to upload, or to “Mark For Uploading”. When a file has been marked for uploading, Coda puts an up-arrow to the right of the file. Clicking that arrow uploads the file to the current folder you have open on your server.

When working on several files that will incorporate interlinked changes across your whole site, it is usually preferable to upload them all at once. Marking them for uploading helps keep them organized for you. Then you can close out the file, but keep it marked and when you’re done, upload all of them together.

The integration of the file manager and the FTP client is so seamless it is easy to take it for granted. The file manager is out of the way, but ready and available when you need to use it. And that, my friends, is the mark of a well-designed feature.

The Terminal

This is where I confess I am not that hard-core of a nerd. I am not a Terminal junkie, and in-fact, have not once used Coda’s built in terminal. Though if I needed to, Coda has made it as easy as possible by taking my “Site” information and using it to log me in via SSH.

Reference Books

Coda includes two books: A PHP reference guide and the “Web Programmer’s Desk Reference: HTML, CSS and JavaScript“, by Lázaro Issi Cohen and Joseph Issi Cohen -

The Web Programmer’s Desk Reference is the only book to serve as a single point of reference for all three primary web programming languages. Each listing includes the latest syntax and functionality, compatibility with other elements, and cross-browser compatibility issues.

The content in these books is comprehensive, easy to understand and very well laid out.

The biggest complaint is that the books are only available when you’re connected to the internet. Their content is hosted by Panic. This certainly defeats much of the purpose of having built-in reference guide. If I can only access it when I am online I could just as easily use Google to find what I need help with.

I would love to see these books saved locally to make them accessible when the internet is not.

The Little Things

It’s the little things in Coda that you may or may not notice that make it worth owning and using. The way a “Site” fades away if you delete it, or the way each of the primary six components in Coda have a numbered hot-key.

In fact, the little things in Coda matter so much it’s why Brent Simmons recently purchased a copy -

I used [Coda] to update NetNewsWire’s Help book for the latest release, and I liked the flow of it. I liked the easy flip between edit and preview modes. I liked having the list of files on the left. I liked the tabs. I liked the keyboard command for closing a tag. Etc. But, most importantly, I liked the overall feeling of the program, and the sense that it would take care of me — that is, I felt like it probably had features I didn’t know I needed, and anything missing would probably be added in the future (things like multi-file find/replace). Part of this is just judging the app, and part comes from considering Panic’s track record.

Here are a few of the little things that stand out to me:

Symbols Quick Navigator

Clicking the brackets at the bottom toolbar underneath the file-manager brings up the Symbols Quick Navigator. It is a funky little table of contents for all the style-sheet symbols in your current open window. Coda's Symbols pane

The 3-Pixel Conundrum

If you’re a fan of the new look for selected icons in Leopard’s toolbars you have Cabel and Panic to thank for it. Cabel was un-satisfied with the default selection state in Apple’s toolbar. To make a long story short, Panic’s development team coded their own toolbar to make up for the trouble Apple’s toolbar gave them when trying to get the look they wanted. But someone at Apple noticed and the design became Leopard’s default. (Read the whole story, here.)

Clips

Michael from WordPress Candy points out how helpful Coda’s “Clips” feature is for doing WordPress theme development.

You can save any text you want as a “Clip”. This is extremely helpful for keeping common tags available at all times. And Clips has a Global database as well as a site-specific database. If you are working on a WordPress based site you can save your WordPress tags for that site, and if you are also working on a Textpattern site your tags for that are saved when that site is open.

Double clicking a specific clip paste that text starting at the cursor’s current location. Or you can click and drag a clip to any location in your file. Coda's Clips Box To open up the Clips use the hot-key CTRL+CMD+C, or navigate to “Window” then select “Clips”.

Miscellaneous

  • If you move the location of your local root directory, Coda keeps track of where it goes. Even if it goes to the Trash.
  • A dot to the right of the file name inside the file manager, or in the file’s tab tells you the file has had changes since the last save. Coda's Save Dot
  • The way the toolbar stays fluid with the file manager’s width. It’s hard to explain, but adjust the width of the file-manager window and watch what happens up by the toolbar. The icons stay fixed above the window, the site name stays centered above the file-manager.

More Reviews

This is just one of a handful of winded and entertaining software reviews.

Sean Sperte’s Mildly Geeky Keynote Reactions

Sean Sperte’s Mildly Geeky Keynote Reactions -

There are too many good points and one-liners to try and squeeze into a few in blockquotes. (My favorite is the sentence about his mom and backups. You’ll see.)

And by the way, Sean’s site is a must read. Do yourself a favor and subscribe to his feed. You can thank me later.

Glenn Wolsey’s Latest “Desktop Friday”

I get quite a few emails asking about the desktop wallpaper displayed on the Apple Cinema Display in my office setup pictures. The image is a picture Glenn Wolsey took, and he just posted it to the public. Go forth and download my friends.

Workaround for Lame WebClip Icons

Override Lame WebClip Icons -

Smart little workaround by Matt to avoid lame WebClip Icons on your iPhone. I imagine that all this hububb about WebClip Icons will be mute in a very short time. But so goes the blogosphere, eh?

Mint WebClip Icon

Mint WebClip Icon -

Most people have Mint in a subdirectory like /mint. This is a problem if you want to set an iPhone favicon for your root domain, but change the favicon in subdirectories because the iPhone looks in the root directory for the favicon.

A joint effort over Twitter between Cameron and I to hack Mint to display the Mint Icon on your iPhone instead of a picture of your Mint page or the default WebClip you have uploaded to your root directory.

By “hack” I mean slightly edit, and by “joint effort” I mean I resized the 3 different colored Mint Icons to 57×57, and Cameron figured out the edit and wrote the tutorial.

UPDATE: If you’re still stuck with your site’s root folder’s WebClip try “Red X-ing” out of your Mint browser window, restarting your iPhone and then re-navigating to your Mint install.

Updated: iPhone Tips & Tutorials

iPhone Tips & Tutorials: A semi-comprehensive link list -

Just updated. Now with 57 links to iPhone Web Apps, Tips, Tutorials, Articles, and more.

Create WebClips Icons

HOW TO: Create WebClips Icons -

I’m always happy to link to Brett’s site. Not to mention he posted it first.

Writing a Great Review

There are two basic components to writing a product or software review. One is to look at, and then state, the obvious (and sometimes not-so-obvious) in great detail. The second is to put a bit of personality behind it.

Point in case: John’s recent article on the new MacBook Air. He didn’t say anything groundbreaking nor unearth any deep secret about Apple’s new notebook. He simply looked at the stats, put them into two comparative unordered lists, gave his opinion and that’s it. The end. Great article.

Think about it for a second. John’s opinion articles and reviews are great, not because he tells us all secrets, but because he tells most of us something we already knew but hadn’t thought about yet.

For example, my favorite DF article of all time: Full Metal Jacket. It contained no new information, but had 5,000 words of detailed observations about the 15″ Aluminum PowerBook. It’s the only DF article I’ve read more than once, and it made me love my own PowerBook all the more.

A great review is one you can relate to.

The Talk Show: Episode 14

My best friend and his wife just had their first little girl, Isabella, so I am off to the hospital to say ‘hi’. In the mean time, while you all wait with baited breath for Steve’s keynote I’d suggest listening to Episode 14 of The Talk Show, where “Dan and John lay down their predictions for Macworld 2008.” It just got posted so I haven’t even listened to it yet, and probably won’t get to until tomorrow on my flight to Colorado.

Electric Weekend Redesigned

Electric Weekend -

Nice redesign to Phil Bowell’s site. It looks great, Phil!

Behind the Scenes of ShawnBlanc.net

Nerds are suckers for information. And the really gargantuan nerds love to find out information about other nerd’s nerdery.

For example: One of my favorite set of posts on Glenn Wolsey’s site are his Famous Mac User Setups. Paul’s recent article on the behind the scenes info for PSTAM.com was a great read. Point being: I am a gargantuan nerd.

Therefore, for your own nerdery: Here are the ins and outs of how ShawnBlanc.net is maintained and published.

Mac Setup and Workspace

Having my home office and workspace set up in a way that helps me relax, think and work has taken a while to figure out. My office is my favorite room. It is so much more than just “where I work”. It’s my room. My wife gets the rest of the house – I get the office. And I am content with this arrangement.

Here is where I sit to code and publish ShawnBlanc.net -

ShawnBlanc.net Blogging HQ

My primary machine is a Mac Pro Quad-Core 3.0GHz with 4GB of RAM, 750GB of storage and a 23″ ACD. Since the above picture was taken I went sans-wireless with a thin Apple keyboard and my wired Mighty Mouse.

I never fully got on board with digital GTD apps. I use a Moleskine notebook for all my ToDo lists and notes. Basically I just want something I can write down a todo and the cross it off when it’s done.

The desk, lamp and wall shelves are from IKEA, and I think the desk and shelves totally make the room. I have that lamp on virtually all day long. Something about shining light onto my workspace helps me feel creative and motivated. And even though you don’t care: I just replaced the bulb today.

And yes, my desk is always that clean. When it’s not I have a hard time thinking.

When I’m not at home I have my 12″ G4 PowerBook with me. I plan to replace it with a 15″ MacBook Pro later this year. (Probably this spring when the new/refreshed MBPs announced next week at Macworld show up in Apple’s online refurbished store.)

(I wrote a full article on the elements of my office setup a while back.)

The Digital Skinny

WordPress

ShawnBlanc.net is powered by WordPress. I’ve never used another CMS, and I probably never will. I’m comfortable with WordPress, I’m familiar with how it’s built and I am extremely happy with how it performs.

As far as plugins go, I only have a few:

  • Clutter-Free: I use this do hide a few un-wanted portions of the Dashboard.
  • FeedBurner FeedSmith: I use this to redirect my site’s RSS feed (http://shawnblanc.net/feed) to a feedburner feed (http://feeds.feedburner.com/shawnblanc). I could easily just post all RSS links to the feedburner feed, but I like the clean look of the native feed link.
  • FlickrRSS: Used to import my Flickr photo stream into my footer.
  • Mobile Admin: For logging into wp-admin via my iPhone. I’ve only logged in on my iPhone a few times, as there’s not much you can conveniently do. But how am I not going to have an iPhone plugin installed?
  • TwitterRSS: Used to import my Twitter status.
  • Database Backup: Backing up your WordPress database is vital. You never know when your host could lose your data, or something else horrible could happen. I have a schedule set-up and get an email every day from my WP install with the latest backup as an attachment.
  • WP-Mint: Automatically puts the Mint javascript into your WordPress header without the need to edit .htaccess or theme files.

(mt) Media Temple

My site is hosted on (mt) Media Temple’s (gs) Grid Server.

The (gs) Grid Server is the perfect solution for a website that gets a healthy amount of traffic with occasional heavy spikes. And the $20/month price of the (gs) is great for a guy like me who doesn’t make any revenue from his website. (I’ve thought about selling ad space in the sidebar, but haven’t pursued it at all.)

I won’t pretend that I have never had any hiccups with (mt) Media Temple’s service, but that is something you will get with any hosting provider. I feel confident that if a major traffic spike comes I won’t have any issues. In fact, my site’s performance often seems to improve when I’m linked to on TUAW or DF. Moreover, any time I’ve had to call (mt) to get some help with something they are fun, and treat me like their best friend.

Stats

I use Mint to keep track of all my site stats, and FeedBurner to publish my RSS feed and track subscription information.

I started publishing this blog on July 2nd, 2007. Currently, there are 193 posts and 0 comments. My site averages 500 unique visitors a day, 20,000 page views a month and has somewhere around 1,500 RSS subscribers.

Workflow and Publishing

When writing an article the first thing I do is get an outline for the post. My brain thinks best in 1, 2, 3…

Once I know the main points, and have an idea for the “feel” I want my article to have I start writing and try not to stop until I’m done. Then I edit a few times and publish.

Most writing used to be done with Ecto, but I have recently switched to MarsEdit.

I do all the coding for my site with Coda, and file uploads with Transmit. Additionally, all the graphics are created in Adobe Photoshop CS3.

Reading & Writing

For the most part, my online life consist of reading weblogs, publishing my ShawnBlanc.net and twittering.

I spend about 80% of my time reading, 20% of my time writing and 100% of my time twittering.

Right now I am subscribed to 70-ish websites, and that’s about my max. Most of them are weblogs with authors who produce great content and have great personalities.

I use NetNewsWire as my feed reader, but don’t read many articles in there. When I want to read someone’s article I’ll arrow-out to their website and read it there. Those words were written for their website, and there’s something about reading someone’s work in its native location.

(To see what blogs I’m reading, you can download my OPML file and import it into your feed reader.)

As you know, most of my articles are focused on design, Macintosh and the greatest invention of our time: the internet. When I am writing an article or an aside I aim to make it dynamic and narrative.

The NNW Sites Drawer

If your are new to NetNewsWire, allow me to point out the Sites Drawer.

The Sites Drawer is a long list of sites that Brent put in there by hand. Some are sites he reads and likes but many were submitted by others, Brent checked them out and decided they were good enough for the drawer. You’ll find lots of your favorites like Daring Fireball, Rogue Amoeba, Ars Technica, CNET plus TONS more.

Just click on “View” and about 3/4s of the way down select “Show Sites Drawer”.

When you select a feed there is an info-box at the bottom which gives you a short description of the feed and the option to open the site in your browser or to subscribe.

Have fun.

Sam Brown’s (M)interview with Shaun Inman

Sam Brown posted a great (M)interview with Shaun Inman on Peppermint Tea.

I love this answer:

SAM BROWN: You are one of the very few designer developers out there that is able to marry your brilliant code with a gorgeous design… How have you come to accomplish this feat that is rarely seen elsewhere? SHAUN INMAN: Oh this one’s easy. I just don’t know when to stop. I will bang my head against the proverbial wall until I understand something—to the detriment of everything else. Sleep. Relationships. It’s really not the enviable quality everyone makes it out to be. It’s not a quick process either. Of course, I am a classically trained graphic designer. As for code and development, I had a couple computer science friends who pointed me in the right direction early on. A collection of dense, occasionally impenetrable O’Reilly books and googling got me the rest of the way. 

And for additional reading, here is the review of Mint I wrote a few weeks back.

(Now I just need some Transmit news to publish and my day will be complete.)