Full-Service monatlich ab 49,90€.

Full-Service Websites

Was gefällt Ihnen besser?
A: Alles von diversen Anbietern kaufen.
B: Alles aus einer Hand inkl. Full-Service.

 

Kontaktieren Sie uns

Webdesign Agentur Hamburg

Webdesign Agentur für Hamburg.

Einfach smarte Websites.

Ihre Website braucht ein ansprechendes Design, gute Programmierung und hochwertige Bilder für Ihre Darstellung. Unsere Agentur macht genau das für Sie.

Gutes Webdesign ist das Fundament unseres Konzepts: Auf Grundlage Ihrer bisherigen und bewährten Gestaltungselemente (wie etwa Logo, Schriftart oder Slogan), entwickeln wir Ihr Konzept für die Gestaltung aller visuellen Inhalte der zukünftigen Website - oder entwickeln das gänzlich neu für Sie.

Damit schaffen wir den Internetauftritt, der zu Ihrem Image passt.

Ein smarter Auftritt, der Ihre Kompetenzen widerspiegelt!

Webdesign Agentur Hamburg

Einige einfach smarte Referenzen.

Querkopf Architekten
Hej Arkitekter
FAIST

Bausteine für Websites mit System.

Das Briefing.

Erfolgreiches Webdesign bedarf einer soliden Basis. Noch bevor der erste Entwurf erstellt wird, sind einige Fragen zu klären:

  • Haben Sie eine Markenstrategie?
  • Gibt es eine Corporate Identity (CI)?
  • Was und wer soll erreicht werden?
  • Welche Leistungen werden angeboten?
  • Wird ein Shop, ein Blog o.ä. gebraucht?
  • Gibt es eine Präferenz, was das CMS betrifft?
  • Was gefällt Ihnen?
  • Welche Funktionen wünschen Sie Sich?

 

Die Antworten auf diese Fragen bestimmen nicht nur maßgeblich, wie Ihre Webseite optisch aussehen wird, sondern auch wie aufwendig die Umsetzung und Programmierung ist. So ist es z.B. für einige Content-Management-Systeme komplexer, einige Funktionen zu programmieren.

Als Agentur mit über 20 Jahren Erfahrung am Markt und tausenden von Webseiten kennen wir die Anforderungen an Webentwicklung. Wir bieten Lösungen in der Webentwicklung, die optimal zu Ihrem Marketing passen und die visuelle Kommunikation Ihrer Bran stärken. Jeder Kunde kommt mit einem einzigartigen Projekt, aber das Ergebnis wird immer gleich: Einfach & smart.

Was spielt bei Webdesign alles eine Rolle?

Als gute Agentur werden wir Sie umfassend beraten und auch Aspekte wie Analyse und Konzeption berücksichtigen. Es macht einen großen Unterschied, ob Sie zum Beispiel einen Onlineshop angeschlossen oder integriert benötigen oder zum Beispiel einen internen Besucherteil. Als Internetagentur mit viel Erfahrung können wir solche Bedarfe elegant in die Webentwicklung mit einfließen lassen.

SEO ist ein Punkt, der entgegen der Vermutung vieler schon beim Thema Programmieren und Entwickeln anfängt. Auch das muss beim Erstellen Ihrer Website bedacht werden. Eine gute Webagentur schaut auf gute UX (User Experience) und UI (User Interface). Auch ganz wichtig: Ihre Website muss mobiloptimiert sein und auch auf Endgeräten wie Smartphones und Tablets funktionieren.

Website in Desktop & mobil

