Tänään puhumme tyyleistä verkkosivujen suunnittelussa, ja painopisteemme on sanomalehtityyli. Tässä viestissä saat selville tämän suunnittelun erottuvimmista piirteistä ja saat hyödyllisiä vinkkejä, joita voit noudattaa saadaksesi parempia tuloksia projektillasi.

Tyyli on täydellinen yhdistelmä verkkosivustosi suunnittelusta. Tyyli on myös tapa kommunikoida sinun ja yleisösi välillä. Jokaisella web-suunnittelutyylillä on omat osansa.

Verkkosuunnittelun tärkeimmät tyylit ovat:

puhdas;
grungy;
vintage/retro;
kuva;
sanomalehti/aikakauslehti.

Sanomalehtityyliä käytettiin ensisijaisesti verkko- ja aikakauslehdissä, koska niiden painetuissa versioissa on tämä rakenne. Nykyään tämä muotoilu sopii kaikille verkkosivustoille, varsinkin jos sen on oltava runsassisältöinen. Sanomalehtityylinen verkkosivu on helppo tunnistaa monien muiden joukossa sisältörikkaasta ulkoasusta, monisarakkeisesta rakenteesta, yksinkertaisista ja kontrastisista väreistä.

Sanomalehden verkkosivuston ulkoasu: Ominaisuudet

1 Musta valkoisella

Perinteinen painettu sanomalehti on valkoinen tai harmaa ja teksti musta. Tämä väriyhdistelmä sopii täydellisesti silmillemme. Värien kontrasti helpottaa luettavuutta ja siksi tämä värimaailma sopii parhaiten sanomalehtityyppisille verkkosivuille, jotka ovat yleensä täynnä sisältöä. Voit siirtyä sivuun tästä klassisesta väriyhdistelmästä, mutta sinun tulee aina pitää mielessä, että kontrasti on pakollinen. Voit kääntää tavallisen värivaihtoehdon, jolloin taustasta tulee musta ja typografia valkoinen. Mutta älä koskaan käytä keltaista mustalla, vihreää sinisellä, vaaleanpunaista sinisellä jne. Yritä lukea verkkosivusto itse, jos silmäsi tuntuu hyvältä sen jälkeen, voit ottaa poimitut värit käyttöön verkkoprojektiisi.

Neutraali vaalea ja tumma ovat perusvärejä, mutta niissä voi olla enemmän korostusvärejä. Esimerkiksi sininen on hyvä käyttää otsikoissa, punainen olisi täydellinen painikkeissa. Navigointivalikon välilehdet voidaan koristella päävärin vaaleammalla tai tummemmalla sävyllä tai värittää samalla tavalla kuin korostusyksityiskohdat. Joten valikko erottuu kankaalta ja tuo käyttäjille täydellisen visuaalisen kokemuksen.

2 Minimal Graphics

Sanomalehtien ulkoasulla varustettu verkkosivusto on puhdas, informatiivinen, rakenteellinen ja siinä on tarkasti ja minimalistisesti suunniteltuja graafisia elementtejä. Graafiset elementit ovat:

rivit
muodot
värit
typografia
tekstuurit.

Kuten jo mainitsimme, väripaletti on aina yksinkertainen tällaisilla verkkosivustoilla. Tekstuureja käytetään harvoin sanomalehtien web-malleissa, koska puu- tai grunge-tekstuurilla oleva tekstiseinä, jossa on kuvia, häiritsee kävijöitä ja pahentaa sisällön luettavuutta. Tästä huolimatta paperin rakenne on oikea. Se voi olla taustatekstuuri, painikkeiden rakenne tai käyttää vain ylä- tai alatunnistealueita.

Säännöllinen ruudukkopohjainen suunnittelu tai monisarakeasettelu karsi muotojen ja viivojen käyttöä, koska niitä riittää joka tapauksessa. Geometriaa olisi liikaa, jos suunnittelet oikean muodon verkkosivustosi ylimääräisillä hahmoilla.

3 Ruudukkopohjainen suunnittelu tai monisarakeasettelu

Sanomalehtien verkkosivujen ulkoasu on täysin organisoitu rakenne. Nämä ovat runsaasti sisältöä sisältäviä verkkosivustoja, joilla on yleensä tällainen muotoilu, joten rakenne on ensimmäinen. Ruudukko tai sarakkeet ovat hyödyllisimpiä sisällön järjestelytyyppejä. On totta, että "hyvin suunnitellut ruudukkojärjestelmät voivat tehdä malleistanne paitsi kauniimpia ja luettavampia myös käyttökelpoisempia" (Mark Boulton). Ruudukkopohjaisen asettelun avulla voit jakaa sisällön kattaviin lohkoihin; houkuttelevat käyttäjät lukemaan verkkosivustoasi, eivät luistelemaan.

