Ein neues Design für unsere Elmastudio Webseite

Einige haben es bestimmt schon bemerkt: Seit dem Wochenende ist unsere neugestaltete Elmastudio-Webseite online. Wir haben zwar noch etliche kleinere Arbeiten und Optimierungen zu tun, aber trotzdem sind wir froh endlich mit unserem neuen Design online zu sein. Einige der Gedanken, die wir uns während des Designprozess unserer Webseite gemacht haben möchten wir mit dir teilen.

Im Gegensatz zum bisherigen Design (auf der Basis von Moka) haben wir dieses mal vor allem Wert darauf gelegt, mehr Klarheit in die Verteilung unserer Inhalte zu bringen. Wir haben unsere Haupt-Menüpunkte und Social Icons in einer feststehenden Leiste im Header untergebracht und alle anderen Links im Footer. So sind unsere wichtigsten Menüpunkte immer zugänglich und alle übrige Info, sowie eine Suche kann im Footer gefunden werden.

Unsere WordPress Theme-Seiten haben wir inhaltlich vereinfacht, klarer und übersichtlicher gestaltet.

Außerdem war uns wichtig, den Blog gründlich zu überarbeiten. Wir haben uns für ein dreispaltiges Masonry-Grid auf der Blog-Hauptseite und bei den gefeaturten Artikeln auf der Startseite entschieden. Auf dem Blog und auf Artikelseiten haben wir zusätzlich ein Widgetbereich mit Links und weiteren beliebten Artikeln integriert. So kann man leichter neue Artikel finden und auch ein bisschen im Blog „stöbern“ (und so auch ältere Artikel entdecken). Unsere Theme-Seiten haben wir inhaltlich vereinfacht und klarer gestaltet. Ein Slider zeigt Bilder der einzelnen Themes und auf der Theme-Übersichtsseite kann man zwischen einer Grid und einer Listen-Ansicht wählen und sich so viel leichter die Themes anschauen. Wichtig war uns auch die Theme-Kategorie (Portfolio, Business, Magazin) zu integrieren, wofür wir in unserem alten Design bisher nicht die Möglichkeit hatten.

Insgesamt war uns wichtig das Design großzügiger, moderner und die Typografie spannender zu gestalten. Auf den Artikel-Seiten haben wir auf eine gute Lesbarkeit geachtet und mehr Vielseitigkeit in den Schrift-Stilen geachtet. Als serifenlose Schrift haben wir die noch recht neue Google-Schrift Work Sans gewählt. Diese haben wir mit der klassischen Times New Roman Vesper Libre kombiniert. Uns gefällt dieser Kontrast sehr gut und er bietet unserer Ansicht nach jede Menge Möglichkeiten, um spannende Gegensätze zu schaffen.

Wir hoffen dir gefällt unser neues Elmastudio-Design. Schau dich doch auf der neuen Webseite ein bisschen um und sag uns was du denkst. Über dein Feedback, Verbesserungsvorschläge oder Fehlermeldungen würden wir uns sehr freuen. Schreib uns doch deine Meinung zum neuen Design in einem Kommentar!

