Meine Leitlinien fĂŒr das Erstellen von Webseiten

1. Vorwort

Als Beispiel fĂŒr die Darstellung meiner Leitlinien nehme ich hier WordPress als CMS. Ich versuche, soweit als möglich, wissenschaftliche GrundsĂ€tze und Erkenntnisse bei der Erstellung zu nutzen.
Diese Dokumentation wurde mit dem neuen „Gutenberg“-Editor erstellt.

2. Sicherheit

Bei der Konzeption einer Webseite, steht an erster Stelle die Sicherheit. Denn wer will ĂŒber einen Telefonanruf erfahren, das fremde oder politische Inhalte von Anderen auf der eigenen Webseite platziert sind. Ja, ist schon alles vorgekommen in meiner Praxis.
Oder wie kommt man auf das eigene WordPress, wenn Benutzername und Kennwort von jemand anderem geÀndert wurde? Dann wÀre ein auch Backup hilfreich um die Webseite neu zu erstellen.

2.1. Login

Login und Benutzername

Login / Benutzername / User mĂŒssen wie auch das Passwort / Kennwort aus allen folgenden Zeichengruppen bestehen:

  • Großbuchstaben
  • Kleinbuchstaben
  • anerkannte Sonderzeichen, wie ! “ ? $ % ^ & )
  • Ziffern
  • mindestens 24 Zeichen

Woraus der Benutzername und das Kennwort natĂŒrlich nicht bestehen sollte, aus Wörtern die in jedem Lexika vorkommen und erst recht nicht aus einem bekannten oder gar noch dem eigenen Namen. Aber das sollte schon als Grundwissen der Sicherheit vorausgesetzt sein.

Benutzername und angezeigter Benutzername des Autors

Beachte, dass der Login-Benutzername nicht dem angezeigten Autoren-Benutzername zu den BeitrÀgen identisch sein muss, aber trotzdem zugeordnet ist!

Login-URL

Die Login-URL maskiere ich wie folgendes Beispiel: „https://meinewebseite.de/K-j-3zp@mfq“. Das ist jetzt kein wirkliches Sicherheits-Highlight, macht den Angreifer jedoch schon unsicher.

2.2. SSL-VerschlĂŒsselung


Ohne VerschlĂŒsselung ĂŒber „https“ werden Webseiten-Inhaber bald keine Kontaktmails ĂŒber ihre Webseite erhalten. Denn wer sollte so dumm sein, wichtige Daten unverschlĂŒsselt durch das Internet zu jagen.

2.3. Backup

Ein Backup sollte zumindest nach jeder grĂ¶ĂŸeren Änderung, nach jedem neuen Beitrag oder jeder neuen Seite erstellt werden.
Was soll wie gesichert werden:

  • Inhalte, also Texte mit dem Plugin „WordPress Importer“ ĂŒber MenĂŒ „Werkzeuge“ und dann „Daten exportieren“
  • Medien sichern mit einem FTP-Programm, und zwar das Verzeichnis „wp-content“ → „uploads“
  • das CSS sichern mit copy und paste in eine Textdatei, zu CSS weiter unten mehr
  • zusĂ€tzlich könnte ĂŒber ftp noch das möglicherweise gekaufte Theme im Verzeichnis „wp-content“ → „themes“ gesichert werden

Somit sollte zumindest das Wichtigste fĂŒr den Ernstfall hinterlegt sein.

Beachte, ein Sichern der gesamten Verzeichnisstruktur von WordPress im Webspace, macht wenig Sinn, da einige Konfigurationen sich nicht ĂŒbertragen lassen auf eine wieder aufzubauende Webseite.

2.4. Plugins auf das wesentliche reduzieren

Nur wirklich genutzte Plugins installieren. Jede ĂŒberflĂŒssige Software kann einem Angriffsszenario dienen. Nach dem Ausprobieren von Plugins, die nicht genutzten wieder deinstallieren.

2.5. Javascript

Nicht nur der Scriptkiddie, auch andere, wie die Konkurrenz, versuchen sich am leichtesten Angriff.
Also konsequent den Einsatz von Javascript reduzieren.

2.6. Firewall und Antivirus

Es gibt fĂŒr sehr sicherheitsbewusste Menschen auch noch die Möglichkeit fĂŒr Firewalls und Antiviren-Maßnahmen.

