I have been designing and developing websites for over well over 10 years. I always get asked what type of hardware and software I use to get the job done, so I thought I would write up a blog post about it.

Hardware

When I first started working on the web, I used a PC. About 4 years ago, I switched to Mac as my primary development environment and never looked back. Sure, I still have to use windows on occasion, and help manage our Windows-based network at the office, but I am a Mac user through and through.

My current setup includes a new 15″ MacBook Pro with a 2.66GHz i7 processor, 8GB of RAM and a hi-res anti-glare display. When I am at the office, I pair this up to a 30″ Cinema Display, which gives me plenty of room to push the pixels around. I use an M-Stand from Rain Design to prop my laptop up, keep it running cool and get the display in line with the Cinema Display.

For backups, I run two 1TB Iomega Prestige Drives. One drive is my Time Machine drive and it stays connected to my Mac when I am at the office. The other is for regular backups using Super Duper. Time Machine is great for when you accidentally delete a file or folder, but nothing beats having a fairly recent, bootable backup to get back up and running quickly. Learn more about my setup for running and managing backups.

I also use Dropbox for sharing files with my wife’s Macbook Pro as well as backing up documents.

Software

I have a fairly standard set of software tools and rarely deviate from them. We run all of our projects out of Subversion, so I use Versions to check in and out of our SVN server. Once I have what I need checked out, I use TextMate as my main authoring environment.
When I first switched from PC to Mac, I tried just about everything on the market to find something that was close to Homesite, which was my main editor on PC. I eventually settled on TextMate and really enjoy using it.

When I am designing sites, I use Photoshop CS4. I could probably get by on Photoshop 6 when you consider that I probably only use about 10% of the features of Photoshop and rarely use much of the imagery past the concepting phase.

Since we do a good bit of .NET programming, I also run VMWare Fusion with Windows 7. This is also handy for browser testing and running Beyond Compare for uploading files to client servers. I wish there was a Mac version of Beyond Compare or another app that mirrored its capabilities.

So that is my main software setup. I use a variety of other apps from time to time to get things done. Here is a list of other apps I regularly run:

• Google Chrome for regular web browsing
• Firefox with Firebug when I need to debug something
• Fetch for quick file uploads
• Skitch for capturing screen shots
• Adium for chatting
• Entourage for email at work (Exchange. what can ya do, huh?)
• Gmail for personal email
• Tweetie for tweeting (patiently waiting for Tweetie 2)
• Evernote for note taking
• Integrity for link checking
• Alfred for app launching
• XCode when I want to pretend I know what I am doing in an iPhone app project

Are there any apps you are using to get your work done? Any that I am missing that I just have to try out?

After a few of my friends had their hard drives die with no backups of their files available, I decided it was time to get serious about keeping my data safe. It would suck to loose 10 years worth of photos and almost 20GB worth of music, not to mention home movies shot on my Flip Mino HD. So I devised a plan and schedule to keep some sort of backup of my Mac in case of hard drive failure.

Since I use a laptop 100% of the time, it was going to be tricky to keep it hooked up to something long enough for backups to run. It wasn’t like I could leave an external drive hooked up all the time to a desktop. Also, running Time Machine backups over WiFi to a disk connected to my AirportExtreme didn’t seem terribly efficient. The bandwidth it took up also affected the performance of other networked devices in the house. So I came up with the following solution.

My MacBook pro is a work machine, but I take it home on the weekends as well. While I am at work during the week (and during the day) it stays connected to a 1TB Iomega Prestige USB drive. This is my Time Machine drive. It keeps running backups of my files so I can revert if I accidentally delete something.

But Time Machine likes to run. A lot. I think it defaults to backups every hour. To do this, Apple uses a launchd daemon to control the timing. Changing the value of the interval in the launchd.plist file has no effect.

To overcome this, I found an app called TimeMachineScheduler. This app disables the automatic backup function of Time Machine and installs its own launchd daemon to allow you to control the frequency of Time Machine backups. You can also skip the backup entirely with a specified time range – like at night, when my MacBook Pro is at home and not connected to the backup drive. If you encounter problems with the app, there is even an uninstaller that will put things back to the way they were.

