Intern: Nichts bleibt beim Alten

Seit nun­mehr einem hal­ben Jahr betrei­be ich hob­by­mä­ßig die­sen Blog. Bis dato hat­te ich mei­ne Tex­te bei Medi­um ver­öf­fent­licht, was vor allem den Vor­teil hat­te, dass ich mich um nichts küm­mern muss­te. Wer mich kennt, weiß, dass ich gut dar­in bin, aus die­sem Vor­teil einen Nach­teil zu machen – ich küm­me­re mich ger­ne. Schon Anfang letz­ten Jah­res sicher­te ich mir für mei­ne G Suite die Domains lawetz​ky​.de und domi​ni​kla​wetz​ky​.de. Im Som­mer erwuchs dar­aus die Idee, einen klei­nen Blog auf­zu­bau­en, um mei­ne Tex­te dort zu publi­zie­ren und gege­be­nen­falls Foli­en von Vor­trä­gen zur Ver­fü­gung zu stel­len.

Für unkom­pli­zier­tes Web­site-Buil­ding hat man mitt­ler­wei­le die Wahl zwi­schen zahl­rei­chen Bau­käs­ten – Squa­respace, Jim­bdo und Wix sind ver­mut­lich die bekann­tes­ten. Ich wähl­te Wix, da mir das User Inter­face am über­sicht­lichs­ten erschien. Kom­pli­zier­te Lösun­gen mit eige­nem Hos­ting kamen zu die­sem Zeit­punkt nicht infra­ge, da ich noch her­aus­fin­den woll­te, ob regel­mä­ßi­ges Blog­gen über­haupt etwas für mich ist.

Screen­shot: Neu­es Web­site-Design

Ein hal­bes Jahr spä­ter bin ich am glei­chen Punkt wie mit Medi­um: die Vor­tei­le von Wix wer­den zu Nach­tei­len. Und so kommt es, dass bereits nach einem hal­ben Jahr der ers­te Refresh mei­ner Sei­te „live“ geht. In die­sem Arti­kel eröff­ne ich einen Blick hin­ter die Kulis­sen die­ser (neu­en) Web­site, denn das Pro­jekt Blog 2.0 hat sich als auf­wen­di­ger als gedacht her­aus­ge­stellt.

Web­hos­ting

Zunächst stell­te sich die Fra­ge, bei wem der Webs­pace – also der Ser­ver, auf dem die Web­site liegt – gemie­tet wer­den soll. Wix macht lei­der kei­ne genau­en Anga­ben dazu, wo ihre Ser­ver ste­hen. Das ist daten­schutz­recht­lich bedenk­lich, solan­ge sich die Web­site an ein deut­sches Publi­kum rich­tet. Jetzt, da ich die Wahl hat­te, waren mir drei Din­ge wich­tig:

  • einen Ser­ver­stand­ort in Deutsch­land
  • eine hohe Zuver­läs­sig­keit (99,9 % Ver­füg­bar­keit und mög­lichst hohe Geschwin­dig­keit aus Euro­pa her­aus)
  • ein mög­lichst nied­ri­ger Preis (< 10 EUR monatl.)

Die­se drei Kri­te­ri­en schrän­ken die Aus­wahl stark ein. Schluss­end­lich ent­schied ich mich für das Level-4-Web­hos­ting von Hetz­ner. Auf iPhoneb​log​.de hieß es schon vor eini­gen Jah­ren mit Bezug auf Hetz­ner: „Schließ­lich ver­eint Hetz­ner die Vor­tei­le eines klei­nen Anbie­ters (fle­xi­bel) mit den Vor­zü­gen eines gro­ßen Anbie­ters (Rechts­si­cher­heit, Sta­bi­li­tät) in sich.“

Screen­shot: Hetz­ners kon­so­leH

Level 4 heißt in die­sem Fall unbe­grenzt Band­brei­te und 50 Giga­byte Ser­ver­spei­cher, was der­zeit mehr als genug (und das fünf­fa­che von dem dop­pel­ten so teu­ren Wix-Ange­bot) ist. Für das Web­hos­ting steht Apa­che zur Vefü­gung (mehr zur tech­ni­schen Umset­zung spä­ter).

Die DNA-Ein­rich­tung ging pro­blem­los, gleich­wohl das User Inter­face von Hetz­ners kon­so­leH ziem­lich alt­ba­cken ist. Eine Domain-Über­tra­gung habe ich nicht durch­ge­führt. Mei­ne Domains sind nach wie vor bei GoDad­dy regis­triert (vor­her bei United­Do­mains).

Screen­shot: Domain-Regis­trie­rung bei GoDad­dy

Wor­d­Press-Ein­rich­tung

