To start off, we need to know a little about plain text. It’s the most basic text document you can create. On Windows, it’s Notepad. On Mac, it’s TextEdit when you go to Format > Make Plain Text. This type of file can only store text.

Plain text has the benefit of being readable/writable by just about everyone. You can open a plain text file in most (if not all) word processors and web browsers, making it highly accessible.

All the websites that we enjoy browsing are written in plain text.

But wait! Websites have style and colors and images and videos and other such things!

That’s right. The way to introduce style to plain text is to use a type of markup syntax. Try right-clicking on a website and select “View Page Source.” You will see something like this:

<!DOCTYPE html>

<html>

<head>
  <meta charset="utf-8" />
  <meta name="generator" content="pandoc" />
  <meta http-equiv="X-UA-Compatible" content="IE=EDGE" />
  <meta name="author" content="cga-wm.github.io" />
  <title>Center for Geospatial Analysis</title>
</head>
<body>
  <div class="fluid-row" id="header">
    <h1 class="title toc-ignore">Center for Geospatial Analysis</h1>
    <h4 class="author">cga-wm.github.io</h4>
  </div>
</body>
</html>

What is all that? The web is written in HTML (HyperText Markup Language), which is a way of telling your browser how to stylize the contents. It is accomplished through a sophisticated method of tagging (denoted by elements between the opening <> and closing </>). Furthermore, each tag can also have attributes (see attribute-value pairs, such as charset="utf-8" and class="author").

HTML is not pretty to look at without a browser to decode it and transform the instructions into the content we look at on a web page.

Markdown was created by John Gruber as a lightweight plain text syntax for “marking up” plain text to add style without losing the ability to easily read it. For example, the content in HTML above can be represented in markdown by the following:

---
title: Center for Geospatial Analysis
---
# Center for Geospatial Analysis
#### cga-wm.github.io

Which do you find easier to read?

Because HTML and Markdown are closely related, and because Markdown is so much easier to read and write for the average person, there have been several efforts to create Markdown editors/renderers for web content.

GitHub has one. The Issues and Discussions allow you write in Markdown and then you can click “Preview” to see it converted to HTML.

Notebooks has one. Type in text block then click “Run” and see it converted to HTML.

Because the conversion of Markdown to HTML depends on whose editor/renderer you are using, we find that there are several “flavors” of markdown (i.e., subtle differences in syntax to HTML rendering). I guess every language has dialects so Markdown is no difference.

If you want to get started testing Markdown on the web, I suggest trying out stackedit.io. There are also lots of online references on Markdown syntax and documentation discussing the differences between the renderers (e.g., GitHub has its own flavor).

Here is a link to GitHub’s Markdown syntax cheatsheet (pdf).

Give it a try.


KML / KMZ

Another popular markup language is Keyhole Markup Language (KML). KML (sometimes in its compressed format, KMZ) is a plain text file used to display geographic data and it is one of the approved file types you can add to ArcGIS Online.

I downloaded the USGS Earthquakes KMZ from the web and extracted1 the KML. It looks like this:

<?xml version="1.0" encoding="UTF-8"?>
<kml xmlns="http://earth.google.com/kml/2.1">
<NetworkLink>
    <name>Real-time Earthquakes</name>
    <open>1</open>
    <LookAt>
        <longitude>-104.1025</longitude>
        <latitude>50.4913</latitude>
        <altitude>0</altitude>
        <range>8384245</range>
        <tilt>0</tilt>
        <heading>-0.2564</heading>
    </LookAt>
    <flyToView>1</flyToView>
    <Url>
        <href>http://services.google.com/earth/kmz/realtime_earthquakes.kmz</href>
    </Url>
</NetworkLink>
</kml>

You’ll notice that KML is based on the eXtensible Markup Language (XML), which should look similar to HTML.


  1. Did you know that you can decompress a KMZ file using 7zip to get the doc.kml file inside? Try it!↩︎