QuickTip : HTML5 Offline Access

Hey everybody !

This is a small tutorial on how to get an offline access on your website using HTML5 ! Meaning even when you bring the website down, your users can see your webpages !


Image via Wikipedia


Now, Shall we begin !

I have just two documents :Ā index.phpstyle.css ( just a basic example !)

We Are not going to talk about the stysheet, we don’t actually need it šŸ˜‰

Now, in the index.php I have just a basic structure Ā :

<html lang='en' manifest='cache.manifest'>
My First Caching System !
<br />

This is my first HTML5 Caching System


No Notice the “Manifest” in the html tag

It’s basicly a file named “Cache.manifest“, yes, it’s extension is .manifest
That file is going to have this structure :

# version 0.1


No, your cache.manifest Should contain all the documents names that you want to keep even whene you bring down the server in place of my index.php and style.cssfiles

Example : if you have 5 pages on your server called ‘index.php’, ‘contact.php’, ‘faq.php’, ‘about.php’, ‘register.php’ (including a stylesheet), teh your cache.manifest is going to have this structure :

# version 0.1

Notice That evry page name have it’s own line, and if you want to add some page in it, just add the file after the style.css šŸ˜‰

Now, by default, the apache server deos not know files with a “manifest” extension so, you probably gess it, An .htaccess file will solve our problem !
Creat a file named : .htaccess, and add the following
line, and save it in the same directory that you have your pages and the cache.manifest in it :

AddType text/cache-manifest manifest

Now, you’ll have an offline access to your users, cool Hun ?

The only problem is that this Method deosn’t work with IE 6, 7 And 8


Enjoy šŸ˜€


boar bristle

Related Blogs

    Leave a Reply

    You might also likeclose
    %d bloggers like this: