Archive for 'html'

Watch people browsing your site

watch and record web visitors

Clicktale says it will record your visitor’s browsing sessions and allow you to watch them later as if you were standing over their shoulder while they browsed. It also provides you with ‘Heatmaps’ showing where most people click and how far down the page they scroll.

As with all web analytics, you need to add a few lines of code to each web page. The site claims the code only adds 10k to the page for the user and a 2k upload per page so it shouldn’t slow down their browsing, nor will they notice any difference.

If you’ve ever wished you could focus-test your website and watch how people use it; this sounds like the closest you can get for free. The free version lets you view 100 random recordings per week on a maximum of 2 domains.

I haven’t tried it yet but I plan to try the free version, I’ll let you know what I think once I’ve tried it, I am curious to see whether it will show any substantial visitors.

Link

HTML Playground

html playground 2

Html Playground is a fun free web tool to test html tags. It’s also a great way to learn about Html tags and their attribute while trying them out live. Modify the code and watch it update in real time

html playground[4]

Link

Sortable table script

A quick sortable table script written in Javascript by Terrill Dent. Download the code for free. Includes instructions on implementing and modifying the code.

Sortable table code

Link

Beautiful HTML

what HTML should look like

Have a look here to get a breakdown of what your HTML code should look like. It’s not about looks it’s really about what useful functioning code looks like

Link.

Generate a CSS menu online

csss menu generator

Simply enter the number of items in your menu, which page they should link to and this web tool writes the code for you. You can generate horizontal, vertical or drop-down menus in a variety of styles. When you are finished you download one zip file containing the css, html and images as well as instructions.

csss menu generator

Link

Create a favourites icon

Often neglected by web designers, favicons are those little images that show up in the address bar, the tab next to the website name and also in your favourites list. Here’s a web tool that will create a favicon for you automatically from an image of your choice.

favicon maker

To add it to your site you need to add the following code to your page header Somewhere between <head> and </head>

<link rel=”shortcut icon” href=”images/favicon.ico” mce_href=”images/favicon.ico”>

Link

Create thumbnail link previews

link thumbnail

This page gives you detailed instructions on how to create thumbnail popups for links on your page using javascript and CSS. You can download all the necessary files and modifiy it to suit your needs.
Link

How to create a custom 404 page

If your server doesn’t have one of those custom 404 (the error when a page is missing) error page option in the control panel, add this line to your .htaccess file

ErrorDocument 404 /error.html

Just make sure you actually create a page called error.html!

Create bubble tooltips

bubble tips Download and implement these bubble tooltips on your website.

From the site:

Installation and customization of Bubble Tooltips is quite easy. They are composed mainly of four parts:

  • A small javascript file of about 2Kb
  • A small CSS for their presentation
  • A single image in gif format for their graphics
  • Four lines of HTML in the head section of the page(s)

Link