3. Technik

Die Technik unterteile ich in Editor, HTML, CSS, Schriftquellen und Farben.

3.1. Editor

Bisher kam „TinyMCE“ als visueller Editor in WordPress, der mir sehr entgegen kam da ich ohnehin kaum den „Visuell“-Modus nutze, sondern den transprenten „Text“-Modus. Aber es ist wohl absehbar, dass der neue Editor „Gutenberg“ sein wird. „Gutenberg“ ist fĂŒr die geeignet, die keine Erfahrung mit HTML und CSS besitzen oder Semiprofessionelle die beispielsweise schnell und komfortabel 3 Spalten erstellen wollen mit unterschiedlichen Eigenschaften.

3.2. HTML

Wir sind derzeit bei der Version HTML5 angekommen, die im einfachen HTML-Syntax oder im strengen XHTML-Syntax, genutzt werden kann. Die Möglichkeiten sind unglaublich, auch daher ziehe ich den Text-Modus von Editoren vor.

3.3. CSS

Das eigene CSS ist am besten auch in einer eigenen Datei aufgehoben. Ich selbst nutze ein sehr kleines Plugin fĂŒr eigenes CSS. Das hat den Vorteil, dass das Theme schnell gewechselt werden kann und ich selbst immer die volle Kontrolle ĂŒber das Layout behalte.

3.4. Schriftquellen

Als Schriftquellen bietet sich der Online-Import zum Beispiel von Googgle-Fonts an. Doch man kann auch gekaufte oder andere freie Schriften auf dem eigenem Webspace per FTP hinterlegen.

3.5. GrundsÀtzliche Farben

Mindestens eine Grundfarbe muss vorhanden sein und von dieser ausgehend 1 bis 3 weitere Farben und zusĂ€tzlich Weiß und Schwarz. Die Grundfarbe kann entsprechend des eigenen Logos, des Logos eines Handwerkes beziehungsweise Dienstleistung oder dem Wappen einer Stadt oder Landes entsprechend, angelehnt sein.

4. Layout

4.1. Responsives Webdesign

Vor allem muss eine Webseite heute responsiv sein. Das heißt, sie passt sich selbst der Auflösung des Monitors und dem WiedergabegerĂ€tes an.

4.2. Einteilung der Seite

In jedem Falle sollten folgende Merkmale existieren:

  • eine Startseite
  • ein Impressum
  • eine Hauptnavigation
  • eine kleine Navigation fĂŒr Startseite, „Nach oben gehen“, Impressum, DatenschutzerklĂ€rung

Ob die Hauptnavigation oben, rechts oder links liegt, ist egal, nur unerwartet unten sollte sie nicht liegen.
Der Inhalt wird immer zentral angelegt. Ansonsten gilt es der Lesegewohnheit von Links oben nach rechts unten die PrioritÀten zu verteilen.
Die Hauptnavigation sollte nicht ĂŒberfrachtet werden und, als Faustregel, bei 1.024px Breite nicht umbrechen.

4.3. Benutzerfreundlichkeit

Wer auf der Startseite / Frontpage / Homepage seine Besucher schon mit Sliders und bewegtem Inhalt ĂŒberfordert, braucht sich nicht zu wundern, wenn diese schnell verlassen wird. Auf der Startseite sollten bis zu 3 wichtige Inhaltshinweise, auch Buttons, liegen, sonst ist auch hier die Aufmerksamkeitsspanne ĂŒberfordert.
Die Webseite sollte lesbar sein, dazu gehört auch die richtige Schriftart, beziehungsweise Schriftartenfamilie. Bei den hoher Auflösungen sollte der Text unbedingt mit Serifen dargestellt werden. Titel, Überschriften und Logos können dagegen plakativ Serifenlos dargestellt werden. Serifen sind nicht „alte“ Schriftarten, sondern Schriften mit „Charakter“ und somit bis zu 10x schneller vom menschlichem Gehirn zu erfassen. Wobei seriflose Schriften eine sehr anstrengende Art ist Inhalte zu vermitteln, da das Gehirn sich jeden einzelnen Buchstaben erkĂ€mpfen muss.
Telefonnummern können heutzutage mit einem Link zum sofortigem WÀhlen ausgestattet werden, das macht Smartphone-Nutzer zum schnellem Kunden.
Kontraste beachten, das auch sehgeschÀdigte Webseiten-Nutzer das Layout erleben können. Einfch einen Screenshot der Webseite erstellen und das Bild mal in Grautöne darstellen lassen, so hat man die Möglichkeit zu Empfinden wie einige sehgeschÀdigte Menschen die Webseite erfassen.
Doch auch das Gegenteil, zu hohe Kontraste, lÀsst die Inhalte unseriös erscheinen. Dasselbe gilt auch bei zu geringen Kontrasten, wie mittelgraue Schrift auf hellgrauem Hintergrund.