Als Con­tent Manage­ment Sys­tem (CMS) set­ze ich bei mei­nem Blog wie etwa 35 Pro­zent aller Web­sites auf Wor­d­Press. Eine voll­um­fäng­li­che CMS bie­tet vor allem mehr Fle­xi­bi­li­tät als eine Web­site-Bau­kas­ten wie Wix. Mit dem Gewinn an Fle­xi­bi­li­tät geht jedoch auch ein Mehr an Ver­wal­tungs­auf­wand und Sicher­heits­ri­si­ken ein­her.

Für Wor­d­Press spricht zudem die sta­bi­le­re und res­sour­cen­scho­nen­de­re Ober­flä­che. Der Bau­kaus­ten von Wix brach­te regel­mä­ßig mei­nen Mac­Book Pro an sein Limit und Chro­me zum Absturz, was die Freu­de am „Bau­en“ ein Stück weit min­der­te. Die Wor­d­Press-Ober­flä­che hin­ge­gen kommt auch mit recht res­sour­cen­ar­men Sys­te­men aus.

Die Instal­la­ti­on der aktu­el­len Wor­d­Press-Ver­si­on auf dem Web­ser­ver ging mit weni­gen Klicks.

Das gro­ße Man­ko: Wix erlaubt nicht den Trans­fer der Blog­posts. Das heißt: Ich muss­te jeden ein­zel­nen Blog­post hän­disch von Wix auf Wor­d­Press über­tra­gen – klas­si­sche Copy-and-Pas­te-Arbeit …

Sicher­heit und Daten­schutz

Ich lege bei mei­ner Web­site gro­ßen Wert dar­auf, dass die Sei­te nicht nur eini­ger­ma­ßen DSGVO-kon­form, son­dern, was die Umset­zung von Daten­schutz angeht, vor­bild­lich ist. Jede und jeder, der sich schon mal dar­in ver­sucht hat, weiß, was das bedeu­tet: vie­le Schmer­zen.

SSL-Ver­schlüs­se­lung

Bei http:// kann ein Dritter mitlesen, welche Daten übermittelt werden - da sie nicht verschlüsselt sind. Bei https:// ist dies nicht möglich; die Verbindung ist sicher.
Gra­fik: Unter­schied zwi­schen http:// und https://

Hetz­ner erlaubt die Instal­la­ti­on eines Let’s‑Encyrpt-Zertifikats, alter­na­tiv auch Basic-SSL (Symantec/​Digicert). Die SSL-Ver­schlüs­se­lung garan­tiert, dass kei­ne Daten on the way abge­fan­gen wer­den kön­nen (Ende-zu-Ende-Ver­schlüs­se­lung). Klas­si­sche „Man in the middle“-Angriffe sind damit aus­ge­schlos­sen. Die SSL-Ver­schlüs­se­lung macht sich in Chro­me durch ein Schloss bzw. httpS:// vor der URL bemerk­bar.

Screen­shot: Schloss in Chro­me als Signal für SSL-Ver­schlüs­se­lung

Das klingt etwas über­trie­ben für einen ein­fa­chen Blog, ist jedoch sinn­voll, da auch mei­ne Web­site auf die ein oder ande­re Wei­se per­so­nen­be­zo­ge­ne Daten erfasst, z. B. beim Kon­takt-For­mu­lar. In die­sem Fall sieht die DSGVO eine Ende-zu-Ende-Ver­schlüs­se­lung expli­zit vor.

Two-Fac­tor-Authen­ti­fi­ca­ti­on

Eigent­lich soll­te es dafür kei­ner Erwäh­nung bedür­fen, aber eine Two-Fac­tor-Authen­ti­fi­ca­ti­on (2FA) ist ein Muss, vor allem beim Zugang zu einer Web­site, die im Inter­net für jeder­mann sicht­bar ist und damit poten­ti­ell gro­ßen Scha­den anrich­ten kann.

2FA bedeu­tet, dass zusätz­lich zum sta­ti­schen Pass­wort noch ein zwei­ter Fak­tor hin­zu­kommt. Bes­ten­falls han­delt es sich bei dem zwei­ten Fak­tor nicht um einen Code aus einer E‑Mail oder SMS, son­dern um einen zeit­lich befris­te­ten Token. Ich kann Authy emp­feh­len, mit die­ser App las­sen sich die Tokens platt­form­über­grei­fend zwi­schen ver­schie­de­nen Gerä­ten syn­chro­ni­sie­ren. Dann ist das Dra­ma nicht ganz so groß, fällt das Smart­pho­ne in die Bade­wan­ne …

