This page presents examples of different techniques for presenting and highlighting information on a web page.
Here are 12 examples:
Table. This enables the author to arrange data – text, images, links, forms, form fields, other tables, etc. – into rows and columns.
Fancy List. This enables the author to present a list of items and use icons instead of numbers or plain bullets to make the list look more interesting.
Highlight. This enables the author to highlight a piece of text as if a highlighter pen had been used.
Note. This enables the author to present a piece of text as a note.
Box. This enables the author to highlight an item on a page within a box.
Button. This enables the author to insert a button within a page.
Service. This enables the author to display service information, e.g. an address, a phone number or an email address.
Map. This enables the author to display a google map within a page based on a street address.
Frame. This enables the author to display an image within a picture frame.
Gallery. This enables the author to display a fixed set of images in the form of a grid. Each image within the gallery can have a hotlink associated with it.
Carousel. This enables the author to display a set of images in the form of a continuously rotating slideshow. Each image within the carousel can have a hotlink associated with it.
Slider. This enables the author to display a set of images in the form of a slideshow. Each image within the slideshow can have a hotlink associated with it.
Carousels and a Sliders are very similar. The major difference between a slider and a carousel is that a carousel never ends. When you scroll to the end it starts again, just like a real carousel.
A Table is an essential tool for placing elements such as images and sections of text into the desired position within a page.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem.
But I must explain to you how all this mistaken idea of denouncing pleasure and praising pain was born and I will give you a complete account of the system, and expound the actual teachings of the great explorer of the truth, the master-builder of human happiness.
The quick, brown fox jumps over a lazy dog. DJs flock by when MTV ax quiz prog. Junk MTV quiz graced by fox whelps. Bawds jog, flick quartz, vex nymphs. Waltz, bad nymph, for quick jigs vex! Fox nymphs grab quick-jived waltz. Brick quiz whangs jumpy veldt fox.
This is a useful way of presenting a list of items. The author can select the icon to be used from a long list of icons as well as the colour of the icon.
List item 1
List item 2
List item 3
This is a useful way of highlighting a piece of text. The author can select the colour to be used for the highlighting.
Here is some highlighted text.
This is another useful way of highlighting a piece of text. A note can have rounded corners. The author can select the text colour, the colour to be used for the background and the radius of the corners.
This is an example of a Note.
This is another useful way of highlighting a piece of text. A box has a title as well as text within the box. A box can have rounded corners. The author can select the box colour, the colour of the title and the radius of the corners.
Box Title
This is an example of a Box.
This is a useful way of adding a button to a page. A button can have an icon as well as text. A button links to the address of a web page and the page can be opened within the same window or a new window. The author can select the button’s background colour, text colour and button size as well as the type of icon and the colour of the icon (if any).
Home Page
This element makes it easy to display service information in a meaningful way. The author can select the icon to be used from a long list of icons as well as the size and colour of the icon.
This example shows a single service element.
Phone Numbers
+61 7 3345 2506 +61 7 3868 3466
This example shows 3 service elements within a table.
Phone Numbers
+61 7 3345 2506 +61 7 3868 3466
Postal Address
Hearts for Africa PO Box 8160 Sunnybank QLD 4109 Australia
Email
This is a useful way of adding a map to a page. The author can define the width and height of the map.
This is a useful way of displaying a single image within a frame.
Jayson Gillham
This is a useful way of displaying a set of images in the form of a photo gallery. The thumbnail of each image is displayed and if the user clicks on a thumbnail, the full-size image can be displayed. The author can define the width and height of each thumbnail.