Samanlainen, mutta ei sama, on usean sarakkeen asettelu. Näiden tulee olla muutama oikeankorkuinen sarake, mutta ei välttämättä yhtä leveä. Mitä leveämmät sarakkeet ovat, sitä luettavampi teksti on. Kaksi saraketta voi näyttää upealta, vaikka kolme tai enemmän ovat ehdottomasti parempia. Sarakkeet ruudukkona auttavat erottamaan sisällön, helpottavat käyttäjien löytämistä kiinnostuneen osion. Kun valitset tämän tyylin, älä unohda sarakeväliä. Sivusto on erittäin vaikea lukea, jos sarakkeet ovat liian tiukalla toisiinsa.

4 Otsikot ja otteet

Haluatko avata jokaisen viestin ja lukea sen, kun siirryt verkkosivustolle tai blogiin, jossa on paljon tekstejä? Otsikot auttavat meitä erottamaan kiinnostavan artikkelin toissijaisesta. Jokaisella sisältölohkolla on siis oltava oikeus. Olipa kyseessä pieni osa ruudukossa tai täysikorkuinen sarake, sillä tulee olla otsikko. Otsikon on oltava suurempi fontti, lihavoitu tai korostettu eri värillä. Tämä kohta on selvä, ehdotan.

Otteet ovat lyhyitä kuvauksia tekstiartikkeleista. Niitä tehdään aina lukijoiden kiinnostuksen herättämiseksi ja pitkän tekstin ymmärtämiseksi muutamalla lauseella. Tämä elementti on hyödyllinen, jos pidät blogia, online-aikakauslehteä, uutissivustoa jne.

5 Ensisijainen ja toissijainen sisältö

Piirrä raja sisältösi osien välille. Määrittele mikä on tärkeintä ja mitkä tekstit voivat odottaa lukemistaan. Voit esimerkiksi suunnitella etusivullesi suuren otsikkoosion uusille postauksille (yhdelle tai parille). Tämä on alue, jossa on suuria kuvia ja grafiikkaa. Muu sisältö on pienempi ja perustuu ruudukon murtolukuihin. Tämä keskittyy voimakkaasti viimeisimpään tulokkaaseen ja auttaa saamaan enemmän sosiaalisia jakoja.

6 Intuitiivinen ja johdonmukainen navigointi

Sanomalehtien verkkosivujen ulkoasu on suunniteltu sisällölle ja tämän sisällön on oltava helposti navigoitava. Näin ollen navigointivalikko on ominaista sen yksinkertaisuus ja oikea sijainti.

Paras sijainti on yläsivun alue, koska tämä vyöhyke mainitaan ensimmäisenä ja se on aina samassa paikassa – vieritä vain ylöspäin, jos olet alareunassa. Jos pidät pystysuuntaisesta navigoinnista etkä voi lakata rakastamasta sitä – aseta valikkosi pystysuuntaiseksi, mutta tee se vasemmalla. Luemme vasemmalta oikealle, emme päinvastoin, joten vasemmanpuoleiset elementit osuvat silmään aikaisemmin kuin oikealla.

Sanomalehtityyliset verkkosivustot jakavat tonneittain tekstejä, ja niiden on oltava käyttäjien tavoitettavissa.

7 Luokittelu

Luokkien parempi käyttö on saatavilla eniten sanomalehtisivustojen ulkoasussa . Se viittaa erityisesti blogeihin ja myös muihin verkkosivustoihin. Useimmat sivustot epäonnistuvat, koska niiden sisältö on puhtaasti järjestetty. Luokat ovat välttämättömiä, jos julkaiset usein ja eri aiheista (esim. uutissivustot).

Jaa sisältösi luokkiin ja näytä ne joko sivupalkissa tai navigointivalikkopalkissa.

8 Mainostila

Kuinka aiot ansaita rahaa ennen kuin verkkosivustostasi tulee suosittu? Mainos kertoo kuinka monet verkkosivustojen omistajat tekevät melko suuria voittoja. Mainosbannereita ei tarvitse sijoittaa vain jonnekin, vaan tämä sijainti on määriteltävä tarkasti. Oikeat paikat ovat sivupalkki, sekä vasen että oikea, ylä- tai alatunniste. Promootiobannerit näkevät usein aivan tekstiartikkeleiden keskellä, mutta tämä kohta on kiistanalainen: se on sinulle hyvä asia, joka ottaa siitä rahaa, mutta nämä elementit voivat myös ärsyttää lukijakuntaasi.

