First Post, Best Post

This first post is the best post because it is used to test the design. It may change from time to time.

The idea of making my first post for this purpose came after reading z3bra's blog. It is somewhat funny that I start this blog after this person officially stopped writing for its blog. At least I will not anymore check out this blog regularly for new posts.

Testing text formating


Text formating is quite important. A sentence starts with an uppercase and ends with a full stop, and a paragraph should start with a small indentation. As much as I prefer justified texts, they do not render well on a small screen when words are long. Some words are bolder than others to make them important. Some are put verbatim. Of course links for my website or other websites are important.

If I put long code inline snippets like /home/username/Personal/Projects/Nales/src/en/blog and also another path like /home/username/Personal/Projects/Nales/build/en/blog, would they overlap?

About list typography, when a list continues a sentence:

When a list does not continue a sentence.

Block quotes

Here is an excerpt of Mon Rêve Familier by Paul Verlaine.

Je fais souvent ce rêve étrange et pénétrant
D’une femme inconnue, et que j’aime, et qui m’aime,
Et qui n’est, chaque fois, ni tout à fait la même
Ni tout à fait une autre, et m’aime et me comprend.— Paul Verlaine, Mon Rêve Familier

And here is a quote from an unknown author.

Sit aspernatur et enim repellendus nihil saepe voluptas! Rem omnis consequatur sapiente sit delectus Molestiae porro totam ipsum accusamus itaque? Dolore possimus magni quos atque deleniti? Repudiandae eum exercitationem iusto?

A last one in Japanese to try out non latin characters.

汗るほどくもっていく鏡— チャットモンチー, Thermae Roman



Images are displayed as figures. In articles, a version with a reduced quality is displayed and it links to the original version. The displayed images can be previews for videos or audio. The goal is to reduce the quantity of data to be loaded. I know how it is to have a limited data cap and a slow connection...

The quality of the displayed image is less than the one pointed by the link.
A test image


Tables are also figures.

Long table to show that it does not break the page
Column-1 Column-2 Column-3 Column-4 Column-5 Column-6 Column-7 Column-8 Column-9 Column-10
Line-1 Value 1x1 Value 1x2 Value 1x3 Value 1x4 Value 1x5 Value 1x6 Value 1x7 Value 1x8 Value 1x9 Value 1x10
Line-2 Value 2x1 Value 2x2 Value 2x3 Value 2x4 Value 2x5 Value 2x6 Value 2x7 Value 2x8 Value 2x9 Value 2x10
Line-3 Value 3x1 Value 3x2 Value 3x3 Value 3x4 Value 3x5 Value 3x6 Value 3x7 Value 3x8 Value 3x9 Value 3x10
Line-4 Value 4x1 Value 4x2 Value 4x3 Value 4x4 Value 4x5 Value 4x6 Value 4x7 Value 4x8 Value 4x9 Value 4x10

Here is a more complex table. I do not use vertical sideways orientation because this feature is broken (padding not correctly rendered).

The adjectifs possessifs in French
Singular Plural
Masculin Féminin
Owner Singular 1st person mon ma mes
2nd person ton ta tes
3rd person son sa ses
Plural 1st person notre vos
2nd person votre vos
3rd person leur leurs


Most of this blog will be technical about software development. I am checking here if at least 80 characters are displayed when the page is rendered on a wide screen.

         1         2         3         4         5         6         7         8
|    On a big screen, at least 80 characters should be displayable by line.    |
|         On a small screen. Well, too bad but overflow is activated.          |
         1         2         3         4         5         6         7         8

                     <HTML characters like & are escaped.>

Some code from main.c with some highlights.

#include <stdio.h>

// A simple Hello World!
int main(int argc, char* argv[])
    printf("Hello World!\n");
    return 0;

Here is the command I used to create the thumbnail image above. Since it was in a shell, there are no file names but the programming language is known (sh) so syntax highlighting can be used.

convert dune-fear-wallpaper.png \
    -scale 1000x \
    -ordered-dither 1x1 \
    -grayscale average \


To embed interactive things, I use iframes. Here is the table of contents of this blog.