Wich­tig ist, dass sowohl der Zugang zum Web­ser­ver als auch der Wor­d­Press-Log­in mit 2FA geschützt sind. Hetz­ner ermög­licht 2FA von Haus aus, bei Wor­d­Press bedarf es eines Plugins. Ich kann das Plugin Two Fac­tor nur emp­feh­len (und damit ste­he ich auch nicht allei­ne).

Coo­kie-Ban­ner und Con­tent-Blo­cker

Zur DSGVO-kon­for­men Web­site gehört auch ein Coo­kie-Ban­ner bzw. ‑Blo­cker, der opt-out gestellt ist. Das heißt, ohne akti­ves Zutun des Nut­zers wer­den nur tech­nisch not­wen­di­ge Coo­kies gespei­chert.

Screen­shot: Coo­kie-Ban­ner

Tech­nisch not­wen­dig ist auf mei­ner Web­site der­zeit nur Goog­le Fonts für die Schrift­art (kon­kret: Noto Sans). Ja, es wäre mög­lich, die Schrift­art auch auf dem eige­nen Web­ser­ver zu spei­chern; aller­dings pro­du­zier­te das in mei­nem Fall etli­che Schwie­rig­kei­ten bei der Dar­stel­lung. Wie gesagt: vie­le Schmer­zen.

Ein wei­te­rer Coo­kie kann bei Ein­wil­li­gung von Goog­le Ana­ly­tics (Sta­tis­tik) gesetzt wer­den. Das Goog­le-Ana­ly­tics-Skript wird jedoch bis zur Ein­wil­li­gung nicht aus­ge­führt. Um das zu rea­li­sie­ren, griff ich auf ein kos­ten­pflich­ti­ges Plugin namens Borlabs Coo­kie zurück. Für 39 Euro erhält man ein Coo­kie-Ban­ner, die Mög­lich­keit, die Aus­füh­rung von Skrip­ten zu blo­ckie­ren, und einen Con­tent-Blo­cker für ein­ge­bun­de­ne Inhal­te wie You­tube-Vide­os und Tweets.

Screen­shot: Blo­ckier­tes ein­ge­bun­de­nes You­tube-Video

Der Con­tent-Blo­cker soll­te ohne Zutun aktiv sein, so dass ver­hin­dert wird, dass You­tube oder Twit­ter über die embed­ded scripts Coo­kies set­zen oder die IP-Adres­se tra­cken.

Übri­gens wer­den alle erfass­ten IP-Adres­sen, bevor sie ver­ar­bei­tet wer­den (z. B. durch Goog­le Ana­ly­tics) pseud­ony­mi­siert. Aus­ge­nom­men sind aller­dings eini­ge ein­ge­bun­de­ne Inhal­te; da kann eine Pseud­ony­mi­sie­rung nicht voll­stän­dig sicher­ge­stellt wer­den.

Back­up

Die gesam­te Web­site wird alle zwei Stun­den in einem ver­schlüs­sel­ten Back­up in einer Goog­le Dri­ve gespei­chert. Jeweils die letz­ten zehn Back­ups blei­ben erhal­ten. Auf die­se Wei­se ist die Sei­te auch bei einem Total­ver­sa­gen von Sei­ten Hetz­ners nicht ver­lo­ren und kann rela­tiv unkom­pli­ziert wie­der online gehen.

Zudem führt Hetz­ner selbst regel­mä­ßig Back­ups ihrer Ser­ver durch. Auf die­se inter­nen Back­ups soll­te man sich aller­dings nicht ver­las­sen.

Page Speed

Sind wir ehr­lich: Bis­lang war mein Blog nicht der schnells­te. Im Gegen­teil: Die Page Speed war teil­wei­se eine Kata­stro­phe. Das wirkt sich nicht nur nega­tiv auf die User Expe­ri­ence (UX), son­dern auch die Search Engi­ne Opti­miz­a­ti­on (SEO) aus.

Gra­fik: Zusam­men­hang zwi­schen tole­rier­ter Page Speed und Moti­va­ti­on, die Sei­te auf­zu­ru­fen

Die meis­ten geben – abhän­gig von ihrer Moti­va­ti­on, die Sei­te zu besu­chen – auf, wenn eine Sei­te zu lan­ge lädt. Umge­kehrt: Die von einem Nut­zer tole­rier­te Page Speed steigt mit des­sen Moti­va­ti­on, die Sei­te auf­zu­ru­fen.

Wie schnell die eige­ne Sei­te lädt, lässt sich über ver­schie­de­ne Tests her­aus­fin­den. Emp­feh­lens­wert ist Goo­g­les Open-Source-Test (web​.dev).

Screen­shot: Score bei Goo­g­les web​.dev

