Online-Blogs haben sich in digitale Publikationen verwandelt, wobei jede große Druckmarke ihre eigene Website betreibt. Diese Blogs haben normalerweise die Form eines digitalen Magazins, das viel professioneller aussieht als eine kleinere persönliche Website.

Aber was geht in ein Magazin Layout? Und wie können Sie eine für Ihre eigene Website entwerfen?

Diese Liste sollte Sie mit 9 wesentlichen Funktionen für ein qualitativ hochwertiges Magazin-Blog-Design beginnen. Wenn Sie mit diesen Funktionen arbeiten und versuchen, ein verwendbare Schnittstelle Sie werden ein großartiges Design haben, das zu jeder Online-Publikation passen sollte.

1. Starkes Branding

Dies scheint offensichtlich, aber eine starke Marke hilft wirklich, das "Magazin" Gefühl über einen persönlichen Blog zu verkaufen. Wenn Sie eine autoritative Publikation erstellen möchten, müssen Sie sich darauf konzentrieren auf dem Branding .

Wie werden Sie sich von jedem anderen Blog abheben? Im Idealfall durch Inhalt, aber Ihre Marke ist ein großer Teil davon. Zum Beispiel ist das unten abgebildete Wired-Logo unter Tech-Blogs bekannt. Es gibt es schon seit Jahren und wenn Sie diese Marke sehen, erkennen Sie sofort die Seite.

Sie können das Branding jedoch auch in der Seitenleiste und in der Fußzeile Ihrer Website hinzufügen. Das Ziel ist es, einen einheitlichen Stil zu schaffen, der sich einfach stärker anfühlt als Rinky-Dink-Blogspot-Seiten.

01-Kabel-Magazin

2. Knackige Schlagzeilen

Sie können Ihre Überschrift beliebig formatieren, so dass es kein richtiges Design gibt. Aber du willst immer Überschrift Typografie das ist knackig, leicht zu überfliegen und normalerweise dick.

Schauen Sie sich die Schlagzeilen an US-Magazin um zu sehen, was ich meine. Diese Überschriften überspannen die gesamte Seitenbreite und die Buchstaben sind ziemlich dick. Sie können diese Schlagzeile nicht ignorieren, weil sie praktisch in Ihr Gesicht geschoben wird. Das ist das Ziel Ihrer Schlagzeile - machen Sie es so deutlich, dass es wirklich Aufmerksamkeit erregt und die Leute ermutigt, weiter zu lesen.

02-US-Magazin-Schlagzeile-stark

3. Tiered Navigation Menüs

Einige Designer argumentieren möglicherweise gegen diese Funktion, die besagt, dass Zeitschriftenwebseiten keine riesigen Menüs benötigen. Dies ist im Allgemeinen der Fall, jedoch haben Websites im Stil von Magazinen oft ein großes Archiv an Beiträgen. Sie möchten den Benutzern die bestmögliche Möglichkeit bieten, all diese Beiträge zu durchsuchen.

Egal, ob Sie WordPress-Kategorien, -Tags oder sogar benutzerdefinierte Taxonomien , können Sie diese zu einer massiven Mega-Navigation hinzufügen. Dies kann Dropdown-Menüs mit Listen aktueller Posts oder beliebter Tags / Kategorien oder sogar eine Mischung aus beiden enthalten.

Das Menü für Atlanta Magazin ist ziemlich glatt mit vielen eingebetteten Links im Dropdown. Außerdem ist das responsive Sliding Nav auf dem Handy klar erreichbar, so dass Smartphone-Nutzer nicht zu kurz kommen.

Diese gestaffelte Navigation könnte mehrstufige Dropdown-Listen enthalten oder sogar zum Scrollen mit dem Benutzer eingerichtet sein. So viele Optionen und wirklich der größte Faktor ist die Benutzerfreundlichkeit gemischt mit Tonnen von Links zu durchsuchen.

03-atlanta-Magazin-Dropdown-Nav

4. Featured Beiträge Widgets

Jede Homepage im Magazin-Stil sieht ein wenig anders aus mit verschiedenen Post-Thumbnail-Größen, benutzerdefinierten Formaten und natürlich verschiedenen Widgets.

Ich betrachte diese als Grundpfeiler jeder Magazin-Website, weil das Widget die Aufmerksamkeit auf sich zieht. Damit können Sie die neuesten Posts oder heißen Stories promoten, die am meisten Beachtung finden sollten.

Suchmaschinen-Journal hat einen Karussell-Slider, wo er zwischen 3 ihrer vorgestellten Geschichten auf einmal rotiert. Jede Story lädt einen Ausschnitt auf der linken Seite, der auch eine Vorschau-Miniaturansicht bietet.

Aber keine zwei Homepages sind identisch. Versuchen Sie also, Ihre Lieblingsmagazinseiten zu durchsuchen und sehen Sie sich an, welche anderen Story-Stile Sie finden können.

04-search-engine-journal-featured-widget

5. Prominente Sharing-Schaltflächen

Wenn es um Bauen geht eine starke Präsenz Sie können Social Media nicht ignorieren. Und wenn Sie mehr Besucher in Ihrem Magazin-Stil Blog wollen, werden Sie Social-Sharing-Buttons für jeden Post wollen.

