Best companions for Sandvox: my choice for 2014

A lot of bloggers and e-zines are sharing their favorite apps of year 2013. I use to read these selections compulsively and usually my credit card suffers a huge drain after few minutes. The you-cannot-live-without-this-app statement often turns out to be somehow exaggerated, but sometimes I actually discover apps that really change my workflow and simplify my life in front of a Mac.

I decided to focus in this post only on applications that may (or may not, according to your taste, your skills and your habits) work as good companions for the average or expert Sandvox user. You can benefit of my reckless purchases, I guess.

Writing

ByWordIf you have a blog or any website that isn’t just a static page with your basic information, sooner or later your main activity will be writing. We spend a lot of time caring about presentation: is this design good for my website? Do I need to modify it? Pictures? Colors? A funny animated gif with music that surely cheers the visitor up? (please, don’t do this. I mean, really: just don’t).

This makes us forget that a good presentation is only the best way to deliver content – but content is what really our website is about. While writing, what isn’t content is a distraction. If your content doesn’t sound good in a plain text editor, this means it isn’t good and you have to work further on it.

When it comes to writing, I use a Markdown-compatible text editor and my favorite one right now is ByWord. I already wrote about markdown, a language so simple, flexible and easy to learn that only a genius could have invented it. There’s a plenty of markdown compatible text editors and you don’t even need to use markdown when writing for Sandvox. As a matter of fact, I suggest you don’t!

Markdown editors have some specific features that come very handy, though. For example, here is why I love ByWord:

  1. Full-screen, distraction-free mode.
  2. Very nice typography, optimal readability.
  3. iOS companion apps, with iCloud or Dropbox sync.
  4. Many exporting options, including of course html and rtf.
  5. Markdown rendering and preview look both good.

If you’re writing for Sandvox, I suggest you to use just plain text: no markdown, no formatting at all. Enjoy the editing features of ByWord, but stick to plain text: then select all your content, paste it into Sandvox and then add your formatting there.

This because you risk to carry with you an unneeded ton of hidden code that can create some trouble later.

Moreover, emphasis (bold, italic…) needs to be checked along all the other elements of the presentation, there’s no point in adding it previously.

If otherwise you’re a power-user and you plan to add html-enriched text (as in a RAW HTML object, for example), you will have fun writing all your stuff and then exporting or copying to html with one click. Easy and fast.

This post, by the way, was written in ByWord.

Images: photos

GraphicConverterPictures are a very important part of a web page: they add value, improve content delivery, make long posts readable allowing the eye to rest and wander around while keeping the reader focused. You have to choose the right image, the right size, the right positioning… many choices here and most of them will depend – again – on your skills and your taste.

One thing that is sure, though, is that images can be heavy and long loading times are bad for your visitor. Sandvox usually optimizes them so you shouldn’t worry too much, but if you want more control or you need to crop, resize, modify a picture, a graphic application is what you need. Many basic operations can be performed by Preview, but the result isn’t often the best you can have.

The swiss-knife for images is – has always been – GraphicConverter. Don’t expect anything like Photoshop: if you need retouching maybe Pixelmator is what to look for. Here is why I use GraphicConverter since version 1:

  1. It opens in a blink. This could seem not so important but – believe me – it is. Try and see the difference when you need to work with images often.
  2. In more than ten years I paid for an upgrade just a couple of times. In the meantime it used to support 68k, PowerPC, Intel 32bit and 64bit. This is very fair to the customer. Now GraphicConverter is on the AppStore, so future updates will likely be free undefinitely.
  3. It creates the highest quality JPGs with the smallest footprint I’ve seen so far. You have full control of what goes online, including EXIF data and metadata. You can strip them all away, save bits and protect your personal information. And, again, it is fast.
  4. It can open virtually any graphic file ever created on any platform. And export to most of the same formats as well, including .ico for your website’s favicon.
  5. Tons of other options for the power user.

Images: vectors and graphics

SketchIf you work with photos, JPG (with 80% compression) is probably the only option you have for creating good quality and reasonably small files.

If you create an image from scratch, though, your workflow could be pretty different. Logos, drawings, graphically enriched text need a vector application (maybe it’s time for a short disclosure: at this point you may have noticed that I’m a Photoshop-hater and that I’m not even considering any Adobe product at any point).