9 Toimiva sivupalkki

Sivupalkissa ei voi olla vain mainoksia, vaan sisältöluokkia, tuoretta sisältöä, hakukenttää, sähköpostin uutiskirjepalkkia, navigointia, sosiaalisen jakamisen painikkeita, alennuksia/erikoistarjouksia jne. Sanomalehden verkkosivujen ulkoasu on hyvä toteuttaa sivupalkki, koska se olisi vain toinen sarake rivillä.

Onnistuneen sivupalkin suunnittelussa on pari ainesosaa:

koko (korkeus ja paino);
värit;
fontit;
sijoitus.

Sivupalkin tulee olla pienempi tai yhtä suuri kuin asettelusi tavallinen sarake, ei mitenkään suurempi. Se tulee säilyttää neutraaleissa väreissä, mutta näkyvällä typografialla. Sijoitus voi olla sekä vasemmalle että oikealle, mutta kuten jo sanoimme, kaikki vasemmalla oleva näkyy heti.

10 Valkoisen tilan maksimointi

Toistaiseksi, kun olemme luomassa monikäyttöistä verkkosivustoa vaikuttavalla ulkoasulla, emme voi olla muistamatta tyhjää tilaa. Tämä on olennainen osa jopa sanomalehtityylistä suunnittelua. Olkoon se tilaa sarakkeiden välissä, tyhjiä osia sivuilta tai alareunasta. Käyttäjillä tulisi olla mahdollisuus kääntää katseensa pois tekstiseinältä ja miettiä asiaa.

Yleensä tyhjää välilyöntiä pidetään osiona, johon ei kirjoiteta mitään. Tarkoitus on suppeampi: tyhjä väli on tekstirivien ja kirjainten välissä, sisältöelementtien ympärillä. Se on kaikki, mikä tekee verkkosivustostasi luettavamman ja yksinkertaisemman, vaikka se on täynnä liikaa sisältökohteita.

11 Säännölliset sisällön päivitykset

Sanomalehden verkkosivujen ulkoasu velvoittaa sinua työskentelemään projektin parissa jatkuvasti. Verkkosivusto, jossa monet sarakkeet ja ruudukkoosat ovat tyhjiä, näyttää hankalalta. Sinun on täytettävä verkkosivusto perusteellisesti, ja pyrittävä päivittämään sisältöä säännöllisesti, tekemään julkaisuistasi usein ja muuttamaan esiteltyä sisältöä otsikossa (tai missä teet sen).

Sisältö ja taajuus ovat pari, kuten kuningas ja kuningatar. Sivuston ulkoasun lisäksi usein toistuva sisältö vaikuttaa tuloksiisi hakukoneissa. Ihmiset vierailevat verkkosivustollasi harvoin, jos se on vanhentunut, ja Google näkee sen. Joten sisältösi saa huonompia pisteitä hakutuloksissa.

12 Sosiaalista jakamista kannustetaan

Blogit ja uutissivustot käyttävät yleisimmin sanomalehtityyliä, eivätkä nämä sivustot voi olla olemassa ilman sosiaalisen median integraatiota. Tämä on massojen jakamisen aikakausi, ja sosiaaliset verkostot ovat siellä, missä ihmiset viettävät suuren osan ajastaan. Sinun tulisi käyttää hienoja seuranta- ja jakamispainikkeita jokaisessa verkossa: Twitter, Facebook, Google+, Pinterest, LinkedIn jne. Ainoa varoitus: älä käytä tilejä, jotka olet hylännyt, käytä vain niitä, joihin julkaiset usein. Luo nämä painikkeet näkyvimmäksi verkkosivustolla varmistaaksesi paremman visuaalisen näkyvyyden media-alustoilla.

Vielä yksi asia, jonka haluamme mainita sanomalehtien verkkosivujen ulkoasun erityispiirteistä, on reagointikyky. Tämä asettelu ei koskaan pysy samana mobiililaitteissa, eikä mobiiliversiota voi tehdä sanomalehtityyliin. Mobiilisivustolla ei saa olla usean sarakkeen sisältöjärjestelyä, ja tämä on välttämätöntä sanomalehtien verkkosuunnittelussa. Mobiilisivustolla ei voi olla sivupalkkeja. Ja navigointia on parempi harkita uudelleen, koska on hyödyllisempää tehdä mobiilisivustostasi vieritettävä klikattavan sijaan.