Chaospott/site
43
1
Fork 1
Code Issues Pull Requests Releases Activity

Dokumentation für Optimierung und Bildausrichtung

Browse Source
This commit is contained in:
Christian 2020-01-14 21:35:28 +01:00
parent b7e56d3bee
commit a1d639b1fe
1 changed files with 13 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
README.md
View File

@ -1,15 +1,15 @@
# site # site
Die Chaospott Seite / Der Blog Die Chaospott Seite / Der Blog
Zu finden auf [chaospott.de](https://chaospott.de) Zu finden auf [chaospott.de](https://chaospott.de)
jekyll + bootstrap jekyll + bootstrap
### Blogeinträge ## Blogeinträge
#### Text
### Text
Blogeinträge werden in dem Verzeichnis „web/\_posts“ abgelegt. Um einen Blogeintrag zu verfassen legt man eine Datei mit dem Schema „Jahr-MM-TT-Titel.markdown“ an. Der Blogeintrag beginnt mit folgenden Metadaten: Blogeinträge werden in dem Verzeichnis „web/\_posts“ abgelegt. Um einen Blogeintrag zu verfassen legt man eine Datei mit dem Schema „Jahr-MM-TT-Titel.markdown“ an. Der Blogeintrag beginnt mit folgenden Metadaten:
<pre><code>--- <pre><code>---
layout: post layout: post
@ -19,7 +19,8 @@ categories: docpatch
---</code></pre> ---</code></pre>
Damit wird der Titel des Blogeintrags, das Datum der Veröffentlichung und die Kategorie (optional) festgelegt. Damit wird der Titel des Blogeintrags, das Datum der Veröffentlichung und die Kategorie (optional) festgelegt.
#### Bilder ### Bilder
Bilder für Blogeinträge werden unterhalb von Media in einem eigenen Verzeichnis (Jahr-MM-TT) abgelegt. Bilder für Blogeinträge werden unterhalb von Media in einem eigenen Verzeichnis (Jahr-MM-TT) abgelegt.
<pre><code>~/site/media/jahr-mm-tt <pre><code>~/site/media/jahr-mm-tt
@ -30,11 +31,15 @@ Als erstes sollte man die Exif-Daten (z.B. Geoinformation) der Bilder entfernen.
</code></pre> </code></pre>
Ggf. muss das Bild gedreht werden, wenn es ohne die Metatags auf dem Kopf steht oder auf der Seite liegt. Ggf. muss das Bild gedreht werden, wenn es ohne die Metatags auf dem Kopf steht oder auf der Seite liegt.
```convert -rotate 90 $Bild $Bild_out.jpg```
Der letzte Schritt setzt die Bilder auf eine einheitliche Breite. Der vorletzte Schritt setzt die Bilder auf eine einheitliche Breite.
<pre><code>mogrify -resize "1140>" $Bild <pre><code>mogrify -resize "1140>" $Bild
</code></pre> </code></pre>
Viele Bilder können noch optimiert werden, damit der benötige Speicherplatz und die zu übertragende Datenmenge reduziert wird.
```jpegoptim -m 80 %Bild.jpg```
Wenn das Bild in der korrekten Größe und Ausrichtung vorliegt, kann es wie Folgt eingebunden werden. Wenn das Bild in der korrekten Größe und Ausrichtung vorliegt, kann es wie Folgt eingebunden werden.
<pre><code>![Quelle: Chaospott]({{ site.url }}/media/Jahr-MM-TT/$Bild.jpg) <pre><code>![Quelle: Chaospott]({{ site.url }}/media/Jahr-MM-TT/$Bild.jpg)
</code></pre> </code></pre>