Data-Driven Webdesign: Wie man durch A/B-Testing und Benutzerfeedback bessere Websites erstellt

In der modernen Webentwicklung spielt die Optimierung der Benutzererfahrung (UX) eine zentrale Rolle. Data-driven Webdesign bietet eine systematische und wissenschaftliche Methode, um Websites zu verbessern. Durch A/B-Testing und Benutzerfeedback können Sie fundierte Entscheidungen treffen, die auf echten Daten basieren, anstatt auf Vermutungen oder subjektiven Meinungen. In diesem Blogbeitrag zeigen wir Ihnen, wie Sie diese Techniken anwenden, um Ihre Website zu optimieren und die Benutzerzufriedenheit zu steigern.

Die Vorteile von responsiver Typografie im Webdesign

In der sich ständig weiterentwickelnden Landschaft des Webdesigns, in der die Benutzererfahrung an erster Stelle steht, erweist sich responsive Typografie als ein entscheidendes Werkzeug für die Gestaltung ansprechender und zugänglicher Websites. Die Zeiten statischer Texte, die sich nicht an unterschiedliche Bildschirmgrößen und Geräte anpassen, sind vorbei. Responsive Typografie bietet eine dynamische Lösung, um sicherzustellen, dass Inhalte auf verschiedenen Plattformen lesbar und visuell ansprechend bleiben. Tauchen wir ein in die zahlreichen Vorteile der Integration responsiver Typografie in Ihr Webdesign-Arsenal.

Das Logo eines Unternehmens ist das wichtigste Wiedererkennungsmerkmal. Daher muss es 3 wichtige Dinge inspirieren: Professionalität, Vertrauen und Innovation. Wenn Sie am Anfang Designer sind und etwas Neues und Interessantes lernen möchten, zeige ich Ihnen heute in 5 einfachen Schritten, wie Sie Buchstaben hintereinander verschieben können aus einem Logo und wie Sie mit den Buchstaben in einem Text in Illustrator spielen können.Darüber hinaus können Sie in Ihrem Design und für Ihre Kunden moderne Typographie-Effekte erzielen. Fangen wir an!

Das Jahr 2024 steht vor der Tür, und mit ihm zeichnen sich in der Welt des Webdesigns spannende neue Trends ab, die sowohl für Designer als auch für Nutzer gleichermaßen richtungsweisend sein werden. Angesichts der rasanten technologischen Entwicklungen und der ständig wechselnden Benutzererwartungen ist es entscheidend, auf dem Laufenden zu bleiben und zu verstehen, welche Designelemente in den kommenden Monaten dominieren werden. Von der Renaissance des Skeuomorphismus, der eine Brücke zwischen dem Analogen und dem Digitalen schlägt, über die bahnbrechenden Möglichkeiten KI-generierter Bilder bis hin zu minimalistischen Text-Only-Layouts – die Trends 2024 versprechen, die Art und Weise, wie wir über Webdesign denken und es erleben, zu revolutionieren.

Semantisches HTML

Semantisches HTML spielt eine entscheidende Rolle in der Entwicklung moderner Webseiten. Es geht darum, den Inhalt einer Webseite auf eine sinnvolle und strukturierte Weise zu präsentieren. Doch was genau bedeutet semantisches HTML?

In der heutigen digitalen Welt ist eine Website, die sich auf die Bedürfnisse der Nutzer konzentriert, ein entscheidender Faktor für den Erfolg im Online-Bereich.Eine intuitiv gestaltete und leicht bedienbare Website schafft nicht nur positive Erfahrungen für die Besucher, sondern beeinflusst auch maßgeblich deren Engagement. Dieser Blog-Beitrag widmet sich den Schlüsselelementen, die eine Website wirklich benutzerfreundlich machen. Im Folgenden zeigen wir, wie Sie sicherstellen können, dass Ihre Website eine reibungslose und zufriedenstellende Online-Reise für Ihre Besucher bietet.

So können Sie ganz einfach ein responsives Webdesign mittels Flex-Layout erreichen

Das Flex-Layout ist ein mächtiges Werkzeug zur Erstellung von responsiven Designs. Mithilfe des Flex-Layouts können wir unsere Website so gestalten, dass sie sich an verschiedene Bildschirmgrößen und Geräte anpasst.

HTML5 und aktuelle Entwicklungen

HTML5 ist die neueste Version der Hypertext Markup Language, die für das Erstellen von Webseiten verwendet wird. Mit HTML5 wurden viele neue Funktionen eingeführt, die das Webdesign und die Benutzererfahrung verbessert haben.

HTML-Formulare

HTML (Hypertext Markup Language) ist eine grundlegende Programmiersprache für die Erstellung von Webseiten und wird von Entwicklern auf der ganzen Welt verwendet. Eine der häufigsten Verwendungsmöglichkeiten von HTML besteht darin, interaktive Formulare zu erstellen. Formulare ermöglichen es den Benutzern, Daten einzugeben und an den Server zu senden, um weiterverarbeitet zu werden. In diesem Artikel werden wir uns eingehender mit dem Erstellen von HTML-Formularen befassen.

HTML-Links und Navigation

Links sind ein grundlegendes Element in der HTML-Programmierung und spielen eine entscheidende Rolle beim Navigieren zwischen verschiedenen Webseiten und Ressourcen. In diesem Blog-Beitrag werden wir uns genauer mit HTML-Links und ihrer Verwendung zur Navigation befassen.

HTML-Tags und Elemente

Die Grundlagen von HTML: Was Sie wissen müssen
HTML, oder Hypertext Markup Language, ist eine grundlegende Technologie für die Erstellung von Websites. Es ist die Strukturierungssprache des World Wide Web und ermöglicht es Entwicklern, Texte, Bilder, Links und andere Elemente auf einer Webseite zu platzieren und zu formatieren.

So funktioniert der CSS Reset

Bei der Suche nach den besten CSS-Praktiken im Jahr 2023, taucht in den Ergebnissen oft die CSS-Reset-Funktion auf. Dabei handelt es sich im Grunde um die Aufnahme eines Stylesheets in denIhrer Website, das die Standardstile der verschiedenen Browser zurücksetzt. Auf diese Weise wird eine einheitliche Darstellung der Website in allen Browsern gewährleistet. Es gibt zwei Arten von CSS-Resets:

CSS Libraries

Einbinden von CSS Libraries für vorgefertigte Effekt-Bibliotheken

 

Wenn Sie Ihre Website mit beeindruckenden Effekten aufpeppen möchten, müssen Sie nicht alles selbst von Grund auf neu erstellen. Es gibt zahlreiche CSS-Bibliotheken, die vorgefertigte Effekte bieten und Ihnen viel Zeit und Arbeit sparen können. Beim Einbinden dieser Bibliotheken sollten Sie jedoch einige Dinge beachten.

CSS-Tipps und Tricks

Warum sind CSS-Tricks für Anfänger wichtig?

 

