<!DOCTYPE html>

<html lang="en">
  <head>
    <meta charset="utf-8" />

    <title>Konsole</title>

    <link rel="stylesheet" href="./konsole.css" />
    <script src="./konsole.js"></script>

    <script>
//Konsole.noop();

kpp(document.body, 'log call before DOM ready');

document.addEventListener('DOMContentLoaded', function () {
  kp(document.getElementById('about'));
  kpp(window, 'the window object');

  boom
});
    </script>
  </head>

  <body>
<h1 id="about">Konsole</h1>

<p>Click Konsole title to scroll the log to the bottom. Click it again to scroll to the top. When in the middle of the log, click the title to scroll to the top.
</p>
  </body>
</html>

<!DOCTYPE html>

<html lang="en">
  <head>
    <meta charset="utf-8" />

    <title>Konsole</title>

    <link rel="stylesheet" href="./konsole.css" />
    <script src="./konsole.js"></script>

    <script>
//Konsole.noop();

kpp(document.body, 'log call before DOM ready');

document.addEventListener('DOMContentLoaded', function () {
  kp(document.getElementById('about'));
  kpp(window, 'the window object');

  boom
});
    </script>
  </head>

  <body>
<h1 id="about">Konsole</h1>

<p>Click Konsole title to scroll the log to the bottom (the beginning). Click it again to scroll to the top (the end). When in the middle of the log, click the title to scroll to the top.
</p>
  </body>
</html>

Make example description more clear
Make example description more clear