Zusammenfassung:

  • keine beweglichen Inhalte, zumindest auf der Startseite
  • 3 Hauptinhalte auf der Startseite
  • Serifen im Inhalte
  • Serifenlos nur Titel, Überschriften und Logos, hier können auch elegante Schriften, Handschriften oder „Schön“-Schrifen verwendet werden.
  • Telefonnummern, E-Mailadressen gleich mit Hyperlink zur sofortigen Nutzung versehen
  • Farben so auswĂ€hlen, das Sehbehinderte trotzdem Kontraste erkennen
  • angenehme Farbkompositionen, nicht zu hohe Kontraste und nicht zu geringe Kontraste

4.4. Farbberechnung

Die Farben werden entsprechend des Inhaltes der Webseite berechnet.
Ich nutze fĂŒr die Farben:

  • Beziehungen der Farben, wie Farbperspektiven, QuantitĂ€tskontrast und komplementĂ€re Farben
  • die kalte oder die warme Wirkung, entsprechend des Webseiteninhaltes
  • Farbgruppen, zum Beispiel von Flaggen, Wappen und Logos
  • Farbkataloge, meist den X11-Katalog, basierend auf RGB, und die sogenannten „websicheren“ Farben

4.5. Schriften

Schriften binde ich ausschließlich ĂŒber die externe CSS-Datei ein. Ansonsten habe ich Schriften schon oben in 4.2. Benutzerfreundlichkeit und in 3.4. Schriftquellen behandelt.

4.6. Bilder

Ein schwieriges Thema. Am besten nur eigene Bilder nutzen, damit die Rechtslage klar ist. Bilder nur wenig oder gar nicht dekorieren mit Schatten oder Rahmen. Das Bild selbst soll wirken.
Große Bilder sind beliebter als kleine Bilder.
Trotzdem keine Bilder hinter viel Text als Wallpaper, entspricht dann dem „Text im Bild“.
Die SpeichergrĂ¶ĂŸe der Bilder unbedingt klein halten, somit verringert sich die Ladezeit und die Frustration des Benutzers. Das gelingt mit der Reduzierung der Auflösung bis höchstens 1.200px x 1.200px und wenn es Logos oder technische Zeichnungen sind, auch mit der Verringerung der Farbanzahl. Beachte, Fotos im JPG-Format abspeichern und Zeichnungen / Logos im PNG-Format speichern. Profis können selbstverstĂ€ndlich das QualitĂ€ts-Format SVG nutzen, wenn es in WordPress freigeschaltet wurde.
Ein rundes Bild entspricht nicht der normalen Sehgewohnheit, daher einfach weglassen. Runde Logos wiederum sind erlaubt.
Auch Texte in Fotos platzieren ist keine gute Idee, denn das Bild wirkt nicht und der Text ebenso wenig. Logos mit Text ist wieder in Ordnung.
Beachte, wenn das Bild mit Schatten und Rahmen und runden Ecken und weiterem zuviel bearbeitet wird, ist das Bild in dem Hintergrund gerĂŒckt, also genau das Gegenteil, was erreicht werden sollte.

Zusammenfassung:

  • möglichst eigene Bilder nutzen
  • große Bilder, statt kleine Bilder
  • wenig bis keine Dekoration
  • Auflösung der Dimension bis 1.200 px und nicht grĂ¶ĂŸer
  • Fotos in JPG-Format
  • Logos/Zeichnungen im PNG-Format
  • keine runden Bilder
  • weniger ist mehr bei der Bildbearbeitung mit CSS

4.7. Tabellen und AufzÀhlungen