CSS kann für Anfänger oft eine große Herausforderung sein. Das direkte Bearbeiten des Codes und das Styling von Webseiten kann schnell überwältigend wirken. Aber machen Sie sich keine Sorgen, denn wir habe gute Nachrichten für Sie! CSS-Tricks sind der Schlüssel zum Erfolg für Anfänger. In diesem Artikel werden wir diskutieren, warum CSS-Tricks für Anfänger so wichtig sind und wie diese Ihnen helfen können, Ihre Webdesign-Fähigkeiten auf das nächste Level zu bringen. Sind Sie nun bereit Ihre CSS-Kenntnisse zu verbessern und ein besseres Verständnis dafür zu entwickeln, wie CSS funktioniert? Dann lesen Sie weiter!

So erstellen und stylen Sie einen Button in html/css

Das <button>-Tag definiert eine anklickbare Schaltfläche. Innerhalb eines <button>-Elements kann Text (und Tags wie <i>, <b>, <strong>, <br>, <img> usw.) eingefügt werden. Das ist bei einem Button, der mit dem <input>-Element erstellt wurde, nicht möglich!

Tipp: Gib immer das type-Attribut für ein <button>-Element an, um Browsern mitzuteilen, um welche Art von Schaltfläche es sich handelt.

 

honeypot

Einen DSGVO-konformen Spamschutz kann man in Form eines Honeypots umsetzen. "Ohne Javascript" (in der Überschrift dieses Beitrages) heißt hier jedoch nicht, dass wir hier eine serverseitige Umsetzung vorstellen (<?php IF Honeypotfeld ausgefüllt THEN nicht absenden ?>), sondern wir berücksichtigen hier, dass Bots das Formular auch gerne ohne Javascript besuchen und damit eine clientseitige Umsetzung via Javascript (<script>"IF Honeypotfeld ausgefüllt THEN nicht absenden"</script>) umgehen.

 

 

After Effects: Y-Shake Tutorial

Willkommen zu unserem ersten After Effects Tutorial. Heute zeigen wir Ihnen einen vertikalen Übergang von zwei Clips.

Hamburgermenü

Willkommen zu einem neuen Tutorial zur Webentwicklung! Heute zeige ich Ihnen, wie Sie ein Hamburger-Menü nur mit HTML und CSS erstellen können. Egal, ob Sie am Anfang einer Webkarriere stehen und nicht wissen, welche praktischen Projekte Sie durchführen sollen, oder ob Sie sich für den IT-Bereich begeistern, es ist ein fesselndes Tutorial. Und noch etwas: Es ist responsiv!

 

 

Webdesign-Trends 2023, die Sie nicht verpassen sollten

Webdesign-Trends sind immer im Wandel. Was heute noch modern und ansprechend ist, kann morgen schon veraltet wirken. Daher ist es wichtig, stets über die neuesten Entwicklungen und Trends in der Webdesign-Branche informiert zu sein. Im Jahr 2023 gab es bereits einige Veränderungen, die wir Ihnen nun präsentieren.

Die Bedeutung von Responsive Webdesign für den Erfolg Ihrer Webseite

Nur wenige Dinge haben sich in der Welt des Webdesigns so schnell weiterentwickelt wie die Technologie und die Art und Weise, wie Websites auf verschiedenen Geräten angezeigt werden. Heutzutage ist es nicht mehr ausreichend, eine Website zu haben, die lediglich auf einem Desktop-Computer gut aussieht. Stattdessen müssen Websites auf allen verschiedenen Geräten, von Smartphones bis hin zu Tablets, optisch ansprechend und funktional sein. Die Lösung für dieses Problem ist das sogenannte Responsive Webdesign. Bei dieser Art des Webdesigns passt sich die Website automatisch an die Größe des Bildschirms an, auf dem sie angezeigt wird. Das bedeutet, dass Inhalte, Bilder und Navigationselemente so angeordnet und skaliert werden, dass sie auf jedem Gerät optimal dargestellt werden.

 CSS- und HTML-Kenntnisse verbessern

Haben Sie schon einmal versucht, CSS und HTML zu lernen, aber es fällt Ihnen schwer, die richtigen Ressourcen oder Tools zu finden, um Ihre Fähigkeiten zu verbessern? Dann sind Sie hier genau richtig! In diesem Blogartikel stellen wir Ihnen die besten kostenlosen Tools und Ressourcen vor, mit denen Sie Ihre CSS- und HTML-Kenntnisse ganz einfach verbessern können. Egal, ob Sie ein Neueinsteiger oder bereits erfahrener sind, diese Tools werden Ihnen dabei helfen, Ihre Webentwicklungsfähigkeiten auf die nächste Stufe zu bringen. Worauf warten Sie noch? Tauchen Sie ein und entdecken Sie die besten kostenlosen Ressourcen, um Ihre HTML- und CSS-Kenntnisse zu verbessern.

benutzerfreundliches Webdesign

Ein ansprechendes und benutzerfreundliches Webdesign ist für den Erfolg einer Website von entscheidender Bedeutung. Wenn Ihre Website nicht intuitiv zu bedienen ist oder langsam lädt, werden potenzielle Kunden schnell das Interesse verlieren und zu einem Konkurrenten wechseln. Aber wie erstellt man ein Webdesign, das sowohl ästhetisch ansprechend als auch benutzerfreundlich ist? Unser Team von Experten in Sachen Webdesign bei Econcess steht Ihnen zur Seite. Wir bieten einen Full-Service-Ansatz, der sicherstellt, dass Ihr Webdesign sowohl den Bedürfnissen Ihrer Zielgruppe als auch Ihren Unternehmenszielen gerecht wird. Von der Planung und Gestaltung bis hin zur Programmierung und Optimierung sind wir Ihr Ansprechpartner, um das bestmögliche Webdesign für Ihre Website zu erstellen. In diesem Blog-Artikel geben wir Ihnen einige Tipps, wie Sie ein benutzerfreundliches Webdesign entwickeln können, das Ihre Kunden begeistert und zum Wiederkommen animiert.

KI revolutioniert handel

Künstliche Intelligenz (KI) ist eine der spannendsten Entwicklungen unserer Zeit und hat in vielen Branchen - darunter auch im Handel - bereits große Veränderungen hervorgerufen. Im E-Commerce kann KI dazu beitragen, den Kundenservice zu optimieren, das Einkaufserlebnis zu verbessern und sogar die Effizienz in der Logistik zu steigern. In diesem Blogbeitrag möchten wir Ihnen einige der wichtigsten Aspekte von KI im E-Commerce näherbringen. Von der Personalisierung über die Bilderkennung bis hin zu Chatbots und Lieferung - wir werden versuchen, alle Ihre Fragen zu beantworten und Ihnen eine umfassende Einführung in das Thema zu geben. Also machen Sie es sich bequem und lassen Sie uns gemeinsam in die Welt der KI im Handel eintauchen.

Webdesign, Joomla Google Fonts Lokal einbinden

Lernen Sie in diesem Tutorial, wie Sie Google Fonts im Joomla Theme lokal einbinden können. Erfahren Sie, wie Sie Google Fonts DSGVO-konform einbinden und Ihre Webseite professionell gestalten können.

 

