Webdesign Glossar, 25 Begriffe leicht erklärt

Vor kurzem hatte ich ein kleines Interview mit meiner Kundin:

Ich: „Hast du meinen Startseiten-Guide gelesen, konntest du mit den Inhalten etwas anfangen?“

Kundin, zögert kurz. „Ja, aber ganz ehrlich – ein paar Worte musste ich erst googeln. Für mich waren das neue Begriffe.“

Ich: „Oh“.

Kundin: „Zum Beispiel der Begriff Slider. Kannte ich nicht.“

Ich: „Gut, dass du mir das so sagst. Wenn man täglich und seit Jahren mit diesen Beschreibungen zu tun hat, kommt man gar nicht auf die Idee, dass bestimmte Wörter für branchenfremde Menschen einfach nicht gängig sind.“

Kundin: „Mach doch ein Glossar zum Guide.“

Und et voilà, da ist es!

Das kleine Glossar zum Thema Website-Startseite:

1. Full Screen Layout:

Das „Full-Screen-Layout“ bezieht sich auf ein Designkonzept in der digitalen Benutzeroberflächengestaltung, bei dem der gesamte verfügbare Bildschirmplatz eines Geräts ausgenutzt wird, um Inhalte anzuzeigen. Dabei werden die Elemente der Benutzeroberfläche so angeordnet, dass sie den gesamten Bildschirm ausfüllen, ohne sichtbare Randbereiche oder Leerräume zu hinterlassen.

2. Startseite:

Die Startseite einer Website ist die erste Seite, die Besucher sehen, wenn sie die Website aufrufen. Sie dient dazu, einen ersten Eindruck zu vermitteln und Benutzer zu den wichtigsten Inhalten der Website zu führen.

3. Header-Bereich:

Der Header-Bereich ist der oberste Bereich einer Website, der normalerweise das Logo, das Menü und oft auch ein großes Bild oder Video enthält. Er ist oft das erste, was Besucher sehen.

4. Menüpunkte:

Menüpunkte sind die Navigationslinks auf einer Website, die es den Besuchern ermöglichen, verschiedene Seiten oder Abschnitte der Website zu erreichen.

5. Claim:

Der Claim ist ein kurzer Satz oder eine Aussage, die das Kernversprechen oder das Alleinstellungsmerkmal eines Unternehmens oder Angebots zusammenfasst.

6. Über mich:

Der Abschnitt „Über mich“ auf einer Website gibt Informationen über den Eigentümer oder den Anbieter der Dienstleistungen, um Vertrauen aufzubauen und die Persönlichkeit hinter dem Unternehmen zu zeigen.

7. Call to Action (CTA):

Ein Call to Action ist eine Handlungsaufforderung, die Besucher dazu ermutigt, eine bestimmte Aktion auszuführen, wie z. B. „Jetzt kaufen“, „Jetzt kontaktieren“ oder „Mehr erfahren“.

8. Hero-Bereich:

Der Hero-Bereich ist ein auffälliger Bereich auf der Startseite, im oberen Teil, der die wichtigsten Botschaften, Bilder und Handlungsaufforderungen enthält.

9. Stockbilder:

Stockbilder sind Bilder, die von Fotografen oder Hobbyfotografen erstellt wurden und über Bildagenturen vertrieben werden. Unternehmen können diese Fotos kaufen und auf ihren Websites verwenden.

10. Testimonials:

Testimonials sind Bewertungen, Empfehlungen oder positive Erfahrungsberichte von Kunden, die die Glaubwürdigkeit und den Wert eines Produkts oder einer Dienstleistung erhöhen sollen.

11. Footer:

Der Footer ist der untere Bereich einer Website, der oft Links zu Datenschutz, Impressum, Kontaktinformationen und anderen rechtlichen oder navigationsbezogenen Inhalten enthält.

12. Personal Branding:

Personal Branding bezieht sich auf die Art und Weise, wie Einzelpersonen sich selbst als Marke präsentieren und ihr Image, ihre Expertise und ihren Mehrwert hervorheben.

13. Ressourcen:

Ressourcen können Artikel, Anleitungen, Podcasts oder andere Inhalte sein, die Besuchern auf der Website zur Verfügung gestellt werden, um ihnen Mehrwert zu bieten.

14. Blog:

Ein Blog ist ein Bereich auf einer Website, in dem regelmäßig Artikel oder Beiträge zu bestimmten Themen veröffentlicht werden.

