Trying to Display Links the way Facebook Does

So you're building a new app and you want to elegantly display a link for a user. Ideally, you do something like what Facebook/LinkedIn/etc does so the user can see what they may be getting themselves into before clicking the link. Great, we know what we want, so how do we pull it off? Its a simple problem with a solution that can be very simple when dealing with well established websites... just use the tags the authors setup for SEO purposes (meta or OpenGraph). That said, you'll quickly start to discover that there is a long tail of sites that do not maintain these tags so you need to parse the HTML on the page... and thats only the beginning of your troubles: think client side rendered sites, alternate encodings, the list builds up quickly.

A bit of background

I personally ran into this problem about 3 years ago when building an app that would allow marketers to very deliberately post content across multiple social networks. Marketers, being marketers and all, care very deeply about how their entire message reads and looks. The text of the message is fairly straight forward and leaves no room for interpretation by the various networks but links to external websites are a beast of a different color. I needed to allow my users to have full control over how the link would be displayed. Rather than have the users of my app type out the title, description, and upload a logo for the link they are sharing I decided to build something to get a best guess at that information and allow them to edit it.

OpenGraph.io was born

OpenGraph.io is quite simple. First it looks for OpenGraph tags (it's not just a clever name). Next it will parse the HTML on a page to attempt to guess what the tags probably should be. The API then returns the raw results of what was parsed from the page, the OpenGraph content, and a hybrid of both -- defaulting to the OpenGraph tags when available. Being a good developer, I knew I should separate the service from my main application so I decided to build this solution as a micro-service. Upon further thought, I realized I was probably not the only one with this issue so I decided to make it a proper offering.

How it all ended up

How the initial app I was building ended up displaying links to marketers Running off and building a separate product to complete another product is the definition of "shiny object syndrome" but in the end it paid off. Building the first version of OpenGraph only took a couple days before kicking me back into the initial project. Since then it has required fairly constant attention, and still does, to deal with edge cases along the long tail of random websites but the service is proving to be quite valuable. Ironically, it seems clear now that OpenGraph.io will end up being more valuable than the initial project that inspired it. Goes to show that in the entrepreneurial world, sometimes, you just need to go with the flow.