Newsabo Tipps: Als Dankeschön erhalten Sie die PDF-Reporte „Alles was Sie über die Verlinkung wissen müssen“ und „Wie Sie mit meiner Hilfe Tools finden, mit denen Ihre Website effektiver wird“ gratis!
„Verwenden Sie grafische- oder CSS-Buttons?“
„Online-Marketing Checkliste: Navigation“
Informationen gemäss Stand vom 6.1.2021
Konventionelle grafische Knöpfe (Buttons im Format .gif, .jpg oder .png) als auch CSS-Buttons (Cascading Style Sheets) haben ihre Vor- und Nachteile. Nur wenn man diese kennt, kann man sich für die einen oder anderen klar entscheiden.
Buttons werden als Navigationsschaltflächen verwendet und als Handlungsaufforderungen.
„Inhaltsverzeichnis: Website-Buttons“
- CSS-Buttons Beispiele
- Vorteile grafischer Buttons
- Nachteile grafischer Buttons
- Vorteile von CSS-Buttons
- Nachteile von CSS-Buttons
- Nachtrag
- Werkzeuge zur Erzeugung von Buttons
„CSS-Buttons Beispiele“
Button 1 Button 2 Button 3 Button 4 Button 5 Button 6 Button 7
„Vorteile grafischer Buttons“

- Jede denkliche Art von Buttons
lassen sich erstellen, die sich optisch ideal in eine Website integrieren lassen.
„Nachteile grafischer Buttons“

- Zeitfaktor
Die Erstellung ist relativ aufwendig. - Mehrere Manipulation notwendig
Die Änderung einer Farbe ist aufwendig. - Textmutation
Die Änderung eines Text-Eintrages ist aufwendig. - Ladeintensiv
Diese Buttons sind sehr schnell um den 100-fachen Faktor und mehr grösser als CSS-Buttons. Der Seitenaufbau dauert entsprechend etwas länger. - Doppelter Aufwand
Für den bekannten Mouseover-Effekt braucht es mindestens zwei Grafiken pro Button. - Für den Mouseover-Effekt
(beim Berühren des Buttons verfärbt sich der Button) braucht es einen Javascript-Code.
„Vorteile von CSS-Buttons“

- Schnelligkeit
Die Erstellung eines weiteren Buttons ist in Sekunden erledigt. - Farbänderung
Die Änderung einer Farbe ist in Sekunden erledigt. - Textmutation
Die Änderung eines Text-Eintrages ist in Sekunden erledigt. - Schneller Seitenaufbau
Die Grösse eines Buttons ist praktisch nur die Anzahl der Buchstaben sowie einiger wenigen Zeilen CSS-Code. - Mouseover-Effekt
Für den bekannten Mouseover-Effekt sind nur einige Zeichen CSS-Code notwendig. - Für den bekannten Mouseover-Effekt
ist kein Javascript-Code notwendig. Javascript funktioniert nicht auf allen Ausgabegeräten und kann vom Surfer deaktiviert werden. - Es muss keine Grafik heruntergeladen werden,
da der Button nur wenige Zeilen Code gross ist.
„Nachteile von CSS-Buttons“

- Alte Browser
haben Probleme, den CSS-Code korrekt zu interpretieren.
So alte Browser sollten Sie aus Sicherheitsgründen eh nicht mehr verwenden!
„Nachtrag“
- Kombination von CSS-Code und einer kleinen Grafik
Selbstverständlich lassen sich mit CSS grafische Buttons einsetzen.
Damit kombinieren Sie die Vorteile schöner grafischer Buttons mit den Vorteilen der CSS-Technik. - Content-Management-Systeme
Die CSS-Button lassen sich beim Arbeiten mit CMS verwenden. Der Code muss in die entsprechenden CSS-Dateien übernommen werden.
„Werkzeuge zur Erzeugung von Buttons“
Grafische Buttons können Sie mit jedem Bildbearbeitungsprogramm erstellen. Wer damit seine Mühe hat, für den gibt es praktische Onlinedienste.
- Cooltext
Auf dieser Site können Sie Logos erstellen, die Sie als Buttons verwenden können.
de.cooltext.com - Buttonoptimizer (E)
Praktischer Onlinedienst, mit dem Sie sowohl grafische wie CSS-basierte Knöpfe erstellen!
buttonoptimizer.com - CSS Button Generator (E)
Einfach zu bedienender Generator, der CSS-Buttons erstellt.
cssbuttongenerator.com - CSS3 Button (E)
Ein weiterer CSS-Button Generator mit vielen Optionen.
css3button.net - Da Button Factory (E)
Dieser Generator ist einfach zu bedienen. Einfach mit den Optionen spielen, bis es passt!
clickminded.com/button-generator/
Klicken, ähnliche Themen:
Autor: Walter B. Walser, kundennutzen.ch
Walter B. Walser ist Online-Marketing Manager und Redaktor. Er half früher Unternehmern 100% mehr aus Ihrer Website herauszuholen. Er hat KMU in Bezug auf deren Webauftritt beraten und sich auf die Website-Pflege, Website-Optimierung und das Online-Marketing mit Online-Tools spezialisiert.
„Sie dürfen ihn gerne kontaktieren!“