Blogin otsikot: 20 suurta esimerkkiä ja parhaita käytäntöjä
Yläosa on todennäköisesti blogin ensimmäinen uusi kävijä, joten se on ensimmäinen vaikutelma - mutta miksi blogin otsikko on niin tärkeä tai ainakin erilainen kuin perussivuston otsikko?
Blogin otsikot tarvitsevat lisää toimintoja. Muut verkkomallit saattavat poiketa käyttötarkoituksensa vuoksi, minkä vuoksi sivuston otsikkoon sisältyvät ja sen esittämät tiedot voivat vaihdella suuresti.
Tietenkin blogissa on kuitenkin parhaita käytäntöjä, jotka auttavat lukijaa siirtymään blogin läpi ja paremmin mukana.
Juuri tämä artikkeli tekee. Autamme sinua määrittelemään, mitä pitäisi olla osana blogin otsikkoa ja kuinka vihdoinkin se toteutetaan , ja tarkastelemme sitten kaksikymmentä mahtavia esimerkkejä, jotka tekevät juuri niin.
Jotta voisimme määritellä, miten blogin otsikko on suunniteltu ja mitä siihen tulee, meidän on kysyttävä blogista muutamia kysymyksiä:
- Millainen tunnelma on asetettava houkuttelemaan oikea kohdeyleisö?
- Miten ensimmäinen vaikutelma otsakkeen kautta ilmoittaa, mistä blogista kerrotaan?
- Miten blogin otsikko antaa ensivaikutelman, "olen erilainen kuin muut."
- Millaisia sisältöjä on heti havaittavissa paremman toiminnan luomiseksi? (klikkaamalla linkkejä, tilaamalla jne.)
Let's kaivaa hieman syvemmälle ...
Millainen tunnelma on asetettava houkuttelemaan oikea kohdeyleisö?
Kun vierailija tulee ensin minkäänlaiseen verkkosivustoon, ensimmäinen asia, jonka he määrittävät, on blogin "persoonallisuus" - ja onko heille oikein.
Tämä on välttämätöntä blogin suunnittelussa, koska blogit edellyttävät, että oikea kohdeyleisö onnistuu .
Esimerkiksi: luovan teollisuuden sisällön kanssa blogimallilla pitäisi olla luova otsikko, joka vaikutti ja innostaa tulokkaita. Tekninen tai yritysblogi haluaa suoraviivaisen, huipputason otsikon, joka on sekä esteettisesti houkutteleva että silti hienovarainen.
Miten ensimmäinen vaikutelma otsakkeen kautta ilmoittaa, mistä blogista kerrotaan?
Meillä on osa tätä kehitystä kehittävän otsakkeen yleisen tunnelman kehittäminen, mutta otsikko voi tehdä enemmän kuin mitä selventää uudelle lukijalle, mitä tämä blogi koskee.
Ensimmäinen vaikutelma havaitsee blogin persoonallisuuden, mutta mistä juuri kyse on? Yksi voi sisältää tagline, jossa on logo, joka sanoo sen tai sisältää pienen kappaleen / lauseen, joka kertoo lukijalle, mitä tämä blogi on ja kuka se on.
Kuinka blogin otsikko antaa ensimmäisen vaikutelman, "eroan toisista"?
Toinen tapa laittaa tämä on, "Kuinka tämä blogi muistetaan? ”
Jos se sekoittuu kaikkiin muihin blogeihin Internetissä, se ei ole ollenkaan hyvä blogin teema. Tästä syystä otsikko on tärkein paikka logo, tagline ja mikä tahansa muu tuotemerkki.
Yleinen ulkoasu ja sisältö, joka esitetään ensi silmäyksellä, on se, mikä tarttuu, jos se esitetään riittävän hyvin.
Millaisia sisältöjä on heti havaittavissa paremman toiminnan luomiseksi? (klikkaamalla linkkejä, tilaamalla jne.)
Otsikon pitäisi olla sisällöltään yksinkertainen, mutta sisällön sisältö voi olla läsnä helpottamaan toimintaansa. Kun uusi lukija arvioi blogin alkuperäisen vaikutelman ja päättää pysyä, he alkavat etsiä sisältöä ja mistä navigoida.
Kun luokat ovat välittömästi läsnä, katsoja etsii niitä ja etsii alueita, jotka kiinnostavat niitä. Kun hakukenttä on läsnä tai RSS-syöte, he eivät välttämättä ole tilauksia tai tekevät hakua heti, mutta he ovat tehneet alitajunnan huomautuksen sijoittelusta ja mistä löytää tulevaisuudessa.
Vaihtoehdot vaihtelevat huomattavasti tätä pidemmälle, mutta pohjimmiltaan mikä tahansa sisältö, joka on sijoitettu otsikkoon, on ensimmäinen sisältöä koskeva vaikutelma , joten sen pitäisi olla tärkein ja suunniteltu hyvin.
Katsotaan nyt muutamia hienoja blogin otsikoita ja keskustellaan sitten heidän etunsa.
1. Tutorial9
Tutorial9 sisältää lähes kaikki edellä mainitut edut. Logo ja tagline välittömästi osoittavat, mitä blogi koskee ja miten se voi auttaa lukijaa.
Ensisijaiset navigointikappaleet ovat valtavia, näkyviä välilehtiä, joiden kuvakkeet on piirretty silmään. Tämä välittömästi johtaa käyttäjän sisältöön ja edistää heitä kaivaamaan syvemmälle blogiin.
Taustasuunnittelu on luova ja jopa taiteellisen luomisen teema - täsmälleen mitä oppitunnit on tarkoitettu. Lisäksi on olennaista sisältöä oikealle, mukaan lukien RSS-syöte, hakulomake, blogin sivut ja paljon muuta.
2. Home Design Find
Tämä otsikko käyttää visuaalisen hierarkian loistavaa käyttöä saadakseen pisteen toiselle puolelle. Blogin otsikko on melkein tarpeeksi kerrottava lukijalle, mistä se on kyse, ja se edistää pysyttelemistä ja näkemystä yksityiskohtaisemmin siitä, mistä se koskee.
Silmä johtaa sitten ensimmäiseen navigointijoukkoon, jossa on noin selkeästi näkyvä sivu sekä yhteystieto. Oikealla olevat kuvat asettavat sitten mielialan ja antavat inspiraation niille, jotka ovat kiinnostuneita tästä blogin aiheesta.
Lopuksi kuvat oikealle johtavat silmän alaspäin blogin kuvaamiseen.
3. Blogin suunnittelublogi
Tämän otsikon merkittävimmät ominaisuudet ovat logo ja tagline. Tämän blogin kohdeyleisö tekee siitä entistä ainutlaatuisemman, ja uuden blogin lukemisen mukaan tämä uusi lukija näkee sen ja on vakuuttunut siitä, että se eroaa muista.
Pienempi ja pienempi teksti on lukijoiden määrä ja linkki RSS-syötteeseen, sekä ensisijainen navigointi, jotta voidaan edelleen käsitellä blogin sisältöä tai itse sisältöä.
4. Kevin John Gomez
Käsin piirretty valitus ja valokuva tekee tämän blogin teemasta henkilökohtaisen ja vastaa verkkosivuston nimeä - verkkovastaavan itse. Tämä on luovan henkilön henkilökohtainen blogi ja otsikko kommunikoi täydellisesti.
Täydellinen navigointi on otsikossa, koska se on rajoitettu navigointi ja se pystyy painottamaan sitä enemmän.
5. Naldz Graphics
Tämä otsikko tarjoaa hyvän tunnuksen ja sisällön tehokkaan käytön otsakkeessa. Suurin osa otsakkeesta on logo tai blogin nimi, ja se on helppo muistaa.
Silmä johtaa sitten navigointiin, jossa lukija voi kaivaa blogin syvemmälle heti ja siellä tai ainakin saada käsityksen siitä, mitä blogi koskee. Navigointi ja luokat ovat erinomainen tapa kertoa uusille lukijoille, mitä blogi koskee, jos ne ovat hyvin määriteltyjä.
Oikealla oleva graafinen esitys auttaa määrittämään blogin tunnelman ja myös silmää tilaajien ja RSS-linkkien lukumäärään. Kun blogi on kohtuullisen korkealla rehujen määrällä, kannattaa näyttää, että lasketaan otsikossa, koska se tavallaan vahvistaa blogin sisällön ja antaa sen uskottavuuden.
Myös ylimääräistä sisältöä on perinteisessä paikassa tämän tyyppiselle sisällölle, joten se on helposti löydettävissä.
6. Pro Blog Design
Tämän otsikon kaksi vastakkaista vihreää elementtiä ovat enemmän kuin yksi voi ajatella. Useimmat näet logon vihreällä pop-väreillä vasemmalla ensin, jossa he lukevat blogin otsikon ja otsikon. Tämä on vielä yksi hieno otsikko, joka kertoo uusille lukijoille, miten tämä blogi voi auttaa heitä.
Sitten suuret ovikokoiset välilehdet keskittyvät 1) niiden ilmeiseen kokoon ja 2) muihin vihreän värein. Toinen vihreä välilehti kertoo lukijalle, että tämä ei ole vain blogi, joka voi auttaa sinua parantamaan blogin suunnittelua, mutta se tarjoaa blogimallinnuspalveluja. Tämän lisäksi sosiaalisen median kuvakkeet, joita lukija voi ottaa huomioon myöhempää toimintaa varten.
7. Octwelve
Tämä kuvitettu luova otsikko asettaa blogin tunnelman melko nopeasti. Kuva on webmasterista ja antaa blogille henkilökohtaisen lähestymistavan. Aloitamme saada käsityksen blogin sisällöstä ennen kuin se esitellään.
Tämä malli tuo pienen johdantokappaleen suoraan otsikkoon, jossa määritellään tarkalleen mitä tämä blogi on. Päänavigointi on aivan logon alapuolella, joten se havaitaan lähes välittömästi. On myös muita yksityiskohtia otsikon sisällä, jotka ovat hauskoja ja johtavat katsojia katsomaan otsikkoa kauemmin.
8. Mark Forrester
Tämä hauska, omituinen ja luova otsikko asettaa tunnelman, ja se on ainutlaatuinen, jotta se todella kiinnittää huomiosi.
Katselija ensimmäisellä silmäyksellä tutkii välittömästi otsikkoa ja sen hienoja yksityiskohtia ja tarinaa. Siinä tulee logo ja tagline, jossa näkymä selvittää, mitä blogi koskee.
Kun pääset nauttimaan otsikosta, he voivat nähdä navigoinnin yläosassa ja sosiaaliset kirjanmerkit oikealla. Myös otsikko johtaa hienosti sisältöön, jolloin kävijä selaa alaspäin ja tarkistaa enemmän.
9. Cult-Foo
Tämä on vain kaunis otsikko, joka kerää monien lukijoiden huomion päivittäin. Tunnelma on luova ja innoittava teema, ja se houkuttelee vain oikeaa yleisöä. Tämän otsikon logo on muun otsikon "lähde" - laatikko, joka johtaa muuhun muotoon.
Hakupalkki on juuri sen alapuolella helpottamaan pääsyä ja kaksi sisältöaluetta määritellään oikealla.
Navigointi on mitä on todella hienoa tästä otsakkeesta. Se on enemmän tag-pilvi tuntuu, suurempien luokkien ollessa suurempi teksti. Tällä tavoin, kun uusi lukija näkee tag-pilven, he näkevät eniten esineitä.
Sen sijaan he muodostavat yhteyden näihin sanoihin ja blogeihin. Nyt blogissa oleva sisältö sisältää suurimman osan sen sisällöstä. Muista tarkistaa tämän sivuston live-versio: otsikkotiedoston pilvialue todella siirretään käyttäjän vierittämällä, jossa on koristeellinen mutta silti huomaamaton rajapinta.
10. Vektorit
Tämä otsikko on melko minimalistinen, mikä korostaa enemmän sisällön sisältämiä bittejä. Logo on koristeellinen ja hahmoteltu kontrastivärillä, joten se on ikimuistoinen.
Sitä seuraa tag-rivi, joka jakaa blogin sisällön ja sitten yksinkertaisen navigoinnin, joka määrittelee sen edelleen. Navigointi on loistava, koska siinä on yksittäiset kuvakkeet, jotka kiinnittävät huomiota kuhunkin, kun lukija kuulee niitä.
Hauska kuva oikealla asettaa mielialan ja johtaa silmän navigointi ylös alkuun.
11. Osapäiväinen viesti
Toisin kuin Vectips, tämä otsikko on paljon käynnissä. Vasemmassa yläkulmassa oleva logo sisältää tekstiviestin ja ohjaa sitten silmän navigointiin. Ennen kuin napsautat navigoinnin läpi, otsikko jatkaa sitä, miten verkkosivusto voi auttaa uusia kävijöitä, ja sen alla on enemmän navigointi. Tämän hierarkian kautta lukija sai vain hyvän yleiskuvan navigoinnista koko sivustolla.
Oikeanpuoleinen kuva sitten vie katsojan ottamaan huomioon RSS-syötteen, ja silmä on edelleen oikea edistämään yhtiön Facebook-fanisivu.
12. TutCandy
TutCandy-otsikon suurin piirre on sen luovat, värikkäät ja yksityiskohtaiset kuvat. Sen avulla se asettaa tunnelman ja luo uskottavuutta tällaiselle blogille. Nimi on vuorovaikutteinen värikäs kuva, ja sitä voidaan pitää logon.
Oikealla on tekstiviesti, joka selittää, mitä blogi on ja miten se on erilainen: "Ainoastaan Tastiest Design Tutorials". Huolimatta siitä, että se on ensisijaisesti yksinkertainen ja hauska sanasosa, on olemassa muutamia avainsanoja, jotka löytävät lukijan aiheuttaa myönteistä harkintaa. "Vain" - se on ainutlaatuinen, alkuperäinen, ainutlaatuinen.
Se vastaa kysymykseen "Miten tämä blogi eroaa muista?". "Tastiest" - tagline olisi voinut olla "Tasty Design Tutorials". Tämä ei ole vain outoa, mutta se ei tarkoita minkäänlaista etua verrattuna muihin suunnitteluopetusohjelmiin tai muihin tutoriaaliohjelmoihin.
Yllä, blogissa on myös navigointi ja oikealla oleva hakupalkki. Suoraan alapuolella sisältö on määritelty ja järjestetty, mikä johtaa lukijan kaivamiseen syvemmälle blogiin.
13. Yoast
Tämä blogi tarjoaa hyvän sisällön otsikossa. Ainutlaatuinen raidekehys mahdollistaa otsikon sisältävän grafiikkaa ja riittävää sisältöä yhteyden muodostamiseksi uuteen lukijaan. Hahmo ja kuva takana on yksi ensimmäisistä asioista, joita uusi vierailija huomaa, ja he tekevät hyvän puhelun luodessaan merkin otsikkosisällölle vasemmalla.
Kun silmä on johdettu otsikkosisällön, he näkevät logon ja tilaamat tilaukset tai yhteydet blogiin. Sitten se lukee aivan kuin tavallinen "sivun" sisältö, paitsi sen etusivulla esillä oleva, mikä tarkoittaa, että lukijat, jotka ovat kiinnostuneita siirtymään sivulle, tekevät henkilökohtaisen yhteyden - sen sijaan, että kaikki uudet lukijat tekevät. Sisältö selittää, mitä blogissa on kyse ja näyttää joitakin suosittuja ja esillä olevaa sisältöä.
Oikealla näkyvän kuvan alapuolella RSS-syöte on jälleen esillä, mutta tällä kertaa tunnistettavalla grafiikalla. Huomaa, kuinka tämä toinen syötteenäyttö näyttää oikealle sen jälkeen, kun lukija oli juuri lukenut jonkin sisällön otsikot, vähän tietoa ja sen jälkeen, kun he ovat jo tehneet yhteyden blogiin.
14. Se Indie Dude
Tämän otsikon merkki, kuten kaikki muut hahmojen otsikot, tarjoaa henkilökohtaisen kosketuksen ja toimii hyvänä johdana blogissa. Se on ensimmäinen asia, jonka uusi lukija huomasi, ja sen korkea laatu sekä sen ympärillä olevat suunnittelun piirteet antavat lausunnon suunnittelijan tyylistä ja siitä, mitä häneltä odottaa.
Vasemmalla on logo, joka edelleen johtaa silmiin tekstiviestillä, joka selittää blogissa esiintyvää sisältöä. Silmä on jälleen viety blogin persoonallisuuden jakamiseen.
15. Otsoni3
Tämän otsikon teema on ainutlaatuinen, ja siinä mielessä se luo unohtumattoman web-designin - todella hieno ensivaikutelma. Kun arvostamme kuvaa, silmä johtaa merkkiin muistiinpanon logolle ja sitten johtaa suoraan ensisijaiseen navigointiin ja sitten sisältöön.
Ensimmäisen kerran katsojat näkevät, että tämä blogi keskittyy web-design-portfolioon, ja he havaitsevat sen, kun he todella katselevat suunnittelijan työtä otsikossa.
Yksinkertaisuudestaan huolimatta tämä otsikko on erittäin tehokas visuaalisen hierarkian kannalta ja asettaa valtavan lausunnon katsojille.
16. nDesign Studio
Tämä värikäs otsikko on tämän verkkosuunnittelun tärkein vetovoima, ja logo kertoo kävijälle, että se on design-studio.
Hämmästyttävä otsake vahvistaa suunnittelijan taidot ja brändi. Navigointi, syötteet ja hakupalkki liittyvät hyvin yhteen otsikon kanssa, joten ne ovat yksi ensimmäisistä havaittavista elementeistä.
Pääavigointi on välilehtien muodossa, ja se tunnustetaan ensimmäisen kerran osana otsikkoa. Koska se on kuitenkin välilehtien muodossa, se näyttää olevan sidoksissa myös sisältöön, mikä tuo kävijän silmät alaspäin blogin tärkeään sisältöön.
17. Web-suunnittelija-seinä
Tämä on toinen hieno blogi Nick La: n nDesign Studiosta, ja näemme samanlaisen tekniikan: hämmästyttävä suuri tausta / otsikko, jolla vahvistetaan suunnittelijan kykyjä ja asiantuntemusta. Logo on suurempi täällä, ja se sisältää viitoituksen, joka yhdistää blogin nimen sen tarkoitukseen.
Muut otsakkeen sisältö ovat alkuvalikko, yhteyshenkilö / RSS ja hakupalkki. Ne kaikki on sisustettu samalla tavalla kuin otsikko, joka yhdistää ne.
Näillä elementeillä on myös samankaltaisia piirteitä sisältöön (selkeämpi tausta, paperimainen rakenne), joten he tuntevat myös, että he ovat myös osa sisältöä. Tämän osan otsikko yhdistää aloitusotsikon sisällön alueelle.
18. Ma.tt
Näyttäisi olevan lopullinen web-suunnittelusääntö, jotta otsikot eivät muodostu yli 200-250 pikseliä. Tämä on hyvä sääntö, jota noudatetaan monesta eri syystä, mutta tämä otsake osoittaa, kuinka tehokkaasti rikkomaan sääntö.
Koska hän ei näytä mitään sisältöä alusta, Matt käyttää hänen malliaan saadakseen suurimman vaikutelman ensimmäisestä katselusta. Sen elegantit yksityiskohdat ja luovat tavat luovat ikimuistoisen ensimmäisen vaikutelman.
Logo on suuri, ja koska verkkosivusto on nimi, se olettaa henkilökohtaisen blogin aseman. RSS-syöte on myös vasemmassa yläkulmassa, kertoo katsojalle, että se on todellakin blogi alusta alkaen. Lopuksi, navigointi on viimeinen näkyvyys, ja tämä aiheuttaa kävijää jatkamaan blogin kautta.
19. Pixel Resort
Tämän otsikon yksityiskohtainen kuvaustyyli tekee hauska, silti puhdas ja ammattimainen. Se on jopa animoitu, kun kohtaus menee päivällä ja yöllä, muistuttaa kävijää katsomaan takaisin ylös header, jossa on logo (tuotemerkki) ja navigointi. Tämä menetelmä voi helposti edistää enemmän toimintaa blogissa.
Alivalikon alla olevan navigoinnin alapuolella on alivalikko, jossa on nuoli, joka "liittää sen" muuhun otsikkoon. Se auttaa määrittelemään luokkia edelleen ja auttaa lukijaa löytämään aiheen, joka kiinnostaa heitä parhaiten.
20. Webdesigner Depot
Ahh, kyllä - blogi jota parhaillaan katselet. Olitpa ensimmäinen kerta kävijä tai olet lukenut Webdesigner Depotia pitkään, otsikko varmasti kiinnittää huomiota.
Mikä on hienoa tästä otsikosta, se ei ole vain otsikko, jolla on luova vetoomus, mutta sen sisällä olevat elementit osoittavat, että se on otsikko, jolla on luova vetoomus, joka keskittyy tietokoneisiin tai verkkoon. Laptop-kuvat, "www." Ja muut teknologiat tuovat esille tarkemmin kohdeyleisölle.
Headerilla ei todellakaan ole paljon sisältöä, paitsi linkki takaisin kotisivulle. Kuitenkin, koska se on niin monimutkainen, kaikki lisäominaisuudet saattavat hämätä suunnittelun ja tehdä siitä liian täynnä.
Tämä otsikko on vain täydellinen: tunnelman asettaminen, katsojan innostaminen ja se on tarpeeksi lyhyt, että se johtaa katsojan alas muuhun sisältöön.
Käärimistä
Toivottavasti tarkastelemalla näitä kaksikymmentä esimerkkiä voi auttaa paljon paremmin määrittelemään tämän artikkelin alussa esitetyt kysymykset ja auttamaan jokaista web-suunnittelijaa kiinnittämään enemmän huomiota blogien otsikoihin.
Sisällysluetteloon sisällytettävä sisältö voi vaihdella suuresti blogista blogiin, ja on tärkeää pitää mielessä blogin tavoitteet, teema ja mitä ensimmäistä kertaa kävijä etsii vierailtaessa blogissa.
Kirjoitettu yksinomaan WDD: lle Kayla Knight .
Voit jakaa omia vinkkejä otsikkosuunnitteluun sekä muita esimerkkejä.