Webdesign, erfolgreich im E-Commerce

Heute erwarten Kunden mehr als damals in der täglichen Erlebnisökonomie. Eine sehr gute User Experience ist essenziell, damit Kunden sich überzeugt fühlen von einem Produkt oder einer Dienstleistung. Mit dem Betreten eines E-Shops oder Website ist der erste Eindruck bedeutend für die Kaufentscheidung, die User Experience steht somit im Mittelpunkt des unternehmerischen Geschicks, Kunden für sich zu gewinnen. Eine positive User Experience ist die Messlatte für den Unternehmenserfolg im Onlinehandel. Wir vermitteln in diesem Beitrag, was Nutzererfahrung im B2B bedeutet, wie wichtig User Experience im B2B ist und weswegen Personalisierung erfolgreich im E-Commerce macht.

Webdesign, beliebtesten WordPress Plugins

In diesem Blogartikel stellen wir euch die 5 beliebtesten WordPress Plugins 2022 vor, damit Sie einen richtigen Start mit Ihrer WordPress-Webseite hinlegen. Wir zeigen Ihnen, was Sie mit den WordPress-Tools machen können.

Dpi

Kurz gesagt bedeutet dpi, wie viele dots auf einem inch dargestellt werden können. Übersetzt gibt der Wert also die Menge der Bildpunkte pro Zoll an. Ein Inch/Zoll entspricht 2,54 cm. Das ist besonders im Printbereich für den Druck wichtig, da für einen qualitativ hochwertigen Druck, je nach Druckart und Bildmotiv, eine unterschiedlich hohe Auflösung notwendig ist. Dabei gilt grundsätzlich: Je höher der dpi-Wert ist, desto besser ist die Druckqualität. Bei einer zu geringen dpi-Zahl ist das Druckbild dementsprechend pixelig und unscharf.

 

HTML Grundlagen

Die Hypertext Markup Language (HTML) ist eine textbasierte Auszeichnungssprache zur Strukturierung elektronischer Dokumente wie Texte, Bildern und anderen Inhalten. Wir zeigen dir heute die grundlegenden Basics:

WordPress Update Version 5.9

Im Januar 2022 ist die neue WordPress Version 5.9 erschienen. Das Update geht einen weiteren Schritt in Richtung Full-Site-Editing (FSE) mit dem Gutenberg-Editor. Damit ist ein blockbasiertes Editieren von Inhalten nicht mehr nur für Widgets möglich, sondern die gesamte Webseite kann vom Backend aus angepasst werden. Außerdem wurden viele Anpassungen und Verbesserungen am Block-Editor selbst und der allgemeinen Performance von WordPress vorgenommen.

 

CSS Inline-styling

Wenn ein Browser ein Stylesheet liest, formatiert er das HTML-Dokument gemäß den Informationen im Stylesheet. Es gibt drei Möglichkeiten, ein Stylesheet einzufügen: Externes CSS, Internes CSS, Inline-CSS.

CSS-Eigenschaft - width und height

Blockelemente nehmen per Default so viel Breite ein wie möglich, und so viel Höhe wie nötig. Mit Hilfe von CSS können Breiten und Höhen erzwungen werden, sowohl zum Beschränken als auch zum Strecken. Insgesamt stehen CSS-Eigenschaften für Breite und Höhe (width und height), Mindestbreite und Mindesthöhe (min-width und min-height) sowie Maximalbreite und Maximalhöhe (max-width und max-height) zur Verfügung.

 

CSS - Fonts

Die Wahl der richtigen Schriftart hat einen großen Einfluss darauf, wie die Leser eine Website erleben. Sie kann deiner Marke eine starke Identität verleihen und wertet den Text auf. Es ist wichtig, eine leicht lesbare Schrift in der richtigen Farbe und Textgröße zu wählen. Die richtige Schriftart für deine Webseite zu finden ist also ein sehr wichtiger Faktor beim Erstellen einer Webseite!

 

Barrierefreies Webdesign

Barrierefreie Websites sind notwendig, um Inhalte für jedermann zugänglich zu machen. Denn jeder Besucher sollte unabhängig von persönlichen oder technischen Barrieren die Inhalte auf deiner Website lesen, verstehen und mit ihnen interagieren können. Einige Menschen sind hierbei auf assistive Hilfsmitte angewiesen.

 

Code Buttons

Das <button>-Tag definiert eine anklickbare Schaltfläche. Innerhalb eines <button>-Elements kann Text (und Tags wie <i>, <b>, <strong>, <br>, <img> usw.) eingefügt werden. Das ist bei einem Button, der mit dem <input>-Element erstellt wurde, nicht möglich!

Tipp: Gib immer das type-Attribut für ein <button>-Element an, um Browsern mitzuteilen, um welche Art von Schaltfläche es sich handelt.

 

HTML - Images einfügen

Das HTML-Tag <img> wird verwendet, um ein Bild in eine Webseite einzubetten. Die Bilder werden technisch nicht in die Webseite eingefügt; sie werden mit der Webseite verlinkt. Das <img>-Tag erstellt einen Platzhalter für das referenzierte Bild.

 

Html Tabelle

Eine Tabelle ist eine geordnete Zusammenstellung von Texten oder Daten. Die darzustellenden Inhalte werden dabei in Zeilen (waagerecht) und Spalten (senkrecht) gegliedert, die grafisch aneinander ausgerichtet werden. HTML-Tabellen sind die semantisch passende Struktur, um tabellarische Daten in Zeilen und Spalten darzustellen. Für den Aufbau einer Tabelle der Gitterstruktur sind mehrere Elemente verantwortlich. Im einfachsten Fall besteht eine Tabelle aus Tabellenzeilen, in welchen sich Tabellenzellen befinden.

 

CSS float und clear

Mithilfe der CSS-Eigenschaft „float“ kann ein Element an die linke oder rechte Innenkante seines Elternelements verschoben werden. Die Besonderheit dabei: Mit der Eigenschaft „clear“ kann festgelegt werden, ob nachfolgende Inhalte um das Element herumfließen oder einen eigenständigen Abschnitt bilden.

 

Klassen in HTML und CSS

Das class-Attribut ordnet ein Element einer oder mehreren Klassen zu. Klassen sind ein HTML-Konzept, um gleichartige Elemente im Markup zu kennzeichnen mit dem (nicht alleinigen!) Ziel, diese mit einem Klassenselektor ansprechen zu koennen. Dabei müssen es nicht unbedingt gleichartige Elemente sein. Mehrere Klassennamen werden durch Leerzeichen getrennt.

 

Unterschied CSS margin und padding

Wenn es an die Gestaltung von Webseiten geht, wird man früher oder später auf die Begriffe Margin und Padding stoßen. Egal, ob es um das Erstellen von Buttons oder der Anordnung von Textfeldern geht – man kommt selten drum herum. Grundsätzlich definiert das Boxmodell CSS margin als „Abstand“ und padding als „Polster“.

CSS Border Style

