Bleib auf dem Laufenden und profitiere von unserer jahrelangen Erfahrung.

In unserem Blog geht es rund um Coding, UX, UI, Webdesign und Tutorials. Dabei greifen wir auf jahrelange Erfahrung in der IT-Branche zurück.

Responsive Tables: Die bessere Option zu Tabellen

| Allgemein, Code Snippets, How-to, Webentwicklung | No Comments
Tabellen werden häufig verwendet, um Daten übersichtlich darzustellen. Auch auf Webseiten sind sie oft zu finden. Allerdings werden sie immer seltener eingesetzt, da es oft Probleme mit der Darstellung auf kleinen Geräten wie Tablets oder Handys gibt.

Critical CSS: Jetzt wirds kritisch!

| Allgemein, Code Snippets, How-to, Webentwicklung | No Comments
Selbst in Zeiten von 5G-Flatrates und extrem leistungsstarken Endgeräten ist und bleibt es wichtig, den Datenaustausch zwischen Server und Client möglichst gering zu halten. Nicht unbedingt um Daten zu sparen, sondern um den User nicht mit langen Ladezeiten zu nerven.

Der sicherste Weg zu einem number-only Textfeld

| Allgemein, Code Snippets, How-to, Webentwicklung | No Comments
Es gibt diverse Anwendungsfälle, bei denen auf einer Webseite von den Nutzer/-innen verlangt wird, eine Zahlenkombination einzugeben. Dies kann zum Beispiel die Eingabe einer Kartennummer oder auch eines Aktivierungscodes sein. Solche Eingabefelder dürfen natürlich keine Buchstaben oder andere Zeichen enthalten. Allerdings ist es nicht ganz so trivial, wie es klingt, dieses gewünschte Verhalten zu erreichen.

Wie sich Designer die Psychologie für UX zunutze machen

| Allgemein, Design, UI, UX | No Comments
UX Design und Psychologie: Eine langjährige Freundschaft Ich glaube, niemand pflegt so eine intensive Freundschaft oder Beziehung, wie das UX-Design zur Psychologie. Spätestens im Jahr 2023 müsste jedem UX-Designer klar sein, dass einfaches Basiswissen über Designelemente, Farbtheorie und Benutzungsp-Patterns nicht mehr ausreichen, um den modernen Kunden abzuholen – schliesslich ist eine Generation auf dem Weg, die Absichten sehr leicht durchschaut. Sie ist aber auch ziemlich leicht abzuholen, wenn man sich intensiver mit der Psychologie hinter dem UX-Design befasst. Die meisten…

Debuggen mit Local Overrides

| Allgemein, Code Snippets, Webentwicklung | No Comments
Es ist weniger kompliziert, als es sich anhört. Immer wieder müssen sich Webentwickler Problemen annehmen, die von Kunden oder Webseiten-Benutzern gemeldet werden. Oft erhalten sie eine kurze Beschreibung oder sogar ein kleines Video, anhand dessen das Problem nachgestellt und anschliessend gelöst werden muss. Dafür benötige ich oft die Local Overrides Funktion von Safari, mit welcher man Requests an eine API und auch Responses von einer API mit eigenen Werten überschreiben kann. So kann ich zum Beispiel in einer JavaScript-Datei die…

Synchron oder Asynchron? Das ist hier die Frage.

| Allgemein, Code Snippets, Webentwicklung | No Comments
Wer schon Erfahrungen mit dem Schreiben grösserer JS Files hat, hatte sich sicherlich schon mit der Frage zu kämpfen, ob diese synchron oder asynchron laufen sollen. Wir möchten dir helfen, diese Frage zu beantworten und dir ein besseres Verständnis für die Unterschiede zwischen synchronen und asynchronen JS Files zu vermitteln.

Diese AI erobert derzeit das Internet: ChatGPT

| Allgemein, Webentwicklung | No Comments
ChatGPT, ein grosses Sprachmodell, das von OpenAI trainiert wurde. Es kann Entwicklern dabei helfen, ihre Produktivität im Web-Entwicklungsbereich zu steigern und sogar für sie zu programmieren. Eines der wichtigsten Anwendungsgebiete von ChatGPT ist die Erstellung von Code-Snippets. Let's try! Ein Entwickler kann ChatGPT bitten, eine Funktion in JS zu erstellen, die eine bestimmte Aufgabe ausführt. Zum Beispiel eine Funktion, die die Hintergrundfarbe eines Elementes auf einer Seite ändert. ChatGPT kann dann den entsprechenden Code automatisch generieren: function changeBackgroundColor(element, color) {…

Spambots den Kampf ansagen: So setzt du Google reCAPTCHA v3 richtig ein

| Code Snippets, How-to, Webentwicklung | No Comments
Google reCAPTCHA v3 Google reCAPTCHA v3 ist die neueste Version von Googles beliebtem CAPTCHA-Service. Version 3 baut auf der unsichtbaren Umsetzung von v2 auf und bietet dem Seitenbetreiber viel mehr Freiheiten. Im nachfolgenden Beitrag erklären wir dir die Unterschiede der alten zur neuen Version und zeigen auf, wie du die neue Version in deine Webseite oder dein Webformular einbindest. Ausserdem ziehen wir ein kurzes Fazit zu reCAPTCHA v3 und erklären, ob wir es wirklich besser finden, als v2. Unterschied v2…

Ein fancy Hover-Menü mit CSS gestalten

| Code Snippets, How-to, Webentwicklung | No Comments
CSS Trick: Hover-Menü Eine Navigation ist fast auf jeder Seite vorhanden. Auf gewissen Seiten besteht diese aus nur einer Ebene, auf anderen aus zwei oder sogar mehr. Dies setzt sich sehr oft aus einer Navigationsleiste mit Dropdown-Menüs zusammen, die sich z.B. mithilfe der Maus einblenden lassen. Um dies zu ermöglichen, wird oft JavaScript benötigt. Wir stellen euch hier aber eine reine CSS-Lösung vor, die ohne JavaScript auskommt. Let's get started Hier ein einfaches Menü, welches aus vier Hauptmenüpunkten besteht. "Nav…

CSS Container Queries erklärt

| Code Snippets, How-to, Webentwicklung | No Comments
CSS Container Queries: die besseren Media Queries Jeder Webentwickler kennt Media Queries. Diese sind notwendig, um die verschiedenen Elemente der Webseite auf jedem Gerät schön darzustellen. Wir zeigen euch ein einfaches Beispiel anhand von Produkt-Teasern. Diese sollen auf mobilen Geräten im Hochformat untereinander, auf Tablet im Hochformat nebeneinander und auf Desktop im Querformat nebeneinander dargestellt werden. Wir lösen das Problem zuerst wie gehabt mit Media Queries und zeigen deren Grenzen auf. Danach zeigen wir, wie die bestehenden Probleme mit Container…
Nichts verpassen!

Melde dich jetzt für unseren Newsletter an.