Um dort einen mög­lichst hohen, also guten Score zu errei­chen, habe ich fol­gen­de Opti­mie­rung an der Web­site vor­ge­nom­men:

  • Die Web­site läuft über das Con­tent Deli­very Net­work (CDN) Cloud­fla­re. Zu erklä­ren, was genau ein CDN ist, wür­de hier zu weit füh­ren – kurz: Es sorgt dafür, dass häu­fig auf­ge­ru­fe­ne Inhal­te gecacht (vor­ge­spei­chert) wer­den, um die Latenz und damit die Page Speed zu redu­zie­ren.
  • Über ein Script habe ich kon­fi­gu­riert, dass Bil­der erst her­un­ter­ge­la­den wer­den, wenn sie sicht­bar wer­den sol­len. Bei län­ge­ren Arti­keln laden die Bil­der also beim Scrol­len Stück für Stück nach. Außer­dem laden die ein­zel­nen Sei­ten nicht „von oben nach unten“; zuerst lädt der „wich­ti­ge Inhalt“ (Text), dann die „Deko“ (Bil­der). Dadurch ist die Sei­te auch bei extrem lang­sa­mer Inter­net­ver­bin­dung (= deut­sches Mobil­funk­netz außer­halb von Groß­städ­ten) eini­ger­ma­ßen nutz­bar.
  • Alle Bil­der sind im JPG-For­mat und opti­mal kom­pri­miert hoch­ge­la­den. Zur Kom­pres­si­on ein­zel­ner Bil­der nut­ze ich Com​pres​sor​.io.

Blog­ging

Mein Blog­ging-Work­flow ist nun viel ange­neh­mer als mit Wix. Beim Wix-Edi­tor stieß ich immer wie­der auf ver­meint­lich bana­le Pro­ble­me: Über­schrif­ten waren zu klein; das Ein­bet­ten von exter­nen Inhal­ten nur stark ein­ge­schränkt mög­lich (Tweets ja, You­tube-Vide­os waren ein Glücks­spiel); Bil­der wur­den teil­wei­se „ver­schluckt“ und muss­ten mehr­fach hoch­ge­la­den wer­den …

Guten­berg, der Stan­dard-Edi­tor von Wor­d­Press, macht da viel rich­tig. Das Ein­bet­ten von exter­nen Inhal­ten ist leich­ter denn­je. Dar­über hin­aus kann ich mit dem Aca­de­mic Blog­gers Tool­kit Lite­ra­tur­ver­zeich­nis­se anle­gen und mit Easy Table of Con­tents Inhalts­ver­zeich­nis­se – mir nichts, dir nichts – gene­rie­ren (sie­he oben).

Screen­shot: Guten­berg-Edi­tor

Guten­berg ist zwar noch nicht gutenberg (sic!) genug, um mei­ne Tex­te damit zu schrei­ben, aber das Text-Lay­ou­ting macht wie­der Spaß. Ich schrei­be mei­ne Blog­posts wei­ter in Ever­no­te. Mit­tels IFTTT-Auto­ma­tis­mus wird aus einer Ever­no­te-Notiz mit dem Tag #blog­post ein Ent­wurf im Guten­berg-Edi­tor. Zukünf­tig spa­re ich mir folg­lich läs­ti­ge Kopier­ar­beit.

End­lich kann ich auch klei­ne­re Tipp­feh­ler über das Smart­pho­ne kor­ri­gie­ren. Das habe ich genau ein und ein letz­tes Mal mit Wix pro­biert, wodurch mir der gesam­te Arti­kel zer­schos­sen wur­de. Eine gro­ße Erleich­te­rung für jeman­den wie mich, der viel unter­wegs erle­digt.

Fazit

Nichts bleibt beim Alten! Ich freue mich auf das „Tüf­teln“ und vor allem dar­auf, hier – in neu­em über­sicht­li­che­ren Gewand – mei­ne Tex­te zu ver­öf­fent­li­chen. Ich habe mir vor­ge­nom­men, mei­ne Tex­te zukünf­tig inter­ak­ti­ver zu gestal­ten und die tech­ni­schen Mög­lich­kei­ten nach und nach aus­zu­pro­bie­ren.


Zum neu­en RSS-Feed mei­nes Blogs geht es hier.

News­let­ter: Die Poli­ti­sche Wochen­schau
In der Poli­ti­schen Wochen­schau grei­fe ich aktu­el­le Ereig­nis­se aus Poli­tik und Wirt­schaft auf, die ich eines kri­ti­schen Bli­ckes unter­zie­he und (teil­wei­se) wis­sen­schaft­lich ana­ly­sie­re. Die Wochen­schau erscheint (meist) sonn­tags.

Den News­let­ter abon­nie­ren!