I used Fireworks (when it still was a Macromedia product) for my first designs. I was pretty happy with it, but the complete lack of alternatives offered me no choice. Adobe still supports Fireworks but it will not updated anymore – and this is good news because it let a new standard grow up. I now work exclusively with Sketch. This is why I love Sketch (this program is probably intended for expert users):

  1. Clean and basic interface: still, very powerful tools.
  2. Very good export options: PNG, SVG, PNG @2x (good for retina screens); PNGs are highly optimized.
  3. Export to CSS: draw your object and apply its formatting to an HTML object via CSS code: no graphics!
  4. .sketch files are becoming fast a new stadard taking over Fireworks, you can find plenty of examples online.

When you’re done with your exported PNG, check its size: if it’s too large you can squeeze it a bit with ImageAlpha and ImageOptim.

As a rule of thumb, photos should be saved as JPG, graphics often perform better as PNG. Graphics with many blurs, shadows may or may not be smaller when saved as JPG, but JPGs usually degrade the quality of linear, long gradients (there’s a way to avoid this, but it overrides the goal of this post). The best way is to try and see. SVGs are for developer’s eyes only…

Coding

TextMateIf you’re an expert user, sooner or later you’ll find yourself coding. Working with two lines of code is no big deal, but when your code starts to grow a text editing program with syntax highlight comes very handy. And again there’s a lot of choice.

My favorite is TextMate 1.x, but probably this is not what I should suggest to a new user. TextMate development struggled for a while and now TextMate 2 is an open source project, unfortunately still in alpha. It is absolutely usable (I’d rather call it a beta at an advanced stage of development) and it’s free, so you can give it a try. I myself will stick to TextMate 1.x as long as I can.

Valid alternatives are TextWrangler or, if you’re a geek, SublimeText. The former is free and for a Sandvox user the only features to look for are CSS color syntax and a nice theme (I use “Tomorrow Night” for TextMate).

Remote file manager

TransmitSandvox takes care of uploading your website, we all know this. But sometimes things go weird and you need more control of what’s happening. Or your hosting space is limited and you want to get the rid of unneeded files.

Let Sandvox do the daily job, but be prepared to emergencies with an FTP application. My choice goes to Transmit because of its friendly (enough) interface and very good performance. Since you will be using this kind of program rarely (hopefully), you can look for a free alternative like Cyberduck.

If you configured Sandvox for uploading your files remotely, configuring an FTP client shouldn’t be a problem. Once you’re connected, you will see all the remote files, download them to your Mac, inspect them, even modify them remotely and, of course, delete them. In case of problems you can wipe out all your files and re-upload your website from Sandvox.

Please be aware that this can cause trouble – don’t do anything if you’re not sure about what you are actually doing! Don’t say I didn’t warn you.

Some extras

Here are some uncategorized apps worthy of note.

SkitchSkitch is a very useful app to take quick screenshots and notes from the web or from your screen. You can add text, arrows, circles and rectangles, then save the image locally or remotely for sharing.

I strongly suggest you to use Skitch if you need to send a screenshot when looking for technical support here at BehindTheRabbit (support form doesn’t allow attachments, but a screenshot may be required via a subsequent e-mail).

CodeBox is a nice and powerful snippet collector. If you deal with code injections a lot, US$9.99 for this little treasure may be an affordable price. It allows you to save snippets with colored syntax, store them on Dropbox, paste them into any application via a handy menu item that works even if the app is closed.

Parallels Desktop and VMWare Fusion are the most common virtual machines for running Windows on your Mac, but if you just need to check how your website looks on Internet Explorer maybe you don’t need super-optimized performance and yearly and costly updates. Did you know there’s a virtual machine available for free? Made by Oracle (and previously Sun)? It’s VirtualBox.

One last note: the best app comes right with your Mac: it’s Time Machine. No matter how good or bad is your website: once it’s lost, it’s lost for good. Always keep a backup copy of your Sandvox files (and designs). Always! If you can afford a dedicated external drive, use Time Machine; otherwise remember to put a copy on Dropbox, on an USB key, on a backup disk, wherever. Macs are very reliable, so reliable that sometimes we forgot they are just machines. And machines break.

Conclusion

Most of these applications are available as free trials, so give them a look before you buy them (don’t put the blame on me if you’re not satisfied!).

This is just part of my workflow, yours can be pretty different; it’s like shoes: they need to fit you and you have to like them, each of us has his own feet and his own taste.

Moreover, this is just a selection of one app in each category. Sometimes the choice is limited (I don’t think there’s anything comparable to Sketch, for example); other times (as for markdown editors) the choice is so vast it can be confusing. Take your time to look around!

Happy 2014!