Homepage selbst pflegen, Texte und Bilder (Medien) einstellen – Mobile fähig (responsive webdesign Kriterien). Ob business website, Photo Homepage oder Blog – WordPress ist die richtige Wahl!

Thema: OpenSSL-Sicherheitslücke

Im Fernsehen, Radio und Online wird derzeit ausführlich über eine bestehende Sicherheitslücke (Heartbleed) in so genannten „OpenSSL-Zertifikaten“ berichtet. Durch eine Programmier Nachlässigkeit konnte das Zertifikat ausgelesen werden. Wahrscheinlich verschafften sich somit Hacker Zugang zu abgesicherten Servern und konnten so Dateien abgreifen. Diverse Anbieter schloßen diese Lücke allerdings gleich nach Bekanntwerden, wie z.B. die GLS Bank und manche tauschten proaktiv alle Sicherheitszertifikate aus.
Das trifft aber vielleicht nicht auf alle Anbieter zu, eine Übersicht hat mashable aufgelistet. Hier Mashable (englisch) […]  gibt es eine Übersicht, bei welchen Anbietern dringend die Passwörter ändern geändert werden sollten und wie die offiziellen Stellungnahmen dazu lauten.

Große Namen wie Facebook, GMail und Yahoo sind darunter. Ebenso wordpress.com! Die allerdings laut Twitter unmittelbar reagiert haben: „We took immediate steps, and have addressed the Heartbleed OpenSSL exploit on“

Wie Sie Ihre WordPress Seite oder WordPress Blog sicherer machen, insbesondere wenn kein „https“ verwendet wird, lesen Sie hier […]

 

Wie speichern / verwenden Sie Bilder auf ihrer Website?

Sind ihre Bilder richtig, d.h. fürs Internet optimiert abgespeichert? Viele wissen nicht, wie man Bilder richtig optimiert und auch nicht, daß sie großen Einfluss auf die Geschwindigkeit ihrer WebSeite / ihres Blogs haben. In diesem Artikel beschreibe ich, wie Sie Bilder für das Web optimiert aufbereiten und warum.

Jeder Blogging-Experte / Webseiten Experte weiß, das der Einsatz von Bildern generell die Besucher ihrer Website zu mehr Verweildauer anregt. Doch was sie nicht sagen, ist dass der Einsatz von „nicht fürs web optimierten Bildern“ Ihre Website sehr verlangsamen kann. Und das mögen weder ihre Besucher noch Suchmaschinen wie Google & Co.

Nach Strangeloop kann eine Verzögerung von einer Sekunde  7% des Umsatzes kosten, zu 11% weniger Seitenaufrufen führen und auch Kundenzufriedenheit nimmt bis zu 16% ab.

Strangeloop Grafik

Strangeloop Grafik

Bilder fürs Internet optimieren – wie geht das?

Beim Abspeichern von Bildern sind Sie zwei Dinge zu beachten : 1. Bilddateiformat und 2.Kompression.
Durch die Wahl der richtigen Kombination , können Sie die Bildgröße ca. 5-fach verringern.

Bilddateiformat: dafür kommen derzeit nur zwei Bildformate in Frage: JPEG und PNG. Natürlich können Sie auch GIF verwenden, aber der Einsatz von GIF Bildern wird vom besseren PNG Format abgelöst. Um es einfach zu halten verwendet man JPEGs für Fotos oder Bilder mit viel Farbe und PNGs für einfachere Bilder / Grafiken, die z.B. auch Transparenz benötigen.

Kompression:  um Bilder für das Web optimiert abzuspeichern, ist die richtige Einstellung der Kompression entscheidend und kann einen großen Unterschied ausmachen. Nicht jedes JPEG Bild ist auch schon fürs Web optimiert. So sind Digital Kamera Bilder zwar im JPEG Format, aber immer noch zu groß für eine Webseite. Mit dem richtigen Einsatz von Bilddateiformat und Kompression  können sie diese bis zu fünf-fach verkleinern ohne nennenswerten Qualitätsverlust.

Übrigens – auf KulturDesign-Stanko.de kommen hauptsächlich JPEGs zum Einsatz.

