Dzisiaj porozmawiamy o stylach w projektowaniu stron internetowych, a akcent kładziemy na styl gazetowy. W tym poście poznasz najbardziej charakterystyczne cechy tego projektu i uzyskasz kilka przydatnych wskazówek, których należy przestrzegać, aby uzyskać lepsze wyniki w swoim projekcie.

Styl to całkowita kombinacja sposobu, w jaki projektujesz swoją witrynę. Styl to także sposób komunikacji między Tobą a publicznością. Każdy styl projektowania stron internetowych ma swój określony zestaw komponentów.

Główne style w projektowaniu stron internetowych to:

czysty;
nieczysty;
vintage/retro;
ilustracja;
gazeta/czasopismo.

Styl gazetowy był używany głównie w gazetach i czasopismach internetowych, ponieważ ich wersje drukowane mają taką strukturę. Dziś ten projekt jest odpowiedni dla każdej strony internetowej, zwłaszcza jeśli musi zawierać dużo treści. Stronę internetową wykonaną w stylu gazety łatwo rozpoznać po bogatym w treści układzie, wielokolumnowej strukturze, prostej i kontrastowej kolorystyce.

Układ strony internetowej gazety: charakterystyka

1 Czarno na białym

Tradycyjna drukowana gazeta jest biała lub szara, a tekst jest czarny. Ta kombinacja kolorów jest idealna dla naszych oczu. Kontrast kolorów poprawia czytelność, dlatego ta kolorystyka jest najbardziej odpowiednia dla witryn w stylu gazety, które zwykle są wypełnione dużą ilością treści. Możesz odejść od tej klasycznej mieszanki kolorów, ale zawsze pamiętaj, że kontrast jest koniecznością. Możesz odwrócić zwykły wybór kolorów, dzięki czemu tło będzie czarne, a typografia biała. Ale nigdy nie używaj żółtego na czarnym, zielonego na niebieskim, różowego na niebieskim itp. Spróbuj sam przeczytać stronę internetową, jeśli twoje oczy czują się dobrze, możesz zastosować wybrane kolory w swoim projekcie internetowym.

Neutralne jasne i ciemne to kolory podstawowe, ale można użyć więcej kolorów akcentujących. Na przykład niebieski jest dobry do nagłówków, czerwony byłby idealny do przycisków. Zakładki menu nawigacyjnego mogą być ozdobione jaśniejszym lub ciemniejszym odcieniem koloru podstawowego lub w kolorze takim samym jak detale akcentujące. Dzięki temu menu będzie się wyróżniać na płótnie i zapewni użytkownikom doskonałe wrażenia wizualne.

2 minimalna grafika

Strona z układem gazety jest przejrzysta, pouczająca, strukturalna i zawiera elementy graficzne zaprojektowane dokładnie iw minimalistyczny sposób. Elementy graficzne to:

linie
kształty
zabarwienie
typografia
tekstury.

Jak już wspomnieliśmy, paleta kolorów na takich stronach jest zawsze prosta. Tekstury są rzadko używane w projektach internetowych gazet, ponieważ ściana tekstu z obrazami na teksturze drewna lub grunge będzie rozpraszać odwiedzających i pogarszać czytelność treści. Niemniej jednak tekstura papieru ma tutaj rację. Może to być tekstura tła, tekstura przycisków lub używana tylko w obszarach nagłówka lub stopki.

Zwykły projekt oparty na siatce lub układ wielokolumnowy ogranicza użycie kształtów i linii, ponieważ i tak jest ich wystarczająco dużo. Byłoby za dużo geometrii, gdybyś zaprojektował stronę internetową z odpowiednim formularzem z dodatkowym zestawem figur.

3 Projekt oparty na siatce lub układ wielokolumnowy

Układ strony gazety to taki, który ma doskonale zorganizowaną strukturę. Są to bogate w treść strony internetowe, które zwykle mają tego rodzaju projekt, więc struktura jest na pierwszym miejscu. Siatka lub kolumny to najbardziej przydatne rodzaje uporządkowania treści. To prawda, że „dobrze zaprojektowane systemy siatek mogą sprawić, że Twoje projekty będą nie tylko piękniejsze i czytelniejsze, ale także bardziej użyteczne" (Mark Boulton). Układ oparty na siatce umożliwia podzielenie treści na obszerne bloki; w ten sposób zachęć użytkowników do czytania Twojej witryny, a nie przeglądania jej.

