de.hideout-lastation.com
Paradies Für Designer Und Entwickler


Feather Icons - eine schöne, minimalistische und kostenlose Icons Set

Wenn Sie im Internet suchen, finden Sie unzählige kostenlose Icon-Sets für das Web. Diese sind unglaublich nützlich für alle Arten von Websites, weil Grafiken immer ein Layout aufwerten.

Es ist wirklich schwer, kostenlose Icon-Sets zu finden, die zu deinem Design passen. Normalerweise ist Ihre beste Option ein minimalistisches Icon-Set wie Feather.

Dieses neue Set ist voll von Liniensymbolen mit einem klaren Design . Die Symbole fühlen sich mehr wie Interface-Symbole an, aber sie können auch als Feature-Type-Symbole auf Ihrer Homepage funktionieren.

So oder so, sie sind alle Open Source und völlig kostenlos auf jeder Website zu verwenden .

Sie brauchen nicht viel Wissen über Frontend-Programmierung, um diese zum Laufen zu bringen. Ja, Sie müssen einige Zeit im Code verbringen, aber Sie sollten nicht darum kämpfen, dass das funktioniert.

Wenn Sie keine Symbolschriften im Internet verwendet haben, dann ist Feather ein großartiger Ausgangspunkt.

Wenn Sie nicht sicher sind, was Sie tun sollen, sehen Sie sich den Ratgeber für Anfänger an. Es wird Sie durch alles führen, um Ihre Website mit diesen Symbolen zum Laufen zu bringen.

Sie müssen eine externe JS-Datei aufrufen, die bei anderen Symbolsätzen nicht sehr häufig vorkommt. Aber wenn Sie die Webfonts nicht verwenden möchten, laden Sie einfach die SVG-Vektoren herunter und betten Sie diese ein .

Tatsächlich hat das Team sogar eine kleine CodePen-Vorlage erstellt, die Sie in Ihren Code kopieren und einfügen können. Dies ist ideal zum Erlernen der grundlegenden Codes und zum Redesign Ihrer Site, ohne von Grund auf neu zu beginnen .

Aber wenn Sie sich für das Codieren interessieren, sehen Sie sich die kleine API-Referenz auf ihrer GitHub-Seite an. Dadurch können Sie Symbolstile steuern und Vektorformate mit ein paar Zeilen JavaScript ändern.

Beachten Sie, dass dieser Icon-Satz möglicherweise nicht auf jede Seite passt . Es ist wichtig, über die Feather-Icons zu schauen und selbst zu entscheiden, ob diese minimalistischen Designs für dich funktionieren können.

Werfen Sie einen Blick auf ihre Homepage, um einen Blick auf ihre gesamte Sammlung zu werfen. Sie finden einen Link zur Hauptdokumentation von GitHub mit allen notwendigen Schritten, um dies zu erreichen.

Und wenn Sie Fragen oder Anregungen für den Autor haben, können Sie ihm einen Tweet @colebemis schießen.

Build Accessible Modal Windows mit A11y Dialog

Build Accessible Modal Windows mit A11y Dialog

Modale werden in modernen Browsern häufig unterstützt. Sie können als Benachrichtigungs-Popups, als Opt-In-Felder oder sogar für Foto-Diashows verwendet werden .Sie können diese Fenster mit reinem CSS erstellen, aber dies ist nicht die am besten zugängliche Lösung. Schauen Sie sich stattdessen A11y Dialog an, ein voll funktionsfähiges modales Fenster, das den Fokus auf Barrierefreiheit legt.Es läuf

(Tech- und Design-Tipps)

20 Beispiele für vertikales Split-Screen-Layout im Webdesign

20 Beispiele für vertikales Split-Screen-Layout im Webdesign

Ein Split-Screen-Layout wird verwendet, wenn Vollbildelemente in zwei oder mehr vertikale Teile unterteilt sind . Trotz der Tatsache, dass solche Art von Website-Layouts heutzutage trendy sind, kann diese Entscheidung Ihr Design machen oder brechen. Wenn es logisch und korrekt gemacht wird, bietet Split-Screen-Layout eine magische Erfahrung für Ihre Benutzer.

(Tech- und Design-Tipps)