Easily Create a Javascript Console in Sublime Text

I've been spending a lot of time learning Javascript lately over at Code School. As a very hands-on learner, I needed a fast and elegant way to write the code and view the console output at the same time, preferably within a native application. Sublime Text to the rescue! Take a peek at the result:


Bookmarklet for Google Page Speed Insights

Google Page Speed Logo 100px
Getting tired of having to fire up Chrome every time you want to run PageSpeed Insights because Google hasn't created an extension for your favorite browser? Have no fear, a universal bookmarklet is here! Just drag the link you want to your bookmarks bar.

To launch PageSpeed Insights in a new tab with the current page's URL:
→ Run PageSpeed

To launch PageSpeed Insights in the current tab with the page's URL:
→ Run PageSpeed

You are most welcome.


How To: Associate a Custom Folder Extension with an App (Mac OSX)

I was recently looking for a simple notebook app that was centered around Markdown. Unfortunately, I couldn't find one that fit my requirements. When I was listing what I would like to see in a Markdown notebook app, it struck me that all I wanted was included in many text editors: Good syntax support, and a folder/file structure in a sidebar with a simple interface.

However, I wanted a document/package based system, not a file based method of storage. I wanted the notes to be held in containers distributed throughout my project folders, and when those containers were opened, it would launch the app which would list the notes. Lo and behold, it can be done!


Responsive Imagery

One of the most important thoughts behind responsive websites is that they should be usable and look great on all devices without having to serve up a different website version. This means that you are considering all your users and their goals, not just a select group of desktop dwellers.

Today we will be looking at optimizing your images for responsive websites built in Freeway Pro.


Introducing Backdraft!

It is my most absolute pleasure to introduce what was an almost top-secret project for the last month.

Backdraft has arrived, and is the first ever fully-responsive, HTML5 and CSS3 compliant, zoom-friendly, module-based template for Freeway Pro 6. You can view and purchase it on its website here.

If you do decide to purchase Backdraft, you get lifetime support and updates in addition to helping push forward responsive development in Freeway.

If you have any questions, drop me a line at caleb@onrampwebdesign.com or comment below!

Thanks for your support of this project,
Caleb Grove


Backdraft; A Responsive Template

If you've been watching over at FreewayTalk, you might have noticed that I've been fairly absent lately. If you had been really paying attention, you should have already seen what I'm posting today.


Flexible Image and IE

I was working on a top-secret project when I struck a conundrum. You see, I needed a flexible-width image that would work in all browsers.

The typical method of achieving this is the either use the Flexible Image action by Softpress, or to open the extended dialog and enter this:
These seem fine and dandy: Safari, Chrome, and Firefox on a Mac? Check. Chrome and Firefox on Windows 7? Check. IE8 and IE9 on Windows 7? Uh...Not cool.


Creating a 404 Error Page with Freeway

Default 404 Error Page
Nothing's worse than following a link to a website and finding your browsers default 404 page. From a UX perspective, those pages are evil. It's bad enough that the page doesn't exist, but there is no easy way for the visitor to try and find the page they were looking for, or even navigate to your home page!

Create a custom 404 error page with Freeway is really easy, so let's get started:


Quick Tip: FreewaySearch + Alfred

Want an even faster way to search FreewaySearch? Quick-search it from Alfred by clicking on the link below!


FreewaySearch; The Better Way

In my early days of using Freeway, I had lots of questions, which meant I spent the majority of my time searching for answers. Answer-hunting was not very easy, as Freeway's documentation is spread across the web in small bits and pieces.

You have the "official" documentation in the Using Freeway and Freeway Reference guides but this required opening the PDF's and searching, which was FAR too much work for my taste. Of course, you could just Google it! However, this too did not work well either. (Imagine the results for "Freeway Rollover"!). Then, you have the wonderful Freewaytalk which, sadly, lacks a good search feature, as you get flooded in the results with tons of re: to each thread. In addition, there are lots of other tidbits of information scattered across the webosphere.

Then, I had an idea…

I'm Caleb Grove

Yep, that's me. I'm a 17 year old web unicorn and own OnRamp Web Design. My skill base is quite broad, though my real focus lies in UX and UI design for the web. When it comes to designs, I'm a perfectionist, scooting 1 pixel at a time.

My main blog captures all my web-related thoughts that exceed 140 characters. Anson S is my personal blog, where I pander in politics and religion. You can tweet me on Twitter at @SirCalebGrove, circle me on , or friend me on Facebook.

About this site

This is my playground. CalebGrove.com harnesses the power of HTML5 and CSS3. It was built using my web design weapon of choice, Freeway Pro, using a inline flexible system. Responsiveness was hand-coded. The blogs are hosted by Blogger, whose template code was generated by the Blogger actions. Website hosted by GJX Hosting. Creativity provided a disturbed mind, and not much else.

No unicorns where harmed in the making of this website, except through caffeine overdose.