Home
Categories
EXPLORE
True Crime
Comedy
Society & Culture
Business
Sports
Health & Fitness
Technology
About Us
Contact Us
Copyright
© 2024 PodJoint
Loading...
0:00 / 0:00
Podjoint Logo
US
Sign in

or

Don't have an account?
Sign up
Forgot password
https://is1-ssl.mzstatic.com/image/thumb/Podcasts125/v4/ec/ac/29/ecac2937-228f-6ade-67ce-91273bcd2b03/mza_4221770058661718059.jpg/600x600bb.jpg
Webdesign-Podcast.de
Pascal Bajorat
42 episodes
8 months ago
Der Webdesign-Podcast.de ist ein Blog und Video-Podcast (Screencast) von Pascal Bajorat und Sascha Rudolph. Gemeinsam möchten wir euch in den Screencasts Tutorials zu den verschiedensten Themen im Web- und Grafikbereich zeigen. Neben den Tutorials und Anleitung erhaltet ihr auch immer wieder Neuigkeiten aus dem Bereich der Technik und Software.

Weitere Informationen erhaltet ihr auch auf unserer Webseite: www.webdesign-podcast.de - Feedback könnt ihr uns gerne über das Kontaktformular oder direkt via E-Mail zukommen lassen.
Show more...
Technology
News,
Tech News
RSS
All content for Webdesign-Podcast.de is the property of Pascal Bajorat and is served directly from their servers with no modification, redirects, or rehosting. The podcast is not affiliated with or endorsed by Podjoint in any way.
Der Webdesign-Podcast.de ist ein Blog und Video-Podcast (Screencast) von Pascal Bajorat und Sascha Rudolph. Gemeinsam möchten wir euch in den Screencasts Tutorials zu den verschiedensten Themen im Web- und Grafikbereich zeigen. Neben den Tutorials und Anleitung erhaltet ihr auch immer wieder Neuigkeiten aus dem Bereich der Technik und Software.

Weitere Informationen erhaltet ihr auch auf unserer Webseite: www.webdesign-podcast.de - Feedback könnt ihr uns gerne über das Kontaktformular oder direkt via E-Mail zukommen lassen.
Show more...
Technology
News,
Tech News
Episodes (20/42)
Webdesign-Podcast.de
Google Analytics datenschutzkonform und rechtssicher integrieren
Dank diverser Regelungen und Vorgaben ist es mittlerweile gar nicht mehr so einfach Google Analytics datenschutzkonform und rechtssicher in Webseiten zu integrieren.
Neben technischen Anpassungen am Google Analytics Code sind auch gewisse vertragliche Zusatzvereinbarungen mit Google notwendig, um hier deutschem bzw. europäischem Datenschutzrecht zu entsprechen.
Mit dieser Thematik sollte sich daher jeder Webseitenbetreiber sowie Webdesigner beschäftigen. Gerade für Webdesigner und Agenturen ist das Thema brisant, denn diese können durchaus für die durchgeführte Integration auf der Kundenwebseite haftbar gemacht werden.
In diesem Artikel sollen nun möglichst alle Aspekte der datenschutzkonformen und rechtssicheren Integration von Google Analytics beleuchtet werden. Weiterhin stellen wir für alle WordPress-Nutzer mit „Google Analytics Germanized“ ein einfaches Plugin zur technisch datenschutzkonformen integration zur Verfügung.

Anzeige:





(adsbygoogle = window.adsbygoogle || []).push({});





1. Vertrag zur Auftragsdatenverarbeitung
Es mag für viele nun vielleicht absurd klingen, aber es ist leider notwendig mit Google einen schriftlichen Vertrag zur Auftragsdatenverarbeitung zu schließen.
Nach Meinung der Aufsichtsbehörden sind Betreiber von Webseiten bzw. konkret die Nutzer von Google Analytics Auftraggeber von Datenverarbeitungsleistungen, welche durch Google als Auftragnehmer erfolgen.
In diesem Kontext ist daher ein schriftlicher Vertrag über die Auftragsdatenverarbeitung zwischen dem Betreiber der Webseite und Google notwendig.
Seitens Google wird zu diesem Zweck eine entsprechende Vertragsvorlage zur Verfügung gestellt, welche mit den Aufsichtsbehörden abgestimmt ist.
Download als PDF: Vertrag zur Auftragsdatenverarbeitung
Der Vertrag muss ausgefüllt via Post an die Europa-Zentrale von Google gesendet werden, welche ihren Sitz in Dublin (Irland) hat.
Auf der ersten Seite der PDF-Datei werden alle relevanten Informationen zum Ausfüllen des Dokumentes erklärt.
2. Zusatz zur Datenverarbeitung
Neben dem schriftlichen Vertrag sollte auch im Google Analytics Konto, in der Kontoverwaltung, dem Punkt „Zusatz zur Datenverarbeitung“ zugestimmt werden.
Bei neuen Google Analytics Konten wird diese Zustimmung in der Regel mit der Kontoeröffnung erteilt. Bei älteren Analytics Konten muss dieser Zusatzvereinbarung  noch gesondert zugestimmt werden.
Zu finden ist der Bereich in Google Analytics unter:
Verwaltung (links unten im Hauptmenü) > Kontoeinstellungen (linke Spalte)
In den Kontoeinstellungen ist am Ende dann folgender Bereich zu finden:
Zusatz zur Datenverarbeitung
Wenn Ihr Unternehmen in einem Mitgliedsstaat des europäischen Wirtschaftsraums oder der Schweiz ansässig ist oder Sie dem räumlichen Geltungsbereich der EU-Datenschutz-Grundverordnung unterliegen, können Sie den Datenverarbeitungsbedingungen von Google Anzeigen unter der Voraussetzung zustimmen, dass Sie einen Direktkundenvertrag mit Google zur Verwendung von Google Analytics abgeschlossen haben. Weitere Informationen
3. IP-Adressen anonymisieren – Anonymize IP
Um in Google Analytics die anonymisierung von IP-Adressen zu gewährleisten ist eine Modifikation des Google Analytics Codes notwendig.
Show more...
7 years ago
7 minutes 33 seconds

Webdesign-Podcast.de
Bootstrap 4 Komplettkurs – Jetzt 50% Einführungsrabatt sichern
Bootstrap ist das weltweit bekannteste und auch meistgenutzte Frontend-Framework. In unserem kürzlich veröffentlichten Bootstrap 4 Kurs, möchten wir dir praxisnah die Schritt-für-Schritt-Umsetzung einer vollständigen Webseite mit Bootstrap 4 und allen dazugehörigen Komponenten erklären. Dabei zeigen wir dir nur das, was du brauchst, um schnell Ergebnisse zu erzielen und sofort loszulegen.
Bis zum 05.11.2017 gibt es den Kurs noch mit einem bombastischen Einführungsrabatt von über 50%. Dabei hast du lebenslangen Zugriff auf den Kurs, die dortigen Inhalte und auf unseren Fragen & Antworten Bereich, in welchem wir dir bei Fragen auch persönlich zur Seite stehen.
Weiterhin kommt der Kurs mit unserer Aktualitätsgarantie! Bootstrap 4 ist derzeit noch in der Betaphase, sollte sich hier bis zur finalen Version noch etwas ändern, aktualisieren wir den Kurs kostenlos, sodass du sicher sein kannst, dass du nur die neusten und aktuellsten Infos zu Bootstrap 4 bekommst.

Anzeige:





(adsbygoogle = window.adsbygoogle || []).push({});



Jetzt über 50% Rabatt sichern
Sicher dir jetzt über 50% Rabatt auf den Online-Kurs mit lebenslangem Zugriff:
Jetzt Rabatt sichern und kaufen
Der Rabatt gilt nur bis zum 05.11.2017 23:59 Uhr
Der große Bootstrap 4 Komplettkurs
Möchtest du lernen, großartige Webseiten mit Bootstrap 4 zu erstellen? In diesem Komplettkurs lernst du praxisnah die Schritt-für-Schritt-Umsetzung einer vollständigen Webseite mit Bootstrap 4 und allen dazugehörigen Komponenten. Dabei zeigen wir dir nur das, was du brauchst, um schnell Ergebnisse zu erzielen und sofort loszulegen.
Wir erklären dir alle Funktionen und die gesamte Umsetzung an einer modernen Beispielwebseite, von der du natürlich auch den gesamten Code für deine eigene Übung erhältst. Du lernst die Umsetzung von der Photoshop- / PSD-Datei hin zur fertigen Webseite auf Bootstrap-Basis.
Du lernst also den kompletten Erstellungsprozess mit vielen Tipps und Tricks aus dem Agenturalltag. Wir arbeiten bereits seit über 5 Jahren erfolgreich mit Bootstrap im Agentureinsatz und möchten dir unsere Erfahrungen mit diesem Kurs praxisnah und mit vielen Beispielen näherbringen.
Diese Beipsielwebseite setzen wir gemeinsam komplett und von Null an Schritt für Schritt um:
Das Rezept für die erfolgreiche Webseite mit Bootstrap
Ein Frontend-Framework ist dann gut und erfolgreich, wenn man der Webseite nicht mehr sofort ansieht, dass sie auf einem Framework basiert. Vielleicht kennst du sogar die eine oder andere Webseite, bei der du sofort Bootstrap als Basis erkennst?
Bei uns lernst du, Webseiten mit Bootstrap so zu erstellen, dass der Besucher diese Grundlage nicht direkt erkennt. Wir werden gemeinsam eine umfangreiche Beispielwebseite umsetzen, die vollständig auf Bootstrap basiert. Aber genau das werden wir gut kaschieren und die Seite vollständig individualisieren!
Los geht’s mit den Grundlagen
Wir zeigen dir die Grundlagen von Bootstrap. Lerne das flexible Grid und die Helper kennen. Weiterhin lernst du die Dateistruktur kennen und welche Dateien für welchen Anwendungsfall verwendet werden können.

