Inline vs. Display mode.

The differences between (LaTeX) inline mode, and (LaTeX) display mode, can easily be demonstrated. 😉

Like so:

This is inline mode: (a^2+b^2=c^2)


This is inline mode: \(a^2+b^2=c^2\)

And…

This is display mode:

[
a^2+b^2=c^2
]


This is display mode:

\[
a^2+b^2=c^2
\]

This is too, but probably will get neglected:

[
a^2+b^2=c^2
]


This is too, but probably will get neglected:

[
a^2+b^2=c^2
]

Because why? Because the “”, hasn’t been properly ‘escaped’. This is how to properly escape the “” on a(ny) web-page/publishing platform: \ ← It’s the html entity for “” in hex notation. 😉

Other “nasties” to keep a look out for are, including—but not limited to— the following characters:

The infamous angle brackets

< < and > >
The open and closing symbol for every html element, one can possibly dream of! 😀
They are—among things—used to give web-masters headaches, especially when the need arises to display them/present them.

The ampersand

& &
Used to display the &—on the web—as it has special meaning when used as stand alone character.
They are—among things—used to give web-masters headaches, especially when the need arises to display them/present them.

I’ve already mentioned the “”

The backslash

\ (hex)
Used to display the —on the web—very useful when presenting long lines of code – neatly wrapped up – for readability.
They are—among things—used to give web-masters headaches, especially when the need arises to display them/present them.

The apostrophe

' ‘, or ' (dec) ‘, or &#x27 (hex) ‘;
Not to be confused with these: ‘ ’ (‘ and ’ respectively.)
They are—among things—used to give web-masters headaches, especially when the need arises to display them/present them.

The quote

" “, or " (dec) “, or " (hex) “
Not to be confused with these: “ ” (“ and ” respectively.)
They are—among things—used to give web-masters headaches, especially when the need arises to display them/present them.

This all brings me to the following part of this post… 😉

Separation of content and style

Not the most obvious advantage, possibly because a lot of Word users don’t understand why this so beneficial. When producing your LaTeX document, you are concentrating on the content itself. You introduce structure explicitly by telling LaTeX when a new section begins, for example, but you don’t then faff around trying to decide how the section headers should look. That’s done later.

Honestly! Whoever thought up the code for html… What were you smoking! 😀

Speaking of which: A little while ago, I was thinking about how html could be presented in a more structured manner, I came upon the following:
It looks way more intuitive (indentation is optional. 😉 ), no? 🙂


html{
  header{
      title{
      This is my fancy web-page
      }
      meta[encoding]{
      utf8
      }
      meta[keywords]{
      some meta data
      }
      meta[blabla]{
      some bla bla etc etc yada yada yada
      }
      style{
      point.to.some.stylesheet.css
      }
    }
    article{
      chapter[1]{
<!--    div  -->
        section{
          paragraph{
          This is my paragraph.
          }
        }
      }
    }
  }
}

That is, until I discovered markdown, which has a certain elegance that only can be admired. 😉

Anyway!

Below you’ll find a few snippets of code, as I’ve to use them on the several social media outlets out there. And yes, I’m finally getting to the point of all this! 😀 It’s easy to infer, that one has to write a lot of extra characters, just to present a few lines of code, or whatever. It’s even easier to infer, that I don’t feel like doing so all the time! 😉


## Here you see a snippet of
## pseudocode, which continues
## on the next line.
#
## The following is
## what I’d actually type.
## But…
code --flag 1 -f 2 --flag 3 
-i input.file 
-o output.file
#

Here’s how I’d have to present it on e.g. WordPress.: A semantic personal publishing platform.


## Here’s, how I’d have to present it
## on e.g. WordPress.
code --flag 1 -f 2 --flag 3 \
-i input.file \
-o output.file
#

Its equivalent in (LaTeX):


## Or… as I haven’t tested it yet.
## Its equivalent in LaTeX
code --flag 1 -f 2 --flag 3 textbackslash
-i input.file textbackslash
-o output.file
#

Last but not the least.


## Last but not the least.
## In html, literal.
code --flag 1 -f 2 --flag 3 &amp;#x5c;
-i input.file &amp;#x5c;
-o output.file
#

The point:
Which is why, whenever I feel the need to write something. I don’t feel like having to go up and down my text the whole time, just to make certain, if I’ve closed every html tag properly. And I most certainly don’t feel like I have to know every html entity, by heart! 😀 I do know quite a few, but I’d happily “forget” them, in a heartbeat. Thus the contents of the file pointed out below, pertains to a nifty feature of the text-editor of my choice. Namely: Its snippets feature, another word would be: macro. Macros are good, as they “help” me forget, nasty html entities—among things—ever existed.