Wie bei Bildern gilt auch hier, der Inhalt ist wichtiger als die Dekoration. Bei grĂ¶ĂŸeren Tabellen hinterlege ich jede zweite Zeile mit einem sehr hellem Hintergrund, um die zusammenhĂ€ngenden Daten zu gruppieren. Ansonsten keine oder graue Linien zwischen den Zeilen. Die Tabellen-Überschriften sind meist durch das < th > -Tag schon gut dargestellt.
AufzĂ€hlungen sind mit den visuellen Modus der Editoren in WordPress fĂŒr Normalnutzer besser zu erstellen. Die schwarzen Bullets und Quadrate sind in den meisten FĂ€llen ausreichend.

5. Rechtliches

Wer eine „de“-Topdomain besitzt, ist rechtlich zu folgendem verpflichtet:

  • Ein Impressumvollen Vor- und Nachnamen
    ◩ mit voller postalischer Anschrift
    ◩ Kontaktmöglichkeit ĂŒber Telefon oder Fax, das tĂ€glich genutzt wird
    ◩ vollstĂ€ndige E-Mail-Adresse
    ◩ vorgeschrieben Anzeige von gewerblichen Daten
  • DatenschutzerklĂ€rung
  • SSL-VerschlĂŒsselung bei Kontakt zwischen Besucher und Betreiber der Webseite

DSGVO, Konsequenzen fĂŒr Verbraucher

Es gibt bisher nicht besprochene Konsequenzen fĂŒr den Verbraucher.

Warum sollten Unternehmen Daten vorhalten, von denen sie keinen Nutzen haben?
Werden bisher nicht genutzte Daten von Kunden gelöscht?
Jeder Verbraucher muss sich selbst um Datenhygiene kĂŒmmern!
Auch muss ein Backup-Konzept her!
Wichtige Daten mĂŒssen Sie selbst vorhalten!

WordPress hÀngt sich auf im Wartungsmodus

Problem
Wie im vorherigem Beitrag ein eher seltenes Problem. Wenn ein Plugin nicht aktualisiert wird oder aus anderen GrĂŒnden der Wartungsmodus sich nicht selbst ausschaltet.

Lösung
Mit FTP auf das Wurzelverzeichnis von der WordPress-Installation gehen und die versteckte Datei, erkennbar am fĂŒhrenden Punkt, .maintenance löschen. Nicht vergessen sich die versteckten Dateien anzeigen lassen, meist im MenĂŒ „Ansicht“ des FTP-Programms zu finden.

WordPress manuell aktualisieren

Problem
Das automatische Update wird von wp-admin/update-core.php verwaltet.
Trotzdem kommt auch ein solch mehrfach geprĂŒftes und gefixtes CMS mal ins Stolpern.
Die Fehlermeldungen können sein

  • Die Datei konnte nicht kopiert werden.

Lösung
Hier nun ein die Lösung um in jedem Fall ein aktuelles WordPress auf seinem Webspace zu nutzen.

  1. Wenn noch möglich, ein Backup der Inhalte und der Datenbank vornehmen, auch wenn es sich im Nachhinein als ĂŒberflĂŒssig herausstellt.
  2. Download der deutschen Version von WordPress ĂŒber https://de.wordpress.org/txt-download/.
  3. Entpacken der Zip-Datei, es wird ein Verzeichnis „wordpress“ erstellt.
  4. Aus diesem dekomprimiertem Verzeichnis das Unterverzeichnis wp-content löschen.
  5. Mit dem FTP auf den bisherigen Webspace zugreifen und außer
    • dem Verzeichnis wp-content und
    • den Dateien .htaccess und wp-config.php

    die gesamte WordPress-Installation löschen.

  6. Nun die neuen Verzeichnisse und Dateien aus dem dekomprimiertem Verzeichnis auf den Webspace hochladen.

WordPress missachtet W3C-Standards


Inhaltsverzeichnis

  1. Heute am Beispiel des Unterstrich von Hyperlinks, auch Selektor „a“
  2. Die Normung von HTML5 und CSS3 sind große Erleichterungen
  3. WordPress und die Ehrlichkeit
  4. Noch Open Source Software oder doch nicht mehr zu empfehlen
  5. Beispiel der Deklarationen „outline“ und „border“

Immer wieder werden von „WordPress“ bewĂ€hrte Standards missachtet. Hier im Theme „Twenty Sixteen“ von WordPress.org.


