Blog von F/X Web Consulting auf SSL (HTTPS) umgestellt

HTTPS-gesicherte Verbindung

Ab sofort via SSL erreichbar: https://www.muenchen-webdesign.de

Nach unserer Umstellung auf SSL/HTTPS sieht es nach dem Aufruf der Site in der Google Chrome Browser-Adresszeile ab sofort erfreulicherweise so aus:

Screenshot Browser-Adressleiste mit SECURE-Vermerk: www.muenchen-webdesign.de ab sofort nur noch per SSL/HTTPS erreichbar

Was ist SSL bzw. TLS?

SSL (Secure Sockets Layer – die alte Vorgängerbezeichnung) bzw. TLS (Transport Layer Security – die heute gängige, neue Bezeichnung) ist ein hybrides Verschlüsselungsprotokoll zur sicheren Datenübertragung im Internet. TLS-Verschlüsselung wird heute vor allem in Verbindung mit HTTPS für den Zugriff auf Webseiten, aber auch Webservices oder z.B. für den Zugriff auf Office 365 (Outlook Web Access, OWA) eingesetzt.

Im Unterschied zum unverschlüsselten Zugriff auf Webseiten via HTTP werden beim Zugriff via HTTPS sämtliche Daten zur und von der Website verschlüsselt übertragen. Beim unverschlüsselten Datentransfer können diese von Hackern im Internet “abgegriffen” und natürlich entsprechend missbräuchlich verwendet werden – beim verschlüsselten Datentransfer jedoch hat der Hacker im Normalfall keine Chance.

Insbesondere Betreiber von Online-Shops achten in der Regel darauf, dass der Shop nur über HTTPS erreichbar ist – denn hier werden im Rahmen von Kauftransaktionen sensible Kundendaten (Name, Adresse, Kreditkartendaten, etc.) übertragen, und wenn dies verschlüsselt erfolgt, sind die Daten des Kunden geschützt.

Allerdings ist die SSL/TLS-Verschlüsselung auch nur sicher wenn das zugehörige Zertifikat von einer vertrauenswürdigen Zertifizierungsstelle ausgestellt wurde. John Mueller von Google macht dazu in einem Google Webmaster Hangout sehr interessante Aussagen: https://youtu.be/AdzlHxRJpak?t=1015

Hier finden sich mehr Informationen zu TLS auf Wikipedia.

Warum die Umstellung auf SSL?

Wir hatten ja schon seit längerem unsere F/X Web Consulting Unternehmens-Website auf SSL umgestellt, nachdem im August 2014 bekannt geworden war, dass Google Webseiten mit SSL im Ranking bevorzugt (englischer Artikel im Google Webmaster Central Blog: HTTPS as a ranking signal) – also ein wichtiger Baustein für die Suchmaschinenoptimierung (SEO).

Aber natürlich auch deshalb,weil wir dort ein Kontaktformular sowie ein Registrierungsformular für unseren F/X Web Consulting Newsletter (unsere F/X-News) vorhalten, und wir sichergehen wollten, dass die in den Formularen eingegebenen Daten nach dem Absenden verschlüsselt übertragen werden.

Nicht zuletzt gibt es noch einen Vorteil: der Abruf der Seiten wird schneller! Das sorgt für zufriedenere Besucher (speziell auf Smartphones/Tablets ohne LTE) und ist auch ein wichtiger Suchmaschinenfaktor. Das klingt im ersten Moment unlogisch, schließlich benötigt die Ver- und Entschlüsselung zusätzliche Rechenzeit. Aber es wird klar wenn man weiß, dass die meisten Webserver für die verschlüsselte Verbindung Googles SPDY-Protokoll, eine Alternative zu HTTPS, verwenden – und diese ist bereits standardmäßig verschlüsselt.

Da ein SSL-Zertifikat in der Regel je nach Validierungsstufe (siehe auch Extended-Validation-Zertifikat) einige Kosten verursachen kann, und wir hier auf unserem Unternehmens-Blog keine Formulare einsetzen oder sensible Transaktionen erfolgen, hatten wir bisher auf die Umstellung verzichtet.

Nun geht Google aber mit seinem Chrome Browser noch einen Schritt weiter, und warnt ab Januar 2017 im Chrome Browser ab Version 56 den Browser-Nutzer vor Webseiten ohne SSL-Zertifikat- das sieht dann wie folgt aus:

Screenshot: Google Chrome - Anzeige Not Secure in der Browser-Adressleiste

Hier auch ein Artikel dazu auf dem dogado-Blog. Und Google plant offensichtlich, die Warnhinweise im Browser schrittweise auszuweiten. Es bleibt abzuwarten, ob andere Browser-Hersteller nachziehen…

Nachdem wir unsere (Erst-)Besucher aber keinesfalls verschrecken wollen, haben wir uns nun auch auf www.muenchen-webdesign.de an die Umstellung gemacht.

Die Umstellung auf SSL (HTTPS) in der Praxis

Was war also zu tun?

