Footnotes:
This is a demo page showing the basic functionality of the Easy Footnotes for Web Pages (Accessibility friendly) system.
Note that in the CSS there are media query sections for settings for printing, you can try printing in both basic and prettifried modes.
(Updated 31 Mar 2024)
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc semper libero sapien, id facilisis turpis efficitur mattis. Etiam tempus sem elit, sed hendrerit diam eleifend in. Sed in lorem ut ex iaculis blandit. Nam condimentum vitae quam sed mattis. Pellentesque sodales dolor ut nisl elementum, nec convallis nibh fringilla. Nullam eu eros a velit cursus rhoncus. Praesent sit amet dapibus justo. Proin tincidunt tellus justo, vel commodo arcu tincidunt vitae. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Cras viverra elementum augue sit amet ullamcorper.
Footnotes (Footnote: A footnote is a note that is inserted at the end of a page, after the main material. For more information, see http://www.plagiarism.org/citing-sources/what-are-footnotes.) can be a very useful adjunct to written material, allowing a reader to skip past details, but at the same time allowing the reader to view those details (Footnote: The details are such as to be not of sufficient interest to most readers that it should be an integral part of the text.) if they wish. Traditionally, footnotes are indicated by a number enclosed in square brackets, (Footnote: We refer in this page to these as “footnote references”.) with the actual footnotes appearing at the bottom of the page. The references to the footnotes are numbered in the order in which they appear in a page, and the footnotes themselves at the bottom of the page also follow the same order.
Footnotes:
Suspendisse sollicitudin libero congue quam dignissim consequat. Vestibulum tempus non nisl ac venenatis. Praesent pellentesque blandit dui, nec vulputate nunc tempus non. (Footnote: Like this ! This is simply a long footnote which has been put here to demonstrate this footnote system. Please understand that many of the footnotes have been inserted on this page principally for demonstration purposes !) Integer ut justo ut mi mattis auctor. Vestibulum quis convallis elit, tincidunt ultricies massa. Proin placerat ornare urna mattis lacinia. Nullam sed metus molestie, sagittis felis vel, consequat mi.
Pellentesque mattis luctus turpis, eu rhoncus nibh rhoncus ac. Pellentesque ac sem sodales, elementum elit feugiat, vestibulum arcu. Donec blandit interdum magna, ut lacinia felis faucibus sit amet. Ut ac viverra magna. Donec vel ullamcorper ipsum. Etiam condimentum, elit pulvinar gravida pretium, ante nunc auctor justo, vel imperdiet augue libero porta sem. Donec et nibh felis. Maecenas varius nibh a massa rutrum, vitae venenatis est fermentum. Duis venenatis in quam eu finibus. Aliquam tristique scelerisque faucibus. Suspendisse diam turpis, porttitor eu diam ac, pharetra finibus libero. Donec orci felis, ornare efficitur fermentum dignissim, ornare vitae nisi. (Footnote: This footnote is referenced by the first of two immediately consecutive footnote reference numbers.) (Footnote: This footnote is the second of two immediately consecutive footnote reference numbers.)
Nam quis urna sit amet nulla aliquet gravida ac sed orci. Etiam sagittis vitae nisl ac lacinia. Sed non nunc elementum, dapibus leo id, luctus elit. Sed et maximus felis. Aenean ultricies orci laoreet, fermentum elit eu, mollis ipsum. Vestibulum id lectus eget dui rhoncus fermentum et bibendum lacus. Sed sollicitudin lectus eros, eu tincidunt elit ullamcorper ac. Integer pharetra euismod magna, eget tempus odio suscipit eu. Curabitur rutrum metus urna, nec fringilla eros posuere ut. Nulla lobortis eros euismod iaculis rutrum. Aliquam egestas tincidunt libero, nec efficitur metus consequat eu. Donec euismod vel eros a dictum. Aenean ultrices risus ac aliquet varius.
Nam nibh orci, auctor quis pharetra sed, accumsan eu augue. In dictum augue eget leo maximus porttitor. Praesent sit amet fermentum enim. Maecenas lacus ante, elementum in ex in, egestas volutpat nulla. In hac habitasse platea dictumst. Nulla vel placerat massa. Suspendisse pretium urna a nisi efficitur, sit amet aliquam ante egestas. Morbi libero ex, interdum et leo ut, ultricies rhoncus quam. Nullam neque ligula, ultricies blandit neque in, pulvinar scelerisque nulla. Donec consequat felis justo, eget volutpat dolor viverra non. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin fringilla lorem sapien, eget gravida leo dapibus at. Pellentesque sit amet imperdiet nisl, sed ornare tellus. Proin a enim id purus rhoncus fringilla. Cras interdum a nisi sit amet condimentum.
Etiam porttitor pulvinar turpis nec convallis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. In pulvinar laoreet dolor vitae lobortis. (Footnote: As a single person I don’t have the resources such as big operators like Wikipedia might have.) Nulla est sapien, commodo at dictum in, pellentesque non neque. Mauris at lacinia est. Ut at massa a elit lacinia molestie sit amet quis nunc. Sed sollicitudin ipsum arcu, quis commodo nunc dignissim vitae. Aliquam auctor congue felis, a commodo ante iaculis ut. Sed mattis faucibus. (Footnote: Only plain JavaScript is used and does not require any additional library.) Nullam pharetra sem tortor, ac volutpat leo vestibulum quis. Sed egestas molestie lacus, laoreet hendrerit dolor maximus sed. Curabitur elementum nibh a nulla venenatis tristique. Aliquam quis turpis tempor mi ultrices faucibus. Mauris id blandit libero. Vivamus nec lectus et leo faucibus condimentum nec convallis nibh. (Footnote: The footnotes are not restricted to just plain text, for example hyper-links can be included, e.g. my home page.) Nulla consectetur sapien id justo blandit vulputate. Vivamus ut elit at est venenatis pretium eget sit amet arcu. Nulla ut finibus dolor, sit amet porttitor diam. Vestibulum eu purus sed nisi rhoncus rutrum. Duis nec dictum nibh. Maecenas facilisis sem quis enim tincidunt dictum. Mauris cursus sapien sit amet bibendum dapibus. Sed cursus dui sit amet nunc sollicitudin consequat. Donec sapien velit, convallis ac dui at, vehicula aliquam arcu. Morbi rutrum interdum tempor. Nam eu pretium neque. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
Note that this footnote system allows for multiple groups of footnotes for different sections of a web-page. This page is itself divided into two sections and uses two different footnote groups. Note that the footnote references and footnotes can be styled differently for different groups, as seen in the Side Box here.
You can download copies of the demo files here:
Footnotes: