6 Tipps zum Erstellen besserer One-Page-Websites
One-Page-Websites sind heiß und beliebt - kein Zweifel. Aber sie sind nicht für jeden oder für jedes Geschäft. Es ist einfach, einen zu wollen, weil sie beliebt sind; und wenn es richtig gemacht wird, könnte es ein Treffer sein. Aber stellen Sie sicher, dass Sie sich zuerst für das Projekt qualifizieren.
Ein guter Kandidat für eine einseitige Website ist nicht übermäßig inhaltlich anspruchsvoll. Sie haben nur eine Seite, um Ihren Standpunkt klar zu machen, und es gibt nur so viele Animationen und Tricks, die Sie hineinwerfen können, bevor sie alt werden.
Außerdem sind die meisten einseitigen Websites in ihrem Layout unkonventionell. Der Versuch, viele Inhalte auf eine Seite zu passen, ohne überladen zu wirken, ist ziemlich schwierig.
Die möglichen Nutzungen variieren, aber einige der beliebtesten Kandidaten für One-Page-Websites sind persönliche Portfolios und Websites für Unternehmen, die nur wenige Produkte oder Dienstleistungen verkaufen.
Wenn Sie sich qualifizieren, stellen Sie sicher, dass Ihre Website das Ziel erreicht. Es gibt immer bestimmte Dinge, die Sie beim Erstellen einer Website beachten müssen, aber die folgenden Punkte sind besonders wichtig für einseitige Websites.
1. Bleiben Sie konzentriert
Mach alles so einfach wie möglich für das Publikum. Wenn Sie eine einseitige Website in Betracht ziehen, haben Sie wahrscheinlich nicht viele Inhalte. Das ist gut. Wir sind manchmal versucht, unseren Websites eine Menge Fluff hinzuzufügen. Einzelseiten-Websites erfordern kein Fluffing, da sie nur dazu dienen, auf den Punkt zu kommen. Wenn Sie ein Designer sind, der ein Portfolio zusammenstellt, präsentieren Sie Ihre beste Arbeit; Lass dich nicht von mittelmäßigen Projekten oder deinem T-Shirt-Geschäft ablenken.
Streifen Sie Ihre Website von allen Flusen ab und machen Sie sich mit den wichtigen Dingen vertraut. Während dies eine gute Strategie für jede Website ist, können die meisten mehrseitigen Websites mit ein bisschen Flaum wegkommen, weil die Benutzer normalerweise wissen, wo sie die gewünschten Informationen finden. Mit One-Pager erhalten Sie einen Schuss, und wenn die Information, die jemand sucht, nicht da ist, werden Sie sie verlieren.
Es gibt keine Frage, was diese E-Commerce-Website verkauft.
Dieses Portfolio kommt auf den Punkt. Ein hübscher wunderbarer minimalistischer Entwurf auch.
2. Geben Sie dem Layout eine Hierarchie
Zusammen mit dem Fokus des Besuchers soll eine einseitige Website Ihr Produkt oder Ihre Dienstleistung präsentieren. Wenn Sie an One-Page-Websites denken, die Sie kennengelernt haben, haben sie wahrscheinlich einen einzigartigen Zweck, sei es, um das Design einer Agentur zu präsentieren oder Interesse an einer bevorstehenden Veranstaltung zu wecken.
Ein großartiges Design und ein fokussiertes Layout können helfen, den Zweck Ihrer Website zu definieren. Sie als Designer haben die Macht, die Augen des Besuchers dorthin zu lenken, wo Sie ihn haben wollen. Menschen merken zuerst große Dinge und kleine Dinge dauern, also nutzen Sie das zu Ihrem Vorteil. Wichtige Dinge sollten nicht die kleinsten oder letzten Dinge auf der Seite sein.
Diese Einführungsabsätze mit großen Schriftarten sind in Designer-Portfolios so beliebt geworden, weil sie schnell auf den Punkt kommen und für Designer, die nach einem Designer suchen, ansprechend klingen. Das letzte, was Sie wahrscheinlich sehen wollen, ist, welche Schule sie absolviert haben. Aber Sie wollen wissen, worauf sie sich spezialisieren und welche Art von Arbeit sie machen.
Auch hier haben Sie sehr wenige Möglichkeiten, Ihre Botschaft zu vermitteln, also machen Sie es richtig. Wenn Sie feststellen, dass Sie zu viel Inhalt haben, um dies tun zu können, sollten Sie eine mehrseitige Website verwenden.
Obwohl diese Website verschiedene Punkte enthält, können wir selbst innerhalb dieses Screenshots ziemlich genau sagen, was am wichtigsten ist.
Wir können sagen, was diese Firma macht, aber die visuelle Hierarchie könnte besser sein.
3. Löschen Sie die Navigation
Einige einseitige Webseiten sind statische Seiten, deren Navigation den Besucher auf externe Webseiten führt. Ein Musiker hat beispielsweise auf seiner Website eine Navigationsoption mit der Bezeichnung "Videos", die Sie zu seinem YouTube-Konto führt. Absolut nichts ist daran falsch, und es macht sogar die Dinge einfach (besonders für Nicht-Programmierer). Die einzige Sache ist, dass Besucher wissen sollten, wenn sie zu einer externen Seite geleitet werden.
Wenn Ihre einseitige Website ein Produkt präsentieren soll und Ihr Einkaufslink die Kunden an eine externe Zahlungsplattform weiterleitet, ohne sie zu informieren, könnten Sie einige Verkäufe verlieren.
Ihr Ziel ist es, alles einfach zu halten. Benutzer ohne Warnung auf externe Websites umzuleiten, kann verwirrend sein. Sie könnten davon ausgehen, dass die Verbindung unterbrochen oder falsch ist. Erwägen Sie die Verwendung von Symbolen (viele kostenlose gibt es da draußen) oder Überschriften, um Besucher wissen zu lassen, wohin sie gehen.
Hier ist was nicht zu tun. Die Links oben führen Sie ohne Warnung vor die Website. Das hat mich wirklich abgewiesen.
Das Design und die Codierung dieser Website sind sehr ungewöhnlich. Links zu externen Seiten sind jedoch durch die grünen Kreise gekennzeichnet und als solche gekennzeichnet.
4. Go Design verrückt
Jetzt kommen wir zum spaßigen Teil: Wir benutzen eine einseitige Website, um anzugeben. Sie möchten nicht, dass die Website langweilig oder sich wiederholend ist. Bringen Sie das Design auf die nächste Ebene und denken Sie über den Tellerrand hinaus. Ein unorthodoxes Design ist in Ordnung, um Aufmerksamkeit auf Ihr Produkt zu lenken und es unvergesslich zu machen.
One-Pager werden zum Synonym für gutes Design, weil Sie mit der größeren Leinwand mehr erreichen können. Sie sind nicht gezwungen, den gleichen Hintergrund überall zu verwenden; Sie ändern es in den Abschnitten. Das Blättern durch eine Seite ist oft so, als ob man durch ein Magazin oder eine gut zusammengestellte Dia-Präsentation blättert. Nutzen Sie die Möglichkeiten.
Machen Sie das Design groß, egal, ob Sie große Bilder verwenden, die das gesamte Browserfenster umfassen, oder einen großartigen illustrierten Hintergrund erstellen. Sie erhalten Bonuspunkte und können in Webdesign-Showcases gezeigt werden.
Dieses Design ist atemberaubend, so etwas wie ein Poster. Und der Rest der Website enttäuscht nicht.
Die Reinheit dieses Designs (und des Codes) ist erstaunlich. Es lässt dich stehen bleiben und starren.
5. Kodieren verrückt
Ähnlich wie beim Design möchten Sie auch Ihre Programmierkenntnisse zeigen. Einzelseiten sollen interagiert werden. Die Benutzererfahrung ist kritisch, also achten Sie auf die Details. Der Code kann Ihre Website auf die nächste Ebene bringen.
Einige Dinge, auf die Sie achten sollten, sind die Farben und das Verhalten von Links (besonders der Hover Selector); das Aussehen und Verhalten von Formularen (z. B. um das Formular an das Design anzupassen und AJAX- und JavaScript-Validatoren zu verwenden); Eingabe- und Fehlermeldungen (verwendet mit den Formularen und einigen AJAX); und das Raster und die Platzierung des Inhalts (sowie das Verhalten des Inhalts im Browserfenster). Alle diese sollten mit dem Design übereinstimmen.
Eine nette und einfache Möglichkeit, Code auf einer Website mit nur einer Seite zu verwenden.
Ich mag voreingenommen sein, weil ich den Trick mag, bei dem Inhalte auf Scroll geladen werden, aber die Detailgenauigkeit im Code hier ist unglaublich.
6. Bringen Sie es in Bewegung
Neben der Pflege der Codierungsdetails können Sie mithilfe von Code Bewegung und Spannung auf der Seite erzeugen. Vermeiden Sie es erneut, langweilig zu sein. Geben Sie Ihrer Seite ein Gefühl von Leben und Bewegung; mach es so, als ob es sich mit den Besuchern bewegt. Fügen Sie lustige Animationen oder Übergänge hinzu, um die Seite hervorzuheben.
Sprachen wie jQuery und AJAX sind zum Standard geworden, um Bewegung auf einer Website zu erzeugen. Ob Sie den Inhalt von verschiedenen Seiten einblenden lassen oder den Hintergrund zu einer Diashow machen, halten Sie das Publikum auf dem Laufenden.
Dieser Hintergrund ist eine Animation. Ich habe keine Ahnung, worum es auf der Webseite geht, aber es sieht ordentlich aus.
Die Übergänge auf dieser Website sind hervorragend. Liebe diesen!
Welche anderen Dinge werden benötigt, um eine einseitige Website besonders zu machen?