Photoshop optimimiert JPEG High 33 KB
Adobe Elements optimiert 57 KB
JPEG Mini optimiert 70 KB
Photoshop optimiert JPEG Max 93 KB
Nicht optimiertes JPEG Max 119 KB
Photoshop optimiert PNG 135 KB
Adobe Elements PNG 145 KB

Bildkomprimierungs Werkzeuge / Programme

Adobe Photoshop ist eine Premium Software, die mit einer Funktion ausgestattet ist, um Bilder für das Web optimiert abzuspeichern. Öffnen Sie einfach Ihr Bild und klicken dann auf die Datei> Speichern für Web und Geräte-Taste.

Dann öffnet sich ein Detailfenster. Dort können Sie verschiedene Bildformate einstellen. Für JPEG-Format gibt es verschiedene Qualitäts Optionen. Wenn Sie eine der Optionen auswählen, wird die Datei-Größe auf der rechten unteren Ecke angezeigt, bevor sie abspeichern.

Adobe Photoshop Elements ist eine einfachere, abgespeckte Version und um ein vielfaches günstiger –  die aber mit der gleichen Web-Funktion ausgestattet ist, um Bilder für das Web optimiert abzuspeichern. Für den kleinen Geldbeutel auf jeden Fall meine Empfehlung!

Gimp ist eine Open Source Software, die ebenfalls ihre Dienste für die Web-Optimierung von Bildern leistet. Wer vorerst kein Geld in die Hand nehmen will, ist hier bestens bedient. http://www.gimp.org/

Smush.it ist ein speziell für WordPress entwickeltes Plugin, daß ich im Moment teste und demnächst mehr dazu schreibe. Die Idee: man kommt ganz ohne zusätzliche Software aus… wir werden sehen :-)

Hinweis: Da Photoshop ziemlich teuer ist, kann man getrost auch zu Alternativen greifen. GIMP ist eine kostenlose Alternative. Andere Produkte wie Adobe Elements, Adobe Lightroom oder Adobe Fireworks erledigen den Job ebenfalls hervorragend.

TinyPNG

TinyPNG ist eine kostenlose Web-App, die die Größe schon bestehender PNG-Dateien nochmal reduzieren kann. Alles was Sie tun müssen, ist auf die Webseite zu gehen, dort laden Sie Ihr Bild hoch. Das Bild wird dann von der App komprimiert und bekommen dann den Download-Link angezeigt.

Mini JPEG

Die JPEGmini Technologie verwendet eine erneute Komprimierung, mit der Sie die Größe der Bilder nochmal deutlich reduzieren können , ohne daß ihre Wahrnehmungsqualität leidet . Sie können eine Web-Version kostenlos nutzen oder kaufen das Programm für Ihren Computer.  Ebenfalls gibt es eine API , wenn sie den Autmations-Prozess für Ihren Server einsetzen wollen.

ImageOptim

ImageOptim ist ein Mac -Programm, mit dem Sie Bilder ohne Qualitätsverlust fürs Web optimieren können, indem sie die besten Kompressionsparameter einstellen und dazu unnötige Farbprofile entfernen. Eine Windows Alternative dazu ist Trimage.

Wie Sie sehen können gibt es mehrere Tools, die Sie verwenden können, um Bilder für das Web zu optimieren. Bei der Verwendung von Photoshop Kompressionen bekommen Sie meiner Ansicht nach die besten Ergebnisse in der Größe und Qualität . TinyPNG war ein klarer Sieger für die Speicherung jeder Art von PNG im Internet.

Abschließende Gedanken zur Bildoptimierung

Wenn Sie bisher die Bilder / Photos noch nicht für das Web optimiert haben, dann starten Sie jetzt damit! Denn es hat definitiv einen großen Einfluß auf die Geschwindigkeit Ihrer Website und die Besucher werden es Ihnen ebenfalls danken. Auch wenn die Bildqualität ein wenig sinkt, was aber die meisten Nutzer nicht bemerken bzw. sehen.

Wie Sie hochwertige Bilder im Internet suchen und auf ihrer Website einsetzen – dazu finden Sie in meinem nächsten Artikel entsprechende Links und Beschreibungen (auf englisch-sprachigen Seiten)

Eine Alternative ist auch CDN (content delivery network), um Bilder für Ihre WordPress-Seite deutlich schneller zu machen. Auch dazu mehr in einem kommenden Artikel.