Die komplette Umsetzung Schritt für Schritt – von der PSD-Datei zur fertigen Webseite!
In unserem Kurs lassen wir keinen Schritt aus! Das beginnt bereits bei dem Design der geplanten Webseite. Wir haben eine moderne Webseite in Photoshop vorbereitet und setzen diese aus der PSD-Datei heraus um. Du lernst den kompletten Umsetzungsprozess aus einer Designvorlage heraus.
Dabei lernst du also nicht nur die Verwendung der Bootstrap-Komponenten, sondern auch deren Individualisierung nach Kundenwunsch und eigenem Design.
Show more...
8 years ago
7 minutes 33 seconds

Webdesign-Podcast.de
WordPress-Online-Kurs jetzt mit exklusivem Rabatt
Seit wenigen Wochen ist mein neuer WordPress-Online-Kurs für Macher und Anwender nun zu haben. Zum Ende dieser Woche möchte ich zur Feier von mittlerweile über 100 Teilnehmern, allen Webdesign-Podcast.de Lesern einen exklusiven Rabatt für den Kurs anbieten.
Dieser Online-Kurs beinhaltet Videomaterial mit über 10 Stunden Spieldauer, aufgeteilt auf 11 Abschnitte und rund 60 Lektionen. Der Kurs richtet sich vor allem an Anfänger im Bereich WordPress. Vorkenntnisse oder gar Programmierkenntnisse sind nicht erforderlich.

Anzeige:





(adsbygoogle = window.adsbygoogle || []).push({});



Inhalte des Online-Kurses
Der Online-Kurs verbindet das Beste aus zwei Welten, nämlich die Video-Trainings mit den Kursen und Seminaren. Im Online-Kurs befinden sich über 10 Stunden Video-Material, welches frei und nach eigener Geschwindigkeit angesehen und verinnerlicht werden kann.
Zusätzlich können alle Teilnehmer des Kurses untereinander kommunizieren und natürlich jederzeit Fragen an mich persönlich stellen. Damit haben wir die Vorteile eines Seminars mit dem kommunikativen Austausch aller Teilnehmer untereinander sowie der Flexibilität eines Video-Trainings für die Lerninhalte.
Das beste am Online-Kurs: Lebenslanger Zugriff auf alle Inhalte und auch spätere Erweiterungen sowie Zugriff zu Live-Webinaren.
Jetzt 40% Rabatt sichern
Der Rabatt gilt nur bis zum 18.08.2017 23:59 Uhr
1. Einleitung
Zum Start bekommst du grundlegende Informationen zum Kurs, zu meiner Person und einige WordPress Basics, die du unbedingt wissen solltest.
2. Vorbereitungen und Installation
So bestellst und konfigurierst du deinen Webspace und installierst darauf WordPress. Dabei führe ich dich Schritt für Schritt durch die Installation.
3. Die WordPress Oberfläche und die Funktionen
Du lernst alle Basics, um WordPress bedienen zu können und um für die tägliche Arbeit gerüstet zu sein.
4. Themes
Ich erkläre dir was Themes sind, zeige dir die besten Bezugsquellen und wir installieren gemeinsam eines der meistgenutzten Premium-Themes für WordPress.
5. Webseite mit Leedeo erstellen
Das WordPress-Premium-Theme Leedeo bekommst du gratis mit diesem Kurs. Ich erkläre dir wie du es installierst und bedienst sowie die wichtigsten Funktionen.
6. Plugins & SEO Wissen
Ich zeige dir die 8 wichtigsten Plugins um WordPress zu erweitern und vermittele dir grundsätzliches WordPress SEO Wissen, um bei Google & Co. ganz vorne zu stehen.
7. Backups und Sicherheit
Du lernst wie du Backups für den Notfall erstellst, wie du wichtige Updates installierst und wie du deine WordPress Webseite sicher gegen Angriffe schützt.
8. Vernetze Dich
Auch nach Abschluss des Online-Kurses lasse ich dich nicht allein. Du bist jetzt Teil einer Gemeinschaft und kannst dich mit anderen Kursteilnehmern (Bloggern und Unternehmern) sowie mir vernetzen und in Kontakt bleiben.
Abschlussbescheinigung
Jeder Kursteilnehmer erhält eine Abschlussbescheinigung. Nach Abschluss aller Lektionen, kannst du diese als PDF herunterladen.
Jetzt den Online-Kurs mit 40% Rabatt sichern
Für alle Leser des Webdesign-Podcast möchte ich den Online-Kurs mit einem besonderen Rabatt anbieten, welcher exklusiv nur hier veröffentlicht wird.
Du erhältst beim Kauf des Kurses ganze 40% Rabatt und lebenslangen Zugriff auf die jetzigen Inhalte, sowie alle spätere Ergänzungen und Erweiterungen.
Show more...
8 years ago
34 minutes 43 seconds

Webdesign-Podcast.de
WordPress 4.8 ist da – das sind die neuen Funktionen
Seit kurzem steht WordPress 4.8 zum Download bereit. In diesem Artikel stelle ich die neuen Funktionen inkl. Video kurz vor.
Der neue Release ist vom Umfang her eher klein, bietet jedoch einige Neuerungen, bei denen vor allem Autoren hellhörig werden dürften. WordPress 4.8 ist im großen und ganzen ein „Widget-Update“.

Anzeige:





(adsbygoogle = window.adsbygoogle || []).push({});




Die neue WordPress Version glänzt mit insgesamt vier neuen Widgets. Alle vier werden gerade bei Autoren sicher sehr gut ankommen, da die entsprechenden Funktionen doch häufiger nachgefragt werden.
Es gibt nun also neue Widgets für Bilder, Videos, Audio-Files und ein Widget mit dem kompletten WYSIWYG Editor von WordPress.
Diese neuen Widgets stellen auch die wichtigsten Neuerungen in WordPress 4.8 dar.
Endlich bessere Links
Nicht unbedingt eine großartige Neuerung, aber trotzdem super und auch hier mit hohem Wert für alle Autoren.
Es gab in den vorherigen WordPress Versionen immer dieses etwas nervige Verhalten, dass ein Text der direkt hinter einem Link eingegeben wurde ebenfalls zum Link wird. Genau dieses Verhalten ist nun geändert und man kann gefahrlos Texte hinter Links erweitern und verändern ohne das diese auch direkt zu einem Link werden.

Update kann problemlos installiert werden
Da das Update unter der Haube keine all zu umfangreichen Änderungen mit sich bringt, dürfte ein Update in vielen Fällen problemlos möglich sein.
Es könnte allerdings sein, dass die Darstellung der neuen Widgets gerade in älteren Themes noch nicht ganz ideal ist. Dieser Umstand sollte sich allerdings via Theme Update oder eigenen Nachbesserungen einfach umgehen lassen, falls es Probleme gibt.
Viel Erfolg mit WordPress 4.8.
Show more...
8 years ago
4 minutes 48 seconds

Webdesign-Podcast.de
Suchmaschinenfreundliche Bilder für WordPress – PB SEO Friendly Images
WordPress ist von Haus aus auf eine suchmaschinenfreundliche Struktur ausgelegt. Diese Tatsache gilt selbstverständlich auch für Bilder. Das Problem bei nicht korrekt optimierten oder gar nicht vorhandenen Alternativtexten oder Titeln (welche für suchmaschinenfreundliche Bilder relevant sind) liegt oftmals eher im Bereich des Anwenders.
Der Dialog für Bilder fragt in WordPress nach jedem Upload nach einem entsprechenden Alternativtext. In der Regel ist es daher meistens ein Versäumnis der Autoren, wenn hier Angaben nicht gesetzt werden oder in der Vergangenheit gesetzt wurden.

Anzeige:





(adsbygoogle = window.adsbygoogle || []).push({});