Mit den CSS-Rahmeneigenschaften kann der Stil, die Breite und die Farbe eines Rahmens eines Elements angepasst werden. Die Eigenschaft border-style gibt an, welche Art von Rahmen angezeigt werden soll.

 

PageSpeed

Der PageSpeed (auch Ladezeit genannt) beschreibt die benötigte Zeit, bis eine Webseite vollständig geladen ist. Je schneller eine Seite geladen wird, desto schneller kann der Besucher die Inhalte sehen und entsprechend innerhalb der Webseite navigieren. Außerdem sorgt eine schnelle Ladezeit auch dafür, dass ein Besucher eine Webseite überhaupt besuchen kann und nicht aufgrund langer Wartezeit den Besuch abbricht, bevor er Inhalte sehen konnte.

 

Critical CSS

Critical CSS wird oft als “Critical CSS Rendering Path” bezeichnet, womit der gesamte notwendige CSS-Code gemeint ist, der erforderlich ist, um die Webseite in einem Browser für den Webseitenbesucher darzustellen. Der Besucher wird oft einen weißen Bildschirm sehen, bis die CSS-Stylesheets heruntergeladen und ausgewertet wurden. Aus diesem Grund ist die Optimierung der Auslieferung von CSS wichtig für die Seitengeschwindigkeit und das User Experience. Um die Ladegeschwindigkeit einer Webseite zu verbessern, sollte nur das CSS geladen werden, das zum Laden des sichtbaren Teils einer Seite erforderlich ist. Da alle CSS gerendert werden, bedeutet dies, dass die Seite für den Besucher der Webseite viel schneller erscheint. Das ist der Grund, warum Pagespeed-Tools den Nutzern oft raten, render-blockierendes CSS below the fold zu entfernen. Dies bezieht sich auf CSS, das nicht benötigt wird, damit die Seite im Ansichtsbereich des Besuchers der Webseite richtig dargestellt wird. Der Inline-Teil (also direkt im `<head>` durch `<style>`) soll alles beinhalten, was zum Rendern des Sichtbereichs notwendig ist. Dieser Teil wird als „critical“ bezeichnet.

 

Mobile first

"Mobile first" bezeichnet ein Konzept im Responsive Webdesign. Dabei wird zuerst die für mobile Endgeräte optimierte Seite entwickelt und später folgen dann nach und nach Erweiterungen für größere Displays wie den Desktop-Browser. Man arbeitet also von der kleinsten Layout-Version hin zur größten. Webdesign nach dem Grundsatz des Mobile First ist eine Anpassung an die Tatsache, dass sich die Nutzung des Internets immer mehr in Richtung Smartphone verschiebt. Der Anteil der Suchanfragen aller relevanter Länder über das Smartphone ist mittlerweile bedeutend größer als über das klassische Desktop-Gerät.

 

Bildformat

Gerade im Web kommt es auf viele Faktoren an, wenn es um die Wahl des passenden Bildformates geht. Hierzu zählen die Dateigröße, das Farbspektrum, die Transparenz und Skalierbarkeit. Doch Welches Bildformat ist wofür am besten geeignet? Es gibt viele verschiedenen Bildformate jedoch unterscheiden Sie sich in den einzelnen Eigenschaften. Einige unterstützen beispielsweise einen Transparenten Hintergrund, andere haben ein großes Farbspektrum und wieder andere lassen sich nur verlustbehaftet komprimieren.

Mockup

Ein Mockup (Vorführmodell, Anschauungsmodell) ist ein digitaler Entwurf einer App oder Webseite, um aus einem Kundenwunsch beziehungsweise einer Idee ganz individuelle Designs zu erstellen. Mockups dienen in der frühen Konzeptionsphase der Visualisierung von Ideen und Konzepten im Rahmen des Webdesigns. Der Sinn hinter einem solchen Mockup-Konzept ist, dass verschiedene Kombinationen von Elementen sowie unterschiedliche inhaltliche Strukturen ohne großen Aufwand gestaltet und verändert werden können.

Kontaktformular

Kontaktformulare können prinzipiell jede Webseite bereichern, da es den Besuchern deiner Webseite die Möglichkeiten gibt, schnell und einfach mit dir in Kontakt zu treten und dir als Webseiten-Betreiber eine Nachricht zu schicken. Außerdem sind sie ein einfacher und weit verbreiteter Weg, um Feedback oder Anfragen von Kunden oder Interessenten zu sammeln.

 

Domain

 Eine Domain ist die Adresse, die Leute benutzen, um eine Website zu besuchen. Es handelt sich um einen weltweit einmaligen und eindeutigen Namen bzw. Adresse, unter der Nutzer Inhalte im Internet oder Netzwerk erreichen können. Sie ist ein wesentlicher Bestandteil des Uniform Resource Locators (URL) und gibt an, wo in der hierarchischen Struktur die entsprechende Ressource zu finden ist. Internet-Domains können beispielsweise so aussehen: www.beispiel.de.

 

HSB-Farbmodell

Neben dem RGB-Modell werden die Farben digital sehr oft mit dem HSB-Modell bestimmt. Das H steht für „hue“ – in Deutsch Farbenwert. Das S steht für „saturation“ – Sätigung. Und das B steht für „brightness“ – den Helligkeitswert. Der Farbton wird als Winkel zwischen 0° und 360° beschrieben, während die Sättigung und Helligkeit als Prozentwerte zwischen 0% und 100% angegeben werden.

 

Breakpoints

 Responsive Websites basieren auf flexiblen Gestaltungsrastern und passen sich automatisch an die unterschiedlichen Bildschirmgrößen der verschiedenen Endgeräte an. Für die optimale Darstellung auf Tablets oder Smartphones werden dazu mithilfe von CSS Media Queries sogenannte Breakpoints definiert. Das sind die Punkte, ab der das Design einer Webseite anders gestaltet wird, bzw. die Container umbrechen.

WordPress Vor- und Nachteile

WordPress ist eine Software, mit der ein eigener Blog oder eine Webseite erstellt und gepflegt werden kann. Die Software ist ein Content-Management-System (CMS), das sich durch seine weite Verbreitung, einfache Konfiguration und seine hohe Anpassbarkeit auszeichnet.

CSS steht für Cascading Style Sheets und ist eine Gestaltungs- und Formatierungssprache, die ermöglicht, das Aussehen und Design von HTML-Dokumenten zu bestimmen. Es geht also nicht um den Inhalt einer Webseite, sondern um das Design oder den Stil der Seite. Mithilfe von CSS können Nutzer zum Beispiel Schriftarten, Farbe, Linien, Höhen und Breiten auf einer Webseite anpassen.

 

Typografie: Serif und Sans-Serif

 Der Unterschied zwischen serifenlosen Schriftarten und Serifenschriften liegt in den sogenannten Serifen, welche Verzierungen der Buchstaben sind. Das sind die kleinen, abschließenden Querstriche am oberen oder unteren Ende der Buchstaben. Sans-Serif Schriftarten haben klare Linien und keine Verzierungen.

 

Bootstrap