Wenn Sie diesen Artikel hilfreich fanden erzählen Sie es ihren Freunden oder teilen Sie diesen Artikel. Wenn Sie Fragen haben, dann hinterlassen Sie einen Kommentar. Vergessen Sie auch nicht, uns auf Twitter und Google+ folgen

Gewinner sind dann nicht nur Sie und ihre Website, sondern auch die Nutzer von Smartphones, die immer mehr das Internet bevölkern und im Web surfen. Eingeschränkte Bandbreiten und zum Teil erhebliche Internet Streaming Kosten verleiden es aber vielen und so tragen sie mit einer optimierten Website zu einem besseren Internet bei :-)

Dieser Artikel ist eine freie Übersetzung eines wpbeginners Artikels – mein herzlicher Dank an die Redaktion und die Inspiration.

Artikel UPDATE am 11.April 2014
Um es den Hackern und Deppen dieser Welt nicht allzu leicht zu machen, sollte der WordPress Anfänger ein paar Dinge beachten. Sieben Tipps, bzw. Änderungsvorschläge für Einsteigerwer alle dieser Fehler schon begangen hat, kann sich gerne an unsere mich wenden :-)

  1. Admin als Benutzername verwenden (Einstellungen / Benutzer)
  2. Als Admin schreiben / Einträge verfassen (Einstellungen / Benutzer)
  3. Verwenden Sie sichere Passwörter
  4. Kein bzw. „falscher Blog-Seiten-Untertitel“ (Einstellungen / Allgemein)
  5. Permalink Struktur unverändert lassen (Einstellungen / Permalinks)
  6. Tabellenpräfix  zu einfach / Standard-Einstellung (wp_)
  7. WordPress, Plugins und Theme aktuell halten

HINWEIS: Kein System ist zu 100% sicher!, aber durch die richtigen Maßnahmen sind Sie auf einem sicheren Weg…

1. „Admin“ als Benutzername (Einstellungen / Benutzer)

Auf jeden Fall ist das einer der häufigsten Fehler, der auch darum immer wieder auftritt, da WordPress standardmäßig diesen Benutzernamen beim Erstellen eines neuen Blogs / einer neuer WordPress Seite vorschlägt. Dieser hat zudem gleich alle Administratoren-Rechte, was gerade deshalb für die Hacker von großem Reiz ist. Und wenn Du als Benutzer noch ein schwaches Passwort wählst, freuen sich die Skript-Kids und professionellen Hacker dieser Welt und betreten oftmals ganz einfach Deinen Administrationsbereich. Aus diesem Grund mußt du neben einem guten Passwort (am besten Zahlen, Buchstaben – in Klein- und Großschreibung und Sonderzeichen) auch einen eigenen Login-Namen für deinen WordPress Admin-User aussuchen. Auch wenn du diesen schon angelegt haben solltest, so kannst Du im WordPress backend Artikel (Beiträge) nachträglich einem anderen admin-user zuweisen und anschließend die Rechte des ursprünglichen admins beschneiden, wenn nicht sogar löschen.

2. Als admin posten (Einstellungen / Benutzer)

Aus dem Punkt 1 ergibt sich die Wichtigkeit den Administrator-Benutzernamen hinter deiner WordPress Installation zu verstecken. Denn wenn Du nun Beiträge als Administrator schreibst, hast Du nichts erreicht und kannst genauso gut den oben beschriebenen Fehler belassen. Es ist also klar, daß der Admin-Benutzer nur für die Arbeit am Backend zu verwenden ist und ein Benutzer mit weniger Rechten (Editor, Autor, …)  für die Erstellung von Beiträgen ( Artikeln ) zu verwenden ist. Zunächst etwas mehr an Aufwand, aber eben sicherer.

3. Verwenden Sie sichere Passwörter