15. Branding:

Branding bezieht sich auf die Art und Weise, wie sich ein Unternehmen visuell und verbal präsentiert, um eine einheitliche Identität und Woyalität aufzubauen.

16. Layout:

Das Layout einer Website bezieht sich auf die Anordnung von Elementen wie Text, Bilder, Menüs und Call-to-Action-Buttons auf den verschiedenen Seiten.

17. Benutzerfreundlichkeit:

Benutzerfreundlichkeit bezieht sich auf die Gestaltung einer Website, um sicherzustellen, dass Besucher leicht navigieren können und die gewünschten Informationen schnell finden.

18. Responsives Design:

Responsives Design bedeutet, dass eine Website so gestaltet ist, dass sie auf verschiedenen Geräten, Bildschirmgrößen und Auflösungen optimal angezeigt wird.

19. Kontrast:

Kontrast bezieht sich auf den Unterschied in Helligkeit und Farbe zwischen verschiedenen Elementen auf einer Website. Ein ausgewogener Kontrast erhöht die Lesbarkeit und die visuelle Trennung von Elementen.

20. Bildrechte:

Bildrechte regeln, wer das Recht hat, ein bestimmtes Bild zu verwenden und unter welchen Bedingungen. Es ist wichtig sicherzustellen, dass die verwendeten Bilder rechtmäßig erworben wurden.

21. Zielgruppe:

Die Zielgruppe sind die Personen, die als potenzielle Kunden oder Nutzer einer Website oder eines Angebots angesprochen werden sollen.

22. Farbwelt:

Die Farbwelt bezieht sich auf die Palette von Farben, die in einem Branding oder Design verwendet werden, um eine konsistente visuelle Identität zu schaffen.

23. Slider:

Ein „Slider“ im Kontext von Webdesign bezieht sich auf eine interaktive Funktion auf einer Website, bei der mehrere Bilder oder Inhalte nacheinander in einem bestimmten Bereich der Webseite angezeigt werden. Ein Slider ist eine Art Bildergalerie oder Diashow, die in einem begrenzten Bereich platziert wird, oft im oberen Teil der Startseite (Header) oder an einer anderen gut sichtbaren Stelle.

Hier sind die grundlegenden Merkmale und Funktionen eines Sliders:

  • Automatisches Wechseln: Ein Slider zeigt in der Regel eine Reihe von Bildern oder Inhalten automatisch an, indem es zwischen ihnen wechselt, nach einer festgelegten Zeitspanne. Das automatische Wechseln kann dem Besucher der Webseite verschiedene visuelle Informationen präsentieren, ohne dass er interagieren muss.
  • Manuelles Wechseln: Benutzer können oft auch manuell durch die verschiedenen Bilder oder Inhalte im Slider navigieren, entweder durch Klicken auf Pfeilschaltflächen oder durch Wischen (bei Touch-Geräten). Dies ermöglicht den Benutzern, die Anzeige zu steuern und zwischen den Inhalten zu wechseln, wann immer sie möchten.
  • Bild und Text: Ein Slider kann nicht nur Bilder anzeigen, sondern auch kurze Textbeschreibungen oder Call-to-Action-Buttons für jeden Slide enthalten. Dies kann dazu verwendet werden, wichtige Nachrichten, Angebote oder Informationen zu präsentieren.
  • Übergangseffekte: Oft werden Übergangseffekte zwischen den einzelnen Bildern oder Inhalten verwendet, um einen visuell ansprechenden Wechsel zu schaffen. Beliebte Übergangseffekte sind z.B. Überblenden, Aufschieben, Einzoomen usw.
  • Design und Platzierung: Das Design eines Sliders sollte zur Gesamtgestaltung der Website passen. Er wird normalerweise im oberen Bereich der Seite platziert, um die Aufmerksamkeit der Benutzer zu erregen.

Slider können eine effektive Möglichkeit sein, wichtige visuelle Inhalte auf einer Website zu präsentieren. Sie können jedoch auch Herausforderungen mit sich bringen, insbesondere in Bezug auf Benutzerfreundlichkeit und die Auswirkungen auf die Ladezeit der Website. Manche Nutzer könnten die Möglichkeit vermissen, den Inhalt auf eigene Faust zu erkunden, wenn die automatische Wiedergabe zu schnell ist. Außerdem kann die Verwendung von Slidern die Ladezeit der Seite erhöhen, wenn viele Bilder geladen werden müssen.