Auch wenn die Probleme nicht suchmaschinenfreundlicher Bilder und damit nicht optimierter Alternativtexte und Titel oftmals Versäumnisse der Nutzer sind oder Attribute einfach aus Unwissenheit in der Vergangenheit nicht gesetzt wurden und daher leicht durch entsprechende Aufmerksamkeit und Nachbesserung gelöst werden könnten,  gibt es hierfür jedoch elegantere Lösungen.
Suchmaschinenfreundliche Bilder für WordPress
Ich habe in den vergangenen Wochen an einigen größeren Portalen auf WordPress Basis gearbeitet. Bei diesen Portalen waren teilweise „Alt-Attribute“ gesetzt, dafür jedoch keine „Title“ oder genau umgekehrt.
In jedem Fall wäre ein manuelles Nachbessern für mehrere tausend Artikel und Seiten eine kaum praktikable Lösung gewesen. Weiterhin musste auch für künftige Artikel sichergestellt werden, dass entsprechende „Alt“ und „Title“ Attribute korrekt gesetzt werden.
Es gibt für WordPress bereits Plugins, welche sich dem automatischen Setzen von „Alt“ und „Title“ Tags annehmen. Diese haben für den obigen Fall allerdings keine ausreichenden Einstellungsmöglichkeiten. Entweder können Werte nach einem bestimmten Schema  überschrieben oder das „Alt“ Attribut automatisch in den „Title“ geschrieben werden. Hierbei wird jedoch nicht berücksichtigt, wenn es bereits einen „Title“ gibt. Es wird also hart überschrieben.
Für den oben genannten Fall und ganz allgemein ist dieses Verhalten für das automatische Befüllen von „Alt“ und „Title“ Attribut jedoch alles andere als optimal.
Alt und Title flexibel und automatisch setzen
Meine Vorstellung für eine optimale Lösung musste wesentlich flexibler sein. Wenn ein „Alt“ Attribut vorhanden ist soll daraus auch der „Title“ gebildet werden, sofern dieser leer ist. Im umgekehrten Fall, also leeres „Alt“ Attribut und gesetzter „Title“, sollte auch die automatische Befüllung umgekehrt funktionieren (Sync: Alt <=> Title gleichen sich gegenseitig ab).
Wenn beide Werte gesetzt sind, bleiben diese wie sie sind. Bei komplett fehlenden Werten sollen diese automatisch generiert werden.
Da es genau diese flexible Lösung bisher nicht gab und einige Plugins, welche zumindest in die richtige Richtung gingen aber stark veraltet waren (über 2 Jahre ohne Updates oder Pflege), habe ich ein eigenes Plugin entwickelt, welches die oben genannten flexiblen Ansprüche erfüllt und noch einige weitere Optionen bietet.
Plugin: PB SEO Friendly Images für WordPress
Meine Lösung für automatische und flexible „Alt“ sowie „Title“ Attribute für Bilder habe ich in Form eines WordPress Plugins als Open Source Version freigegeben.
Ich selber nutze das Plugin mittlerweile auf allen eigenen Webseiten und Portalen sowie auf den meisten Kundenwebseiten. Über diese Lösung ist sichergestellt, dass es immer optimale „Alt“ und „Title“ Attribute und damit suchmaschinenfreundliche Bilder für WordPress gibt, selbst wenn künftig oder in der Vergangenheit einige Attribute vergessen oder möglicherweise vernachlässigt wurd...
Show more...
8 years ago
8 minutes 47 seconds

Webdesign-Podcast.de
WordPress 4.7 ist ab jetzt verfügbar!
Pünktlich zum Nikolaus wurde WordPress 4.7 veröffentlicht. Wie immer ist auch diese neue Version einem Jazzmusiker gewidmet. In diesem Fall gilt die Ehre der in den 90er Jahren verstorbenen Sarah „Sassy“ Vaughan aus New Jersey.
Die neue WordPress Version 4.7 beinhaltet ein paar interessante Neuerungen und wie üblich diverse Optimierungen und Sicherheitspatches. In diesem Artikel und Video möchte ich dir alle wichtigen Neuerungen vorstellen.

Anzeige:





(adsbygoogle = window.adsbygoogle || []).push({});



Twenty Seventeen
Die wohl größte und offensichtlichste Neuerung ist das neue Standard-Theme mit dem Namen „Twenty Seventeen“. Das neue Theme ist, wie seine Vorgänger auch, relativ schlicht, einfach und mehrheitlich verwendbar gehalten.
Das Theme verwendet die neue Video-Header Funktion von WordPress, womit Twenty Seventeen WordPress 4.7 voraussetzt und für die Verwendung alle Funktionen nicht mit älteren Versionen kompatibel ist.
Twenty Seventeen soll speziell für Business-Seiten und Showcases geeignet sein.
Eine Demo des neuen Themes ist hier zu finden: https://wordpress.org/themes/twentyseventeen/
Video-Vorstellung zu WordPress 4.7
Kurz und knapp alle Infos zu WordPress 4.7 im Video:

 
Weitere Neuerungen in WordPress 4.7
Im folgenden eine kurze Übersicht über die interessantesten neuen Funktionen in WordPress 4.7:

* REST API Endpoint ist final in den Core implementiert. WordPress 4.7 unterstützt jetzt REST API Endpunkte für Beiträge, Kommentare, Benutzer, Metadaten und Einstellungen. Die REST API ermöglicht den Fernzugriff- und Verwaltung deiner WordPress Installation und vereinheitlicht diese. Weiterhin ist ein allgemeiner Datenaustausch auch für interne Komponente wie Themes oder Plugins möglich.
* Themes können mit Starter-Content ausgestattet werden, um eine bessere Demo und Hilfe bei der Einrichtung eines neuen Themes darzustellen.
* Shortcuts im Theme-Customizer: Neben Elementen, welche im Theme-Customizer bearbeitet werden können, taucht ein kleines Icon zur direkten Bearbeitung auf.


* Video-Header: WordPress Themes können nun direkt aus WordPress und der Customization API Video-Header unterstützen. Die neuen Video-Header erweitern den bestehenden Custom Header Bereich. Die Videos werden per Standard geloopt und ohne Ton abgespielt.
* WordPress Navigation verbessert: Der Bereich rund um die Navigation wurde verbessert. In der neuen Version lassen sich Seiten direkt aus dem Navigations- / Menübereich erstellen. Somit können Strukturen für die Webseite direkt und wesentlich schneller als bisher aus dem Menübereich erstellt werden.


* Custom CSS Bereich direkt in WordPress, es ist kein Drittanbieter Plugin mehr dafür notwendig.


* Benutzer können ihre bevorzugte Sprache für das Backend direkt in ihrem eigenen Profil ändern.
* Die WordPress Mediathek unterstützt nun auch Vorschaubilder für PDF-Dateien, statt dem bisherigen einheitlichen Icon.
* Änderungen im Editor: Menü mit Formatierungen wie Überschriften und Absätzen wandert in die erste Zeile des Editors. Weiterhin werden im Tooltip zu jedem Element im Editor die Shortcuts angezeigt.

Zu den obigen Punkten gibt es noch diverse Neuerungen für Entwickler und auch Anpassungen unter der Haube. Eine vollständige Liste gibt es im WordPress Codex unter diesem Link.
Wichtig: Checkt vor einem Update des WordPress Cores erst einmal eure Plugin-Updates. Für ein paar Plugins, darunter auch das beliebte WordPress Jetpack, gibt es Patches, welche Probleme mit WordPress 4.7 beheben.
Vom JetPack Plugin sollte die Version 4.4.
Show more...
8 years ago
13 minutes 41 seconds

Webdesign-Podcast.de
E-Mail-Verschlüsselung für WordPress mit dem MailCrypt AntiSpam Plugin
Vor rund drei Jahren habe ich an dieser Stelle im Blog meine Lösung zur Spam-Abwehr vorgestellt. Das WordPress Plugin PB MailCrypt – AntiSpam E-Mail Encryption, welches die E-Mail Adressen in WordPress mittels Shortcode maskiert und so vor Spam-Bots schützen soll.
Das WordPress Plugin setzt dabei auf das gleichnamige jQuery Plugin, welches ebenfalls schon hier im Blog vorgestellt wurde.

Anzeige:





(adsbygoogle = window.adsbygoogle || []).push({});



Mittlerweile habe ich das WordPress Plugin komplett überarbeitet und um hilfreiche und sinnvolle Funktionen erweitert.
So ist es nun zum Beispiel nicht mehr notwendig, dass jede E-Mail Adresse mit dem Shortcode des Plugins in die Seiten eingefügt wird. Der mit Version 2.0 eingeführte Automatikmodus erkennt E-Mail Adressen im Text und maskiert diese.
Der neue Automatikmodus ist dabei nicht nur in der Lage reine Plain-Text E-Mail Adressen in maskierte Links umzuwandeln, sondern kann ebenfalls bereits bestehende und von WordPress erzeugte E-Mails Links nachträglich maskieren.
Dank dieser neuen Funktion ist der Aufwand bei der Integration nun sehr gering, da im Prinzip nach der Installation und Aktivierung der Funktion keine händischen Anpassungen oder Shortcodes mehr notwendig sind.
Für die Verwendung auf Theme-Ebene, also im Template-Code, kann natürlich weiterhin der bewährte Shortcode verwendet werden:

Selbstverständlich steht der Shortcode überall in WordPress zur Verfügung und kann als Alternative zu oder auch zeitgleich neben dem Automatikmodus verwendet werden.
Dabei stehen folgende Parameter zur Verfügung:

* email = Pflicht
* href = Optional
* title = Optional

Wie funktioniert PB MailCrypt
PB MailCrypt basiert auf dem gleichnamigen jQuery Plugin MailCrypt. Der PHP-Part des Plugins maskiert den E-Mail Link mit Tags und ersetzt das @-Zeichen durch ein sehr ähnliches Zeichen.
Das JavaScript, welches von dem Plugin ebenfalls automatisch eingebunden wird, erzeugt dann einen entsprechenden E-Mail „mailto:“ Link und fügt das @-Zeichen wieder in den sichtbaren Teil des Links ein.
So ist die E-Mail Adresse im Quelltext und für Spambots nicht direkt zu erkennen. Besucher jedoch sehen die E-Mail Adressen wie gehabt ohne Einschränkungen. Sollte ein Nutzer die Webseite ohne JavaScript aufrufen, kann als Alternative auf ein Kontaktformular oder eine Informationsseite verlinkt werden. Das @-Zeichen wird dabei durch ein ähnliches Zeichen nachgestellt, für eine vollständige Anzeige und Funktion wird jedoch JavaScript im Browser benötigt.
MailCrypt installieren und die E-Mail Verschlüsselung einrichten

PB MailCrypt – AntiSpam E-Mail Encryption lässt sich am einfachsten direkt über WordPress installieren. Dazu wird im Administrationsbereich im Menü Plugins der Unterpunkt Installieren aufgerufen.
Show more...
9 years ago
13 minutes 23 seconds

Webdesign-Podcast.de
WordPress für Einsteiger und Autoren
Du willst WordPress für deine Website nutzen, bist aber noch Einsteiger oder Anwender ohne Entwicklerhintergrund? In meinem neuen Video-Training „WordPress für Einsteiger und Autoren” möchte ich dir alle Grundlagen von WordPress erklären, die du für deine tägliche Arbeit mit dem System benötigst.
Ebenso wirst du erfahren, wie man WordPress von Grund auf installiert und mit einem Theme einrichtet. Selbstverständlich wirst du diese Schritte ohne Entwicklerhintergrund oder anderweitiges tieferes technisches Grundwissen durchführen können.

Anzeige:





(adsbygoogle = window.adsbygoogle || []).push({});



Dieses Training bringt dir das weltweit meistverwendete Content-Management-System näher: WordPress. Über 60% aller Webseiten, deren CMS bekannt ist, nutzen WordPress zur Verwaltung der Inhalte.
Ich werde dir in diesem 6-stündigen Training alles zeigen, was du zu deinem gelungenen Einstieg in WordPress wissen musst.
Du wirst dich im Nu und von Null an, mit allen wichtigen Bereichen vertraut fühlen. Ein großer Fokus liegt hier vor allem auch auf der Verwendung von Themes, mit denen du deine Webseite ganz individuell anpassen kannst.
Was du in dem Training unter anderem lernen wirst:


* Vorbereitungen für die Verwendung von WordPress
* Funktionen des Dashboards
* Administration und Content-Management
* Umgang mit Medien
* Einrichtung und Installation von Themes
* WordPress-Backups anlegen
* Plugins einrichten und verwenden
* u.v.m.

Für wen ist dieses Training?
Die Zielgruppe dieses Trainings sind Redakteure, Autoren und Blogger sowie Verantwortliche aus den Bereichen Marketing und Öffentlichkeitsarbeit, die ohne spezielles Entwicklerwissen erfolgreich das CMS WordPress für ihre Website nutzen wollen.
Dieses Training ist optimiert für die Version 4.x von WordPress (und höher) – es ist eingeschränkt geeignet ab Version 3.5.
Auszug aus dem Video-Training WordPress für Einsteiger und Autoren: Design und Themes
In diesem Video-Training möchte ich dir zeigen, wie du in WordPress ein Theme für deine Webseite findest und wie dieses eingerichtet wird. Zusätzlich zeige ich dir alle wichtigen Funktionen des Live-Customizers.

Das komplette Video-Training „WordPress für Einsteiger und Autoren“ ist im Shop von PSD-Tutorials.de erhältlich und kostet 29,95 € als Download oder 34,95 € als DVD.
Ich wünsche dir viel Spaß mit dem Training und hoffe, dass es dir gefällt.
Show more...
10 years ago
27 minutes 50 seconds

Webdesign-Podcast.de
WordPress benutzerdefinierte Felder mit Advanced Custom Fields meistern
Benutzerdefinierte Felder oder auch Custom Fields sind in WordPress sehr hilfreich, um zusätzliche Inhalte und Daten zu Seiten, Artikeln oder auch eigenen Inhalts-Typen (Custom-Post-Types) zu speichern.
Gerade wenn WordPress als Content-Management-System und nicht „nur“ als Blog-System verwendet wird, sind die benutzerdefinierten Felder eine sinnvolle Erweiterung. Denn oftmals ist es nicht ausreichend die Inhalte nur in einem großen Editor speichern zu können.
In diesem Tutorial möchte ich euch die Basics der benutzerdefinierten Felder in WordPress erklären und zusätzlich zeigen, was mit Hilfe des Plugins Advanced Custom Fields noch alles möglich ist.

Anzeige:





(adsbygoogle = window.adsbygoogle || []).push({});



Wie funktionieren benutzerdefinierte Felder (Custom Fields) in WordPress
Die benutzerdefinierten Felder findet ihr direkt in der Ansicht von WordPress, in welcher ihr auch eure Artikel oder Seiten bearbeitet.
Falls der Bereich mit den benutzerdefinierten Feldern nicht von Anfang an sichtbar ist, müsst ihr diesen einblenden. Drückt dazu auf den „Optionen“ Button in der oberen rechten Ecke. In den Optionen setzt ihr nun einen Haken in der Checkbox bei „Benutzerdefinierte Felder“.
Danach sind die Felder unter dem Text-Editor zu finden. Die benutzerdefinierten Felder bestehen aus zwei Bereichen: Dem Namen und dem Wert.
Der Name identifiziert euren Wert in den meisten Fällen eindeutig. Es ist allerdings auch möglich, mehrere Werte mit dem selben Namen anzugeben. WordPress behandelt die Ausgabe in diesem Fall als Array, dieses Thema möchte ich für den einfachen Einstieg hier jedoch nicht tiefergehend beleuchten.
Namen, die im Verlauf der Nutzung schon einmal eingegeben wurden, können komfortabel aus einem Dropdown ausgewählt werden. Eine erneute Eingabe ist nicht erforderlich.
Theoretisch könnt ihr zu jedem Artikel oder jeder Seite beliebig viele Felder anlegen. Vielleicht gibt es in eurem Blog bzw. auf eurer Webseite auch bereits benutzerdefinierte Felder, die z.B. von Plugins für ihre entsprechenden Funktionen genutzt werden.
Ein Praxis-Beispiel für benutzerdefinierte Felder
Nehmen wir einmal an, ihr möchtet in eurem Blog bei bestimmten Artikeln einen Banner unter eurem Artikel anzeigen. Dann könnte diese Schaltung z.B. über die benutzerdefinierten Felder laufen.
Legt dazu bei dem gewünschten Artikel ein Feld mit dem Namen „banner“ und dem Wert „ja“ an. Statt ja könnte man natürlich auch „yes“, „true“, „1“ oder jeden anderen beliebigen Wert verwenden.
Das Feld alleine bewirkt rein gar nichts, denn dieses muss selbstverständlich noch in irgendeiner Form von eurem Theme verarbeite werden.
Für diesen Zweck gibt es die Funktion get_post_meta( $post_id, $key, $single ). Die Attribute müssen wie folgt gesetzt werden:

* $post_id: Entspricht der ID der Seite oder des Artikels, von welchem das Feld geladen werden soll. Die aktuelle ID einer Seite oder eines Artikels kann mit get_the_ID() abgerufen werden.
* $key: Steht für den Namen des benutzerdefinierten Feldes, den ihr selbst im Editor festgelegt habt (im Beispiel „banner“).
* $single: Erwartet einen booleschen Wert (true oder false). Hier könnt ihr steuern ob der Wert als String (true) oder Array zurückgeliefert wird. Letzteres ist dann sinnvoll, wenn ihr mehrere Werte / Felder mit dem selben Namen hinterlegt habt.

Um nun also unser „banner“-Feld auszulesen, benötigen wir folgende Funktion:
<?php $banner = get_post_meta( get_the_ID(), 'banner', true ); ?>
Jetzt ist in der Variable $banner der Wert gespeichert,
Show more...
10 years ago
24 minutes 9 seconds