Auch wenn es schwerer zu merken ist, das Passwort sollte immer ausreichend lang sein (mind. 8 Zeichen!). Es sollte nicht zu erraten sein (also keine echten, bekannten Wörter wie Geburtsdaten oder Namen) und auf jeden Fall eine Zahl und ein Sonderzeichen beinhalten (€_@%!“&/()$%=+*#-). Ein gutes Beispiel wäre zum Beispiel: D8e!%_20*14?.  Durch Sicherheits-Plugins, wie zum Beispiel Better WP Security kann man sichere Passwörter für Benutzergruppen als Pflicht einstellen.

4. Kein bzw. „falscher Blog-Seiten-Untertitel“ (Einstellungen / Allgemein)

Es gibt leider einige Themes, die den Untertitel der WordPress-Site nicht ausgeben. Falls Du eines dieser Themes nutzt, denkst Du vielleicht, dass er auch nicht eingestellt werden sollte (da eh nicht sichtbar). Das ist falsch! Die Suchmaschinen wie Bing, Yahoo oder Google registrieren und speichern den Untertitel zu deiner Site, dabei ist es unbedeutend, ob er auf der Seite angezeigt wird oder nicht. Geändert wird der Untertitel hier: „Einstellungen -> Allgemein“. Standardmäßig gibt WordPress „Just Another WordPress Site“ aus, was natürlich nicht besonders individuell ist ;-)

5. Permalink Struktur (Einstellungen / Permalinks)

Nach der Erst-Installation ist Deine Seite mit WordPress bereit für die Erstellung von eigenen Artikeln (Beiträgen) und Seiten. Standard ist eine URL mit Zahlen und Platzhaltern wie z.B. „http://www.individual-seite.de/?p123“. Das sieht sehr schräg und unschön aus, was aber schlimmer ist: das kann sich auch negativ auf dein Suchmaschinenranking bei Google auswirken.
Dabei ist die Änderung der Permalink-Struktur eine Sachen von ein paar Minuten und sollte am besten gleich nach der Installation vorgenommen werden. Unter Einstellungen/Permalinks kannst du die Link-Struktur Deiner Website / deines WordPress Blogs ganz einfach einstellen. Die von SEO Experten bevorzugte Einstellung ist dabei: „http://www.individual-seite.de/name-des-artikels“.

6. Tabellenpräfix  (wp_) (wp-config.php)

Genau wie der Admin-Name, ist das Standard-Tabellenprefix für die Datenbank von WordPress eine allgemeine Voreinstellung und sollte beim Aufsetzen des Blogs / der Seite schon geändert werden. Wenn all die Konfigurations Einstellungen in der wp-config-sample.php eingetragen und anschließend als wp-config.php abgespeichert werden, ist das die beste Möglichkeit spätere Datenbank Anpassungen zu vermeiden. Du setzt also ein kompliziertes Präfix (zB. „wp_934tqlmgeX“ ) ein. Später benöitigst du es eh nicht mehr, da es fix in der Datenbank eingetragen ist und dann mit Aufwand geändert werden muß.

7. WordPress, Plugins und das Theme aktuell halten

Wenn Sie die oben beschriebenen Sicherheitsmaßnahmen durchführen wollen, aber ein komplett veraltetes System mit uralten Plugins oder Themes einsetzen, hilft das nicht wirklich weiter.  WordPress macht es einem heute ziemlich leicht, immer auf dem aktuellsten Stand zu sein. Die aktuelle Version 3.8 läßt sich z.B. so einstellen, daß sich WordPress im Hintergrund selbst aktualisiert. Das gilt allerdings nicht für Plugins und individuelle Themes. Diese werden vom Admin durch einfache Routinen aktuell gehalten. Vorher ist es aber immer ratsam, ein Backup durchzuführen. Wie das geht lesen Sie hier (englisch) […]

Brauchen Sie Hilfe bei den Maßnahmen? Ich helfe gerne […]

http://kultur-design.com/wp-content/uploads/2013/08/IMG_1323.mov

Die aktuelle WordPress Version 3.6 (Oscar) steht zum Download bereit

Unter der Motorhaube finden wir ein neues Standard Theme: Twenty Thirteen, das den Schwerpunkt auf die einfache Content Erstellung im einspaltigen Design legt. Im Bereich Media sind einige Neuerungen hinzugekommen wie:

Neues Theme: Twenty Thirteen

Natürlich ist das Theme Twenty Thirteen nach allen Regeln des „responsive webdesigns“ erstellt und sieht demnach ziemlich cool auf allen Geräten aus, egal ob groß oder klein – sei es der heimische MAC oder PC, der Laptop oder das iPad und selbst auf dem iPhone oder einem anderem handy glänzt der Inhalt, wenn in dieses neue Theme gekleidet.

