Koti Henkilökohtainen rahoitus Luoda kontrasti blogin suunnittelussa - dummies

Luoda kontrasti blogin suunnittelussa - dummies

Sisällysluettelo:

Video: Four Reasons Education: Block sliding tekniikka – Liukuvaa kontrastia - NINJA 2024

Video: Four Reasons Education: Block sliding tekniikka – Liukuvaa kontrastia - NINJA 2024
Anonim

Kontrasti blogin suunnittelussa tapahtuu, kun kaksi tai useampi elementti eroaa toisistaan. Mitä suurempi ero elementtien välillä, sitä suurempi kontrasti. Blogin suunnittelu voi hyötyä kontrastista muuallakin tavalla:

  • Kontrasti voi tarjota visuaalista kiinnostusta. Silmäsi on piirretty vastakkainasetteluihin, kuten vaalean kuun mustan taivaan tai muun ympäröimän korkean rakennuksen murto-osaan. Blogimuutoksessa kontrasti voi pitää blogin miellyttävän katsoa sen sijaan, että se olisi hellä ja mielenkiintoinen.

  • Kontrasti voi tehdä elementin siirtyä sivulta ja kannustaa lukijaa ryhtymään toimiin. Jos haluat korostaa painiketta, joka linkittää uuteen e-kirjaan, voit käyttää kontrastia niin, että painike erottuu silti sopivaksi kokonaissuunnitteluun.

    Pat Flynnin blogi Smart Passive Income käyttää kevyitä vihreitä laatikoita, joilla on tummanvihreä raja, jotta blogin suunnittelun tärkeät alueet erottuvat. "Älä tiedä mistä aloittaa? "Ja eBook Guide -ruudut ristiriidassa mustan videon ja e-kirjakuvan kanssa, jotta nämä elementit ponnahtaa sivulta ja kiinnittävät kiinnostusta blogiinsa.

    Luotto: © Smart Passive Income
  • Kontrasti tekee tekstistä helppoa. Oletko koskaan ollut blogissa, jossa et lukenut varsinaista blogikirjoitusta, koska taustaväri ja tekstin väri olivat liian samankaltaisia? Kontrasti on olemassa, jotta blogin postin luettavuus houkuttelee kävijöitä pysymään ja lukemaan viestisi.

    Valkoinen tausta, jossa on musta tai tummanharmaa teksti on aina turvallinen valinta tärkeimmille sisältöalueille kuten blogikirjoitukselle.

Tutki kontrastin luomistapoja

Voit käyttää kontrastia blogin muotoiluun muutamilla tavoilla. Seuraavassa on muutamia yleisiä:

  • Väri: Todennäköisesti tavallisin tapa soveltaa kontrastia on väri. Voit käyttää samaa varjostusta (esimerkiksi musta vaaleanharmaalla) tai kaksi väriä värirenkaan vastakkaisilla päillä (oranssi ja sininen). Voit jopa käyttää yhtä väriä, jotta tietyn blogin elementti erottuu, esimerkiksi kuinka punainen vapaa pikavipu-painike osoittaa vaalean vihreää taustaa vasten.

  • Fontit: Kaksi eri fonttia, jotka täydentävät toisiaan, voivat myös luoda kontrastia tekstissäsi. Esimerkiksi sans-serif -fontilla varustetun kirjoitusfontin yhdistäminen tuo visuaalista kiinnostusta.

    Voit myös käyttää kontrastia samaan kirjasimeen käyttämällä lihavoituja ja kursivointeja. Käytä vain maltillisesti. Vältä myös alleviivattua tekstiä, koska useimmat online-kävijät katsovat, että alleviivattu sana on hyperlinkki.

  • Koko: Eri kokoja sisältävien kahden tai useamman muotoilun elementtejä luo myös kontrastia.Esimerkiksi useimmat blogimallit käyttävät blogikirjoituksen otsikkoa, joka on suurempi kuin viestin sisällön alikansio.

  • Blogin sisällön sisältämät kuvat: Lisäämällä blogisi sisältöä ristiriitaa hajottamalla suuria tekstin osia ja vetämällä lukija edelleen blogiin.

Kun olet ymmärtänyt nämä tavat käyttää kontrastia, voit aloittaa yhdistämällä ne lisäämällä entistä suurempaa kontrastia, kuten kahden eri fontin käyttämistä kahdella eri värillä.

Käytä oikeaa kontrastia

Kontrasti blogin suunnittelussa voi olla hankalaa. Enemmän kontrastia ei aina ole parempi kontrasti. Ja joskus et välttämättä halua käyttää riittävää kontrastia pelkäämättä sitä liian kauas.

Liian suuri kontrasti voi olla jarruttaa lukijaan tai estää blogisi luettavuutta. Esimerkiksi valkoisella tekstillä mustalla taustalla on usein mainittu esimerkki liikaa kontrastia. Vaikka se voi toimia pieninä annoksina, kappaleen kappaleen lukeminen on väsyttävää, koska silmäsi täytyy työskennellä kovemmin tekstin lukemisessa.

Se tuottaa myös halation , valkoisten merkkien tai tekstin taipumuksen "hehkua" mustalla taustalla.

Vaikka ei välttämättä jarring, liian pieni kontrasti voi myös tehdä blogisi vaikea lukea. Esimerkiksi blogimerkinnän alanimikkeiden luominen vain lihavoidulla tekstillä ei välttämättä aiheuta alaotsikoita tarpeeksi, jos joku skimmottaa blogikirjoituksesi. (Useimmat ihmiset kuorivat.)

