Control Browser Cache And Cookies With HTML
- Posted by - Ahtasham Khan
- On -
Caching and cookies are two methods browsers employ to save data regarding a certain website. Caching is used to store some web page data locally for faster loading on each subsequent revisit, whereas cookies are small pieces of data containing important user information for a website. Not many webmasters know or use this, but you can actually use just HTML meta tags to control cookies and browser caching for your website!
Meta Tags are used to store pieces of information on a web page. Essentially, it is information about data, and its purpose is for browsers and search engines to understand and know the page better.
When you visit a webpage, your browser stores it in its cache so as to make reloading faster. Sometimes, cache errors cause the browser to load an older version of a page, even when new content is available. To prevent this, you can simply disable browser cache from time to time by using some meta tags. Here’s what you can do.
<meta http-equiv="Cache-Control" content="no-store" />
This meta tag is recognized in Firefox, Chrome, and Internet Explorer. Even more so in IE, where you can use more values and specifications to disable caching, as follows.
<meta http-equiv="Cache-Control" content="no-cache" /> <meta http-equiv="Pragma" content="no-cache" />
You can also set an expiration date to ensure that the browser will show the file that’s fresh from the server, rather than from the cache.
<meta http-equiv="expires" content="Fri, 18 Jul 2014 1:00:00 GMT" />
How to set cookies?
Cookies are small files stored on your browser that contain important user information, such as user and password. Websites may reuse the cookies to tailor some functionality. For example when you shop in an online store, as long as you have not yet checked out, the items remain in your cart even though you have left the browser for several days.
Here’s the tag for setting a cookie;
<meta http-equiv="Set-Cookie" content="name=data; path=path; expires=Day, DD-MMM-YY HH:MM:SS ZONE">
name=data is the name of the cookies which determines the values set in it. path is the path of document. Whereas, the value of expired indicates the time and date when cookies are deleted from your computer. If you leave the expired date empty, the cookies will be deleted once you quit the browser. Here is a an example cookie that will expire at the end of this year;
<meta http-equiv="Set-Cookie" content="name=data; path=path; expires=Thursday, 01-Jan-2015 00:00:00 GMT">
Got any questions? Let me know in the comments section below!
Share your thoughts
CEO at Ingenious Gurus
An Author & Coding Guru from Sufism City of Pakistan with more than 13 years of experience in developing Web applications. CRM Solutions, Database Design, Analysis and Expert in Linux Server Security.
Latest posts by Ahtasham Khan (see all)
- Best 2020 Tips for Boosting the Speed of your Shopify Website - September 3, 2020
- Secure WordPress in Easy Steps - July 18, 2020
- Top 5 Blog Niches That Make Money in 2020 - July 4, 2020