We have a content authoring tool that creates interactive learning activities (imagine a multiple choice quiz) packaged as self contained zip files that contain an index.html css / js / media assets (inc video).

We then create customised courses (an aggregation of these learning activities) and serve them to users.

My question is can I just upload these zip files to a web CMS (with global CDN) and then serve them directly to a user via some web app that just unzips the zip file on the client and renders the content on the browser? Or will this be horribly slow?

My problem is that the content of the zip files is self-contained, so I cannot host the media components separately somewhere like S3 with a global CDN and then reference them from the HTML.

  • 2
    As long as you don't mind the recipient having a complete copy of your interactive "site," there shouldn't be a problem with it. Of course zip file size and client connectivity speed/reliability might factor into it's practicality. You don't even need an app to serve them. You could just include a link to the zipped file and let the user's browser do the downloading. You'd want to include directions as to where to unzip the package and what to click on to load the "site." – Phil N DeBlanc Sep 26 '17 at 16:47
  • 3
    Why does it have to be on the client side? Just unpack the ZIP in a folder served by a web server. – Daniele Torino Sep 27 '17 at 9:01

ePub uses a zipped format:

Ordered list of files in the OCF ZIP Container

EPUB/As You Like It.opf

The contents of the mimetype file


The contents of the META-INF/container.xml file

<?xml version="1.0"?>
<container version="1.0" xmlns="urn:oasis:names:tc:opendocument:xmlns:container">
        <rootfile full-path="EPUB/As_You_Like_It.opf"
            media-type="application/oebps-package+xml" />

and allows embedded video:

Audio or video embedded in an EPUB file should be contained in HTML5 tags, such as in the examples below:

<audio src="audio/example.mp3" />
<video src="video/example.mp4" width="640" height="480" />
<video title="Example Video" width="640" height="480" poster="images/example.jpg">
  <source src="video/example.mp4" />
  <source src="video/example.webm" />


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.