Revisionen

Ein weiteres highlight ist vor allem für Vielschreiber die ausgebaute „Revisions-“ Funktion. So kann der Autor jederzeit die verschiedenen Varianten eines Textes vergleichen, zu älteren Versionen zurückgehen und alte Fehler aufspüren und einfach verbessern. Dabei hilft natürlich auch eine verbessserte „auto-save“ Funktion.

Neuer Mediaplayer

Ein eingebauter „html5 Mediaplayer“ erlaubt es nun, Video und Musik ganz einfach zu verwalten und einzubinden und sieht dabei noch gut aus!

Lesbos Video

http://kultur-design.com/wp-content/uploads/2013/08/IMG_1323.mov

DOWNLOAD

Hier WordPress 3.6 downloaden


 

 

Mobile die eigene Website betreiben und bloggen

Noch nie war es so einfach die eigene Website, oder den eigenen Blog aktuell zu halten. Dabei spielt es keine Rolle, ob Sie ein iPhone, Blackberry oder ein Android Handy besitzen. WordPress bietet für fast jedes mobile Gerät die passende App – gratis versteht sich.

So konnen Sie morgens auf dem Weg, mittags im Café, Abends vor der Party (und natürlich auch während der Party), am Wochenende aus den Bergen oder vom See oder während der spannenden Reise jederzeit Bilder einstellen, Artikel schreiben, Inhalte mit Fans auf Facebook teilen, einen Newsletter versenden oder die neuesten Kommentare beantworten.

So nutze ich bei meinen Reisen – wie auf der letzten nach Venedig zur Biennale mein iPhone und blogge direkt aus den Giardini die interessanstesten Eindrücke, indem ich eine Bilderseite erstelle und sie anschließend mit meinen Freunden auf Google+ und Facebook teile. So bleiben die Inhalte auf meiner Seite – die „Fans“ werden dorthin geleitet und erfreuen sich an spannenden und aktuellen Artikeln und Bildern.

WordPress ist schon 10 Jahre alt – Wer hätte das gedacht?

Infografik von marketplace.com

Infografik von marketplace.com

WordPress ist nun seit 10 Jahren am Start. Das ist doch ein Grund den Machern ganz herzlich zu gratulieren und auf die nächsten 10 Jahre anzustoßen. Heute ist WordPress das beliebteste und am meisten genutzte open source CMS und Bloging System weltweit. Da kommen Joomla und Typo3 schon lange nicht mehr mit, wie die Info-Grafik von marketplace eindrücklich zeigt. Wußten Sie zum Beispiel, daß weltweit mehr als 15% aller Websites auf WordPress basieren – Tendenz steigend. Und das dabei weltbekannte Marken wie Adobe, CNN, Nokia, ebay, Nikon und selbst die Süddeutsche Zeitung darauf vertrauen? Nur um ein paar der unzähligen zu nennen.

Unzählige Plugins und viele Gratis Themes aus der weltweiten Entwickler Gemeinde, sowie höchstprofessionelle, eigens entwickelte Themes für alle Kundenwünsche und speziell programmierte Plugins gegen kleines Entgelt runden das sagenhafte Angebot ab.

Themes, die nach den Maßgaben des „responsive webdesigns“ erstellt sind, ersparen Entwicklungskosten für sogenannte, eigens programmierte „mobil“-Versionen Ihrer Website. Und erfreuen die handy und iPad Generation mit schicken und komfortablen Websites.

Mit dabei im großen Reigen der WordPress Seiten sind so bekannte Namen wie:

  • Adobe
  • arte
  • CNN
  • Ford
  • Intel
  • Nikon
  • Nokia
  • ZDF

um nur einige aufzuzählen.

Video Tutorials, Anleitungen und „how to´s“

WordPress wartet mit einen eigenen TV / Video Channel auf, hier finden sich Anleitungen und best practice Beispiele – nicht nur für die Lese-Faulen unter uns zu empfehlen :-)

Hier dreht sich alles um „resposive webdesign“ – ein kurzer Zukunftsentwurf für aktuelles WebDesign

Basiswissen, falls sie ihre WordPress Seite mobilisieren möchte. (in Englisch!)