Bootstrap ist ein freies Frontend-CSS-Framework. Es enthält auf CSS und HTML basierende Vorlagen zu Gestaltung von Buttons/Schaltflächen, Grid-Systeme, Icons, Typografie und Hervorhebungen, Tabellen, Formulare, Navigations- und andere Gestaltungselemente. Außerdem ist Bootstrap ein anpassungsfähiges und zuerst für mobile Geräte wie Smartphones („Mobile First“) entwickeltes Framework. Das bedeutet, dass Bootstrap mit Hilfe von Media-Queries Anwendungen und Webseiten ohne doppelten code an jedes beliebige Gerät anpasst.

 

gute Webseite

 

Wer eine eigene Webseite betreibt, möchte mit seinen Inhalten möglichst viele Leute erreichen und natürlich mit dem Inhalt überzeugen. Doch was macht eine Website zu einer guten und vor allem benutzerfreundlichen Seite, die von den Besuchern geschätzt und häufig genutzt wird? Hier spielen neben der passenden Domain, das Webdesign und die Programmierung der Webseite eine große Rolle.

 

Farbenlehre - Der Farbkreis

 Was ist der Farbkreis?

Der Farbkreis dient als Ordnungssystem, in dem Farben kreisförmig angeordnet sind. Er bietet eine Orientierung über die Farbkompositionen und es wird dargestellt, welche Farben harmonieren. Es existieren verschiedene Varianten des Farbkreises, in denen die Farben nach Physikalischen, Physiologischen, Künstlerischen, Ästhetischen und technischen Aspekten unterteilt werden.

Unterschied RGB und CMYK

 

Um Farbeindrücke bei digitalen Medien und im Print zu verwenden, werden vordergründig zwei Systeme verwendet: RGB und CMYK. Die Farbräume von RGB und CMYK sind nicht deckungsgleich. Das bedeutet, dass nicht alle RGB-Farben gedruckt werden, und nicht alle mit CMYK erzeugten Druckfarben auf digitalen Displays angezeigt werden können.

 

Wordpress Update auf Version 5.5

Wir haben in unserer Internetagentur festgestellt, dass das Update auf Wordpress 5.5 oft Probleme verursacht. Nach längerer Recherche sind wir auf die Ursache gestoßen.

Image Map

Was ist eigentlich eine Image Map? Wissen Sie es? Wenn Sie dieses Thema interessiert, dann sind Sie hier richtig. Im Folgenden wird erklärt, was eine Image Map ist, welche Ziele diese hat und in welchen Bereichen sie eingesetzt wird. Außerdem wird durch Beispiele erläutert, wo sie am meisten genutzt wird. Darauffolgend werden die Vor- und Nachtteile einer Image Map geschildert und wichtige Schlüsselbergriffe erklärt. Zum Schluss gibt es eine Anleitung für die Erstellung einer eigenen Image Map mit einer App wie zum Beispiel:"Photoshop".

 WordPress Child-Theme

Was ist ein Child-Theme?

 

Ein Child-Theme ist ein Theme, dass das Styling und die Funktionen eines anderen Themes, dem sogenannten Parent-Theme erbt. Es ist sozusagen eine Kopie des Parent-Themes, in der man gewisse Änderungen und Anpassungen vornehmen kann, ohne das original Parent-Theme zu verändern.

 

 Call-to-Action

Bei einem Call-to-Action (zu dt. „Aufruf zu einer Aktion“) handelt es sich wie der Name schon sagt, um eine Aufforderung an den Nutzer etwas zu tun. Im Bereich Web-Design sind Call-to-Actions (CTA) normalerweise interaktive Elemente auf einer Webseite. Sie können z.B. in Form eines Buttons auftreten oder als einfacher Link. Aber auch ein eingebundenes Video kann ein Call-to-Action sein, da es den Nutzer animieren soll, darauf zu klicken und es anzuschauen.

Farbwahl einer Webseite

Egal ob man Farben für das gesamte Konzept einer Webseite sucht, oder ob lediglich einzelne Elemente gestaltet werden sollen, die Auswahl dieser Farben sollte gut durchdacht sein. Denn je nachdem, welche Farben man miteinander kombiniert, können ganz unterschiedliche Effekte erzielt werden. Deswegen ist es sinnvoll, zunächst die Grundlagen zum Thema Farben zu verstehen.

Newsletter erfolgreich

Wenn man einen Newsletter erstellt, bekommt man von dem Erstellungstool häufig die Möglichkeit geboten, den Erfolg des Newsletters anhand von auf Wunsch erstellten Reports zu analysieren. Dabei sieht man eine Menge Zahlen und Statistiken und weiß oftmals nicht so recht, was man damit anfangen soll. Welche Zahlenwerte sind gut und welche eher schlecht? Wie kann ich die Statistik nutzen, um den nächsten Newsletter ansprechender zu gestalten?

Wirkung und Funktion von Farben

Farben können in Bezug auf Webdesign unterschiedliche Funktionen haben und eine bestimmte Wirkung erzielen. Sie dienen zum Beispiel dazu, den Nutzer zu stimulieren, sie können eine Struktur erzeugen und den Nutzer leiten und nicht zuletzt werden sie gezielt eingesetzt, um Aufmerksamkeit zu erregen und bestimmte Elemente hervorzuheben.

UX Designer

In einem Designprozess gibt es kein Schema X, dem man einfach blind folgen kann. Jedes Produkt ist anders und somit ist auch seine Entwicklungsphase individuell anzupassen. Die Vorgehensweise eines UX Designer lässt sich also nicht verallgemeinern. Außerdem hat jeder Designer unterschiedliche Ansätze und Methoden, die sich für ihn oder sie bewährt haben. Dementsprechend soll dieser Artikel lediglich einen kleinen Überblick über einen möglichen Designprozess und verschiedene Methodiken bieten.

gutes Design

Das ist eine Frage, die jeder für sich selbst beantworten muss. Design ist nämlich in erster Hinsicht eines – und zwar subjektiv. Jeder Mensch hat einen individuellen Charakter und somit auch einen eigenen Geschmack. Was dem einen gefällt, das findet jemand anderes wiederum furchtbar.

 

 UX Design

Fachbegriffe wie beispielsweise User Experience Design werden in unserer Webdesign Agentur täglich verwendet, auch in Kundengesprächen. Dabei wird häufig vergessen, dass nicht jeder weiß, was eigentlich hinter diesem Begriff steckt. Deswegen soll der folgende Artikel dazu Abhilfe schaffen.

 

Chronoforms 5 Variabilisierung von Footer/Header

In unserer Agentur haben wir vor einigen Jahren für einen Kunden eine Seite mit einigen Formularen erstellt. Allerdings haben wir damals einen festen Footer mit Geschäftsdaten in den Formularen hinterlegt.

Jetzt kam das Problem auf, dass ein Geschäftsführer das Unternehmen verlassen hat, und jedes Formular einzeln geändert werden musste.

Damit wir das Problem zukünftig umgehen, haben wir diesmal die Felder Funktion von Joomla verwendet.

 

COOKIE CONSENT DSGVO