Tässä esimerkissä eri fontin ja toisen värin käyttö lisää tarpeeksi kontrastia siihen, miten ihmiset todennäköisesti toimivat vuorovaikutteisesti blogisi sisällön kanssa.

Kun päätät elementtien kontrastin, muista seuraavat kysymykset:

  • Mitkä ovat tärkeimmät ja toiseksi tärkeimmät toimet, joita haluat blogin kävijöitä tekemään? Lisää kontrasti korostamalla blogisi alueet, joissa lukijat suorittavat nämä toimet (kuten aiemmin mainittu Free Instant Access -painiketta).

  • Miten kontrasti voi saada tämän sisällön helposti blogin kävijöille? Joskus tekstin jakaminen valokuvilla on ihanteellinen. Esimerkiksi vaiheittaiset kuvat, joissa on täynnä kuvia, on tehokkain ja helppokäyttöinen tapa esittää nämä tiedot ja hajottaa tekstin. Jos sisältösi on käsitteellisempi kuin visuaalinen, tekstin rikkominen alanimikkeisiin, kuten on esitetty, voi olla parempi vaihtoehto.

Luoda kontrasti blogin suunnittelussa - dummies

Toimittajan valinta

Canon Rebel T3 -sarjan kamerat: ottakaa pysäytyskuva elokuvien tallennuksen aikana - dummieja

Canon Rebel T3 -sarjan kamerat: ottakaa pysäytyskuva elokuvien tallennuksen aikana - dummieja

Canon Rebel T3i: n avulla voit ottaa still-kuvan tallennuksen aikana ja voit keskeyttää nauhoituksen ottaaksesi pysäytyskuvan ilman, että poistut elokuvamoodista. Paina laukaisinta vain tavalliseen tapaan ottaaksesi kuvan. Kamera tallentaa pysäytyskuvan tavalliseksi kuvatiedostona käyttäen samaa kuvaa ...

Canon Rebel T3i: Kuinka katselet valokuvia televisiosta?

Canon Rebel T3i: Kuinka katselet valokuvia televisiosta?

Canon EOS Rebel T3i-kamera on varustettu ominaisuudella, jonka avulla voit toistaa kuvia ja elokuvia televisioruudulla. Itse asiassa sinulla on kolme toistovaihtoehtoa: Säännöllinen videotoisto: Eikö ole tehnyt hyppää HDTV: lle? Ei huolia: Voit asettaa kameran lähettämään tavallisen vakiomääritetyn äänen ja ...

Canon Rebel T3 -sarjan kamerat: Nopea tila Automaattinen tarkennus suorana näkymänä - dummieja

Canon Rebel T3 -sarjan kamerat: Nopea tila Automaattinen tarkennus suorana näkymänä - dummieja

Nimi tarkoittaa, että Nopea tila tarjoaa nopeimman automaattitarkennuksen suoran näkymän tai videokuvauksen aikana Canon Rebel T3- tai T3i-digitaalisella järjestelmäkameroilla. Se on myös samankaltainen kuin automaattitarkennusjärjestelmä, jota käytetään tavalliseen etsimen valokuvaukseen, joka perustuu samaan yhdeksän pisteen tarkennusruudukkoon. Aseta objektiivikytkin AF-asentoon. ...

Toimittajan valinta

Muokata esiasetuksia Photoshop Elements 10 - dummies

Muokata esiasetuksia Photoshop Elements 10 - dummies

, Kaltevuusvärejä ja kuvioita haluamasi ulkoasun luomiseen. Jotta voit aloittaa, Elements tarjoaa sinulle useita valmiita kirjastoja, joita voit ladata ja käyttää, kun haluat. Voit esimerkiksi ladata Harjat-kirjaston hankkimalla ...

Toimittajan valinta

Taulukon sisällön mukauttaminen sarakkeisiin ja riveihin Dreamweaverissa - dummies

Taulukon sisällön mukauttaminen sarakkeisiin ja riveihin Dreamweaverissa - dummies

Elementtien sarakkeissa ja riveissä tekee taulukosta siistin ja helppo lukea. Saavuttaminen Dreamweaveriin voi olla hankalaa, koska sinulla ei ole yhtä paljon HTML-koodia kuin sinulla on esimerkiksi Excel-ohjelmassa, jossa voit esimerkiksi kohdistaa numerot desimaalipisteeseen. Yhdessä ...

Miten elementit nivoutuvat kelluvilla Dreamweaver - dummies

Miten elementit nivoutuvat kelluvilla Dreamweaver - dummies

Tagia tai muuta elementtiä Web-sivun vasemmalle tai oikealle Dreamweaveriin ja käärittele sitten minkä tahansa tekstin tai muun sisällön ympärille. Kuva on kohdistettu sarakkeen oikealle puolelle niin, että teksti vierekkäin sen vasemmalla puolella. In ...

Miten tarkistaa CSS-yhteensopivuus Adobe Dreamweaver CS6: ssä - dummies

Miten tarkistaa CSS-yhteensopivuus Adobe Dreamweaver CS6: ssä - dummies

On tärkeää varmistaa, että Adobe Dreamweaver CS6 -mainos näyttää oikein ja johdonmukaisesti kaikkiin suosittuihin selaimiin, kuten Internet Explorer, Firefox, Chrome ja Safari. Vaikka nykyaikaisimmissa selaimissa on otettu käyttöön melko yhtenäinen tuki CSS2 (ja joitakin CSS3) ominaisuuksia, suunnittelijoiden on silti testattava sivujaan useilla selaimilla ja selaimilla ...