Markup Feature Demonstration

I learned a few important lessons editing, proofing and publishing books; consistency in layout is key, text reads easier when justified and using footnotes helps both the readers that are up to speed as it does those who want more background information. Being a coder and web-designer from an early age also taught me to use and build solutions to accommodate readers with visual ques and small aides, like tooltips for abbreviated definitions and tools for viewing images, or emoticons. 😎

-reminder to add a custom lightbox(!)

This page is mostly a demonstration and a reminder to myself; so I have a reference to usability-features and as a compliancy test-case(!) These days most browsers are pretty decent at rendering pages with little need for specific codes, but it helps to test and remind me of things I built and don’t frequently use. Like the Hashtags that show up at the top of the page that can (now) be overridden. And for future features..!

-“This text has emphasis..”

Paragraphs should justify nicely across the page, going all the way from left to right, by default.

Left aligning paragraphs are still possible, it just looks horrible to me, yet most websites don’t bother with it. Why? Idk, possibly they just can’t be bothered to consistently markup or don’t know how to change stylesheets..

This left aligning paragraph has a break above it..
,, and a new line inside the paragraph!

Right aligning paragraphs are still possible and possibly nice to get readers focus on something? Idk.

---

Justified H2 Headlines are now default, they just need to be long enough to notice!

Left aligning H2 Headlines are still possible

Justified H3 Headlines are now default, they also just need to be long enough to notice!

Left aligning H3 Headlines are also still possible

image with sub-text and picture frame

Blockquotes are always centered!

Even if blockquotes have paragraphs in ’em!

Hyperlinks: Links can have nice titles so the reader gets an idea what’s up, for instance: Hyperlink also mind it has a target ‘_blank’ so it opens in a new tab(!)

Footnotes: Sometimes definitions are unclear, but explaining them inline isn’t a great idea; then we can a reference to a Footnote¹!

Tooltips for Abbreviations: Using obscure shorthand can leave readers puzzled, talking about web markup languages like ‘CSS Cascading Style Sheets‘ or ‘HTML Hyper Text Markup Language‘, using some script tooltips can go left, right, top or bottom of the defeinitions.
(!)I will have to see if I want to combine these with footnotes and automate numbering, if I ever feel the need(!)

Emoticons: smile: 🙂 razz: 😛 cool: 😎 wink: 😉 biggrin: 😀 twisted: 😈 mrgreen: lol: 😆 rolleyes: 🙄 confused: 😕 cry: 😥 surprised: 😮 evil: 👿 neutral: 😐 redface: 😳 mad: 😡 eek: 😯 sad: 🙁 arrow: ➡ idea: 💡

<script type="text/basic">
10 print"Mind the special characters!"
20 goto 10
</script>

<style type="text/css">
.test{
	/*a test to see if tabs-are preserved*/
}
</style>

Place footnotes below a break, but the link above it; so the footnotes don’t get hidden behind the menu that’s a the top of the page. Also linking to a singular anchor helps keep things consistent and is less prone to mistakes. Place the anchor inside a hidden paragraph so it doesn’t take space in layout

---

footnotes:

¹Footnotes rule! Use them!

Custom Hashtag