Heute am Beispiel des Unterstrich von Hyperlinks, auch Selektor „a“

Das CSS, Cascading Style Sheets, gibt dem Inhalt das Aussehen. Diese Trennung ist vom W3C, World Wide Web Consortium, auch genauso gewollt. Das CSS gibt es mittlerweile in der 3. Version und deckt fĂŒr die meisten Webdesigner auch gefĂŒhlte 99% der gewĂŒnschten Funktionen ab.


Die Normung von HTML5 und CSS3 sind große Erleichterungen

Wird ein Link gesetzt, so wird dieser sofort ohne weitere Layout-Einstellungen in der Farbe Blau und mit Unterstrich dargestellt. Außerdem bekommt der Mauszeiger die Form des Pointers zugewiesen. Das sind die 3 Standards die in jedem HTML-Dokument fĂŒr Hyperlinks schon vordefiniert sind. Der Unterstrich wird dabei von der Deklaration „text-decoration“ mit dem Wert „underline“ dargestellt.
Dieser Standard soll gewĂ€hrleisten, das nachfolgende Arbeiten an der Webseite und seinem CSS, ohne weiteren Aufwand und von jedem anderem Bearbeiter fortgesetzt werden können. Denn das schlussendliche Werk, fĂŒr das ein Webdesigner bezahlt wird, gehört dem Kunden.


WordPress und die Ehrlichkeit

Jetzt das Aber, aber warum versuchen Webdesigner diese Standards mit nicht konformen WinkelzĂŒgen auszuhebeln? Das bleibt wohl deren Geheimnis. Das es getan wird, das ist zweifellos Tatsache. Doch das es bei den empfohlenen und von der eigenen Plattform verbreitete Themes von WordPress sind, das ist Ă€rgerlich und widerspricht auch dem Gedanken von Open Source Software, nĂ€mlich der Nichtdiskriminierung, und dem wichtigstem Designprinzip, dem KISS-Prinzip.

In verschieden Themes, die von WordPress vertrieben werden, sind mir solche nicht standardkonformen Deklarationen von Elementen vorgekommen und sie Ă€rgern mich so sehr das ich nun einen Beitrag zum WordPress Standart-Theme „Twenty Sixteen“ schreibe. Denn hier wird der Unterstrich von Links erstellt mit „box-shadow: 0 1px 0 0 currentColor;“.

Versucht nun jemand diesen Unterstrich zu Ă€ndern oder zu entfernen wird er nicht fĂŒndig mit der Suche nach „text-decoration“. Bei einem anderem Theme von WordPress wird der Unterstrich mit „border-bottom“ erstellt, das zu dem selbem Ärger beim Webdesigner fĂŒhrt.


Noch Open Source Software oder doch nicht mehr zu empfehlen

Jetzt stellt sich mir die Frage, sind diese Themes denn dann ĂŒberhaupt noch Open Source Software und wenn nicht, dann sind diese auch nicht mehr zu empfehlen!

Beispiele
standardkonformer Hyperlink der W3C-Empfehlung
Hyperlink mit „border-bottom“
Hyperlink mit „box-shadow“
Es sind keine Unterschiede zu erkennen, genau das ist die fatale Situation, vor dem der Webdesigner steht. Zudem sind in dem Theme „Twenty Sixteen“ 6(sechs) CSS-Dateien mit 53kB, das entspricht etwa 9000 Wörter, da ist die Suche nach der entsprechenden Deklarationen schon sehr schwer.


Beispiel der Deklarationen „outline“ und „border“

Hier liegt kein Fehler vor, nur scheint „outline“ doch sehr redundant zu sein. Die Deklaration „outline“ ist ohne sie zu kennen nicht gleich von „border“ zu unterscheiden. Der Unterschied liegt darin, „border“ legt sich zuerst um den Inhalt und „outline“ beinhaltet „border“ und den Content. Aber einzeln gesetzt, ist „outline“ nicht von „border“ zu unterscheiden.

Hyperlink mit „border“
Hyperlink mit „outline“
Hyperlink mit blauer gepunkteter Linie fĂŒr „outline“ und roter Linie fĂŒr „border“

Einzelne Wörter in allen BeitrĂ€gen mit CSS ohne „class“ und „span“ formartieren