Webdesign-Podcast.de
Zwei Tools um Bilder fürs Web zu komprimieren bzw. zu optimieren
Dass Bilder in vielen Fällen einen großen Teil der Datenmenge moderner Webseiten ausmachen, ist allseits bekannt. Es ist jedoch oftmals nicht ausreichend, wenn die Bilder nur über die Photoshop Funktion „Für Web speichern…“ gesichert und optimiert werden. Oftmals lässt sich über andere Tools ein noch wesentlich höherer Gewinn an Dateigröße einsparen.
In diesem Artikel möchte ich euch zwei Tools vorstellen, mit denen ihr Grafiken und Fotos für Webseiten optimieren könnt. Die Tools eignen sich jedoch auch für jeden engagierten Fotografen, der die Sammlung an JPEG’s aus dem letzten Urlaub komprimieren möchte, um Speicherplatz auf der Festplatte zu sparen. Die Einsparungen können hier teilweise erheblich ausfallen, jedoch ist das Optimieren der Originaldateien einer gesamten Fotosammlung nicht jedermanns Sache.

Anzeige:





(adsbygoogle = window.adsbygoogle || []).push({});



Zwar werben beide Tools mit einer nahezu unsichtbaren Kompression ohne Qualitätsverluste, dennoch halte ich es für möglich, dass es unter bestimmten und nicht optimalen Bedingungen vielleicht doch Abstriche in der Qualität gibt.
Generell bin ich persönlich mit beiden Tools sehr zufrieden und verwende sie täglich um meine Bilder zu komprimieren. Mit JPEG Mini habe ich tatsächlich auch mein gesamtes Fotoarchiv an Urlaubsbildern komprimiert und mehrere Gigabyte an Daten gespart.
JPEG Mini
JPEG Mini ist eines der bekanntesten Tools zur Optimierung von JPEG-Bildern, hier liegt auch direkt der erste und einzige Nachteil. Das Tool kann lediglich JPEG bzw. JPG Bilder optimieren und komprimieren, alle anderen Formate bleiben außen vor.
Dafür ist die Qualität der komprimierten Bilder und die eingesparte Dateigröße überragend.
Auf der offiziellen Webseite wird JPEG Mini mit einer Kompression von bis zu 80% im Vergleich zur Originalbildgröße beworben und das ohne Qualitätsverluste. Nachdem ich mit dem Tool bereits einige tausend Bilder komprimiert habe, kann ich dies nur bestätigen. Eine Kompression um 80% ist zwar eher selten, aber bei einigen Bildern tatsächlich möglich.
JPEG Mini eignet sich hervorragend für die Optimierung großer Fotosammlungen und läuft auch bei großen Ordnern mit vielen Bildern sehr stabil. Die Software kann kostenlos getestet werden und dürfte mit den Funktionen der freien Version bereits viele Alltagsfälle abdecken. Mit der Lite Version können jedoch maximal 20 Bilder pro Tag optimiert werden.
Die Vollversion von JPEG Mini unterliegt dieser Einschränkung natürlich nicht und ist mit 19,99 USD meiner Meinung nach fair bepreist. Die Software kann sowohl unter Windows als auch Mac OS X verwendet werden.
Neben der zeitlich unbeschränkten Testversion JPEG Mini Lite gibt es auch einen Webdienst, mit dem ihr eure Bilder mittels JPEG Mini Server komprimieren könnt: JPEG Mini – Shrink Photos online.
ImageOptim und PNG Gauntlet
Beim ImageOptim handelt es sich, im Vergleich zu JPEG Mini, um ein komplett kostenloses Tool, welches einen ebenso großen Nutzen hat wie  JPEG Mini, eben auf seine Weise. Man kann und sollte beide Tools, JPEG Mini und ImageOptim, durchaus gemeinsam und kombiniert nutzen.
ImageOptim komprimiert und optimiert im Vergleich zu JPEG Mini alle gängigen Bildformate, die fürs Web relevant sind (JPEG, JPG, PNG, GIF) und ist damit nicht nur auf JPEG’s beschränkt.
Bereits auf der eigenen Webseite gibt der Hersteller des Tools eine wichtige Information, warum es sinnvoll ist ImageOptim gemeinsam mit anderer Komprimierungs-Software zu verwenden:
How does ImageOptim compare to TinyPNG and JPEGMini?
Tools like ImageAlpha/pngquant/TinyPNG and JPEGMini can make files much smaller by using lossy compression which (slightly) lowers image quali...
Show more...
10 years ago
6 minutes 52 seconds

Webdesign-Podcast.de
WordPress Performance-Optimierung an einem Praxis-Beispiel
In diesem Artikel, mit dazugehöriger Video-Podcast Folge, möchte ich euch an einem Praxis-Beispiel einige Tipps und Tricks zur Performance-Optimierung einer WordPress Webseite bzw. eines WordPress Themes geben. Das Video findet ihr am Ende dieses Artikels.
Es gibt für Webseiten eine unglaubliche Menge an verschiedenen Tipps und Tricks um diese zu beschleunigen. Ein echtes Patentrezept, welches sich auf jede WordPress-Webseite anwenden lässt, gibt es jedoch nicht. Jedes Web-Projekt ist in der Regel individuell und sollte auch so behandelt werden.

Anzeige:





(adsbygoogle = window.adsbygoogle || []).push({});



Eine Technik, die bei der einen Seite funktioniert und einen guten Performance-Boost bringt, muss nicht auch zwangsweise bei einer anderen Webseite denselben Effekt hervorrufen.
In diesem Artikel und dem dazugehörigen Video möchte ich euch nun einige Techniken und Tricks vorstellen, die sich im Ansatz für fast jede WordPress basierende Webseite eignen.
Wer darüber hinaus Informationen zur Optimierung der Ladezeit sucht, kann sich gerne auch die weiteren Artikel im Blog ansehen, unter anderem zu finden in der Kategorie Webseitenoptimierung.
Kombinieren (combine), komprimieren (minify oder compress) und danach cachen
Combine, minify and cache – Diese drei Techniken lassen sich in WordPress verhältnismäßig einfach umsetzen, da es hier die verschiedensten Plugins gibt, die diese Arbeit übernehmen können.
Was verbirgt sich hinter den jeweiligen Techniken:
Kombinieren (combine)
Darunter versteht man das Zusammenlegen von Dateien. Nehmen wir einmal an, ihr benötigt für eure Webseite drei CSS-Dateien: Die style.css eures Themes und zwei weitere CSS-Dateien die von Plugins eingebunden werden.
Nun muss der Browser für alle drei Dateien jeweils eine neue Verbindung (HTTP-Request) zum Webserver aufbauen und diese Dateien einzeln herunterladen. Dieser Vorgang kostet wertvolle Zeit, welche vermieden werden könnte.
Um die HTTP-Requests nun von drei auf einen zu reduzieren, werden alle drei CSS-Dateien einfach in einer gemeinsamen Datei kombiniert und nur noch diese eine Datei geladen.
Komprimieren (minify oder compress)
Bei dem Vorgang der Kompression (compress) werden z.B. JavaScript, CSS und auch HTML Dateien um unnötige Zeilenumbrüche, Kommentare, Leerzeichen usw.  bereinigt, dadurch sinkt die Dateigröße.
Bei der Kompression unterscheidet man in der Regel zwischen zwei Varianten, der gerade genannten und beschriebenen „normalen“ Kompression und dem Minifying oder auch Minification.
Bei diesem letzten Vorgang werden nicht nur unnötige Zeichen entfernt sondern Dateien aktiv umgestaltet. In JavaScript werden z.B. Variablen und Funktionsnamen gekürzt, Kurzschreibweisen zur Verkleinerung von Abfragen verbaut uvm. In CSS verläuft der Prozess ähnlich, hier werden ebenfalls Kurzschreibweisen verwendet um den Code zu verschlanken und z.B. auch Farbcodes verkleinert. So wird aus dem HexCode für rot #ff0000 z.B. die kurze Version #f00.
Caching
Der Prozess des Caching kann uns in den verschiedensten Varianten begegnen. In der Regel dient ein Cache-System dazu, dass dynamisch erzeugte Dateien statisch gespeichert werden und somit schneller darauf zugegriffen werden kann.
Im Fall von WordPress und den oben genannten Beispielen, wäre in unserem Fall z.B. ein Cache für die folgenden Systeme relevant:
1. Ein Cache zum Zwischenspeichern der dynamisch erzeugten komprimierten und kombinierten Dateien. Müssten diese mit jedem Seitenaufruf dynamisch neu erzeugt werden, so könnte und würde der Geschwindigkeitsvorteil aufgrund der längeren Verarbeitungszeit der Dateien verpuffen.
2. Um WordPress zu entlasten, können auch hier fertig gerenderten HTML-Ausgaben in...
Show more...
10 years ago
33 minutes 30 seconds

