Migrate to "INITIO" template (Themewagon)

Projekt:

Umstieg von einer iframe basierten Website auf eine moderne HTML5 CSS3 open source platform mit responsive-Fähigkeiten. Vorteile: bessere user experience auf android-basierten Geräten, bessere Suchergenisse aufgrund verbesserter SEO-Eigenschaften. Die auf der Altseite verbreitet verwendeten .pdf-files sind nicht responsive. Sie sollen in Zukunft nur als download angeboten werden. Zusätzlich wird deren Kontent in html-Seiten migriert. Für diesen Migrationsschritt existieren keine  brauchbaren tools.

Der Aufwand für den Umstieg wird durch Auswahl eines geeigneten templates deutlich verringert. Weit verbreitet sind die freien one-pager-templates von bootstrap. Diese Seiten passen sich flüssig an die Bildbreite des Geräts an, d.h.  es wird keine spezielle mobile-Version erzeugt. Für die Transition und die Bild-Animation wird das betagte java script jquery eingesetzt. Wer diese templates tiefgreifender modifizieren will, weil sie nicht ganz wie gewünscht funktionieren, wird nicht immer umhin können, diese java script dateien zu überarbeiten. Die css- und js-ressourcen von bootstrap werden über url zur Laufzeit hinzugeladen, ebenso die awesome- bzw. glyphicon iconfonts. Im Fall einer Modifikation ist es aber ebenso möglich, diese Dateien lokal zu speichern, die Modifikationen in neuere git-Versionen einzuarbeiten, erst zu testen und dann hochzuladen.

Nach dem Download eines geeignet erscheinenden templates kann das .zip-file in einen workspace  entpackt werden. Sämtliche Ressourcen sind enthalten. Es kommt jeweils eine les- und editierbare css bzw. js-Datei und eine laufzeitoptimierte css-min bzw. js-min Datei mit. Vorsicht beim Verwenden dieser Dateien aus anderen templates: diese können unterschiedliche Versionen haben und anderes Verhalten bewirken.

Die Reihenfolge von css- und js-Dateien sollte nicht umgestellt werden, da Abhängigkeiten bestehen. Aus Laufzeitgründen werden in den templates die js-Dateien an das Ende des HTML bodies gestellt.

Was sind die Anforderungen? Gewünscht ist eine Seitenstruktur nach Art eines "Portfolio"-Auftritts. Die Auswahl fiel auf "initio" von Themewagon. Das Template hat eine Hauptseite und bietet über ein leicht erweiterbares Menu mehrere Nebenseiten an.

Support / Bugs (siehe https://github.com/pozh/Initio/issues )

1. Nach einem switch von Menuzeile auf Menuebutton (passiert beim Einschränken der Bildbreite auf mobile-Format) klappt der Menubutton  on_click nicht auf! Der Fehler ist bekannt und behoben, aber auf der Downloadseite von Gettemplate nicht erwähnt. Die Lösung mit Angabe der codelines findet sich in github

2. Unschönheit: Die Menueinträge sind nach Aufklappen des Menubuttons nicht vertikal bündig ausgerichtet (wohl aber bei sub menues)

3. Unschönheit: Die Darstellung des Hintergrundbildes bg_head ist  nicht optimal. Mal wird bei Änderung der Bildbreite abgeschnitten, mal beim Scrolldown der Seite teilweise wiederholt. Das ist auch beim template-background schon festzustellen (Die Bildwiederholung lässt sich leicht über einen parallax-Parameter abschalten).

4. Ist das template im small media mode, gehen den footer icons die links verloren (Kann leicht durch ein zusätzliches <br> behoben werden).

Migrate from http to https

Projekt:

Umstieg auf https

Blockierung gemischter Inhalte (mixed content)

Migrierte Seiten enthalten externe links mit ungesichertem Aufruf (http:...). Dies führt beim https-Aufruf zu einer verknüppelten Anzeige von Seiten im browser. Firefox, Chrome und Explorer zeigen Seiten, die unter bootstrap erstellt wurden, ohne CSS, JS und icons an. Im Originaltemplate werden die betreffenden Seitenelemente über einen externen http-link geladen. Diese Seitenelemente werden standardmäßig vom browser blockiert. Diese Aufrufe müssen unter https allesamt umgestellt werden. Die firefox console kann beim Aufspüren dieser links helfen.
Nützliche links:
Wie-beeinflussen-Inhalte-die-nicht-sicher-sind-meine-Sicherheit
Site_mit_gemischten_Inhalten

Redirect Suchergebnisse

  Suchergebnisse, die auf alte Seiten verweisen, und nun ins Leere verweisen, können auf die neuen Seitenadressen umgeleitet werden (redirect 301). Weiterleitungen können in der Webserver-Konfiguration hinterlegt werden, allerdings beeinträchtigt dies die Performance. Für Apache kann dazu die versteckte Datei .htaccess genutzt werden. Zu beachten ist, dass nach dem Hochladen der Server die Datei u.U. nicht anzeigt. Abhilfe: Versteckte Dateien im Explorer und im ftp-Programm sichtbar machen: In Filezilla folgende Menuepunkte Ansicht/Verzeichnisfilter oder Server/Auflistung versteckter Dateien erzwingen. Auf jeden Fall führt Server/Dateisuche auf Server zum Erfolg.

Blog abonnieren