33 Kommentare

  1. Hallo Ellen,

    gefällt mir gut euer neues Design. War auch nicht anders zu erwarten. Der Fokus auf minimales Design mit guter Typographie ist man von euch ja gewohnt. Du frägst nach möglichen Verbesserungsvorschlägen – mir fällt dazu nur eines ein. Auf der Startseite hätte ich im Einleitungstext/Intro ‚Elmastudio‘ noch hervorgehoben – vielleicht durch einfache Fettung. Das solls dann aber auch schon gewesen sein. :)

    vg nach NZL
    Markus

    • Hallo Markus,
      ganz vielen herzlichen Dank für dein tolles Feedback, das freut uns total :) Ja, du hast Recht, wir hatten „Elmastudio“ ein einer ersten Version auch hervorgehoben, dann hat es uns doch nicht mehr so gefallen, das es zu sehr herausgestochen hat (aus dem sonst schlichten Text). Aber wir werden es auf jeden Fall noch einmal testen.
      Ganz viele Grüße, Ellen & Manuel

  2. Hi Ellen,

    sieht sehr schön aus, allerdings finde ich die doch recht in die Jahre gekommene Times etwas gewöhnungsbedürftig. Im ersten Moment dachte ich, da wird irgendeine Schrift nicht geladen und daher der „Fallback“-Font Times verwendet. Habe dann erst Deinem Blog entnommen, dass es Absicht ist.

    Ansonstensehr übersichtlich und sehr gute user-experience.

    Viele Grüße

    Jens

    • Hallo Jens,
      ganz vielen Dank für dein positives Feedback, ja du hast Recht, die Times ist etwas unüblich im Gebrauch. Wir haben uns auch noch nicht final entschieden, eventuell testen wir noch alternative Fonts :)
      Ganz viele Grüße, Ellen & Manuel

  3. Hallo Ellen,

    mir gefällt’s eigentlich auch sehr gut. Nur die Einzel-Seiten, so wie diese hier: http://www.elmastudio.de/wordpress-themes/zuki/ sind meiner Meinung nach von der Schrift her zu groß geraten. Bin sofort einen halben Meter zurückgewichen, lässt sich auch nicht mehr lesen wegen der krassen Breite der Schrift.

    Viele Grüße
    Reni

    • Hallo Reni,
      vielen herzlichen Dank für dein Feedback, ja du hast Recht, wir werden daran noch arbeiten. Als Zwischenelement gefällt uns die komplett breite Schrift sehr gut, aber auf den Themes-Einzelseiten ist der Text leider doch etwas zu lang für diesen Stil. Wir arbeiten noch an einer Optimierung :)
      Viele Grüße, Ellen

  4. Hi Ellen,

    hab einige Seiten auf einem mobilen Endgerät unter die Lupe genommen: auch wenn der Re-design recht überschaubar ist, die Weißraumwirkung kommt nun noch besser zur Geltung. Was die Schrift angeht, möchtet Ihr wohl experimentieren. Ob sich die zum Teil ‚ungewohnt’große Schrift noch durchsetzen wird, muss man sehen. Ansonsten wäre vllt noch überlegenswert (habe ich glaube schon per Mail an euch angemerkt), ob Ihr die native Kommentarfunktion erweitern wollt. Bin gerade am testen des Plugins wpDiscuz.

    Bisher gefällt’s.

    LG Robert

    • Hallo Robert,

      ganz vielen Dank für dein tolles Feedback bzgl. der mobilen Optimierung (diese Optimierung war uns sehr wichtig). Ganz vielen Dank auch für deinen Vorschlag bzgl. der Kommentare, ja wir haben wirklich schon darüber nachgedacht. Bisher sind wir aber noch nicht dazu gekommen, uns für eine Lösung zu entscheiden. Gibt es eigentlich noch die Social Comments Funktion von Jetpack? Hast du mit diese Erfahrung? Wir möchten ungern noch weitere Plugins installieren (wir haben leider schon sehr viele aktiv…).

      Ganz viele Grüße, Ellen

  5. Hey Ellen,

    Die gesamte Schrift gefällt mir mir leider überhaupt nicht.
    Die Work Sans gepaart mit der Times, empfinde ich gegenteilig zu eurem ästhetischem Empfinden, als keine gute Kombination.

    Auch die Größe der Schrift ist mMn. eher unglücklich.
    Es sieht einfach nicht gewollt aus und wirkt aufgesetzt.

    Positiv anzumerken sind jedoch, die sehr gute Umsetzung des „Minimalistic-Design“ und die allgemeine bessere Übersichtlichkeit.

    Insgesamt ein schönes Design, aber mit deutlichem Verbesserungspotenzial.

    Beste Grüße
    Jan

    • Hallo Jan,

      vielen Dank für dein ehrliches Feedback, ja du hast Recht, es ist etwas ungewöhnlich. Uns gefällt es eigentlich sehr gut, aber wir testen auch noch alternativen. Wir wollten auf jeden Fall bei Google Fonts bleiben, da wir so auch schon die Work Sans laden. Wenn du eine Idee für eine alternative Serifenschrift hast, sind wir sehr offen dafür, immer her damit :)

      Ganz viele Grüße, Ellen

      • Hey Ellen,

        Seeeeeehr Gute Wahl mit der Vesper Libre.
        Das Zusammenspiel der beiden Fonts wirkt jetzt richtig gewollt und ist nun auch sehr gut umgesetzt.
        Die große Schrift macht jetzt auch dank der Vesper Libre nicht mehr so den erschlagenen Eindruck.

        Super!

        Beste Grüße
        Jan

  6. Hallo zusammen,
    Glückwunsch, wie immer sieht alles sehr aufgeräumt und strukturiert aus! Gestaltung und Design finde ich grundsätzlich hervorragend!

    Allerdings: Mit dem Schriftenkonzept komme ich nicht ganz klar; die Typenkombination und vor allem die Schriftgrößen irritieren mich. Gerade im Flattersatz (siehe „Über uns“ und „Elmastudio“) macht das den Eindruck, als hätte irgend etwas nicht funktioniert!
    Etwas hilflos war ich auf der Startseite („Elmastudio“). Ich wollte nicht weiterlesen und habe daher das Menü gesucht. Weil es fehlte, habe ich mich scollend und mit den Augen nach unten orientiert, da kam aber nichts. Erst beim Zurückscrollen bemerkte ich die inzwischen oben erschienene, unscheinbare Menüleiste. m.E. ist das ein Tick zuviel an Minimalistik, weil es die Usability beeinträchtigt („der erste Eindruck“!).
    Was mich generell stört, geradezu nervt, ist die Marotte, ein Thema beim Focussieren auszublenden! Das machen mittlerweile viele Themes so, ich finde es jedoch geradezu kontraproduktiv! Man interessiert sich für ein Thema („Blog“), beginnt den Teaser zu lesen, fährt mit der Maus darauf und der Inhalt verschwindet. Kann man das nicht anders lösen? Ich weiß um die Problematik, aber „Ausblenden“ ist nicht der richtige Weg. Idealerweise müsste alles andere ausgeblendet werden. Das ist doch mal ’ne CSS-Aufgabe!
    Das Mobile Menü ist super! Allerdings kommt die Umschaltung m.E. zu früh. Monitore mit (1152, 1024, 800 horizontal) haben kein normales Menü mehr, sondern einen „großes schwarzes Fenster“). Das Mobile Menu sollte sich auf „mobile devices“ beschränken.
    Das waren jetzt aber nur 4 Kritikpunkte, die teilweise der Erläuterung bedurften, in einem sonst sehr, sehr ansprechenden Ansatz! Der dreispaltige Blog z.B. ist super …

    Weitermachen und beste Grüße, Klaus

    PS: Beneide euch für eure Location! Hoffe, es gefällt euch immer noch dort!

    • Hallo Klaus,
      ganz vielen herzlichen Dank für dein ehrliches Feedback und deine Verbesserungsvorschläge, das ist wirklich sehr hilfreich für uns (viele Augen sehen mehr). Bzgl. der Schrift, wir sind eventuell schon an einer alternative dran, eventuell sind wir bei der Times etwas zu klassisch drangegangen (obwohl uns die Schrift wirklich sehr gefällt). Über Schriftempfehlungen freuen wir uns übrigens sehr :)

      Die mobile Ansicht werden wir uns auf jeden Fall auch noch einmal anschauen, ganz vielen Dank für deinen Tipp!
      Viele Grüße, Ellen

  7. Hallo Ellen,
    Hm auf dem 27″ Bildschirm ist es gewöhnungsbedürftig und die große Schrift ist sehr schwer zu lesen, weil sie so groß ist. Ebenso irritierte mich, dass die Hauptnavi erst beim Scrollen erscheint.Mobil sieht sie dafür wirklich super aus. Schade dass ihr das Freelancer-Netzwerk rausgenommen habt.

    • Hallo Daniela,

      ganz vielen Dank für deinen Kommentar und dein Feedback. Die Hauptnavi macht diesen Effekt nur auf der Startseite, da gefällt uns der Effekt (in der Kombination mit dem Introtext) sehr gut. Natürlich ist das ein bisschen ein Hingucker und nicht jedermanns Sache, aber es macht das Design auch etwas spannender und kreativer (unserer Ansicht nach).

      Das Freelancer Netzwerk kommt auf jeden Fall auch wieder rein. Leider müssen wir noch ein paar Seiten umgestalten und das neue CSS anpassen, daher haben wir es momentan noch nicht verlinkt (wir machen das in den nächsten Tagen).

      Ganz viele Grüße, Ellen

  8. Also nach mehrmaligem Besuch muss ich schon sagen , dass mir die Times überhaupt nicht gefällt. Sieht irgendwie echt aus wie Web 1.0. Außerdem finde ich prinzipiell die Schrift zu groß. An einem normal großen Monitor ist es schwer zu lesen, es sei denn man sitzt soweit weg wie vom Fernseher. Die Google Work Sans ist toll, aber in Kombination mit der Times geht das so nicht, finde ich. Müssen es überhaupt zwei Schriften sein? Es gibt doch toll ausgebaute humanistische Serifenlose (Work Sans hab ich noch nicht näher angeschaut) mit denen man durch verschiedene Fetten oder Stile sehr viel machen kann. Mein Motto: Wenig ist mehr.
    Ich arbeite gerade an meiner neuen Website mit eurem theme Zeitreise. Da habe ich zwar die Schrift ausgewechselt (werdet Ihr sehen, wenn es fertig ist) aber ich verwende da nur eine. Das bringt mehr Ruhe und Konsistenz in die ganze Geschichte.

    Die Themes-Seiten sind ansonsten z.B. sehr gelungen.

    • Hallo Jens,

      ganz vielen Dank für dein Rückmeldung und dein weiteres Feedback. Du hast Recht auf großen Monitoren ist die Schriftbreite natürlich etwas provokant, aber uns gefällt das bei den kürzeren Zwischen-Texten eigentlich gerade sehr gut. Bei den längeren Texten (z.B. bei dein Theme Einzel-Seiten) werden wir aber noch einmal dran arbeiten und die Lesbarkeit verbessern, da hast du natürlich Recht.

      Die Kombination aus serife und serifenloser Schrift gefällt uns eigentlich auch sehr gut, vor allem da das gesamte Design sehr minimalistisch ist. Aber wir sind dran, eventuell noch eine alternative zur Times zu finden. Bisher sind wir leider noch nicht ganz fündig geworden.

      Sag uns Bescheid, wenn deine Zeitreise-Anpassung fertig ist, die würden wir natürlich super gerne sehen!

      Ganz viele Grüße, Ellen

      • Meine Anpassung wird nicht so spannend sein, nach einigen Experimenten u.a. mit der Fira Sans bin ich im Moment bei der allseits bekannten Open Sans gelandet. Ist zugegebenermaßen nicht sonderlich individuell, ist aber für kleinere Texthäppchen gut lesbar und sieht schön schlicht aus. Außerdem bin ich nach wie vor ein fan der Open Sans bzw. Ihrer professionellen Schwester der The Sans.

        Ich sag Bescheid, wenn die Seite online geht. Dann könnt Ihr die gerne in der Luft zerreißen. Dauert aber noch ein wenig, zu den eigenen Dingen kommt ja immer nicht, das zieht sich dann gerne etwas hin.

        Viele Grüße nach NZL

        Jens

  9. Hallo Ellen und Manuel,

    mir gefällt die Seite von der Aufmachung gut, weg vom „klassischen Einheitsbrei“. Ich muss mich allerdings meinen Vorschreibern anschließen, dass ich mit der Schriftgröße leider gar nicht zurecht komme. (Ich habe mir die Seite nicht mobil angeschaut nur Desktop)
    Auch finde ich die Zwischenüberschriften bei „Über uns“ zu klein im Vergleich zur Größe des normalen Textes. Auch die Einrückung bei jedem Absatz, auch ohne vorstehender Überschrift, finde ich etwas irritierend.
    Insgesamt aber ein spannender Ansatz und ich freue mich auf weitere Optimierungen und „beim wachsen der Seite“ zuzuschauen.

    Viele Grüße
    Florian

  10. Hallo Ellen und Manuel,

    mir gefällt das neue Design sehr gut. Allerdings habe ich einen Kritikpunkt im Blog in der mobilen Ansicht gefunden.
    Wenn der Name des Verfassers eines Kommentars länger ist, dann steht das Datum in den Button „Antworten“ hinein.

    Viele Grüße aus Wien nach NZL
    Simon

  11. Hallo,

    ich kann zum Design bisher nur soviel sagen, dass die große Schrift das Lesen auf einem 24-Zoll Monitor sehr erschwert. Ich habe den Eindruck, dass man visuell keine Textblöcke mehr erfassen kann, sondern mühsam Wort für Wort abarbeiten muss. Kann natürlich eine Gewohnheitssache sein, aber anscheinend teile ich diese Gewohnheit mit anderen. ;-)

    Gruß, Daniel.

  12. Hi Ellen,

    das gefällt mir schon mal deutlich besser mit der Vesper Libre anstelle der Times.
    Die Times wirkte zu altbacken und vor allem zu fragil im Verhältnis zur Work Sans.
    Jetzt ist es schon deutlich harmonischer, nur teilweise immer noch zu groß, zumindest für große Bildschirme. Siehe mein Vorredner.

    Viele Grüße

    Jens

  13. Ich kann mir gut vorstellen, dass Vesper Libre auf euren Macs ganz sexy aussieht, auf einem Windows QHD + Chrome entstehen jedoch leichte Unschärfen an den Kanten. Bei Times blieb alles gestochen scharf, auch auf Windowsgeräten.

    Optisch ist sie natürlich die bessere Wahl.

    Gruß,
    Ruslan

    • Hallo Ruslan,

      ganz vielen Dank für dein Feedback zur Schrift, könntest du uns eventuell einen Screenshot linken oder kurz per Email schicken (kontakt (at) elmastudio (punkt) de. Das wäre genial und super nett von dir! Natürlich nur wenn es dir nicht zu viel Arbeit ist.
      Ganz viele Grüße, Ellen

    • Das frage ich mich auch. Der Theme ist Bombe und gehört definitiv ins Theme Bundle ;) Mir würde schon der Blog Teil reichen. Ich habe noch keinen so aufgeräumten und schicken Blog Theme gesehen.

    • Hallo Mac, Hallo Martin,
      es freut uns total, dass euch das Redesign gefällt. Leider ist das Theme im Moment nur eine Eigenanpassung für Elmastudio, aber wir werden bestimmt in der kommenden Zeit auch ein Theme in diese Richtung gestalten :)

      Ich bin gerade auch dabei eine kleine Umfrage für unsere Theme-Nutzer einzurichten, so können wir Feedback sammeln, welche Art von Themes und welche Theme-Features besonders beliebt und gewünscht werden. Ich werde in einem Blogartikel darauf hinweisen, sobald die Umfrage fertig ist.

      Grüße, Ellen

  14. Gefällt mir sehr gut, vor allem mobil kann alles gut gelesen werden und das wird ja immer wichtiger…

  15. Hallo Marco,
    ganz vielen Dank für dein Feedback, ja, auf eine verbesserte Lesbarkeit auch auf mobilen Geräten haben wir besonders geachtet, es freut mich sehr, dass dir das neue Design gefällt :)
    Grüße, Ellen

  16. Dr. Elmar Basse 31. Mai 2016

    Hallo, schönes neues Design. Ich finde es immer gut, wenn etwas in mehr oder minder regelmäßigen Abständen überarbeitet wird, zeigt es doch, dass man mit Engagement bei der Sache ist.

    Viele Grüße
    Elmar Basse

  17. Insgesamt sehr gelungen. Kleiner Fehler: wenn man Mobil den Hamburger klickt, ist das daraus entstandene Schliessen-„X“ an einer anderen Stelle.

Hinterlasse eine Antwort

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