Webdesign-Podcast.de
Adobe Project Parfait (Beta) – PSD-Dateien online in valides CSS umwandeln (PSD CSS-Extractor)
Adobe bringt mit der Project Parfait (Beta) ein Projekt an den Start, welches in ähnlicher Form oder zumindest mit ähnlichen Funktionen schon von verschiedenen Plugin-Entwicklern in Photoshop Einzug gehalten hat, man nehme hier z.B. CSS-Hat oder Enigma64 als ein Beispiel.
Nichtsdestotrotz ist es eine angenehme Entwicklung, dass auch Adobe nun ein Tool (PSD CSS-Extractor) herausgebracht hat, mit dem sich schnell und einfach online die entsprechenden CSS-Definitionen für PSD-Dateien kopieren lassen bzw. Ebenen oder gruppierte Elemente als Asset direkt herunterladen lassen.

Anzeige:





(adsbygoogle = window.adsbygoogle || []).push({});



Project Parfait ermöglicht es Webdesignern, die erstellten Layouts oder natürlich auch die von Auftraggebern in Form von PSD-Dateien zu dem Online-Dienst hochzuladen. Parfait ermöglicht es dann, die Elemente in der PSD-Datein einfach zu selektieren und den dazugehörigen CSS-Code zu kopieren.
Es ist ebenfalls möglich, Ebenen direkt als Bild herunterzuladen. Hiermit erspart man sich das Ausschneiden in Photoshop, wobei dieser Vorgang bereits über den Photoshop Bild-Asset-Generator (nur in der CC-Version verfügbar) sehr elegant gelöst wird. Meiner Meinung nach sogar besser und flexibler als über Project Parfait, da es direkt aus Photoshop heraus erledigt werden kann. Da Parfait allerdings einfachere Dialoge bietet, kann es für Anfänger oder nicht routinierte Nutzer durchaus die schnellere und vor allem einfachere Variante sein.
Photoshop CC bietet ebenfalls die Möglichkeit, CSS Code direkt aus der Ebenen-Palette zu kopieren. Dies funktioniert über einen »Rechtsklick« und anschließend im Kontextmenü mit „CSS kopieren“, daraufhin kopiert Photoshop CC den CSS-Code in die Zwischenablage. Hier wiederum ist Project Parfait wesentlich eleganter und generiert auch den besseren CSS-Code.
Zum Vergleich hier ein Beispiel-Code eines einfachen orangenen Buttons:
Der Code aus Photoshop CC sieht wie folgt aus:
.Rectangle_5_copy_2 {
background-color: rgb( 204, 204, 204 );
position: absolute;
left: 932px;
top: 703px;
width: 142px;
height: 37px;
z-index: 9;
}

Derselbe Button, nur jetzt mit Code aus Project Parfait:
background-color: #ff9c00;
width: 142px;
height: 37px;

Hier wird auf Anhieb klar, dass sich Parfait auf die wirklich relevanten Codes beschränkt und diese auch sauberer ausgibt. Photoshop CC sorgt im Vergleich für viel Müll-Code, den man in dieser Form besser nicht in die eigene CSS-Datei übernehmen sollte, schon gar nicht mit den absoluten Positionen.
Project Parfait befindet sich aktuell in einer offenen Beta-Version und kann von jedem, der es testen möchte, ausprobiert werden.
Podcast Info:
Titel: Adobe Project Parfait (Beta) – PSD-Dateien online in valides CSS umwandeln (PSD CSS-Extractor)
Autor: Pascal Bajorat
Länge: 11 Min
Dateigröße: 282 MB (1080p HD)

Dieses Video findet ihr ebenfalls in unserem Vimeo Kanal.
Anmerkung: In dem Video erzähle ich, dass die beiden Plugins CSS-Hat und Engima64, aus dem Hause madebysource.com, bei mir unter Photoshop CC nicht funktionieren. Nun habe ich von ein paar Kollegen erfahren, dass die Plugins bei ihnen auch unter der CC funktionieren, dies ist bei mir leider nicht der Fall, eine Neuinstallation und auch die Installation auf einem komplett anderen Rechner waren keine Lösung. Auf Support-Anfragen hat madebysource.com nicht reagiert, daher erkläre ich beide Plugins zumindest für mich weiterhin als tot und nicht benu...
Show more...
11 years ago
10 minutes 56 seconds

Webdesign-Podcast.de
Aufzeichnung WordPress Webinar – WordPress Vorstellung
In dieser Screencast-Folge möchten wir allen Interessenten das aufgezeichnete WordPress Webinar zur Verfügung stellen, die es z.B. aus zeitlichen Gründen vergangenen Freitag nicht live verfolgen konnten.

Anzeige:





(adsbygoogle = window.adsbygoogle || []).push({});



Themen des WordPress Webinars
Das Webinar behandelt folgende Themen (grober Überblick):

* WordPress Geschichte und Entstehung
* WordPress Standard-Funktionen
* Erweiterungen in Form von Themes und Plugins (Shop, Community, Galerie, usw.)
* WordPress Multisite
* Tipps und Tricks zu WordPress

Anschließend werden alle Teilnehmer die Möglichkeit haben Fragen zu WordPress zu stellen.
Weitere Informationen sind im original Artikel zum WordPress Webinar zu finden.
Podcast Info:
Titel: WordPress Webinar vom 13.09.2013
Autor: Pascal Bajorat
Länge: 50 Min (geschnitten)
Dateigröße: 768 MB (720p HD)

Show more...
12 years ago
50 minutes 20 seconds

Webdesign-Podcast.de
Adobe Bild-Asset Generator Assistent in Photoshop CC
Adobe hat seiner Creative Cloud Version von Photoshop ein Update verpasst, die aktuelle Version von Photoshop CC trägt damit die Nummer 14.1. Bei der neuen Funktion handelt es sich um den Adobe Generator Assistent, dieser erstellt automatisch beim speichern in Photoshop Bild-Assets. Diese Funktion ist vor allem für Webdesigner und Entwickler eine enorme Hilfe, die einiges an Zeit und Nerven einspart.

Anzeige:





(adsbygoogle = window.adsbygoogle || []).push({});



Der Bild-Asset Generator Assistent lässt sich über das Datei Menü in Photoshop aktivieren und deaktivieren „Datei > Generieren > Bild-Assets„. Ist diese Funktion erst einmal aktiv, wird sie mit jedem Speichervorgang die entsprechenden Bilder generieren.

Als Indikator dienen die Namen der Ebenen, diese müssen entsprechend ihres gewünschten Dateinamens und Formats benannt werden. Ein Logo ohne Hintergrund, also mit Transparenzen müsste also folgenden Ebenennamen tragen um als PNG gespeichert zu werden: „logo.png“. Soll das Logo als PNG 8 gesichert werden, muss einfach eine 8 hinter den Dateisuffix gehängt werden, also „logo.png8“.

Über den Ebenennamen lassen sich ebenfalls z.B. bei JPG’s die Qualitätsstufe festlegen, möchten wir z.B. den Header eines Web-Layouts als JPG mit Qualitätsstufe 6 bzw. 60% speichern, wird die Ebene wie folgt benannt: „header.jpg6“.
Wie das ganze genau funktioniert, möchte ich euch in einem kurzen Video zeigen, dass ihr ebenfalls über unseren Podcast Feed herunterladen könnt.

Podcast Info:
Titel: Adobe Bild-Asset Generator in Photoshop CC
Autor: Pascal Bajorat
Länge: 6:40 Min
Dateigröße: 97 MB (720p HD)

Dieses Video findet ihr ebenfalls in unserem Vimeo Kanal.
Show more...
12 years ago
6 minutes 40 seconds

Webdesign-Podcast.de
Angriffe auf Admin-Konten von WordPress-Systemen
In den vergangenen Tagen gab es immer mehr Meldungen über Brute Force Attacken auf WordPress-Systeme, auch die Sicherheitssysteme, auf den von mir verwalteten Seiten, zeigen erhöhte Login-Versuche mit dem „Admin“ Benutzer. Bots versuchen bei WordPress-Webseiten die Passwörter mittels Wörterbuch und bekannten, viel genutzten, Kennwörter zu erraten. Als Benutzername wird in der Regel auf „admin“ zurückgegriffen, der Standard WordPress-Administrator Account.

Anzeige:





(adsbygoogle = window.adsbygoogle || []).push({});



