Welcome to the brand new Stry.us. (Here’s how this thing works.)

With the re-launch of Stry.us, here’s our big goal: Tell great stories, and present them in a beautiful way. This new website is the first step towards that.

story by Dan Oshinsky / photos by Dan Oshinsky
published April 11, 2012

The original Stry.us logo -- and offices

(Above) The original Stry.us logo — and offices. This was before the money came.

Two years ago, I did something that was a whole lot of crazy: I picked up my life and moved to Biloxi, Miss., to write about the five-year anniversary of Hurricane Katrina.

So in the process of all that, I didn’t spend a ton of time building the Stry.us website. I bought the domain, installed WordPress as my content management system (CMS) and added a theme that I bought for $20. I made the original Stry logo — the license plate — myself.

But when I started to position Stry for a re-launch this Spring, I wanted something better. I was inspired by something the team at Once Magazine put together:

YouTube Preview Image

I love that. Create content that makes people stop and stare.

So Stry.us 2.0 came around with a big goal on the design side: Let’s present great stories in a beautiful way.

That’s where this website comes in. It’s eight months in the making now. The amazing team at Sparkbox in Dayton, Ohio, spent hours pouring over the code and getting it online.

And finally, you get to get your hands on it.

The exciting stuff:

1.

This site is responsively designed. What that means is that no matter the size of your screen — whether you’re looking at the site on your phone, or an iPad, or a 30-inch monitor — the site will automatically respond to the size of that screen and present the stories in a way that best fits that screen.

Here’s what I mean: Go to the bottom right corner of your window. Grab the corner of your screen and drag it left. Shrink the screen. And watch how the content moves around. It’s magic, right?

I’m thrilled to say that Stry.us is one of the first websites anywhere — and certainly one of the first news sites to use such a design. I think responsive is a game changer for the web, and I hope the experience on this new site proves why.

2.

The site was built with WordPress as the CMS. So my new reporters don’t have to re-learn some custom CMS, and we get to utilize all the amazing plugins that WordPress has to offer. Sweet!

3.

You’ll notice a “Save This Story For Later” set of links on the side of each story. I love longform storytelling, but I don’t always have time for it right at the moment a story shows up in my Twitter feed or my inbox. So I highly recommend signing up for Instapaper, Read It Later or Readability. All three are essentially a DVR for your reading list. (You can save to Instapaper or Read It Later directly from stry.us. Readability’s API didn’t make a text-based link possible, so you’ll need to install their browser plugin to save our stories to there.)

4.

You’ll also notice that some stories have footnotes built in. Just click the number in the body of the text, and it’ll send you to the footnote. The return arrow will send you back. On laptops and desktops, the footnote also lines up alongside the location of the footnote of the story. That nifty little feature is powered by a bit of custom Javascript the Sparkbox team worked up.

5.

On the editorial side, we want to show you how what’s happening in our stories is connected to what we’re seeing elsewhere. So on some stories, you’ll see a list titled “Background Links.” These are stories we’re seeing from around the web — not on our site — on the same topic. These are hand-picked links by the Stry.us team.

And that’s our website. If you notice something broken with the site — a bad link, or a bug in our code — send me an email at dan@stry.us. I want to know about it.

If you just really like the website, email me as well. (If you hate it, email the Sparkbox guys. All bad ideas/design flaws were their doing.)