So I was off and running with Time Machine, but I noticed that every time it ran, it was grabbing 20-30 GB of data…even though I had not really changed that much on my Mac. What in the world could it have been backing up each time? Fortunately, there is a way to find out.

TimeTracker from CharlesSoft will read your Time Machine backups and show you want is being backed up each time. Once you can see that, you can go in and make adjustments to the exclude list to ignore items that don’t really need to be backed up – like Entourage profiles that are also stored in Exchange, or virtual machine images that can’t be incrementally backed up (that was the 20GB I was seeing every time).

In addition to Time Machine, I also regularly run a bootable backup to a second Iomega drive using the fabulous SuperDuper from Shirt Pocket software. Once you run a full bootable backup, you can run a Smart Update (registered version only) which will basically run a differential based on your original full backup.

I keep my SuperDuper drive at home so that I never have both copies in the same place. With the Smart Update feature, I can also keep my SuperDuper drive up to date and bootable without having to run a full backup each time. I probably run a Smart Update once a week, usually on the weekends when I am at home and not using the computer much.

So that is my backup strategy. What is yours?

Have you been using the new Multitasking feature in iOS 4? I have been using it like crazy and love it. If you have been using it for any length of time, you have probably noticed about 6 or 7 screens worth of apps in the app drawer that shows up at the bottom.

You can actually quit those apps running in the background. To do this, follow these steps:

1. Double-click the home button to open the multitasking panel.
2. Select and hold down on one of the app icons like you do on the homescreen to rearrange them.
3. When they start jiggling, you will see a red minus sign in the top left corner instead of the standard X for deleting apps.
4. Just scroll through and tap the minus sign for the apps you want to close.

Got a new iPhone 4 and no friends to FaceTime with? You can call an Apple representative for a FaceTime demo call. They will show you the various features of FaceTime during the call.

If you are connected to a WiFi network, just call 1-888-FACETIME and follow the instructions.

So when I first got my iPhone 4 and made a call, the FaceTime icon showed up just fine. However, once I got home and synced the the phone with iTunes, restoring it from the backup I made an hour earlier of my old iPhone, FaceTime wasn’t enabled.

Apparently, the act of restoring from backup turned off the FaceTime feature and I had to go back in and enable it. Some people have reported this happening and thought it was because they restored from a backup of an iPhone running the iOS 4 beta. I don’t think that is the case.  My phone was running the 3.1.3 software.

It does explain why the old man standing outside the Apple Store last night said his son didn’t have a FaceTime icon.

So, a few months ago, my son dropped my iPhone 3GS in the toilet (fell off the back of the tank). Since then, I have been using my wife’s original iPhone. Needless to say, the experience just wasn’t the same. No GPS, lagging performance (relative to the 3GS), and more. So, I decided to hold out for the iPhone 4 rather than picking up another 3GS.

With the help of a friend with an extra reservation, I picked up a 16GB iPhone 4 last night and have been throughly impressed with it. Here are some initial thoughts:

• Speed: coming off a 1st gen iPhone, the speed is just incredible. If I were still using my 3GS, it may not seem like that big of a difference.
• Display: The Retina Display is just amazing. The pixel density is unreal and it is odd at first to have that much clarity in a screen that small.
• Folder: Finally, I can put all those un-used system apps in a folder rather than throwing them all on a third or fourth home screen.
• Size: The phone just feels solid.

More thoughts coming along after some time with it.

When Chris Pederick released his Web Developer extension for Firefox, it was my #1 extension and I would recommend it to anyone. Over the past year, I have slowly moved away from Firefox and started using Chrome as my daily browser of choice. Before they allowed extensions on the Mac version, I would still find myself opening up Firefox to use the Web Developer toolbar or Firebug.

When Chrome did turn on extension support, there still wasn’t a quality development extension out there. The version of Firebug that was available was, well, buggy…and tended to slow down the browser.