Oft besteht der Wunsch einzelne Wörter im Layout zu charakterisieren oder zu kennzeichnen. Bisher werden dafĂŒr die Optionen mit „class“, „span“, „div“ oder anderen Elementen genutzt.

Ich habe mir eine Methode erstellt wie dies auch ohne diese Element funktioniert, da zum Beispiel der Standard-Texteditor in WordPress solche Elemente nicht anzeigt.
einzelne-woerter-css3


Beispiele
1. Beispiel
Nutzen sie fĂŒr folgende Eingaben das Terminal.

... Eingaben das <em><strong>Terminal</strong></em>.

2. Beispiel
Nutzen sie fĂŒr Befehl fĂŒr die SystemĂŒbersicht inxi -Fxz.

... SystemĂŒbersicht <code>inxi -Fxz</code>.

Das dazugehörige CSS:
em strong { color:#c00; }
code { color: #00c; }

Telefonnummer direkt zum anwÀhlen

Die Internetnutzung durch Smartphones verlangt VerÀnderungen des Webdesigns um weiterhin oder anders Benutzerfreundlich zu sein oder zu verbessern.

Inhaltsverzeichnis

  1. Beispiel
  2. Symbole
  3. Verweise

Hier am Beispiel einer sofort anwÀhlbaren Telefonnummer direkt aus der Webseite heraus.
Mobil: 0172 – 3062373

Der entsprechende Code ist:

Mobil: <a href="tel:+491723062373">0172 - 3062373</a>

Symbole
Mit verschiedenen UTF-Symbolen ist das ganze auch noch individueller anzupassen.

AusfĂŒhrung Code
đŸ“± &#128241;
✆ &#9990;
☎ &#9742;
🖁 &#128385;
đŸ•œ &#128381;
📮 &#128244;

Das letzte Symbol wÀre geeignet um Ruhepausen in Kliniken, KindertagesstÀtten, Seniorenheime anzuzeigen oder andere sensible Orte zu kennzeichnen.


Verweise
http://unicode-table.com/de/search/?q=Phone
UTF8 mit Google suchen

SVG in WordPress einbinden

Diese Anleitung gilt auch fĂŒr andere Web-CMS.

Warum sind SVG-Dateien, also skalierbare Grafiken so interessant?
Weil diese schneller im Internet transportiert werden und sich somit die Webseite schneller öffnend. Außerdem entlastet es die Datenbank.

Vorsicht, nur selbst erstellte SVG-Dateien hochladen, den SVG-Dateien werden bewusst gesperrt um ausfĂŒhrbaren Code, der in SVG-Dateien versteckt werden kann, keinen Zugang zur Webseite und somit auch zu den Webseiten-Besuchern zu gewĂ€hren.

Hier am Beispiel des Farbrades mit 256 Farben.
Colorwheel-small

150 kB die Original-SVG-Datei
 65 kB als komprimierte PNG-Datei
 17 kB als optimierte JPEG-Datei
 20 kB als SVGZ-Datei, verlustfrei komprimierte SVG-Datei

Nun sieht es so aus, das JPEG die kleinste Datei ist und nicht die verlustfreie komprimierte SVGZ-Datei, aber JPEG hat die schlechteste QualitĂ€t und SVG ist das Original. Gerade fĂŒr Zeichnungen und Logos sind Artefakte wie in JPEG-Dateien keine Option!
Bei JPEG-Dateien besteht noch das Problem die Original-Datei aufzuheben, zusĂ€tzlich zur eingesetzten Datei mit den speziellen Abmessungen fĂŒr die jeweilige Webseite.


Um SVG-Dateien und auch komprimierte SVGZ-Dateien in WordPress zu nutzen, werden zwei Arbeitschritte benötigt.

1. muss dem Apache-Server mitgeteilt werden das diese Dateiformate, die zu Recht als gefÀhrlich eingestuft werden, zulÀssig sind.
.htaccess

AddType image/svg+xml svg svgz
AddEncoding gzip svgz

2. wird WordPress dieselbe Mittelung gemacht ĂŒber das aktivierte Theme.

/wordpress-webseite/wp-content/benutztes-theme/
functions.php

/* MIME-Type svg und svgz zulassen */
    function custom_mtypes( $uwd ){
        $uwd['svg'] = 'image/svg+xml';
        $uwd['svgz'] = 'image/svg+xml';
        return $uwd;
    }
    add_filter( 'upload_mimes', 'custom_mtypes' );

3. Im Header der Seite muss ein eventuelles „no-svg“ gelöscht oder auskommentiert werden.

WordPress WooComerce – Zu wenig PHP-Speicher

Problem:
Wenn Sie mehrere Artikel in WooCommerce einstellen und eine umfangreiche Konfiguration haben, kann schnell das vorgegeben Limit von 40MB ausgereizt sein.

Lösung:
In der eigenen WordPress-Installation können Sie mit Hilfe von FTP die Einstellungen optimieren.

1. Hier eine Bildschirmaufnahme [Screenshot] des Problems.
Auf der Bearbeitungsseite [Backend] sehen Sie beispielsweise unter WooCommerce, dann Systemstatus, unter dem Eintrag WordPress PHP-Memory Limit, die standardmĂ€ĂŸig eingestellten 40 MB.
WordPress_WooComerce_-_Zu_wenig_PHP-Speicher-01


2. Sie Auf Ihren Server mit einem FTP-Programm Ihrer Wahl, wie FileZilla, einlogen und
im Verzeichnis wp-includes die Datei defaults-constants.php zum Bearbeiten öffnen.
WordPress_WooComerce_-_Zu_wenig_PHP-Speicher-02


3. Setzen Sie diese Werte ein um einen Engpass im Speichermanagement auszugleichen:
Zuerst den 1. Wert WP_MEMORY_LIMIT auf 96M setzen.
Nun 2. Wert WP_MEMORY_LIMIT auf 128M setzen.
WordPress_WooComerce_-_Zu_wenig_PHP-Speicher-03


4. Falls wider Erwarten doch keine Änderung sofort sichtbar ist, kann
im WordPress-Wurzelverzeichnis die Datei wp-config.php zum Bearbeiten geöffnet werden.
WordPress_WooComerce_-_Zu_wenig_PHP-Speicher-04


5. Folgenden Eintrag können Sie hier unter den ersten großen Kommentar setzen:
define( 'WP_MEMORY_LIMIT', '96M' );
WordPress_WooComerce_-_Zu_wenig_PHP-Speicher-05

Nun sollte Ihr Onlineshop fĂŒr 1.000 Artikel und mehrere Bestellungen am Tag gerĂŒstet sein.

seriöse Webseite

Was eine seriöse Webseite ist, kann ich nur von meinen Standpunkt erklÀren und mit meiner Erfahrung seit 1996.

Hier eine Priorisierung

Technik der Webseite
1. zu aller erst soll die Webseite sich schnell öffnen
2. nur verbreitete und OpenSource-Technologien verwenden
3. aktuelle Versionen nutzen, wie HTML5, CSS3, PHP ab 5.4, MySQL ab 5.x
4. responsives Verhalten der Webseite
5. ein modernes CMS fĂŒr Erweiterbarkeit und Bedienbarkeit
6. Bildformate in der Reihenfolge PNG, JPG und GIF
7. Videoformate in der Reihenfolge OGV, WebM und MP4
8. Hohe Sicherheit fĂŒr die Besucher mit weitestgehendem Verzicht auf Javascript

Erste Seite der Webseite, auch Frontpage, Homepage oder Mainpage
1. soll sie sofort zum Thema kommen
2. Zielgruppe direkt ansprechen
3. kein großes Bild, siehe 1. bei Technik der Webseite
4. die Webseite muss auf einem Smartphone lesbar sein
5. Navigation muss sichtbar sein
6. Impressum muss erreichbar sein
7. keine Fremdwerbung

Inhalt der Webseite
1. eigene Bilder, gerne auch groß
2. Farben des Logos und dem Inhalt der Webseite angepasst
3. aktuelle Inhalte mit mindestens ein Beitrag jeden Monat
4. Fakten
5. Navigation des Verstehens, also auch Kategorien und Schlagwörter
6. AufzÀhlungen oder Tabellen statt SchachtelsÀtze
7. Downloads fĂŒr Dokumente nur in PDF-Format anbieten

Was nicht auf eine seriöse Webseite gehört
1. Flash
2. Klammern
3. AbkĂŒrzungen
4. Bindestriche, wenn nicht vorgegeben
5. mehrfachen Superlative
6. FĂŒllwörter
7. Werbephrasen