Diese kommen in vielen Stilen und können an der Seite der Seite, oder an der Unterseite des Beitrags, oder sogar auf Bildern wie Pinterest share Tasten hinzugefügt werden.

Auf ZDNet verwenden sie ein langes Rechteck mit Freigabetasten direkt unter der Post-Überschrift. Dies verwendet einfache Symbole mit farbigen Blöcken, um auf alle oberen sozialen Netzwerke zu verweisen.

Aber auch hier finden Sie eine Menge Beispiele, indem Sie sich einige populäre Blogs ansehen. Und egal, welchen Stil Sie wählen, es ist eine gute Idee Split-Test Formate, um zu sehen, welche die meisten Anteile erzeugen.

05-zdnet-Sharing-Buttons

6. Verwandte Beiträge

Ich bin sicher, dass wir alle diese Widgets mit dem Titel "Sie mögen vielleicht auch ..." am Ende der Nachrichtenartikel sehen. Einige davon sind native Anzeigen Aber Websites im Magazin-Stil verwenden diese Widgets wirklich, um relevante Inhalte zu bewerben.

Diese Funktion sollte in keinem Blog fehlen, da sie die Seitenaufrufe ohne großen Aufwand verbessert. Besucher werden nicht immer nach Kategorien suchen, aber sie können nach verwandten Beiträgen suchen. Das Beispiel unten von wirklich einfach hat ein super sauberes Design; genau, was du tun solltest.

Post-Thumbnails sorgen zuerst für Aufmerksamkeit, so dass diese prominent in der Nähe der Schlagzeilen stehen.

06-wirklich-einfach-Sie-mögen-mögen

7. Zugängliche Suche (auch auf Mobilgeräten)

Jede Website benötigt ein Suchformular. Es ist eine der besten Möglichkeiten erhöhen Sie die Benutzerfreundlichkeit indem Sie Menschen helfen, relevante Inhalte zu finden.

Der Unterschied zu einer Zeitschriftenseite ist, dass es sich oft viel zu beschäftigt anfühlt, um zu suchen. Benutzer können sich mit so vielen Inhalten und so vielen Links überfordert fühlen, dass sie möglicherweise gar nicht erst suchen.

Eine prominente Suchform wie auf Platz drücken ist ideal, um mehr Suchen zu fördern.

Sie können ein Lupensymbol in Ihre Navigation einfügen und den Drop-down-Toggle-Effekt auf jeder Seite verwenden. Natürlich funktioniert das für auch mobil also ist es eine zuverlässige Wahl für jedes Magazin Layout.

07-Push-Square-Such-Magazin-Funktion

8. Benutzerdefinierte Seitenelemente

Diese Funktion ist ein bisschen vage, aber ich verdecke es vage absichtlich. Jedes generische Blog fühlt sich normalerweise gleich an: Absätze auf Absätzen mit wenig bis gar keiner benutzerdefinierten Formatierung.

Große Magazin-Themen profitieren von der Anpassung durch Hinzufügen von In-Post-Funktionen. Dies können beliebig viele Seitenelemente sein, die Ihren Inhalt verbessern und Ihre Posts leichter konsumieren lassen. Ein paar Ideen, die ich auf verschiedenen Websites gesehen habe:

  • Anführungszeichen
  • Inhaltsverzeichnis
  • In-Post-Bildpräsentationen
  • "Siehe auch" verwandte Beiträge

Erinnerst du dich, wie ich das Widget für verwandte Beiträge früher erwähnt habe? Es ist großartig, sie am Ende Ihres Posts hinzuzufügen, aber Sie können auch verwandte Inhalte in Ihren Post einfügen.

Beispielsweise TechCrunch Fügt am Ende jedes Beitrags ein Widget "Siehe auch" hinzu. Dies gilt auch für den Tech-Blog Hongkiat Das fügt relevante Beiträge in kleinen Blöcken in den Inhalt ein.

Ich kann Ihnen nicht genau sagen, welche Funktionen Sie Ihrer Website hinzufügen sollten. Aber verbringen Sie einige Zeit damit, Ideen zu sammeln und sie auszuprobieren, um zu sehen, was da steckt.

08-android-authority-page-elements

9. Ausgewählte Bildüberschriften

Wenn Sie beim ersten Seitenaufruf Aufmerksamkeit auf sich ziehen wollen, möchten Sie zwei Dinge: eine große Kopfzeile (die früher behandelt wurde) und ein klares, hervorgehobenes Bild.

WordPress kommt mit vorgestellten Bildern standardmäßig und Sie können bestimmte Größen für Ihre Bilder programmieren. Für Blogs im Magazin-Stil ist es am besten, diese ziemlich groß zu machen und dem zu folgen Held Image Trend . Sie können ein Fullscreen-Bild wie im folgenden Screenshot von Dwell verwenden. Oder Sie können Bilder entwerfen, die in den Inhaltsbereich Ihres Layouts passen.

So oder so sollte jeder Beitrag ein ansehnliches Bild haben, das den Inhalt verkauft. Sie werden das auf so ziemlich jedem Blog im Magazin-Stil sehen, sogar auf diesem Post, wenn Sie nach oben scrollen!

Berücksichtigen Sie all diese Ideen bei der Gestaltung Ihres Layouts und lassen Sie genügend Platz für auffällige Bilder.

09-Verweilzeit-Magazin-Featured-Bild