Folgende Schritte mussten wir nach und nach erledigen, um die Umstellung hinzubekommen.

  1. Bei unserem Website-Provider einen Certificate Signing Request (CSR) erstellen
  2. Mit dem CSR bei einer Zertifizierungsstelle das SSL-Server-Zertifikat für www.muenchen-webdesign.de besorgen
  3. Das ausgestellte SSL-Zertifikat bei unserem Provider hochladen
  4. Das hochgeladene Zertifikat in den Website-Einstellungen der Domain zuordnen (damit es auch verwendet wird)
  5. Die .htaccess-Datei unserer Website so anpassen, dass automatisch immer (also auch bei Eingabe von http://www.muenchen-webdesign.de ohne ‘s’) immer auf die HTTPS-Variante weitergeleitet wird
  6. Die wp_config.php von WordPress mit Hilfe der entsprechenden DEFINE-Befehle auf HTTPS umstellen und hochladen:
    define('WP_SITEURL', 'https://www.muenchen-webdesign.de');
    define('WP_HOME', 'https://www.muenchen-webdesign.de');
  7. Nach dem ersten Aufruf der Website mit HTTPS alle Seiten und Beiträge nach “alten” Verlinkungen auf Ressourcen (Seiten, Beiträge, Bilder) von unserer eigenen Website durchforsten und korrigieren. Wenn man eine umfangreiche Website hat, empfiehlt es sich, diesen Schritt bereits vor der Umstellung umzusetzen – denn je nach Umfang der Inhalte kann das eine Weile dauern, falls man nicht schon zuvor konsequent “sauber” gearbeitet hat (also bei Ressourcen der eigenen Website relative Links verwendet). Hierbei sind uns dann auch gleich zwei Schwächen von WordPress aufgefallen, dazu aber weiter unten mehr.
  8. Nach der Korrektur aller Links die Website nochmals mit Google Chrome, Mozilla Firefox und Microsoft Internet Explorer 11 sowie Microsoft Edge geprüft – alles gut!

Nun müssen wir nur noch Google über die Google Search Console “mitteilen”, dass sie uns künftig über HTTPS indizieren sollen.

Worauf man vor der Umstellung achten sollte

Bei Verlinkungen auf eigene Ressourcen (also interne Links auf Seiten der eigenen Website und Bilder, die auf der eigenen Website liegen) sollten Sie nach Möglichkeit nur relative Links verwenden. Verlinken Sie also nicht per absolutem Link (Beispiel: http://www.domain.tld/meine-unterseite/index.html) sondern per relativem Link auf /meine-unterseite/index.html.

Warum? Weil spätestens nach der Umstellung auf SSL, sprich HTTPS, die Browser bemängeln, wenn innerhalb einer Seite einer Website auf eigene Ressourcen mit HTTP verlinkt wird (sogenannte “gemischte Inhalte”oder auf Englisch “mixed content”).

Ganz besonders deutlich sieht man dies im Internet Explorer, der dann diese via HTTP verlinkten internen Inhalte erst gar nicht anzeigt, sondern stattdessen dem Browser-Nutzer am unteren Bildschirmrand die Fehlermeldung “Nur sicherer Inhalt wird angezeigt” präsentiert:

Screenshot: Internet Explorer Meldung bei Verwendung von SSL und mixed content: Nur sicherer Inhalt wird angezeigt

WordPress-Eigenheiten

Im Rahmen der Umstellung auf SSL sind uns zwei WordPress-Eigenheiten aufgefallen, auf die man achten muss. Die betrifft allerdings nur Website-Betreiber, die ihre Website bislang ohne SSL betrieben haben. Wer von vornherein seinen WordPress-Blog mit SSL eingerichtet und betrieben hat, den betrifft dies nicht (so lange er keine expliziten internen HTTP-Links verwendet).

Absolute Links (URLs) auf interne Seiten und Blog-Beiträge

Werden in WordPress Links auf eigene (interne) Seiten oder auch Blog-Beiträge erstellt, so nutzt WordPress hierzu leider immer absolute Links. Beim noch relativ neuen Inline-Link-Editor in WordPress sieht das dann so aus:

Screenshot: WordPress - Inline-Link-Auswahl (behindert die Umstellung auf SSL)

Nach der Auswahl des Eintrags “Blog & News” trägt WordPress den absoluten Pfad zur Seite als Link ein:

Screenshot: WordPress - Inline-Link-Auswahl (behindert die Umstellung auf SSL)

Diesen Pfad müssen Sie nun korrigieren und den Teil vor dem benötigten relativen Link entfernen. Zuletzt dann die Änderung mit dem Pfeilsymbol-Button speichern:

Screenshot: WordPress - Inline-Link korrigiert (so klappt auch die Umstellung auf SSL)

Die Einbindung von Bildern aus der WordPress-Medien-Bibliothek betrifft dies nicht. Hier handhabt WordPress die Umstellung von HTTP auf HTTPS im Hintergrund “automatisch” korrekt.

Gravatar-Bild

Auch ein eventuell hochgeladenes Gravatar-Bild wird von WordPress mit einem absoluten Link eingebunden. Hier müssen Sie nach der Umstellung auf SSL bei den Benutzern das Profilbild neu hochladen. Leider gibt es keine andere Möglichkeit den absoluten Link auf einen relativen Link zu ändern.

Fazit

Insgesamt haben wir für die Umstellung gerade einmal drei Stunden benötigt, dann war die “Operation” geglückt. Nur gut, dass wir in der Vergangenheit schon vorausschauend mit relativen Links gearbeitet hatten.

Nun sind wir natürlich auch gespannt und neugierig darauf, ob sich das Ranking unseres Unternehmens-Blogs in Google “spürbar” verbessern wird.

Haben Sie bereits Erfahrungen in der Umstellung von WordPress-Seiten auf SSL gemacht? Kennen Sie Tools, Tipps & Tricks für die Umstellung?

Dann nutzen Sie bitte die Kommentarfunktion unter diesem Beitrag und berichten Sie uns davon!

 

Portraitbild Franz X. Kohl
Über Franz X. Kohl 58 Artikel
Inhaber von F/X Web Consulting (www.fx-web.de) und Betreiber des Unternehmens-Blogs www.muenchen-webdesign.de

Ersten Kommentar schreiben

Antworten

Deine E-Mail-Adresse wird nicht veröffentlicht.


*