Nifty Online Web Design Tools (That I Actually Use)

So drawing pictures and building the Internet from the ground up like some hopped up moon bandit on a mission to rebuild peace in a time is a great job. I do it occasionally, rarely compared to the average 9-to-5er-with-overtime and don’t even really need to be wearing underwear when I show up at the office. I usually do though, so check that visual image at the door. I thought I’d take a quick hot minute (while I wait for an enormous website to transfer via FTP, OPP) to share a few nifty resources that I use to build these things called webpages.commerce.

Harvest

Harvest Time Tracking SoftwareHarvest is a simple time tracking software website that I’ve been using for a few years now. Simple is the key, and even as they add more features and upgrades, they keep the basics basic: you pick the project you’re working on from a list of dropdowns (takes about 10 seconds max) and click a clock icon to start timing. Click it again to stop. Full reporting as well. They also do invoicing, track expenses and more. I don’t use those features though, I just want to know how long a project took me.

Available as a browser application, OS X Gadget, iPhone app, Webkit web app and probably lots of more ways to access it. Starting at $12 / month for all of that.

CrossBrowserTesting.com

Cross Browser TestingOkay so I only just started using CrossBrowserTesting.com a short while ago after getting fed up with long wait times and faulty connections at browsercam.com. The fact that browsercam.com (and most other similar services) run $40 – $60 / month as opposed to CrossBrowserTesting’s $20 / month certainly helped, but they also offer a sleek interface, VPN (remote desktop) connection via your browser or desktop client (for which I recommend Chicken of the VNC if you’re on a Mac, it’s free and just works!) and the killer feature: a bookmarklet that allows you to open up the VNC and screen capture processes just by visiting the page you want to test and clicking the bookmark. Wonderful.

Coda

Coda Web Development ApplicationOkay so Coda isn’t an online application, it’s a desktop FTP / HTML editor for Macs. It’s pretty, looks like the rest of the Mac OS X environment, and has great features like auto-completing XHTML, handling CSS and JS well, a plugin system and my favorite is the snippets, where you can easily save and insert little pieces of code that you use over and over. When I started using Coda, about 2 years ago, I averaged 10 hours to put together a website, including XHTML, CSS, testing and integrating into WordPress. Now I can do it in 4 or 5. Coda is $100 and since I’ve purchased it, they’ve never asked me to pay for an upgraded version.

WPEngine

They’re more expensive than the $90 / year guys, but if you’re at all concerned with having the absolute best performance (and search engine placement advantages that come along with that), they’re the way to go. A beautiful interface, WordPress-centric hosting platform, always up (and they perform regular upgrades to their servers) and excellent support are exactly why I use them to host my own sites. $29 / month is what they quote on the site, but you can get the same level of hosting with them through my hosting service, for only $200 / year ($16.67 / month).

More Great Web Design / Development Resources

  • HarvestGmail. If you’re not using it by now, you probably like turkey sandwiches without the turkey. Keep all of your conversations forever, so when clients say “Well I don’t like that blue color there in the links” you can reply “Well you said you did at specifically this time, Mr. Suckface.” Don’t call your clients suckface, though, buddy.
  • Favicon Generator. A simple way to create favicons. Make favicons for your sites people, bookmarkers love them.
  • iStock Photo Stock PhotographyiStock Photo. I feel like everyone who’s ever designed anything knows about iStock, but if you don’t, go check them out. Relatively cheap (particularly when compared to the big boys like Getty, who actually own iStock now I believe), pretty darn easy to use and your clients can go in and find images of their own, create lightboxes and just point you to them. Whatever.
  • Firebug Web Development Firefox extensionFirebug. A Firefox extension that adds a Safari-like Inspector to your browser. No more changing CSS values and refreshing the page, just figure it all out here, make the changes once and kick back with a cool glass of cough syrup.

Up Next: Dale's Bar and Grill