Jede Woche schauen wir uns eine neue Website an und analysieren das Design. Wir werden auf beide Bereiche hinweisen, die gut erledigt werden, zusätzlich zu den Bereichen, in denen etwas Arbeit anfallen könnte. Zum Schluss bitten wir Sie, Ihr eigenes Feedback zu geben.
Die heutige Seite ist SuccessInc, ein Drupal-Thema aus mehr als (nur) Themen. Lass uns rein springen und sehen, was wir denken!
Wenn Sie Ihre Website für eine zukünftige Design-Kritik einreichen möchten, dauert dies nur wenige Minuten. Für die Bewertung Ihres Designs berechnen wir 49 US-Dollar - deutlich weniger, als wenn Sie einen Berater für einen Blick auf Ihre Website bezahlen würden! Hier erfahren Sie mehr.
Über SuccessInc
Die meisten Designs sehen einfach, sauber und minimal aus. Dieses soll Ihnen helfen, zu beeindrucken. Sowohl auf dem Desktop als auch auf dem Handy. Success Inc. passt sich der Breite des betrachteten Browsers optimal an. Daher sieht es fantastisch aus, unabhängig davon, ob es sich um einen Desktop-Computer, ein Smartphone oder ein Tablet handelt, das Ihre Besucher verwenden.
Hier ist ein Screenshot der Homepage:
Erster Eindruck
Mein erster Eindruck von SuccessInc ist ziemlich positiv. Es ist ein sehr attraktives Thema, das viele erstklassige Funktionen und anpassbare Inhaltsbereiche bietet. Ich finde es toll, dass es ansprechend ist und alle leicht zu bedienenden Optionen zu schätzen weiß. Lassen Sie uns jeden Abschnitt einzeln betrachten und sehen, was wir denken!
Farbschema
Einer meiner Lieblingsaspekte dieses Themas ist die kräftige Farbgebung. Die hellen Highlights stehen im starken Kontrast zum Schwarzen und sorgen für ein auffälliges Erlebnis, das sich klassisch und modern anfühlt. Das Orange, das Sie oben sehen, ist einfach das Standardfarbschema. Sie können es einfach in den Einstellungen ändern.
Zum Ändern des Farbschemas klicken Sie einfach auf ein Dropdown-Menü und wählen die gewünschte Option aus. Sie können zwischen sieben Schemata wählen: Orange, Cyan, Grün, Rot, Creme, Lila und Grau. Klicken Sie einfach auf? Speichern? und das neue Schema wird sofort angewendet.
Alle Farbwahlen, die sie enthalten, sehen toll aus und machen das Thema in Bezug auf visuelle Ästhetik ziemlich blind.
Kontakt / Suchleiste
Ganz oben auf der Website befindet sich eine kleine Leiste, die einige grundlegende Kontaktinformationen sowie eine Suchleiste enthält. Hier ist eine Nahansicht davon, wie das aussieht:
Es gibt eine Reihe verschiedener Arten von Websites, bei denen der Benutzer in erster Linie vorbeischaut, um eine Art Kontaktinformation zu finden. Für diese Arten von Websites ist dies ein kleines Designelement. Benutzer müssen nicht nach einer Kontaktseite oder einem Kontaktformular suchen. Die Informationen, nach denen sie wirklich suchen, sind die ersten, die sie sehen.
Wie Sie in der obigen Abbildung sehen können, gibt es in dieser Leiste auch ein Suchfeld. Das Feld selbst ist nicht sichtbar, wird jedoch durch einen Platzhaltertext gefolgt von einem kleinen Suchsymbol gekennzeichnet. Wenn Sie auf diesen Text klicken, wird dieser eher zu einem traditionellen Suchfeld.
Dies ist ein cooles Stück Design, aber ich würde gerne wissen, ob die Benutzer wirklich so gut darauf reagieren. Wir neigen dazu, nach visuellen Hinweisen zu suchen, bevor wir lesen, daher kann es eine Weile dauern, bis jemand herausgefunden hat, wie eine Suche ausgeführt wird. Ein schneller Weg, den ein Benutzer nehmen kann, ist das Lupensymbol zu sehen und darauf zu klicken, wodurch einfach eine unbrauchbare leere Suche ausgeführt wird.
Weiter heißt der Hinweis: Geben Sie Begriffe ein und klicken Sie auf Suchen. ? aber es gibt keine Schaltfläche mit der Aufschrift Suchen es ist also leicht zu sehen, wie dies einen Benutzer verwirren kann. Jeder, der mit dem Web nur halbwegs kompetent ist, wird dies schnell genug herausfinden, es ist dennoch eine gute Idee, potenzielle Blockaden und Frustrationen für Benutzer zu erkennen.
Navigation
Die Navigation wird durch ein felsenfestes Superfish-Menü bereitgestellt. Es funktioniert perfekt, hat flüssige Animationen und mehrere Ebenen und sieht ziemlich glatt aus. Später schauen wir uns an, was passiert, wenn Sie es für mobile Geräte verkleinern.
Diashow
Wenn Sie die Seite nach unten verschieben, sehen Sie als nächstes die Diashow. Es handelt sich um einen schönen, großen und animierten Inhaltsbereich, der am oberen Rand der Seite Interesse weckt. Es gibt einige Funktionen, auf die ich gerne hinweisen möchte, wenn Sie eine Diashow erstellen.
Erstens gibt es mehrere Navigationspunkte. Sowohl die Pfeile als auch die Punkte unten dienen zum Vorschieben der Diashow oder zum Springen zu einem bestimmten Punkt. Darüber hinaus geben die Punkte einen Bezugspunkt an, wo Sie sich befinden und wie viele Folien vorhanden sind. Schließlich gibt es Untertitel, mit denen Sie benutzerdefinierte Nachrichten hinzufügen können.
Letztendlich sind dies nicht nur nette Features. Sie erhöhen die Effektivität und Nutzbarkeit dieses Teils der Benutzeroberfläche und machen es mehr als nur eine Augenweide. Wenn Sie nur über Optionen verfügen, können Sie sogar in die Einstellungen gehen und die Übergänge oder die Foliendauer ändern.
Inhalt & Fußzeilen
Der Rest der Seite ist ziemlich einfach. Es beginnt mit einem sekundären Inhaltsbereich und wechselt zu einer Fußzeile, die beide in drei Spalten angeordnet sind.
Zunächst haben Sie drei Inhaltsbereiche, von denen jeder ein Bild mit einer Beschreibung und einer Schaltfläche enthält. Ich mag besonders den Schatten, der hier auf die Miniaturbilder gesetzt wird. Es ist eine schöne Illusion, die dem Design etwas Tiefe verleiht.
Wenn die Kontaktinformationen in der Kopfzeile nicht ausreichen, bietet die Fußzeile einige sehr nützliche Funktionen. Es gibt einen Platz für eine Karte, einen Twitter-Feed und ein Kontaktformular. Dies zusätzlich zu einer Art sekundärer Fußzeile, die verschiedene soziale Symbole enthält. Diese neigen dazu, ein durcheinandergewürfeltes Durcheinander zu sein, das nachträglich in ein Design geworfen wird. Ich schätze also wirklich, wie gut das in das Design integriert ist.
Responsives Layout
Das Layout für die Site beginnt als statisch. Wenn das Ansichtsfenster auf eine bestimmte Breite reduziert wird, wird es flüssig. Hier sehen Sie einige Schritte für das Design, wenn sich das Ansichtsfenster ändert:
Ich finde es toll, dass dieses Thema ansprechend ist, ich denke, dass dies eher zu einer Notwendigkeit geworden ist, als dass es nett ist. Das, was sie wirklich aus dem Park rauswerfen, ist, dass das Layout ziemlich geräteunabhängig zu sein scheint. Ich versuche es so gut wie möglich, ich konnte das Layout nicht wesentlich brechen, während ich unterschiedliche Breiten erfasste. Alles, bis hin zur Suchleiste, formatiert sich neu, egal welche Bildschirmgröße Sie darauf werfen.
Auf mobilen Geräten wird die Navigation zu einer Auswahlbox. Dies ist einfach zu bedienen, vertraut und behält alle ursprünglichen Optionen bei. Es gibt einige gute Alternativen zu dieser Strategie, aber dies ist eine der funktionalen Lösungen.
Schlussgedanken
Das haben wir schon gesehen Mehr als (nur) Themen macht tolle Arbeit. Beim letzten Mal war meine Hauptbeschwerde, dass das Thema nicht ansprechend war, aber sie haben sich definitiv mit SuccessInc befasst. Alles in allem ist es ein großartiges Thema und ich kann sehen, dass es für viele verschiedene Arten von Websites wirklich gut funktioniert.
Du bist dran!
Nun, da Sie meine Kommentare gelesen haben, helfen Sie dem Designer mit ein paar weiteren Ratschlägen. Teilen Sie uns mit, was Sie an dem Design toll finden und was Sie für stärker halten könnten. Wie immer bitten wir Sie, auch den Designer der Site zu respektieren und eine klare, konstruktive Beratung ohne harte Beleidigungen anzubieten.