Podobny, ale nie taki sam, jest układ wielokolumnowy. Powinno to być kilka kolumn o odpowiedniej wysokości, ale niekoniecznie tej samej szerokości. Im szersze kolumny, tym bardziej czytelny jest tekst. Dwie kolumny mogą wyglądać świetnie, choć trzy i więcej są zdecydowanie lepsze. Kolumny, jako siatka, pozwalają na zróżnicowanie treści, ułatwiają użytkownikom odnalezienie interesującej ich sekcji. Wybierając ten styl układu, nie należy zapominać o odstępie między kolumnami. Witryna będzie bardzo trudna do odczytania, jeśli kolumny będą zbyt ciasno ustawione względem siebie.

4 nagłówki i fragmenty

Czy chcesz otwierać każdy wpis i czytać go po wejściu na stronę lub blog z wieloma tekstami? Nagłówki pomagają nam odróżnić ciekawy artykuł od drugorzędnego. Tak więc każdy blok treści musi być uprawniony. Niezależnie od tego, czy jest to mała sekcja w siatce, czy kolumna o pełnej wysokości, powinien mieć nagłówek. Nagłówek ma być pisany większą czcionką, pogrubiony lub wyróżniony innym kolorem. Ten punkt jest jasny, sugeruję.

Fragmenty to krótkie opisy artykułów tekstowych. Robi się to zawsze, aby wzbudzić zainteresowanie czytelników i umożliwić im zrozumienie długiego tekstu w kilku zdaniach. Ten element jest przydatny, jeśli prowadzisz bloga, czasopismo internetowe, serwis informacyjny itp.

5 Treść pierwotna i dodatkowa

Narysuj granicę między częściami treści. Zdefiniuj, co jest najważniejsze i które teksty mogą czekać na przeczytanie. Na przykład możesz zaprojektować stronę główną z dużą sekcją nagłówka dla nowych postów (jednego lub kilku). Jest to wyróżniony obszar z dużymi obrazami i grafiką. Pozostała zawartość będzie mniejsza i oparta na ułamkach siatki. Skupia się to na najnowszych przybyszach i pomaga zdobyć więcej udostępnień społecznościowych.

6 Intuicyjna i spójna nawigacja

Układ strony internetowej gazety został zaprojektowany z myślą o treści, a ta treść musi być łatwa w nawigacji. Dzięki temu menu nawigacyjne charakteryzuje się prostotą i właściwą pozycją.

Najlepszą pozycją jest górny obszar strony, ponieważ ta strefa jest wymieniana jako pierwsza i zawsze w tym samym miejscu – wystarczy przewinąć w górę, jeśli jesteś na dole. Jeśli kochasz nawigację w pionie i nie możesz przestać jej kochać – zmień orientację menu w pionie, ale zrób to po lewej stronie. Czytamy od lewej do prawej, a nie odwrotnie, więc elementy po lewej wpadają w oko wcześniej niż po prawej.

Witryny w stylu gazety udostępniają mnóstwo tekstów i muszą być dostępne dla użytkowników.

7 Kategoryzacja

Lepsze wykorzystanie kategorii jest najbardziej dostępne w układzie serwisu gazety. Dotyczy to w szczególności blogów, a także wszelkich innych stron internetowych. Większość witryn zawodzi, ponieważ ich zawartość jest czysto zorganizowana. Kategorie są niezbędne, jeśli publikujesz często i na różne tematy (np. serwisy informacyjne).

Podziel zawartość na kategorie i wyświetl ją na pasku bocznym lub na pasku menu nawigacyjnego.

8 Miejsce na reklamę

Jak zamierzasz zarabiać, zanim Twoja witryna stanie się popularna? Reklama to liczba właścicieli witryn, którzy osiągają dość duże zyski. Banery reklamowe muszą być umieszczone nie tylko gdzieś, ale to miejsce musi być dokładnie określone. Właściwe miejsca to pasek boczny, zarówno lewy, jak i prawy, Nagłówek lub Stopka. Banery promocyjne są często widoczne w samym środku artykułów tekstowych, ale ten punkt jest kontrowersyjny: jest to dobre dla ciebie jako osoby, która bierze za to pieniądze, ale te elementy mogą również irytować twoich czytelników.