Finally, a light at the end of the tunnel. Chris Pederick has ported his popular Web Developer Toolbar over to Chrome and it seems to be top-notch. Only time will tell if it affects the performance of Chrome in any way.

The battle between Flash and HTML5 has become increasingly heated as the web design community is starting to choose sides. This new open source project may help ease some of the tension. It claims to convert Flash to HTML5/Javascript on the fly, allowing content that was previously unseen on devices like the iPad and iPhone to be viewed without any problems.

The project is called Smokescreen and they just released a preview of their software. Check out some of the demos they have worked up to see it in action. They plan to release the code within the next few weeks. Here is a video of Smokescreen in action:

Google kicked off their annual I/O developer conference today. One of the announcements they made was the availability of the Google Font API. This allows you to embed fonts on your web page by adding a line of code to your CSS that points to the font on the Google servers.

You can literally add fonts to your website in a matter of seconds. Because of the way the API is written, the fonts are supported as far back as IE6.

So here is how you do it. First, add a link element to the head of your HTML document that points to the font you want to use. Next, add a reference to the font in the CSS selector that you want to use the font on.

That is pretty much it.

If you want to know what fonts are available via the API, head on over to the Google Font Directory to see what is available. This is a collection of open source webfonts that are free and licensed for embedding.

You may be asking what this means for font services like TypeKit that recently launched to offer premium fonts for embedding on webpages. Fear not. TypeKit actually teamed up with Google on this project and has even open sourced their TypeKit font events as WebFont Loader.

It has been just over 2 years since I started using my 17″ MacBook Pro Core 2 Duo 2.5Ghz. It has served me well, but the new lineup of MacBook Pros was just too good to pass up. So I have upgraded. Instead of staying with the larger 17″, I have down-sized to the more portable 15″. To make up for the lack of size, I went with the 2.66Ghz i7 processor and 8GB of RAM.

Here are my thoughts.

Speed

The new 2.66GHz i7 processor, coupled with 8GB of RAM and the 7200RPM 500GB drive make this laptop a speed machine. It launches Photoshop CS4 is no time at all, and runs my Windows 7 VM via Fusion with no problems. I even have enough RAM to give Fusion 2GB and the Mac still doesn’t break a sweat.

Form

After using 17″ Apple laptops for what seems like forever now (5 years +), the 15″ feels great. The new unibody design feels rigid and with the hi-res display, I still have almost as much screen real estate as my old 17″.

The one thing that is taking some getting used to is the new keyboard. I have been using Apple laptops since I got a G4 Powerbook, and they have all had the same keyboard style. The new MacBook Pros have a different keyboard style and it is taking a little getting used to.

Ports

When I am at the office, I connect to a 30″ cinema display. The new MacBook Pro has the mini-DVI port, which meant I had to purchase an extra Dual-link DVI adapter to connect to the cinema display. I have had a few issues where the display wouldn’t properly update when I connect or disconnect, but other than that, it has worked fine. All of the ports (power, video, firewire, USB, network and audio) are on the left side of the notebook. I have noticed it getting warm on that side when pushing video to the large display. When I am using it “laptop” mode, it doesn’t seem to run that hot.

Transition

When I first upgraded from my Powerbook to the first Intel MacBook Pro (Duo Core), I used the migration assistant. When I upgraded to the Core 2, I used migration assistant again. That is in addition to upgrades from Jaguar to Tiger and Leopard to Snow Leopard.

I wanted to keep this new system as clean as possible, so I decided to skip the migration assistant and do the upgrade manually. One thing that made this easy was running a full backup of my old laptop to an external drive using Super Duper. I could then move over my photos, pictures and other files. I had also stored a good bit of data on Dropbox, so as soon as I installed that app, it started syncing.

Installing my apps was easy since I use a fairly limited set of tools (CS4, Versions, and Textmate are my workhorse apps). I also keep a majority of my work files in SVN, so those were just an easy checkout. I was also able to move my Fusion VMs over and get those back up and running quickly.

Coming soon, I will put a post together detailing all the apps I use on a regular basis and why.