Alexis Ulrich is a full-stack web developer based in Paris, France. He is interested in the way content can be created, optimized, used and shared on the web. When not working on his pet sites (languagesandnumbers.com and mancko.com), he shares his MOOC experiences on web-technos.blogspot.com.

Alexis's articles

  1. Using Data Journalism to Generate Content Ideas

    Strictly speaking, data journalism is about telling stories with numbers.

    But let’s use a wider definition in this article, as for me the data used to tell a story can take many faces, including mere facts (historical, biographical, geographical) and different multimedia supports (interviews, photo reports, video footages). The idea here is to give you a broad view of what data journalism is and how you can use its lens to get great content ideas.

    Identifying Data

    The first step is to identify the data you can use. But before that, you will have to define your needs.

    What topic do you want to cover? Are you following a seasonal trend (fashion week, movie premiere, holidays), or do you want to cover your field with content that does not change through time, aka cold content (dog breeds, recipes)?

    Whereas cold content data is easy to find online and can make great long tail content, warmer content is tougher to obtain. You have to be aware of any news event in your field, and to be ready to act as fast as possible with many competitors doing the same thing at the same time.

    Once you have identified the kind of data you are looking for, you need to put your hand on it.

    Open data is a great way to get free data that has been gathered by governmental organisations. Data Catalogs is a good starting point for your search. This site provides open data sources for a number of countries.

    For example, let’s say you are interested in Queensland oral health services. You can get a monthly extract of statistics about waiting list per clinic. Likewise, you can get crime statistics for incidents in Washington, DC.

    These open data catalogs are a good source when you are looking for specific data. But you can also browse them to get new ideas of content. When surfing through open data sites, it is important to keep an open mind: you can dig some completely unrelated data and find a new edge about your content.

    For instance, flipping through the US Social Security dataset can inspire you some ideas, like babies named from movies or TV shows, from celebrities, for specific countries or periods of time. You can correlate this data with movies premieres or sport events in the news to add some depth to it.

    The Google Books n-gram viewer is a great tool to visualize words appearing in books for a specific period of time and a given language.

  2. Faster YouTube Embeds with JavaScript

    We want our visitors to get our content as fast as possible, which means the content needs to be light, and with the minimum number of requests. But we want to keep users on our pages, and be entertained. This is where embedding videos enters the scene.

    Videos illustrate our textual content, bring life to it, and are often served by a third party. What more to ask? Well, there’s a hidden price tag: Videos are slow and heavy to download, even when the visitor is not watching them.

    One simple video on a page called through an innocuous iframe can add up to 6 HTTP requests and as much as 450kb of content. The solution I’m proposing in this article can reduce those numbers to 1 request and about 50kb per video, along with a few bytes of JavaScript (on top of the jQuery library if you don’t like vanilla flavor).

    And you know what? This solution is not new. It was previously proposed by Amit Agarwal in April 2013.

    So, What’s the Trick?

    In Amit’s solution, the DOM is parsed by JavaScript on document load, and each call to a YouTube video (through a special div, not a regular iframe) is replaced by a thumbnail preview to which is attached the iframe when clicking on it.

    This way, we get a nice preview thumbnail still served by a third-party server that’s a fraction of the weight of the full video player. The video player is loaded only when the video is actually viewed.

    My Little Added Value

    I rewrote Amit’s code in plain JavaScript and with jQuery for those interested. I kept the original comments in the code to keep it as understandable as possible. My version adds a new feature in the HTML5 data parameter that enables you to add any parameter to the YouTube URL to customize your video.

    YouTube offers a list of parameters to show and hide controls, branding, and info, and to set the video quality or the starting frame of your video (among other things).

    • controls: set this to 0, and the layer controls are not displayed on the video player.
    • modestbranding: set this to 1, and the YouTube logo disappears from the control bar.
    • rel: set this to 0, and no related videos will be shown when the playback of the initial video ends.
    • showinfo: set this to 0, and the player will not display information like the video title and uploader before the video starts playing.
    • start: set this to a number of seconds, and the player begins playing the video from this time (or rather from the closest keyframe).
    • vq: set this to the wanted video quality, if supported (e.g.: hd720 when high quality is available)

    When adding the YouTube iframe on the click event, some parameters are given values, namely autoplay (we want the video to start as soon as its thumbnail is clicked) and autohide (to hide the video progress bar and the player controls when no interaction is detected).