9 Funkcjonalny pasek boczny

Pasek boczny może zawierać nie tylko reklamy, ale także kategorie treści, najnowsze treści, pole wyszukiwania, pasek biuletynów e-mail, nawigację, przyciski udostępniania w mediach społecznościowych, rabaty/oferty specjalne itp. Układ strony gazety świetnie nadaje się do zaimplementowania paska bocznego, ponieważ byłby to po prostu kolejny kolumna w rzędzie.

Na udany projekt paska bocznego składa się kilka elementów:

rozmiar (wzrost i waga);
zabarwienie;
czcionki;
umieszczenie.

Pasek boczny powinien być mniejszy lub równy zwykłej kolumnie w twoim układzie, nie większy. Powinien być utrzymany w neutralnej kolorystyce, ale z widoczną typografią. Umieszczenie może być zarówno lewe, jak i prawe, ale jak już powiedzieliśmy, wszystko po lewej stronie jest natychmiast widoczne.

10 Maksymalizacja białej przestrzeni

O ile tworzymy wielofunkcyjną stronę internetową z imponującym układem, nie możemy nie wspomnieć o białej przestrzeni. Jest to niezbędny element nawet w przypadku projektu w stylu gazety. Niech to będzie przestrzeń między kolumnami, puste sekcje z boków lub na dole. Użytkownicy powinni mieć możliwość odwrócenia wzroku od ściany tekstu i przemyślenia.

Ogólnie biała przestrzeń jest uważana za sekcję, w której nic nie jest wpisywane. Istnieje węższe znaczenie: biała przestrzeń znajduje się między wierszami tekstu a literami, wokół elementów treści. To wszystko, co sprawia, że Twoja strona internetowa jest czytelniejsza i prostsza, nawet jeśli jest wypełniona nadmierną ilością elementów treści.

11 Częste aktualizacje treści

Layout strony Gazety zobowiązuje do ciągłej pracy nad projektem. Witryna z wieloma pustymi kolumnami i sekcjami siatki będzie wyglądać niezgrabnie. Musisz dokładnie wypełnić witrynę i regularnie aktualizować zawartość, często publikować i zmieniać polecane treści w nagłówku (lub gdziekolwiek to robisz).

Treść i częstotliwość to para, jak król i królowa. Poza samym wyglądem strony, często pojawiające się treści wpływają na Twoje wyniki w wyszukiwarkach. Ludzie rzadko odwiedzają Twoją witrynę, jeśli jest nieaktualna, a Google ją widzi. Twoje treści zyskują więc gorsze wyniki w wynikach wyszukiwania.

12 Zachęca się do udostępniania w serwisach społecznościowych

Blogi i strony z wiadomościami są najczęściej używane w stylu gazety, a te strony nie mogą istnieć bez integracji z mediami społecznościowymi. To epoka masowego udostępniania, a sieci społecznościowe to miejsce, w którym ludzie spędzają większość czasu. Powinieneś używać fajnych przycisków obserwowania i udostępniania dla każdej sieci: Twitter, Facebook, Google+, Pinterest, LinkedIn itp. Jedyna uwaga: nie używaj kont, które porzuciłeś, używaj tylko tych, na których często publikujesz. Stwórz te przyciski jak najbardziej widoczne na stronie, aby zapewnić sobie lepszą ekspozycję wizualną na platformach medialnych.

Jeszcze jedną rzeczą, o której chcielibyśmy wspomnieć o osobliwościach układu strony internetowej gazety, jest responsywność. Ten układ nigdy nie pozostanie taki sam na urządzeniach mobilnych i nie ma sposobu na stworzenie wersji mobilnej zachowującej styl gazety. Witryna mobilna nie powinna mieć wielokolumnowego układu treści, a jest to konieczne przy projektowaniu stron gazet. Witryna mobilna nie może mieć pasków bocznych. Lepiej przemyśleć nawigację, ponieważ bardziej przydatne jest, aby witryna mobilna była przewijana, a nie klikalna.