Bei der Integration des Cookie Hinweises auf Wordpress Seiten verwenden wir das Plugin "Beautiful Cookie Banner". Dieses Plugin basiert auf dem Osano Cookie Consent Skript, welches wir in den anderen Blogbeiträgen schon verwendet haben.

Joomla Chronoform 0 syntax error, unexpected '}', expecting end of file

Auf Grund einer bevorstehenden Änderung in den Chronform Formularen haben wir eine Lokalinstallation einer Kundenwebseite aufgesetzt.

 

Seltsamerweise bekamen wir beim Abschicken der Formulare auf der Lokalinstallation folgende Fehlermeldung:

 

0 syntax error, unexpected '}', expecting end of file administrator\components\com_chronoforms5\chronoforms\actions\email\email.php(127) : eval()'d code:59

Kontaktformular in Laravel

Problemstellung in unserer Internet Agentur: Das Kontaktformular ist zweisprachig verfügbar auf unserer Website mit dem PHP-Framework Laravel, einmal Deutsch, einmal Englisch. Durch das Absenden des deutschen Kontaktformular auf der Website erhält der Administrator eine Mail auf Deutsch und kann diese Mail auch problemlos beim Antworten oder Weiterleiten anhängen. Nach dem Absenden des Kontaktformulars auf der Website in englischer Sprache erhält der Admin die Mail jedoch auch auf Deutsch.

 

Cookie Consent Magento 2

In diesen Beitrag zeige ich ihnen, wie man den Cookie Hinweis in Magento 2 einbindet. Wichtig: Falls Sie das Google Analytics per Backend eingebunden haben, müssen Sie dieses deaktivieren.

 

newsletter marketing

Bei der Erstellung von Templates in Newsletter2go kann es sein, dass man einen Abmeldelink in einer individuellen Vorlage integrieren möchte an einer Stelle innerhalb eines HTML-Elements und nicht in einem Textelement, in dem das Einfügen eines Abmeldelinks per Dropdown bzw. Popup angeboten wird (auf diese Möglichkeit verweisen die die meisten Hilfeartikel und -videos, die man hierzu finden kann). Also kann man hier unter Zuhilfenahme eines Abmeldelinks in einem Textelements den Shortcut-Code auslesen und diesen dann in das gewünschte HTML-Element übertragen.

 