Der Angriff werde von einem Botnetz durchgeführt, berichtet Matthew Prince, Chef des Content Delivery Networks Cloudflare, im Unternehmensblog. Per Brute Force werde versucht, die Passwörter für den Nutzer Admin auszulesen: Es würden lange Listen von möglichen Passwörter ausprobiert, um in eine WordPress-Installation einzudringen. Das Botnetz umfasse mehrere zehntausend IP-Adressen. (Golem.de)
Brute Force Attacken sind in der Regel relativ einfach abzuwehren, gerade in WordPress ist die Sache mit ein paar Kniffen schnell erledigt. In dieser kurzen To-Do Liste möchte ich euch Tipps zur Absicherung eures WordPress-Systems geben:
Sichere Kennwörter verwenden
Das oberste Gebot gilt nicht nur für die Nutzung von WordPress, sondern generell für alle Online-Dienste: Verwendet immer sichere Kennwört. „Hallo“ oder „1234“ zählen definitiv nicht dazu, haltet euch eher an zufällig generierte Kennwörter, die dann z.B. mittels eines Tools, wie 1Password, abgespeichert werden.
So ein sicheres Kennwort könnte dann z.B. so aussehen: b33gkBDQ:vN2p,EE[CEg
Auf diese Weise wird es dem Angreifer schon fast unmöglich gemacht, dass Kennwort in einer realistischen Zeit zu „erraten“.
Admin Nutzer in WordPress nicht verwenden oder entfernen
Seit der WordPress Version 3.0 lässt sich der Benutzername „admin“ in der Installationsroutine entsprechend ändern. Eine nachträgliche Änderung ist über WordPress selber nicht möglich, er kann aber über die Datenbank angepasst werden.
Öffnet hierzu über phpMyAdmin eure WordPress Datenbank und sucht dort die Tabelle „wp_users“, dort solltet ihr euch den Eintrag mit der „ID“ 1 genauer ansehen, hier sollte im Feld „user_login“ der Name „admin“ stehen. Diesen müsst ihr jetzt über phpMyAdmin ändern, dass war es schon.
Login-Versuche einschränken mit Limit Login Attempts
Das WordPress Plugin „Limit Login Attempts“ schütz euren WordPress Login vor zu vielen ungültigen Logins. Es funktioniert relativ simpel, es sperrt einfach die entsprechende IP-Adressen, die sich mehrmals falsch anmelden, die entsprechenden Sperrzeiten und Login-Versuche lassen sich einfach konfigurieren.
Da das Botnetzwerk in dieser Angriffsserie mehr als 90,000 IP Adressen umfasst, ist ein alleiniger Schutz über Limit Login Attempts nicht ausreichend.
WordPress richtig absichern
WordPress ist von Haus aus ein sehr sicheres System, durch den offenen Quellcode werden Sicherheitslücken allerdings relativ schnell bekannt und auch aktiv ausgenutzt. Der erste Aspekt der Sicherheit sollte also ein zeitnahes Update-Verhalten sein. Selbiges gilt natürlich nicht nur für das WordPress-Kern-System, sondern auch für entsprechende Plug-Ins.
Neben den wichtigen Updates gibt es noch einige weitere Plug-Ins und Schritte, die ihr durchführen könnt, um die Sicherheit eures WordPress-Systems zu verbessern.
Show more...
12 years ago
11 minutes 24 seconds

Webdesign-Podcast.de
Neuerungen in WordPress 3.5 mit Video
Seit dem 11.12.2012 ist die neue WordPress Version 3.5 verfügbar, alles in allem hat sich nichts grundsätzliches geändert, bis auf den Media Manager, dieser hat ein umfangreiches und grundlegendes Redesign erfahren, weiterhin gibt es ein neues Standard Theme: Twenty Twelve . Das vom Grundsatz her alles beim alten geblieben ist, soll an dieser Stelle aber keine Kritik sein, denn von der Funktionalität und Bedienbarkeit ist WordPress bereits weit vorne.
In diesem Artikel möchte ich euch sämtliche wichtigen Neuerungen vorstellen und auf einige Umstrukturierungen in den Einstellungen hinweisen. Neben dem Artikel ist am Ende des Beitrags noch ein ca. 15-minütiges Video, dass ebenfalls alle wichtigen Neuerungen aufzeigt.

Anzeige:





(adsbygoogle = window.adsbygoogle || []).push({});



Kurze Themen-Übersicht:

* Der neue WordPress Media Manager
* WordPress Standard-Theme Twenty Twelve
* Verbesserte / Überarbeitete Administrationsoberfläche in WordPress 3.5
* Updates unter der Haube…
* WordPress Aktualisieren – So geht’s…
* Video-Podcast zu allen Neuerungen in WordPress 3.5
* WordPress 3.5 Trailer

Der neue WordPress Media Manager
Der neue Media Manager spielt in WordPress eine zentrale Rolle, denn neben dem offensichtlichen neuen Standard Theme Twenty Twelve, dass nicht unbedingt jeder verwendet, handelt es sich hierbei um die wichtigste Neuerung. Im Gegensatz zu den früheren WordPress-Versionen öffnet sich der neue MediaManager in der Medathek-Ansicht und bietet so schnellen Zugriff auf bestehende Medien-Dateien.
Die Bilder lassen sich schnell und einfach im rechten Bereich des Media Managers anpassen:

Galerien lassen sich jetzt komfortabler erstellen, da sich entsprechende Bilder aus der gesamten Mediathek einfach wie Auswahlfeld markieren lassen. Die Sortierung funktioniert über ein einfaches Drag & Drop Interface. So hat sich das Mühsame bearbeiten der Galerien im Shortcode erledigt, definitiv eine große Erleichterung für Autoren, die sicht nicht großartig mit dem Code beschäftigen wollen.
Insgesamt macht der neue Media Manager einen sehr guten Eindruck und stellt gerade für Webmaster oder Blogger, die mit vielen Bildern oder generell Mediendateien arbeiten, eine enorme Erleichterung dar.
WordPress Standard-Theme Twenty Twelve

Das neue Theme Twenty Twelve löst das alte Theme Twenty Eleven aus WordPress 3.4 ab und folgt dem aktuellen Responsive Webdesign Trend. Soll heißen,
Show more...
12 years ago
14 minutes 2 seconds

Webdesign-Podcast.de
WordPress 3.4 (Green) Neuerungen: Custom-Header, Custom-Backgrounds, oEmbed und Live Theme Vorschau als Video-Training
Ich habe euch bereits in einem kleinen Artikel die wichtigsten Neuerungen von WordPress 3.4 Green vorgestellt, sowie in einem weiteren die Funktionsweise der neuen Custom-Header Funktion. Um das ganze nun abzurunden, möchte ich euch alle neuen Funktionen in einem Video vorstellen.
Neben den Neuerungen in der Oberfläche möchte ich euch noch zeigen wie ihr die neuen Funktionen Custom-Header ( add_theme_support( ‚custom-header‘, $args ) ), register_default_headers() und Custom-Background ( add_theme_support( ‚custom-background‘ ) ) in eure Themes einbauen könnt.
Wie bereits erwähnt findet ihr alle Infos zu add_theme_support( ‚custom-header‘, $args ) und register_default_headers() in dem Artikel: WordPress 3.4 – Custom-Header mit add_theme_support() und natürlich in diesem Video-Podcast.

Anzeige:





(adsbygoogle = window.adsbygoogle || []).push({});



add_theme_support( ‚custom-background‘ )
Der Code für die Custom-Background Funktion ist extrem simpel, sieht wie folgt aus und muss in die functions.php integriert werden:

add_theme_support( 'custom-background', array(
'default-color' => 'ffffff' /* Standard-Farbe für den Hintergrund */
) );

Den Rest übernimmt WordPress, wenn ein Custom-Background gesetzt ist, wird in der wp_head() Funktion automatisch der entsprechend Stil ausgegeben.
Podcast Info:
Titel: WordPress 3.4 (Green) Neuerungen: Custom-Header, Custom-Backgrounds, oEmbed und Live Theme Vorschau als Video-Training
Autor: Pascal Bajorat
Länge: 17 Min
Dateigröße: 143 MB

Auf Vimeo ansehen…
Show more...
13 years ago
16 minutes 22 seconds

Webdesign-Podcast.de
Custom-Post-Types in WordPress mit eigener Taxonomie – mit Video-Training
Seit WordPress 3.0 besteht die Möglichkeit, dass man sich eigene Inhalts-Typen (sogenannte Custom-Post-Types) in Plugins oder in der functions.php seines eigenen Themes definieren kann. Custom-Post-Types gehören generell zu den interessantesten Neuerungen, die mit WordPress 3.0 eingeführt wurden, denn sie ermöglichen es jedem Plugin- oder Theme-Entwickler auf eigene Inhalts-Typen zurückzugreifen, die wie Seiten oder mit eigener Taxonomie wie Artikel behandelt werden können.
In diesem Tutorial möchte ich euch genau erklären wie ihr Custom-Post-Types verwendet, weiterhin findet ihr am Ende noch ein 40 minütiges Video-Training zu Custom-Post-Types, dieses entstammt meinem neuen WordPress-Video-Training.

Anzeige:





(adsbygoogle = window.adsbygoogle || []).push({});



Was sind Custom-Post-Types und wie funktionieren sie …
Stellen wir uns einmal vor, wir haben eine einfache Webseite von einer kleinen Firma: Die Webseite verfügt über einen Blog-Bereich (hier kommen Artikel und Kategorien zum Einsatz) und einige normale Seiten, wie z.B. Über uns, Partner, Kontakt und Impressum, diese Einzelseiten werden natürlich über die „Seiten“ Funktion von WordPress verwaltet.
Nun möchte der Seitenbetreiber neben den zwei Bereichen, Artikel und Seiten, noch einen weiteren Bereich Produkte in dem er nach Kategorien sortiert seine Produkte auflisten kann. Hier könnte man zwar die Artikel-Funktion missbrauchen, dass würde in diesem Fall aber nicht funktionieren, da diese ja bereits regulär für den Blog verwendet wird.
Genau hier würden nun Custom-Post-Types ins Spiel kommen, die prinzipiell genau so aufgebaut sind wie die Artikel in WordPress. Stellt auch also einfach vor ihr hättet eine zweite Artikel Funktion, die allerdings auch direkt Produkte heißt und einen eigenen Menüpunkt im Backend hat. Weiterhin sind die Artikel, die über den Custom-Post-Type Produkte eingefügt wurden, völlig unabhängig von den eigentlichen Artikeln.
Um das ganze etwas besser zu verdeutlichen seht euch einmal den beigefügten Screenshot an:

Auf dem Screenshot ist der in einem Plugin angelegte Custom-Post-Type Produkt zu sehen.
Tipp: Custom-Post-Types können auch für komplexere Funktionen verwendet werden, wie z.B. die Verwaltung einer Slideshow. Ein gutes Beispiel ist hier der NivoSlider, dessen Backend ebenfalls auf einem Custom-Post-Type basiert.
Custom-Post-Types als Plugin oder im Theme (functions.php)
Es gibt zwei Möglichkeiten Custom-Post-Types anzulegen, zum einen in der functions.php des aktiven Themes oder in einem einfachen kleinen Plugin. Beide Varianten haben wichtige Vor- und Nachteile.
Wann sollte man Custom-Post-Types in der functions.php definieren
Es macht nur dann Sinn Custom-Post-Types in einem Theme direkt in der functions.php zu definieren, wenn es sich dabei um Theme relevante Post-Types handelt, wie z.B. für eine Slideshow. Denn stellen wir uns einmal vor, wir würden die Produktverwaltung mit dem Theme verbinden und irgendwann das Theme wechseln, so wäre auch die Produktverwaltung wieder verschwunden. Man müsste nun die Custom-Post-Type Definition manuell in die functions.php des neuen Themes übernehmen, dass wäre nicht wirklich komfortabel.
Wann sollte man Custom-Post-Types in einem extra Plugin definieren
Wenn es sich um Inhaltsbezogene Post-Types handelt, die nicht direkt mit dem Theme zusammenhängen wie z.B. die Produktverwaltung. So kann man das Theme wechseln so oft man will,
Show more...
13 years ago
40 minutes 37 seconds

Webdesign-Podcast.de
simpleCE (mini CMS) Workshop – so werden statische Webseiten schnell und einfach bearbeitbar
In diesem Workshop möchte ich euch zeigen, wie man ganz einfach statische Webseiten umbaut und mit meinem mini CMS simpleCE verwalten kann. Das simpleCE System ist dabei so flexibel, dass man neben normalen Texten und Bildern auch eine individuelle Slideshow damit bearbeiten kann. Ebenso lassen sich Seitentitel und Metatags mit simpleCE verwalten.
Durch den einfachen Funktionsaufbau bietet simpleCE ein umfangreiches Framework zur Bearbeitung von Webseiten.
Hier gibt es weiterführende Informationen zu simpleCE:

* simpleCE (mini CMS) auf CodeCanyon
* simpleCE Produktinformationen auf Pascal-Bajorat.com
* simpleCE – Das kleine und feine mini CMS (inkl. Video)
* simpleCE (mini CMS) jetzt auf CodeCanyon


Anzeige:





(adsbygoogle = window.adsbygoogle || []).push({});



Podcast Info:
Titel: simpleCE (mini CMS) Workshop – so werden statische Webseiten schnell und einfach bearbeitbar
Autor: Pascal Bajorat
Länge: 40 Min
Dateigröße: 350 MB

Show more...
13 years ago
39 minutes 18 seconds

Webdesign-Podcast.de
HTML5 & CSS3 Video-Training – Animationen mit CSS3
Wie ihr vielleicht wisst, habe ich bereits einige DVD-Produktionen hinter mir. Dazu zählen unter anderem die Webdesign-Workshop DVD, Webdesign-Workshop DVD Vol. 2, sowie die Photoshop-Workshop-DVD – Effekte für Typo, Layout & Foto – Vol. 2. All diese DVD’s sind wunderbare Lernmittel, an denen ich und einige weitere Autoren mitgewirkt haben.
Das neue achtstündige HTML5 & CSS3 Video-Training ist nun das erste, dass ich als alleiniger Autor erstellt habe, daher möchte ich euch die DVD in diesem Artikel gerne kurz vorstellen und ein Training davon zum ausprobieren und antesten zeigen.
Als erstes fangen ich einmal damit an, was diese Lern-DVD / Video-Training von denen anderer unterscheidet. Ich selber mache mir bei solchen Projekten auch immer Gedanken, wie man bestimmte Sachen am Besten lernen kann. Letztendlich stand für mich fest, dass man am einfachsten lernen kann, wenn man den Einsatz von HTML5 und CSS3 nicht in Einzelnen kleinen Videos sieht, sondern in zusammenhängenden Praxis-Projekten.

Anzeige:





(adsbygoogle = window.adsbygoogle || []).push({});



Entsprechend werden in dem Video-Training drei ganze Webseiten in komplett unterschiedlichen Stilrichtungen vom leeren HTML-Dokument bis hin zur fertigen Webseite mit SlideShow und JavaScript spielereien umgesetzt und das Beste daran ist: Es wird wirklich kein Schritt übersprungen. So können sowohl Anfänger direkt mit HTML5 & CSS3 durchstarten, als auch Umsteiger ihr entsprechendes Wissen auf den neusten Stand bringen.
Neben den drei Praxis-Projekten sind noch über 10+ weitere Einzel-Workshops enthalten, diese decken unter anderem noch folgende weitere Themengebiete ab:

* Generelle Einleitung und Unterschiede zwischen XHTML / HTML4 gegenüber HTML5
* HTML5-Boilerplate – die beste Vorlage für HTML- und CSS3-Webseiten
* HTML5 Video Tag und eigene Video-Player mit JavaScript (video.js)
* HTML5 Audio Tag
* Formulare mit den neuen HTML5 Tags
* Animationen mit CSS3 (die sind echt verdammt cool 😉 )
* Typografie im Web mit CSS3, @font-face und Cufon
* Effektvolle Navigation mit HTML5 und CSS3 ( z.B. Verläufe und Transitions mittels CSS3  )
* Webseiten richtig testen / Browsertests ( damit es mit den neuen Standards auch keine bösen Überraschungen gibt )
* Die richtige Entwicklungsumgebung zum Erstellen von Webseiten ( vor allem für Anfänger gedacht, die sich zum ersten mal mit dem Thema HTML & CSS auseinandersetzen )
* Die besten Tools zum Erstellen von HTML5- und CSS3-Webseiten ( denn es kann nicht schaden, wenn man sich etwas Arbeit abnehmen lässt )

Ich denke mit dieser Aufstellung ist mir ein ausgeglichenes Lehrwerk zum Thema HTML5 & CSS3 gelungen, dass sowohl Anfänger, wie auch Umsteiger und Fortgeschrittene anspricht.
Da es für das Video-Training auch schon die ersten Käuferstimmen gibt und das Rating aktuell bei 5 von 5 Sternen liegt (was hoffentlich auch so bleibt) hier ein paar Kundenstimmen:

Hendrik Sommer – 5 von 5 Sterne vergeben
Ich habe mir bis jetzt erst die Einleitung angesehen und bin einfach nur begeistert! Ich habe schon lange keine so gute Lern-DVD mehr gesehen. Die Stimme ist sehr angenehm, das Tempo genau richtig und der gute Mann scheint wirklich Ahnung von dem zu haben, was er einem beibringen möchte. Insgesamt 5 von 5 Sternen!
mirrorme – 5 von 5 Sterne vergeben
Show more...
13 years ago
17 minutes 47 seconds

Webdesign-Podcast.de
Der Webdesign-Podcast.de ist ein Blog und Video-Podcast (Screencast) von Pascal Bajorat und Sascha Rudolph. Gemeinsam möchten wir euch in den Screencasts Tutorials zu den verschiedensten Themen im Web- und Grafikbereich zeigen. Neben den Tutorials und Anleitung erhaltet ihr auch immer wieder Neuigkeiten aus dem Bereich der Technik und Software.

Weitere Informationen erhaltet ihr auch auf unserer Webseite: www.webdesign-podcast.de - Feedback könnt ihr uns gerne über das Kontaktformular oder direkt via E-Mail zukommen lassen.