How to blog with SKITCH

I have a new love.. a tool love.. and it’s name is SKITCH.

OK.. it’s not all that new.. but my use of it is.

It’s a free app from the Mac store

This tool has helped me really crank out lots of tutorials quickly and painlessly. This is priceless when teaching outsourced resources how to complete a task or even just blogging a tutorial :)

You can also open iPhotos in SKITCH and make annotations on them and save/share, so there is lots of fun, casual uses as well.

how to blog with skitch

Here is how I use Skitch:

1. Find what I want to capture an image of.
2. Launch Skitch from my menu bar
3. Add text, arrows, boxes.. whatever your heart desires so you can explain yourself
4. Save the image: Here is where you have two options:
A. If I’m going to upload the image to WordPress: I change the name and file type to a .jpg then use the “drag” feature to drop it in a file folder.
B. If I’m adding it to a text document (like Microsoft Word or OpenOffice) I just “drag” right into the document where I want the image.

If you go the “B” route to add it to the document/email/Skype thread you want to share it with then you are done, no more steps needed.

If you go the “A” route and want to upload it to a blog, then continue with the next step:

5. Open the WordPress blog post you want to add the image to.
6. Select the “Media Upload” icon and that will pop open the “drag here” window
7. Find the file in your finder and “drag” the image into the box.
8. Once it’s done “processessing” your file, select “insert into post”
9. Save

Super simple and easy peasy. I haven’t found a quicker way to move images from SKITCH into WordPress, if you have one please share below. There you have it, how I use Skitch.



Html Color Codes


I’m not a coder, but I like to play with it and here is my cheat for adding color codes.

I am the farthest thing ever from a designer, but there are times when I just need to plug an HTML color into a WordPress theme or project I’m working on.

The HTML color codes are based on the RGB color model and stands for the three primary colors of light – Red, Green, and Blue. Note, this is different than colors for printing.

I like the simplicity of the Html Color Codes site and I find it super easy to jump to it and copy/paste what I need.

It not only gives you a quick pick for basic colors but also the color picker, shown above, that allows you to create exactly what you want. Perfect for when you are trying to match colors.

There is also a  “Web Safe Colors” reference page to show you what colors work well across all the different browsers.

Go ahead and bookmark it and happy coloring!