Nach dem EUGH-Urteil vom 01. Oktober 2019 wird empfohlen, ein explizites Opt-In für alle Marketing-Cookies / für alle nicht zwingend für den Betrieb einer Website erforderlichen Cookies zu implementieren. Das heißt: Bevor überhaupt ein Marketing-Cookie ausgespielt wird, z.B. ein User durch Google Analytics getrackt wird, muss er diesem Cookie zustimmen. Wie setzen wir dieses explizite Opt-In-Verfahren nun in Laravel um? Eine schlanke und unkomplizierte Möglichkeit ist hier die Cookie Consent-Lösung von Osano (https://cookieconsent.osano.com/). Mit dieser können wir im Grunde mit ein wenig Javascript in 2 Layout-Partials alles erledigen (da Website zweisprachig, kommen hier noch 2 Sprachdateien dazu, dazu weiter unten mehr!).

reCaptcha 2 in Laravel einbauen

Problemstellung in unserer Internetagentur aktuell: Wie sichere ich mein Kontaktformular ab mit dem Google reCaptcha v2? Erst einmal holen wir uns die benötigte Erweiterung von Biscolab mit dem Composer via require biscolab/laravel-recaptcha. Danach folgen wir dem Manual unter https://laravel-recaptcha-docs.biscolab.com/docs/intro und erstellen via php artisan vendor:publish --provider="Biscolab\ReCaptcha\ReCaptchaServiceProvider" die Konfigurationsdatei und tragen unsere vorher bei Google beantragten Schlüssel (Site Key und Secret Key) ein in die Datei ".env".

TYPO3 v8 XAMPP Installation

Vor der Installation prüft TYPO3, ob alles Installationsvoraussetzungen erfüllt sind. Unter anderem prüft TYPO3 auch, ob das memory_limit in der php.ini der XAMPP-Installation beschränkt ist. In unserem Fall hatten wir dies beschränkt auf 2.048 MB:

memory_limit=2048M. Dennoch erschien vor der TYPO3-Installation immer noch der Warnhinweis: "Unlimited memory limit for PHP". Die detaillierte Meldung lautete hierbei:

 

Joomla Chronoforms

Wie exportiert man Formulareingaben in Joomla-Formularen, welche über Chronoforms implementiert sind? Ein gut verwaltbarer Weg ist z.B. die Einbindung von entsprechendem Code via Backend. So wählt man ein beliebiges Formular über "Komponenten-ChronoForms5" aus und wechselt in die Registerkarte "Setup".

Update von 2.5 auf 3.x Joomla

Wenn Sie Ihre Seite von Joomla 2.5 auf 3.x aktualisieren möchten, kann es vorkommen, dass Sie die Nachricht bekommen, dass „Keine Aktualisierungen vorhanden“ sind.

 

 

Table 'Tabellenname.#__chronoforms_LoginEvents' doesn’t exist

Erhält man in Joomla mit Erweiterung Chronoforms (v5) die Meldung Table 'Tabellenname.#__chronoforms_LoginEvents' doesn’t exist auf einem Linux-Server und existiert die vorgenannte Tabelle, kann es an einem Problem mit der Groß- / Kleinschreibung liegen. Der genaue Ort ist schwer zu finden, da die Formulare in Chronoforms in serialisierter Form in der Datenbank gespeichert werden. Bei uns war eine Log-Action im Setup-Bereich eines Formulares der Verursacher, hier wurde die ausgewählte Tabelle nicht angezeigt, obwohl die Verifizierung durch Chronoforms eine getroffene Auswahl bescheinigen konnte ("Table selected" in der Setup-Übersicht des betroffenen Formulares.

 

 Kiribati-Schnittstelle

Aufgabenstellung war hier: Anbindung der mit Kiribati verwalteten Seminare ("Kiribati Seminarverwaltung" der Include GmbH) an eine TYPO3 8-Website, um Veranstaltungen auf der Website anzeigen lassen zu können und auf der TYPO3-Webseite durchgeführte Registrierungen an Kiribati weiter zu reichen, also die Implementierung eines Veranstaltungsimports (Kiribati -> TYPO3-Webseite) und eines Registrierungsexports (TYPO3-Webseite -> Kiribati).

 

Akkordeon in Chronoforms Joomla

Wir wollen in Chronoforms V5 in Joomla einen Akkordeon-Container erstellen, mit dem man lange Texte verstecken und bei Bedarf ausklappen kann, im Chronoforms-Kontext somit einen Slider. Es gibt einige Tutorials, die den Aufbau erklären und auch einigermaßen funktionieren. D.h.: Man baut einen "slider_area"-Container und fügt in diesen dann "slider"-Container ein, die man wiederum mit individuellem Content befüllen kann. Soweit, so gut - wenn man jedoch nur einen einzelnen Text in einem Akkordeon darstellen möchte, ergeben sich 2 Probleme:

 

Wordpress Plugin Problem

Betreibt man das Mehrsprachenplugin "WPML" und  stellt dieses so ein, dass die verschiedenen Sprachen unter verschiedenen Domains / Subdomains erreichbar sind, kann es durch den gleichzeitigen Betrieb des Performance-Plugins "WP Fastest Cache" zu Problemen kommen. Denn dieses berücksichtigt bei der Definition des Page-Caches die unterschiedlichen Sprachen nicht, zeigt unter einer anderen Domain denselben Inhalt an, da Cache-Verzeichnis identisch.

phpMyAdmin

Wenn man das Passwort für das Backend eines CMS vergessen hat, sollte man keine Panik bekommen, denn es ist noch nicht alles verloren. Es ist möglich über eine Datenbank Änderung das Passwort zurückzusetzen.

phpMyadmin: Fatal error

Es kann durchaus vorkommen, dass bei einem Datenbank Import per phpMyadmin folgende  Fehlermeldung ausgeben wird:

 

Fatal error: Maximum execution time of 60 seconds exceeded in xampp\phpmyadmin\libraries\dbi\mysql.dbi.lib.php on line 140

 

Wie man anhand der Fehlermeldung erkennen kann, ist die maximale Ausführungszeit von 60 Sekunden überschritten worden. Dies passiert oft bei besonders großen Datenbanken. Um die Datenbank trotzdem importieren zu können, ist es nötig, die Ausführungszeit manuell zu erhöhen.

Wordpress Fehlende Übersetzungen Plugins

Unter Umständen kann es dazu kommen dass Plug-Ins wie z.B. WooCommerce Deutsch (de_DE) keine vollständige Übersetzung anzeigen, obwohl diese Sie grundlegend anbieten. 

 

Child-Theme erstellen wordpress

Änderungen an Themes können einige Probleme mit sich bringen. Zu einem können Fehler die Webseite (bei fehlenden Backup) komplett zerschießen, und zum anderen können Änderungen, die am Theme vorgenommen worden sind, beim nächsten Update des Themes überschrieben und somit gelöscht werden.

 

 

phpMyadmin: Fatal error

Es kann durchaus vorkommen, dass bei einem Datenbank Import per phpMyadmin folgende  Fehlermeldung ausgeben wird:

Fatal error: Maximum execution time of 60 seconds exceeded in xampp\phpmyadmin\libraries\dbi\mysql.dbi.lib.php on line 140

Wie man anhand der Fehlermeldung erkennen kann, ist die maximale Ausführungszeit von 60 Sekunden überschritten worden. Dies passiert oft bei besonders großen Datenbanken. Um die Datenbank trotzdem importieren zu können, ist es nötig, die Ausführungszeit manuell zu erhöhen.

 

MooTools Slideshow

Bei der einfachen Implementierung einer Slideshow mit Hilfe der Javascript-Bibliothek MooTools kann es bei neueren Joomla-Installationen und damit auch neueren MooTools-Bibliotheken zu Problemen kommen. So wird in MooTools ab Version 1.4.0 die "setters"-Syntax wie z.B. Element.setOpacity() und Element.set('opacity') nicht mehr unterstützt.

Git

Verwendet man die Git zur Versionsverwaltung von Software-Projekten, ist es sinnvoll, bestimmte Dateien und Ordner vom Datentranfer auszuschließen (z.B. Konfigurationsdateien, temporäre Dateien wie Session- oder Cache-Dateien, Log-Dateien).

CSS-Styles

Wenn sich die Frontend-Ansicht in Joomla stark von der Backendansicht im Backend unterscheidet, werden die Frontend-CSS-Styles im Backend-Editor nicht oder nur teilweise geladen. Ein Blick in den Quelltext (wie in den meisten anderen Fällen!) lohnt sich hier: So sollten wir bei der Suche nach der Javascript-Variablen "content_css" fündig werden und uns diesen Wert genauer anschauen. Hier sollte sich die Einstellung wiederfinden, die in der JCE-Komponente vorzunehmen sind:

 

click-Event in select-Elementen

Der Internet Explorer kann nicht mit dem click-Event innerhalb von select-Elementen umgehen. Verwendet man somit AJAX-basierte Effekte, die mit der Auswahl einer Option innerhalb eines select-Elements ausgelöst werden sollen, passiert im Internet Explorer: nichts. Diese Problematik kann man umgehen, in dem man aus dem click-Event einen change-Event macht. In unserem Beispiel bedienen wir uns des Javascript-Frameworks Prototype

php.ini

Es gibt mehrere Möglichkeiten, die PHP-Parameter für eine Domain anzupassen, die über einen V-Server bei Strato gehostet und mit dem Betriebssystem openSUSE und der Verwaltungs-Oberfläche Plesk unterlegt ist. Eine Möglichkeit hierzu ergibt sich direkt in Plesk.

Schriftgröße auf Android-Devices

Um die Anpassung der Schriftgröße im Google-Browser Chrome auf Android-Geräten zu vermeiden, kann man die max-height des betreffenden Elements bzw. Containers auf 99999px (o.ä.) setzen.

Kollation

Um die deutschen Umlaute Ä, Ö und Ü bzw. ä, ö und ü richtig in einer MySQL-Datenbank zu sortieren, benötigt man die passende Kollation (den passenden Zeichensatz) in der betreffenden Spalte.

Joomla  Popup-Fenster  Menüpunkt

Ein Popup-Fenster herzustellen, das nach dem Klick auf einen Menüpunkt in Joomla erscheint, ist in einem ersten Schritt sehr einfach. In der Menüpunktbearbeitung wählt man als Menüeintragstyp "Systemlinks->Externe URL" im Dropdown "Zielfenster" die Option "Neues Fenster ohne Navigation" aus.

Apache Server Crash

Stürzt bei der Ausführung von Joomla 3 in Verbindung mit dem JCE Editor in einer lokalen Umgebung der in XAMPP integrierte Apache Server regelmäßig ab, kann dies durch einen Überlauf des Speichers verursacht sein.

Steuerelemente in Google Maps

Wenn die Steuerelemente bei Nutzung der Google Maps API fehlen, wird in verschiedenen Beiträgen immer wieder auf das Styling des <img>-Tags verwiesen - mit dem Vorschlag, die Maximal-Breite auf "none" zu setzen (max-width: none).

Mouseover-Funktionalität

Tauchen Probleme bei der Verwendung der Pseudo-Klasse :hover im Zusammenhang mit Apples iPhone auf, sind diese in der Regel schnell zu lösen.

YOAST qTranslate

Wenn man sich bei seiner Wordpress-Installation mit installiertem SEO-Plugin namens YOAST und dem Übersetzungs-Plugin qTranslate nicht mehr zu helfen weiß, da man die verschiedenen SEO-Tags nicht in verschiedenen Sprachen eingeben kann, kan man die functions.php des verwendeten Templates mit folgender Syntax erweitern

Widgets fehlen nach WP-Umzug

Hat man eine Wordpress-Installation nach allen Regeln der Kunst auf einen neuen Server übertragen (siehe auch hier), alle Pfade und Deklarationen in der Datenbank, der wp-conig.php, etc.

WP-Plugins Add-From-Server fehler

Möchte man sich eine Homepage erstellen lassen, verwendet hierbei Wordpress und das WP-Plugin "Add From Server", kann es zu Fehlfunktionen bei Ansprache des Admin-Bereiches kommen.

Fehlerhafte Sprachen-Verknüpfung

Der MSLS ist eine schöne Methode, um einen mehrsprachigen Wordpress-Multisite-Blog zu betreiben und funktioniert auch fast reibungslos.

Schrift-Arten per font-face

Hat man im Rahmen eines Webdesign-Projektes bei der Integration eines Schrift-Typs Probleme mit dem Internet Explorer in den Versionen IE7 und IE8 und funktioniert die Einbindung in anderen Browsern, kann es an der Reihenfolge der Deklarationen im CSS liegen.

Umschalten zwischen PHP-Versionen

Kommt man bei einem Serverumzug oder PHP-Update mit einem Migrationsprojekt in Berührung und möchte eine in PHP4-Syntax erstellte Homepage überarbeiten, um diese innerhalb einer PHP5-Umgebung zur Funktion zu bringen, ist es hilfreich, zwischen PHP4 und PHP5 umschalten zu können.

Unterschiede von PHP 4 und PHP 5Unterschiede von PHP 4 und PHP 5

Möchte man ein Website-Projekt von PHP4 auf PHP5 migrieren, sollte man zu den unter www.php.net/manual/de/ migration5.php dargestellten Spezifikationen insbesondere die Deklaration von globalen Variablen im Auge behalten.

MySQL-Tabellen

Möchte man bei der Erstellung einer Website innerhalb eines PHP-Skriptes Daten in eine MySQL-Datenbank übertragen, sollte man vor der Übertragung die Anführungszeichen als Inhalt deklarieren ("escapen").

 JS-Methode getElementsByName

Die Javascript-Methode getElementsByName eignet sich unter anderem gut, um Formularelemente innerhalb einer Website auszuwählen und weiterzuverarbeiten.

Allowed memory size of x bytes exhausted

Tritt während einer Homepage Erstellung die Fehlermeldung 'Fatal error: Allowed memory size of x bytes exhausted' innerhalb einer Joomla-Installation auf, muss dies nicht zwingend an der PHP-Konfiguration bzw. an dem zu niedrig gewählten Parameter memory_limit liegen.

Facebook-Beiträge in Joomla

Möchte man im Rahmen einer Website Erstellung die Pinnwand seines Facebook-Kontos innerhalb eines Joomla-CMS darstellen, kann man die kostenlose Extension "qe Facebook Wall Feed" nutzen (Joomla 1.5 und Joomla 2.5). Diese ist leicht zu installieren, indem man den Anweisungen des Handbuches folgt (Facebook Application erstellen, Login with Facebook, einbinden, fertig).

Theme My Login Registrierungs- und Login-Prozess

Sollte in einem Webdesign-Projekt die Fehler-Ausgabe bei Registrierung oder Login in Wordpress bei installiertem Pie Register Plugin nicht mehr funktionieren, sollte man in einem ersten Schritt alle anderen Plugins deaktivieren, um schädliche Wechselwirkungen auszuschließen.

Invalid Key Fehler

Möchte man in Wordpress das Passwort unter Verwendung des Plugins Theme My Login zurücksetzen und wird an die Invalid Key Fehler-Seite verwiesen, kann die folgende Änderung in der Plugin-Datei resetpass-form.php (entweder in /theme-my-login/templates/ oder im Theme-Ordner) abhilfe schaffen:

Wordpress-Login mit Plugin 'Theme My Login'

Möchte man als Webdesigner die Standard-Seite nach erfolgreichem Login in Wordpress ändern und verwendet das Plugin 'Theme My Login', muss man nicht lange in der wp-login.php des Installationsverzeichnisses suchen, um die Variable $redirect_to zu verändern.

 Link im Warenkorb zurück zur Produkt

Die Problemstellung: Nach dem Ablegen eines Produktes in den Warenkorb wird dieses in der Warenkorb-Ansicht mit dem Ort verlinkt, von dem aus es in den Warenkorb gelegt wurde. D.h.: Wenn man das Produkt aus einer Übersichtsseite hinzufügt, wird diese Übersicht auch verlinkt und nicht die Produktseite selbst.

booklet Javascript

Blätter-Funktion: Mit booklet-Javascript Buch-Effekt darstellen

Pixabay

Webdesign: Auf der Suche nach Fotos und Grafiken für die Website-Erstellung kommt man natürlich zuerst einmal nicht an den üblichen Verdächtigen vorbei

Bild-Effekt mit Javascript (before-after-JS)


Einen netten Vorher-Nachher-Effekt kann man mit

Opacity

Stellt man eine Transparenz oder Teil-Transparenz mithilfe der opacity-Eigenschaft in CSS3 her, ergeben sich zum Teil unerwünschte Effekte bei den Kind-Elementen, da diese Eigenschaft vererbt wird.

IMAP Problem

Kommt es bei der Nutzung eines IMAP-Kontos bei Abruf oder bei Verschieben von E-Mails zu einer Fehlermeldung à la "Zu viele Verbindungen", kann man in den Einstellungen von Mozilla Thunderbird, Outlook und Co.

PHP-Funktion in XSL / XSLT

Eine PHP Funktion lässt sich in XSL problemlos mit der Direktive XSLTProcessor::registerPHPFunctions ausführen.

Block-Element als Link

Aus dem Webdesign-Alltag: Um ein ganzes Block-Element (z.B. das div-Element) mit einer Verlinkung zu versehen, reicht es normalerweise, über das Blockelement ein Hyperlink-Tag (<a></a>) zu legen,

Poedit

Findet Poedit in einem angegebenen Verzeichnis einen Großteil der zu übersetzenden Strings nicht, kann dies unter Umständen an .phtml-Dateien liegen, die in der Grundeinstellung

Slimbox 2

Die Slimbox2 kann als Lightboxvariante innerhalb des Javascript-Frameworks jQuery in Joomla Probleme machen (hier der Fall in Joomla 2.5). Das kann an einer Kollision mit dem MooTools-Framework und anderen Komponenten liegen, die im Rahmen der "<jdoc:include type='head' />"-Direktive in der index.php des Template-Sets aufgerufen werden. Was also tun?

Slimbox 2 macht Probleme

Voraus geschickt: Die Slimbox2 ist eine richtig gute Lightbox-Variante, wenn nicht sogar eine der derzeit besten innerhalb des jquery-Frameworks. Einfach zu implementieren, einfach zu bedienen, einfach zu verändern.

Wordpress Shortcode PHP

Um die Wordpress Shortcode API außerhalb von Seiten bzw. Artikeln einbetten zu können (u.a. für Plugin-Funktionalitäten), dient die Funktion do_shortcode():