Es ist wichtig, die Vor- und Nachteile sorgfältig abzuwägen und sicherzustellen, dass der Slider den Gesamtzweck der Website und die Bedürfnisse der Benutzer unterstützt. In einigen Fällen könnten statische Inhaltsblöcke oder eine andere Art der Präsentation von Inhalten möglicherweise besser geeignet sein.

24. WordPress Customizer:

Der WordPress-Customizer ist dein persönliches Werkzeug für die direkte Gestaltung deiner Website in Echtzeit. Hier kannst du spielend leicht Anpassungen vornehmen, ohne zwischen verschiedenen Ansichten hin- und herwechseln zu müssen.

Willst du die Farben ändern, Hintergrundbilder anpassen oder die Schriftarten deiner Website verändern? Der Customizer ermöglicht es dir, all das in Echtzeit zu tun. Du siehst sofort, wie sich deine Änderungen auf das Aussehen deiner Website auswirken, ohne mühsam zwischen verschiedenen Registerkarten zu navigieren.

Mit dem Customizer kannst du auch den Header, die Fußzeile, Menüs und Widgets nach deinen Wünschen anpassen. Das Beste daran ist, dass du jede Änderung sofort sehen kannst, während du sie vornimmst. Kein lästiges Hin- und Herschalten zwischen Vorschau und Bearbeitungsmodus mehr. Insgesamt ist der Customizer dein flexibles Werkzeug, um das visuelle Erscheinungsbild deiner Website nach deinen Vorstellungen zu formen, ohne dass du dabei tief in technische Details einsteigen musst. Du möchtest deine Website individuell gestalten? Der Customizer macht es spielend leicht.

25. Gutenberg Editor und Blöcke bei WordPress:

Bei WordPress Gutenberg handelt es sich um einen modernen Block-Editor, der die traditionelle Bearbeitung von Inhalten einfach macht. Hierbei werden Inhalte nicht mehr als einzelner Textstrom betrachtet, sondern in individuellen Blöcken strukturiert. Ein Block ist eine eigenständige Einheit, die verschiedene Arten von Inhalten repräsentieren kann. Hier sind einige der grundlegenden Funktionen von Blöcken in WordPress Gutenberg:

Strukturierung von Inhalten: Blöcke ermöglichen es, Inhalte in verschiedene Abschnitte zu unterteilen. Jeder Block hat einen spezifischen Zweck und kann unabhängig bearbeitet werden.

Vielfältige Inhaltstypen: Gutenberg bietet eine Vielzahl von vordefinierten Blöcken für verschiedene Inhaltstypen wie Text, Bild, Überschrift, Liste, Zitat, Galerie, Audio, Video und viele mehr. Jeder Block ist auf die Bearbeitung eines bestimmten Inhalts spezialisiert.

Einfache Anpassung: Du kannst jeden Block individuell anpassen, sei es durch Änderung von Texten, Hinzufügen von Multimedia-Inhalten, Anpassen von Layouts oder Einstellen von Designoptionen. Jeder Block hat seine eigenen spezifischen Einstellungen.

Drag-and-Drop-Funktionalität: Blöcke können einfach per Drag-and-Drop innerhalb der Editor-Oberfläche verschoben werden. Dadurch wird die Reihenfolge von Inhalten leicht anpassbar.

Responsive Gestaltung: Gutenberg-Blöcke unterstützen eine responsive Gestaltung, sodass deine Inhalte auf verschiedenen Geräten optimal angezeigt werden. Farbwelt: Die Farbwelt bezieht sich auf die Palette von Farben, die in einem Branding oder Design verwendet werden, um eine konsistente visuelle Identität zu schaffen. Hero-Bereich (Manche sagen auch Headerbereich) Der Hero-Bereich ist ein auffälliger Bereich auf der Startseite, im oberen Teil, der die wichtigsten Botschaften, Bilder und Handlungsaufforderungen enthält. Footer Der Footer ist der untere Bereich einer Website, der oft Links zu Datenschutz, Impressum, Kontaktinformationen und anderen rechtlichen oder navigationsbezogenen Inhalten enthält.

Fällt dir auch noch ein Begriff ein, der dir im Zusammenhang mit Webdesign nicht geläufig ist? Schreib gerne in die Kommentare 😉

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert