The main thing that I am not sure about is which font to use for the body text. I use DECTERM Modern on the main page of this website but I find it really unreadable for block text. For example:

According to all known laws of aviation, there is no way a bee should be able to fly. Its wings are too small to get its fat little body off the ground. The bee, of course, flies anyway because bees don’t care what humans think is impossible. Yellow, black. Yellow, black. Yellow, black. Yellow, black. Ooh, black and yellow! Let’s shake it up a little.

That seems a little illegible to me. Instead, I have made the body font Roboto, which is much nicer to read, but seems not so in fitting with the styling of the site.

I am also unsure if the Chromatic Aberration makes things harder to read so I have left it disabled for blog pages. It seems to be less noticeable on desktop than on mobile.

Headings

H1

H2

H3

H4

H5
H6

Paragraph

Barry! Breakfast is ready! Coming! Hang on a second. Hello? Barry? Adam? Can you believe this is happening? I can’t. I’ll pick you up. Looking sharp. Use the stairs, Your father paid good money for those. Sorry. I’m excited. Here’s the graduate. We’re very proud of you, son. A perfect report card, all B’s. Very proud. Ma! I got a thing going here. You got lint on your fuzz. Ow! That’s me! Wave to us! We’ll be in row 118,000. Bye! Barry, I told you, stop flying in the house! Hey, Adam. Hey, Barry. Is that fuzz gel? A little. Special day, graduation. Never thought I’d make it.

Images

blog placeholder

Blockquotes

The blockquote element represents content that is quoted from another source, optionally with a citation which must be within a footer or cite element, and optionally with in-line changes such as annotations and abbreviations.

Blockquote without attribution

According to all known laws of aviation, there is no way a bee should be able to fly.

Blockquote with attribution

Coming!
— Barry B Benson1

Tables

ItalicsBoldCode
italicsboldcode

Code Blocks

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>Example HTML5 Document</title>
  </head>
  <body>
    <p>Test</p>
  </body>
</html>

List Types

Ordered List

  1. First item
  2. Second item
  3. Third item

Unordered List

  • List item
  • Another item
  • And another item

Nested list

  • Fruit
    • Apple
    • Orange
    • Banana
  • Dairy
    • Milk
    • Cheese

Other Elements — abbr, sub, sup, kbd, mark

GIF is a bitmap image format.

H2O

Xn + Yn = Zn

Press CTRL + ALT + Delete to end the session.

Most salamanders are nocturnal, and hunt for insects, worms, and other small creatures.

Footnotes

  1. The above quote is excerpted The Bee Movie (October 25, 2007) ↩