Koken provides basic support for video uploading and web site playback. This tutorial will explain how Koken handles video plus a few tips for encoding them on your desktop.
Videos are uploaded to the Library the same way images are. Click “Upload” in the main navigation, then drag and drop videos into the marked area or click the “Choose…” button to select a file from your desktop. Koken will then generate a thumbnail for each video.
Videos are displayed on your site using the MediaElement video player. The player is used for uploaded videos in essays in addition to videos rendered in templates using the tag. You may append your own custom CSS if you’d like to change the style of the player.
When videos are viewed on mobile devices the original video file is sent directly to the device. This allows videos to be played-back using the native controls of the device.
All videos uploaded to Koken need to be encoded using an MP4 container and the H.264 video codec. This is pretty much the standard for video playback on the web today. Nearly all desktop browsers and mobile devices support the codec, and even if they don’t, the aforementioned MediaElement player will render the video using the Flash Player plugin for consistent video playback everywhere.
To create an H.264 video we recommend using HandBrake. The software is free and compatible with both Mac OS X and Windows. We could explain how to use HandBrake to create H.264 videos, but developer Mark Pilgrim has an excellent walkthrough in his Dive into HTML5 guide: Encoding H.264 Video with HandBrake. We recommend checking that out if you need assistance encoding a video.
Second option: Vimeo
If you’d rather not encode and publish and your own videos you may upload videos to Vimeo then import them to the Koken Library using the Vimeo Import plugin. The videos will look and feel just like an uploaded video, yet are hosted by Vimeo and published to your site using the Vimeo HTML5 video player.