Lass`schnacken!

Was ist Webdesign?

Unter Webdesign versteht man die optische Gestaltung von Inernetseiten. Hier geht es um das Layouting und Design, sprich optische Merkmale. Der Punkt grenzt sich damit von der Programmierung einer Website ab: Programmierung bestimmt, wie eine Webseite funktioniert, während Webdesign bestimmt, wie sie aussieht.

Besonders in modernen Content Management Systemen ist der Übergang fließend. So kann auch ein Webdesigner einiges im Code anpassen, um z.B. Effekte einzurichten. Webdesigner haben viel mit HTML, CSS und Java-Script zu tun. Webentwickler eher mit php, mysql und anderen Programmiersprachen/ Datenbanktypen.

Wir bieten das gesamte Paket: Konzeption, Entwicklung, Beratung, Webentwicklung, Marketing, Analyse, Erfolg.

Und gutes Webdesign?

Gutes Webdesign passt thematisch zu Ihrem Unternehmen. Optisch ansprechend und nicht überladen, fokussiert auf einige wenige Hauptfarben wie eine klare Linie bei Schriftarten, Icons und Bildwelten.

Die Orientierung Ihrer Website trifft mit dem Corporate-Design Ihre Corporate-Identitiy. Keine Sorge, falls Sie so etwas noch nicht entwickelt haben - gerne erstellen wir Ihre CI auch in Absprache mit Ihnen. Denn, wenn Ihre Marke über alle Kanäle hinweg unverwechselbaren Wiedererkennungswert hat, zahlt auch Ihr  Webdesign auf Ihre Unternehmensziele ein.

Das gewünschte Ergebnis: Ein Auftritt, der Ihre Zielgruppe anspricht und Besucher zu Kunden macht, Ihre Leistungen optimal präsentiert und Ihren Anforderungen entspricht. Das kann unsere Internetagentur Ihnen bieten.

Die Webdesign Arbeiten.
Webdesign für Monitor, Tablet & Handy
Webdesign CMS
Top 5 CMS-Nutzungsverteilung in Deutschland

Was ist ein CMS und welche gibt es?

Die Abkürzung steht für Content-Management-System. Der Großteil aller Webseiten basiert auf einem und es gibt eine ganze Bandbreite davon. Laut BuiltWith sind die meist-genutzten Content-Management-Systeme in Deutschland nachstehend:

  • WordPress
  • Joomla!
  • TYPO3
  • Contao
  • Drupal

Wir nutzen WordPress, Typo3 wie Contao neben unserem eigenen Websitebuilder.

WordPress hat den mit Abstand größten Marktanteil. Vorteile hier sind klar die einfache Bedienung gepaart mit einem übersichtlichen Interface. Weiterhin hat es eine unglaubliche Auswahl von Plug-ins, mit denen sich Features und Funktionen einbetten lassen.

Typo3 ist neben WordPress das bekannteste Open-Source-CMS. Es besticht unter Anderem mit einem ausgereiften Rechte,- Rollenverteilungsprinzip was für zum Beispiel große Redaktionen wichtig ist. Typo3 ist besonders für große Unternehmensportale und E-Commerce-Plattformen geeignet.

Contao ist ein weniger bekanntes CMS, das einen großen Funktionsumfang hat. Das Backend ist mehrsprachig und hat eine übersichtliche Verwaltungsebene. Besonders an Contao ist, dass Online-Inhalte damit in HTML5 barrierefrei bereitgestellt werden können. Gut für kleine und mittlere Webseiten wie unsere eigene InternetServiceAgentur.com

Websitebuilder wie Jimdo oder Wix gehören zu den Baukastenlösungen. Der Gedanke dahinter liegt darin, dass das Design per Drag-and-Drop selbst von Laien erstellt werden muss. Diese CMS sind speziell für kleine Firmen, Privatpersonen und Einzelunternehmer entwickelt worden, die sich kein professionelles Webdesign leisten können - oder wollen.

Bei der Wahl spielen einige Faktoren eine Rolle, z. B. ob Sie einen Onlineshop anschließen wollen. Mobiloptimierung für die Darstellung auf verschiedenen Endgeräten bieten inzwischen alle. Unsere Webagentur hilft Ihnen gerne.

Der Entwurf bzw. das Mock-Up

Im ersten Schritt wurden viele Punkte geklärt, die für das Webdesign nötig sind. Einerseits sind das einfach wirkende Basics wie Farben, Logo, Bildwelt, Schriftart etc. Andererseits aber auch für die Strategie wichtige Anhaltspunkte wie Unternehmensausrichtung und -ziele, Menüstruktur und notwendige Funktionen. All das brauchen wir als Agentur, um ein Konzept der Homepage zu erstellen und die optimale Lösung für Sie zu entwickeln.

Was ist Mock-up Webdesign?

Im nächsten Schritt wird ein Mock-up Ihrer Webseite erstellt. Dabei handelt es sich um eine präsentierfähige Vorschau Ihrer Webseite, die unveröffentlicht ist. Das Mock-up wird als PDF,- wahlweise in Präsentationssoftware wie InVision präsentiert, oder die Webseite bereits direkt online erstellt.

Ein Mock-up-Webdesign wird im Wesentlichen aus drei Gründen erstellt:

  1. Anhand eines Entwurfes können wir Ihnen unsere Vision gut präsentieren. Sie wiederum bekommen die Möglichkeit, Änderungswünsche zu kommunizieren.
  2. Die Produktion eines Mock-ups ist weniger zeitintensiv als die einer vollständig funktionsfähigen Webseite. Das spart beiden Seiten kostbare Zeit für Änderungswünsche.
Webdesign Vorschau der Elemente

Wollen wir sprechen?

Die wichtigsten Bereiche einer Webseite im Layout.

Wenn eine Webseite designt wird, gibt es einige Standard-Elemente, die immer berücksichtigt werden müssen. Sie bilden die Basis des Designs. Alle anderen Seiten bauen auf diesen Designelementen auf. In der Regel wird eine Homepage entworfen, auf der alle Elemente vertreten sind.

Das Logo

Ein absolutes Must-have auf Ihrer Webseite ist Ihr Firmen-Logo. Das wird prominent im oberen Bereich platziert und befindet sich meistens links. Einige Webseiten bauen auf Individualität und präsentieren ihr Logo stattdessen oben mittig oder oben rechts.

Die Navigation

Als Navigation bezeichnet man auch das Menü. Das befindet sich ebenfalls oben und ist gut erreichbar und erkennbar. Es gibt verschiedene Möglichkeiten, ein Menü darzustellen: Als Leiste oder als Burger, mit Untermenüs oder ohne, animiert oder nicht, bedienbar per Hover und Klick.

Welche Option sinnig ist, hängt u.a. davon ab, wie die Seitenstruktur aussieht, wie komplex ein Menü also ist. Aber auch vom visuellen Gesamtkonzept der Website und der Intention im Bereich UI/UX.

Der Header (Slider/ Bildelement)

Direkt unterhalb von Logo und Menü (oder auch teilweise dahinter) befindet sich der Header-Bereich Ihrer Webseite. Das ist in der Regel ein Bildelement oder ein Slider aus mehreren Bildern, kann aber auch ein GIF oder Video sein.

Das Header-Element weckt im Seitenbesucher Erwartungen, muss also thematisch damit zusammenhängen, was ihn erwartet. Es muss zum Unternehmen, der Branche und der Bildwelt passen.

Der Content-Bereich (1-, 2-, 3-spaltig)

Unterhalb des Headers beginnt der Bereich,  in dem Ihre Texte, Bilder, Animationen, Grafiken, Videos etc. sich verbergen. Elementar relevant für das Design dieses Bereichs ist die Frage: Soll der Content ein-, zwei, oder dreispaltig sein? Das optische Resultat aus dieser Entscheidung und die Bedienung bzw. Art die Informationen zu lesen, variieren stark.

Der Footer (Kontakt, Impressum, Datenschutz)

Ganz unten auf jeder Website findet sich der sogenannte Footer. Der hebt sich farblich vom Content-Teil ab und enthält Verlinkungen zum Impressum und der Datenschutzerklärung. Außerdem werden dort häufig Kontaktinformationen platziert. Darüber hinaus können dort z.B. wichtige Unterseiten verlinkt werden.

Webdesign Layout
Website Elemente vereinfacht dargestellt.
Website Typen im Webdesign

Seiten-Typen einer Webseite.

Je nach Aufbau gehören zu einer Webseite mehrere Seiten-Typen. Pro Typ wird ein Template im Webdesign erstellt und dann auf alle Seiten dieses Typs übertragen.

News, Blog,- Artikelseite

Der Seiten-Typ „News“ ist – wie der Name bereits sagt – für News gedacht. Er kann auch für ähnliche Zwecke wie einen Blog genutzt werden. Zum Seiten-Typ „News“ gehören Startseiten, Kategorie-Seiten und explizite Inhaltsseiten, neu: Content-Seiten, auf denen sich die einzelnen News befinden.

Content Seite

Websites des Seiten-Typs „Content“ können z.B. Seiten wie die, auf der Sie sich gerade befinden sein. Es handelt sich dabei um in sich geschlossene Seiten, die sich auf ein spezielles Thema (Keyword) fokussieren.

Shop

Ein Shop wird benötigt, wenn Sie Produkte verkaufen wollen. Dazu gehört in der Regel ein Übersichtbereich, Kategorie-Seiten und die jeweiligen Produktseiten. Shops arbeiten für gewöhnlich mit vielen Bild-, aber auch Video-Elementen, die die Produkte darstellen.

Es gibt noch diverse andere Typen, wie Suchergebnisseiten, Shop,- Blog und weitere Kategorieseiten nebst Landingpages, Vorschaltseiten etc. Was für Sie notwendig ist finden wir gemeinsam heraus.

Das Design wird finalisiert.

Wenn all Ihre Änderungswünsche umgesetzt sind, wird finalisiert. Dazu gehört z.B. die Übertragung des Designs vom Mock-up in ein Live-System.

  • Was ist Responsive-Webdesign?
  • Wie funktioniert das?
  • Warum Responsive-Webdesign?

Responsive-Webdesign bedeutet, dass Ihre Website nicht nur für die Darstellung auf einem Desktop-PC optimiert worden ist. Das Design passt sich außerdem an die Bedingungen der gängigen Mobilgeräte wie z.B. Smartphones und Tablets an.

Wir als Agentur gestalten Ihr Webdesign immer unter diesem Gesichtspunkt. Zum einen, weil sehr viele Nutzer heutzutage statt über einen Desktop-PC über ihr Mobiltelefon auf das Internet zugreifen. Außerdem hat Google für 2021 angekündigt, nur noch Websites zu indexieren, die mobil optimiert, also responsive, sind. Damit wird das Thema für Suchmaschinenoptimierung umso relevanter. Entwicklerm ist das natürlich bewusst.

Webdesign Finalisierung
Corporate Identity (CI)
Schriftarten und Farben der Corporate Identity (CI)

Barrierefrei: Webdesign kann mehr.

Es gibt Dinge die nicht zum Standard des Webdesigns gehören und dennoch für einige Kunden und Unternehmen sinnvoll sind. Dazu gehören z.B. barrierefreies Webdesign oder Leichte Sprache.

Was ist barrierefreies Webdesign?

Barrierefreies Webdesign ist so gestaltet, dass auch Menschen mit Einschränkungen sie nutzen können. Regulär wird im Webdesign daran gedacht, dass sehende Menschen eine Webseite besuchen werden. Dank fortschreitender Technik können auch Sehbehinderte das Internet nutzen. Dabei helfen barrierefreie Webseiten.

Jeder Inhalt, der nur visuell zu verarbeiten ist, muss so zur Verfügung gestellt werden, dass er auch ohne die Fähigkeit zu sehen, aufgenommen werden kann. Tools, die den Text auf einer Webseite vorlesen, helfen Sehbehinderten. Wenn ein Bild, Video oder eine Infografik relevant und notwendig ist, um einen Inhalt zu verstehen, kann man folgendes machen: Man versieht das Element mit einem ausführlichen, erklärenden Text. Das kann so geschehen, dass der Text regulär versteckt ist und sehenden Besuchern nicht direkt angezeigt wird.

Erzählen Sie von Ihrem Vorhaben.

Texte für die Website.

Bis hierher wurde mit Fülltexten gearbeitet wie das beliebte „Lorem ipsum“. Jetzt kommt der finale Text in Ihre Website. Auch das ist ein Design-Element, dass das Auge des Users bewusst führt.

Besonders relevant bei Headlines, aber auch Produktnamen. Ist ein Wort oder Satz zu lang, entstehen teilweise unschöne Umbrüche, die stören. Unsere Texter und Webdesigner arbeiten daher eng zusammenarbeiten um sich abzusprechen.

Je nachdem auf welcher Unterseite sich Ihr Webseitenbesucher befindet, hat er unterschiedlichen Informationsbedarf. Das wird beim Verfassen Ihrer Texte berücksichtigt. Die Text-Arten

  • Unternehmensportrait
  • Sales Page
  • Produktbeschreibung
  • Kategorie-Text
  • Blogartikel
  • etc.

Diese Textarten unterscheiden sich einfach formal als auch inhaltlich wie strukturell. Was aber immer gleich bleibt, ist Ihre Corporate Language. Das sind bestimmte smarte Formulierungen und Wörter, außerdem eine Tonalität und Leseransprache.

So haben wir uns z.B. dazu entschieden unser Credo „einfach ist smart“ an passenden Stellen einzubinden.

Webdesign Struktur
Texte in die Webseite

Suchmaschinenoptimierte Texte.

Ihre Webseite soll in den Suchmaschinen gut zu finden sein? Neben vielen technischen Maßnahmen spielt in der Suchmaschinenoptimierung Ihrer Texte eine wesentliche Rolle. Es gilt, Keywords zu recherchieren und passende Botschaften festzulegen und diese zu platzieren. Hier ist die Zusammenarbeit zwischen strategischem Leiter Ihres Projekts und ausführendem Texter nötig.

Gute Texte sind auch anhand des Aufbaus zu erkennen.

  • Die zentrale Kernbotschaft als Zusammenfassung des Themas bildet den Themenschwerpunkt
  • Die Strukturierung mithilfe der Zwischenüberschriften gewichtet
  • Die Formulierung der Botschaft spricht die Zielgruppe an, weckt Interesse und transportiert die Botschaft
  • Der Endteil lädt ein für Weiteres

Einfach alles aus einer Hand.

Wissen Sie, was der Vorteil einer Full-Service-Agentur ist? Wir erstellen nicht nur Ihre Website für Sie und haben erfahrene Entwickler im Team, sondern wollen noch so viel mehr für Sie tun!

Sie möchten im Rahmen der neuen Website auch ihr Logo designen lassen? Kein Problem! Das erledigen wir einfach mit. Beim Launch der Website soll auch in Sachen SEO alles in trockenen Tüchern sein? Wir beraten Sie!

Der Launch soll gleich als Pressemitteilung groß angekündigt werden? Hätten wir Ihnen auch empfohlen und stoßen wir an. Für die Website wollen Sie anstelle von x-beliebigen Stock Photos lieber professionelle, authentische Bilder Ihres Unternehmens? Finden wir smart! Und die Filmproduktion liegt bei uns auch in guten Händen.

CI & Branding
Leichte Sprache

Leichte Sprache.

Leichte Sprache ist eine Art Sätze so zu schreiben, dass sie besonders leicht zu verstehen sind. Sie bestehen aus einfachen Wörtern und sind sehr kurz. Es gibt keine Schachtelsätze oder und-Konstruktionen. Sie lesen sich häufig wie Texte aus Kinderbüchern. Das Ziel von Leichter Sprache besteht darin, Menschen mit Lernschwierigkeiten oder geistigen Behinderungen Inhalte zu erreichen.

Es fällt oft nicht auf, aber die meisten Texte sind sehr kompliziert geschrieben. Behinderten Menschen wird dadurch die Teilhabe am Alltag erschwert. Leichte Sprache soll ihnen die Integration erleichtern.

Es gibt Unternehmen und Institutionen, für die der Einsatz von Leichter Sprache sinnvoll ist. Dazu zählen Kultureinrichtungen wie Museen. Es gibt aber auch Unternehmen und Institutionen, die zwingend Leichte Sprache benutzen müssen. Das sind die, die auch oder in erster Linie Menschen mit Behinderung ansprechen.

Lassen Sie uns einfach sprechen.

Webdesign im Überblick.

Themen im Bereich Webdesign und Webentwicklung.

Webdesign

Wir designen für Sie auf die smarte Art.

Corporate Identity

Corporate Identity aus Ihren Eingaben.

Layouting

Das Layouting gibt den Rahmen vor.

Seitentypen

Seitentypen definieren den Aufbau.

Navigation

Ein sehr entscheidendes Element der Benutzerführung, die Navigation.

Header

Der Header bezeichnet den Kopfbereich Ihrer Website.

Logo

Ihre erste wahrzunehmende Referenz: Ihr Unternehmenslogo.

Slider

Groß und auffallend in Szene gesetzt, das Sliderelement.

Shop

Sie wünschen Sich einen Shop für Ihre Kundschaft? Sehr gern.

Footer

Der Seitenabspann mit Verlinkungen zum Impressum etc.

barrierefreies Webdesign

Barrierefreies Webdesign für Menschen mit Beeinträchtigungen.

Leichte Sprache

Leichte Sprache als Hilfsmittel für ein besseres Verständnis.

Kosten: Was kostet Webdesign?

Was kostet Webdesign

Eine einfache Frage, auf die es eine smarte Antwort gibt: Lassen Sie uns Ihre Website besprechen. Digital (Teams, Zoom..) Mail, Telefon oder bei einer Tasse Kaffee.

Die Kosten für Webdesign variieren enorm und hängen vom tatsächlichen Aufwand ab. Der wiederum hängt an unterschiedlichen Faktoren.

  • Gibt es bereits ein Logo und eine CI, auf die aufgebaut werden kann, oder muss beides erst erschaffen werden?
  • Welche Art von Webseite wird gebraucht? Werden spezielle Funktionen benötigt?
  • Wie umfangreich ist die Webseite? Wie viele Unterseiten gibt es und wie viel Inhalt haben sie?
  • Welches CMS soll als Basis verwendet werden?
  • Werden Bilder und Illustrationen gebraucht und müssen diese extern erstellt werden?

Wir designen & entwickeln für Sie.

Es werden allerlei Kekse (Cookies), Schriftarten von Google (Google Fonts), unser CRM Hubspot, parziell Youtube um für Euch Bewegtbilder parat zu haben und Google Analytics über den Google Tagmanager geladen um diese Seite ständig smarter zu gestalten. Für Sie einfach zum Nachlesen die Datenschutzerklärung oder das Impressum .