This is my Hello World blog post of sorts. It's my introduction to the world of blogging, the blog post likely only read by my family and a few techie friends. It's the post in which I make an unrealistic commitment to blog frequently, which I later fail to live up to. And it's the post in which I introduce a new form of blogging, Collapsible Blogging. Here's the tl;dr.

Hello World!

Click any part of this post to see it in condensed form.
Source is here: https://gist.github.com/3616675

Click stuff to collapse. Click again to expand.

Before we get into the details of Collapsible Blogging, let's start with that commitment to blog. Every half-baked blog has it, so here's mine. Once a month. I know my life is sufficiently not boring that something blog-worthy will come along each month. Why, just last Tuesday I ran with Tyson Mao (yeah, the Rubik's Cube guy) and had a near encounter with Top Gear's Richard Hammond (he came by Twitter while I was interning there). This post counts for September. So you'll be hearing from me next at least before Halloween's end. Here's to a happy, healthy, blogging career!

I'll blog once a month. And I like name dropping.

So, how's this whole Collapsible Blogging thing work, why is it awesome, and how can you try it out? Collapsible Blogging works well with my own internet content consumption habits, which I believe I share with many of the other Hacker News obsessed entrepreneurial spirited folks out there on the internet. Possibly you. I choose an interesting Hacker News article, I read a bit, and I quickly lose interest in favor of another well titled article. My goal is really just to consume quickly the highlights of the web. Collapsible Blogging let's me skim faster. But maybe that's a not a good thing. I'm rereading Fahrenheit 451- and there's a passage this reminds me of:

“I sometimes think drivers don’t know what grass is, or flowers, because they never see them slowly,” and

“Have you seen the two-hundred-foot-long billboards in the country beyond town? Did you know that once billboards were only twenty feet long? But cars started rushing by so quickly they had to stretch the advertising out so it would last.”

I don’t want Collapsible Blogging to be those two-hundred-foot-long billboards.

Use Collapsible Blogging to make your content easier to skim.

So with that in mind, I introduce the second use of Collapsible Blogging. Diving deeper into a topic. If you'd like to learn more about diving deeper into a topic, click this passage.

Collapsible Blogging let's people who aren't interested in the topic read quickly, while people like yourselves who want the full blog post can read more in a single click, as you just discovered.

One application of this is resumes. On my resume I list that I have experience with Java, Python, etc. An employer may care just about my lovely Python experience, but my resume doesn't go into details about each technical skill and where I've used them. If I build my resume with Collapsible Blogging, I can make it so that with a single click potential employers can learn more about my experience with just the skills that interests them. They can learn what matters to them without me cluttering my resume with every project I've ever worked on.

Likewise, say I write a blog post about my experiences at Twitter and Facebook. You might be interested in reading about the technical challenges I faced and the programming concepts I learned, while another reader might be more curious about the pool party I attended at Zuck's house. If I write my post using Collapsible Blogging, you, the reader, can choose to read about the parts of my experience that interest you most, or you can choose to just skim the collapsed form of the post.

Some paragraphs don't have collapsed forms. You can only collapse the passages with a left border. There isn't really a shorter way to say that!

If you're interested in using Collapsible Blogging yourself, it's remarkable easy. I include the source as a gist below. Each passage that I want to collapse, I give an id. Then I create an element with the same id but preceded by an underscore. The CSS below hides elements with ids starting with underscores, and the JS below uses JQuery to handle the swapping in and out of elements. If you're blogging with Tumblr, just paste the code into your theme and you're good to go! Anywhere else, it should be as simple as adding the JS and CSS to your page.

Try it. You'll like it.

Inspired to try blogging by a few of my friends: Dan Kang and Harvest Zhang. Thanks guys! Keep on writing!

Discuss on hacker news.