|
Home | Uniquely NZ | Travel |
|
| Web Site Design Using Cookies in Web pages |
Why use Cookies and JavaScript
As most visitors will have realised before reaching these pages I am not a fan of anything which makes it more difficult for the visitor or search engines in any way - sites should be clear, easy to navigate and fast. JavaScript and Cookies enable one to do some things in a better way than is possible with HTML alone but there is a considerable price to pay. Facilities are supported in different ways by different browsers and in some useful cases they are so lacking in compatibility that the only way is to try to work out the type and version of browser in use. I am therefore very restrictive in my use of JavaScript, especially as some used turn it off. The main use I make is in the provision of Popup Windows for larger pictures when one clicks on an icon. It is virtually impossible to handle pictures well without Popup and hence JavaScript - many sites leave no way out other than the back button when displaying larger pictures!
Cookies are even more hated by many users who do not understand their purpose and mistrust them but again they have a real use. HTML and JavaScript originally had no way of holding onto information and passing it between pages or using it in multiple pages. This was deliberate decision to ensure confidetiallity and security when changing from one web site to another. It was quickly realised that this was too restrictive and the Cookie (Magic Cookie) was added to JavaScript. It holds information whilst you are visiting a site and is only accessible to pages on that site. They can be restricted to the life of the Browser Session and stored in mememory or they can be given an expiry date and stored on disk so they can be accessed again when the site is visited.
Both forms are useful - they allow a message to be displayed the first time the site is visited or a page is used rather than frustrating the user by repeating it every time. In the the less persistent form they can be used to pass information to a popup Window such as the Title to be displayed and the Picture to be shown. There are some other mechanisms which will do that for simple images but they break down for Embedded functions such as video.
Legal Implications of using cookies
The concerns over cookies and the blatant misuse of them by some to track users by using what are known as third party cookies has led to EU (and other) legislation to ensure that users are informed and, with some exceptions, have to agree to their use and that the sites have to have a clear privacy policy. The way we use them ourselves means that we were, and arguably still are, covered by the exceptions for all passive use of our site. Where users actively give feedback and comments we have always consider they are giving implicit consent to our use of the information and the tools to gather it from them.
The situation is changing as we make the web site more responsive and look to extend the techniques we use. We are making our Cookies and Privacy Policy more explicit and are doing trials (September 2015) prior to implementing a consent mechanism involving the display of a banner the first time the site is visited - this page is one of the trial pages!
Another major issue is the use of cookies by software provided by others. We have avoided the use of analytic software by, for example, Google but we did implement a blog using Wordpress and that does use cookies but only when comments are made. These changes will certainly be needed if we ever use embedded videos from, for example, Youtube.
How Cookies are implemented technically on our web site
I am not going to explain exactly how the information is stored within Cookies and retrieved from Cookies - it is perhaps helpful to know that lots of values can be stored within the single Cookie which JavaScript provides. There is information in books such as Special Edition - Using JavaScript by Paul McFedries and on a number of Web Sites. There are a number of JavaScript Functions in the public domain which allow lots of variables to be simply stored and accessed from a Cookie but none did exactly what I wanted and/or were sufficiently independent of JavaScript/Browser versions - most sought elegance at the expense of independence. The following functions which I have written may be less elegant but should be effective over a wide range of browsers and JavaScript versions from 1.0 onwards.
The setCookie() function allows one to simply chose a "per-session" or set a lifetime for a "persistent" name and value pair in the Cookie. It also allows one to delete a "persistent" name from the Cookie when you have finished with it. It can also take an optional path parameter to allow access in all directories on the site rather than the be restricted to the directory and sub directory below where it was set. The getCookie function handles all the complicated activities and returns the value when called with the name. It is confusing that cookie is usually used to refer to the particular "name and associated value" within the single Magic Cookie associated with the Site being visited at the time. I make no promises but you are welcome to use the code below for setCookie() and getCookie() can be cut and pasted into the Head section of the page preferably with the acknowledgement.
<script>
/* Call function as setCookie("cookiename" , cookievalue, lifetime, cookiepath)
with the lifetime required in days, -1 to delete a cookie or zero
for a temporary cookie. The Cookie Path is optional.*/
function setCookie(cookie_name, cookie_value, cookie_life, cookie_path) {
var today = new Date()
var expiry = new Date(today.getTime() + cookie_life * 24*60*60*1000)
if (cookie_value != null && cookie_value != ""){
var cookie_string =cookie_name + "=" + escape(cookie_value)
if(cookie_life){ cookie_string += "; expires=" + expiry.toGMTString()}
if(cookie_path){ cookie_string += "; path=" + cookie_path}
document.cookie = cookie_string
}
} // Based on JavaScript provided by Peter Curtis at www.pcurtis.com
/* Call function as getCookie("cookiename") It returns the value of a cookie
if set or null. Beware of potential ambiguities in names of cookies -
getCookie is simple and will match the end of a string so xyname
will also be matched by yname and ame. */
function getCookie(name) {
var index = document.cookie.indexOf(name + "=")
if (index == -1) { return null}
index = document.cookie.indexOf("=", index) + 1
var end_string = document.cookie.indexOf(";", index)
if (end_string == -1) { end_string = document.cookie.length }
return unescape(document.cookie.substring(index, end_string))
} // Based on JavaScript provided by Peter Curtis at www.pcurtis.com
</script>
One very useful thing to know is that you can see the cookies that a page has set at any time in almost every modern browser by typing the following line in your browsers location bar.
JavaScript:alert(document.cookie)
Try this on commercial sites and see what they are storing (unfortunately it does not tell you if it is persistent between sessions)
If you use Firefox there is a useful extension to view and control cookies called View Cookies which can be found at http://www.bitstorm.org/extensions/view-cookies/ or via the built in add-ons facilities.
