Invisible Titles

Here's a simple technique for web developers wanting alternate text for background images. Why would you want this? Well background images often disappear, for example when stylesheets fail to load, or are over ridden by a user with poor eyesight. To make sure the page still makes sense in these situations, put the following CSS in the sheet that contains the linked background image urls;

    .invisibletitle {display: none;}
@media print {
    .invisibletitle {display:block;}
}
@media aural {
    .invisibletitle {display:block;}
}

Then class="invisibletitle" can be applied to tags around alternate text in the html, making the text invisible whenever background images are visible, yet visible/readable when background images are missing or ignored. I said it was simple!

Example: www.destiny-dubai.co.uk/holdingpage.htm
Do a print preview, or turn off stylesheets, to see the invisible titles appear.