The file displayed below is called: global.xml And its contents can be found—on my box—here:


~/.config/gedit/snippets/global.xml

So, what does it do? It enables me to use shortcuts—while typing—such as: ‘dq’ for “double quotes”, or ‘aq’ for «arrow quotes», or ‘dot’ for … (…), or ‘em’ for —emdash—, and so on, and so on, and so forth… It’s far from complete – for sure – and I’ll be fine-tuning the used shortcuts over time. For now, I can say: How glad I am, to be able to just type in a more fluent motion, instead of having to recap, and retrace every step I’ve made so far. 😉

Its contents:


<?xml version='1.0' encoding='utf-8'?>
<snippets>
  <snippet>
    <text><![CDATA[$1

$0]]></text>

    <tag>wpb</tag>

    <description>sourceb</description>

  </snippet>

  <snippet>

    <text><![CDATA[> $1
$0]]></text>

    <tag>bq</tag>

    <description>blockquote</description>

  </snippet>

  <snippet>

    <text><![CDATA[[$1]($2 "$3") $0]]></text>

    <tag>ref</tag>

    <description>ahref</description>

  </snippet>

  <snippet>

    <text><![CDATA[<a target="_blank" title="$1" href="$2">$3</a>$0]]></text>

    <tag>ablank</tag>

    <description>ablank</description>

  </snippet>

  <snippet>

    <text><![CDATA[**$1** $0]]></text>

    <tag>b</tag>

    <description>strong</description>

  </snippet>

  <snippet>

    <text><![CDATA[_$1_ $0]]></text>

    <tag>i</tag>

    <description>em</description>

  </snippet>

  <snippet>

    <text><![CDATA[*  $1

*  $2

*  $3

*  $4
$0]]></text>

    <tag>ul</tag>

    <description>ul</description>

  </snippet>

  <snippet>

    <text><![CDATA[“$0”]]></text>

    <tag>dq</tag>

    <description>dquo</description>

  </snippet>

  <snippet>

    <text><![CDATA[1.  $1

2.  $2

3.  $3

4.  $4
$0]]></text>

    <tag>ol</tag>

    <description>ol</description>

  </snippet>

  <snippet>

    <text><![CDATA[<sup>$1</sup>$0]]></text>

    <tag>sup</tag>

    <description>sup</description>

  </snippet>

  <snippet>

    <text><![CDATA[<sub>$1</sub>$0]]></text>

    <tag>sub</tag>

    <description>sub</description>

  </snippet>

  <snippet>

    <text><![CDATA[#### $1
$0

]]></text>

    <tag>chap</tag>

    <description>chapter</description>

  </snippet>

  <snippet>

    <text><![CDATA[<a title="$1">$2</a>$0]]></text>

    <tag>atitle</tag>

    <description>atitle</description>

  </snippet>

  <snippet>

    <text><![CDATA[$1

*[$1]: $2
$0]]></text>

    <tag>abbr</tag>

    <description>abbr</description>

  </snippet>

  <snippet>

    <text><![CDATA[<acronym title="$1">$2</acronym>$0]]></text>

    <tag>acro</tag>

    <description>acro</description>

  </snippet>

  <snippet>

    <text><![CDATA[<p>$1</p>]]></text>

    <tag>p</tag>

    <description>p</description>

  </snippet>

  <snippet>

    <text><![CDATA[<table summary="$1" border="$2">

$3

</table>

$0]]></text>

    <tag>table</tag>

    <description>table</description>

  </snippet>

  <snippet>

    <text><![CDATA[<tr>

    $1

</tr>

$0]]></text>

    <tag>tr</tag>

    <description>tr</description>

  </snippet>

  <snippet>

    <text><![CDATA[<td>$1</td>

$0]]></text>

    <tag>td</tag>

    <description>td</description>

  </snippet>

  <snippet>

    <text><![CDATA[«$1»$0]]></text>

    <tag>aq</tag>

    <description>aquo</description>

  </snippet>

  <snippet>

    <text><![CDATA[[$1]: $2 "$3"

![Alt $3][$1]
$0]]></text>

    <tag>img</tag>

    <description>img</description>

  </snippet>

  <snippet>

    <text><![CDATA[$1

$0]]></text>

    <tag>br</tag>

    <description>br</description>

  </snippet>

  <snippet>

    <text><![CDATA[##### $1
$0]]></text>

    <tag>sec</tag>

    <description>section</description>

  </snippet>

  <snippet>

    <text><![CDATA[http://$1$0]]></text>

    <tag>audio</tag>

    <description>audio</description>

  </snippet>

  <snippet>

    <text><![CDATA[***
$0]]></text>

    <tag>hr</tag>

    <description>hr</description>

  </snippet>

  <snippet>

    <text><![CDATA[$latex

$1

$

$0]]></text>

    <tag>latex</tag>

    <description>LaTeX</description>

  </snippet>

  <snippet>

    <text><![CDATA[<pre class="prettyprint">

<code>

$1

</code>

</pre>

$0]]></text>

    <tag>pp</tag>

    <description>prettyprint</description>

  </snippet>

  <snippet>

    <text><![CDATA[<a name="_top"></a>

$0

<em><a href="#_top">Back to top.</a></em>]]></text>

    <tag>anchor</tag>

    <description>anchor</description>

  </snippet>

  <snippet>

    <text><![CDATA[
$1

$0]]></text>

    <tag>wpt</tag>

    <description>text</description>

  </snippet>

  <snippet>

    <text><![CDATA[$1… $0]]></text>

    <tag>dot</tag>

    <description>hellip</description>

  </snippet>

  <snippet>

    <text><![CDATA[»$1«$0]]></text>

    <tag>iq</tag>

    <description>iquo</description>

  </snippet>

  <snippet>

    <text><![CDATA[[^$1] $2

[^$1]: [$3]($4 "$3")
$0

]]></text>

    <tag>cite</tag>

    <description>cite</description>

  </snippet>

  <snippet>

    <text><![CDATA[$1

:  $2
$0]]></text>

    <tag>dl</tag>

    <description>define</description>

  </snippet>

  <snippet>

    <text><![CDATA[<$1>$0]]></text>

    <tag>ab</tag>

    <description>Angle brackets</description>

  </snippet>

  <snippet>

    <text><![CDATA[<!--

$1

-->

$0]]></text>

    <tag>cm</tag>

    <description>comment (html)</description>

  </snippet>

  <snippet>

    <text><![CDATA[—$1—$0]]></text>

    <tag>em</tag>

    <description>mdash</description>

  </snippet>

  <snippet>

    <text><![CDATA[https://duckduckgo.com/?q=$1 $0]]></text>

    <tag>qddg</tag>

    <description>Query</description>

  </snippet>

  <snippet>

    <text><![CDATA[‘$1’$0]]></text>

    <tag>sq</tag>

    <description>squo</description>

  </snippet>

  <snippet>

    <text><![CDATA[$1’$0]]></text>

    <tag>q</tag>

    <description>quo</description>

  </snippet>

  <snippet>

    <text><![CDATA[$1

$0]]></text>

    <tag>bs</tag>

    <description>backslash</description>

  </snippet>

  <snippet>

    <text><![CDATA[textbackslash$0]]></text>

    <tag>tbs</tag>

    <description>textbackslash</description>

  </snippet>

  <snippet>

    <text><![CDATA[&#$1;$0]]></text>

    <tag>amp</tag>

    <description>literal character entries</description>

  </snippet>

  <snippet>

    <text><![CDATA[($1)$0]]></text>

    <tag>imj</tag>

    <description>Inline MathJax</description>

  </snippet>

  <snippet>

    <text><![CDATA[[

$1

]
$0]]></text>

    <tag>dmj</tag>

    <description>Display MathJax</description>

  </snippet>

</snippets>


Share it! You know you want to. :-)

				Click to share on Tumblr (Opens in new window)
				Tumblr
			

				Click to share on Bluesky (Opens in new window)
				Bluesky
			

				Click to share on Threads (Opens in new window)
				Threads
			

				Click to share on Facebook (Opens in new window)
				Facebook
			

				Click to print (Opens in new window)
				Print
			

				Click to share on Reddit (Opens in new window)
				Reddit
			

				Click to email a link to a friend (Opens in new window)
				Email
			

				Click to share on WhatsApp (Opens in new window)
				WhatsApp
			

				Click to share on X (Opens in new window)
				X
			
More

				Click to share on Mastodon (Opens in new window)
				Mastodon
			

				Click to share on Telegram (Opens in new window)
				Telegram
			

				Click to share on Pinterest (Opens in new window)
				Pinterest
			

				Click to share on Pocket (Opens in new window)
				Pocket
			

				Click to share on LinkedIn (Opens in new window)
				LinkedIn
			
Like Loading...