A színek egyszerűen nagyszerű választás. Színkombinációk a webdesignban

Sok cikk született a színelméletről és annak jelentéséről. A színek fontos szerepet játszanak a tervezésben, és időnként akár az emberek viselkedését is befolyásolhatják. Bármely webdesigner tudja, hogy a megfelelő színséma befolyásolhatja az oldal népszerűségét, mivel a színelmélet szerint tervezett weboldalak jó benyomást keltenek a felhasználókban.

Sok tervező azonban a színkombinációk kiválasztásán gyakran elfelejti, hogy nem mindenki érzékeli a színeket egyformán. Kevés ember van színvak, ezért a webhely megtervezésekor ügyelnie kell a színvak felhasználókra. Valójában előfordulhat, hogy egy nagyon szépen megtervezett webhely egyszerűen nem működik a felhasználók ezen kategóriája számára, mivel nem fognak tudni navigálni rajta. És ez valóban probléma: a férfiak körében a színvakok aránya elérheti a 8% -ot, a nők körében pedig körülbelül 1%. Ezért jobb, ha nem kockáztatja a közönség 9%-ának elvesztését, és úgy válassza ki a webhely színsémáját, hogy azt általában minden ember észlelje, beleértve a színvakat is.

A SZÍNELMÉLET JAVÍTHATJA A HELYSZÍN ELÉRHETŐSÉGÉT

Az oldal elérhetősége nagy jelentőséggel bír, mivel közvetlenül befolyásolja a népszerűségét. Az akadálymentesítésnél általában azt jelenti, hogy egyszerű és tiszta felület. De a színséma is befolyásolja a felhasználói élményt. És ha olyan tervezést hoz létre, amely nem veszi figyelembe a különféle látássérült emberek igényeit, akkor ez a tapasztalat negatív lesz, ami elfogadhatatlan. Számos oka van annak, hogy miért kell körültekintően dolgoznia a webhely színes hozzáférhetőségén:

  • A megfelelő színséma versenyelőnyt jelenthet. Ha az oldal kialakítása színvakbarát, és nincs versenytárs oldala, akkor további közönséget vonzhat maga mellé.
  • Az elérhető színekkel rendelkező webhelyek előrébb helyezkedhetnek el a keresőkben
  • Egyes országokban az oldal rossz tervezése jogi lépésekhez vezethet, mivel egy ilyen webhely nem biztosít egyenlő esélyeket a látássérült emberek számára
  • Egy etikai szempont is fontos: a színvakok egyes oldalakat nem használhatnak teljes mértékben, és ez nagy probléma számukra. Ezért mindig emlékeznie kell az UX-re

A fentiek ellenére nem olyan nehéz egy webhelyet elérhetővé tenni azok számára, akik nem tudnak bizonyos színeket megkülönböztetni. Csak helyesen kell használnia a színelméletet, és ne felejtse el a fontos elemek kontrasztját.

HOGYAN KÉSZÍTSÜK NAGY ELÉRHETŐSÉGŰ WEBOLDALT

Természetesen lehetetlen feladat egy olyan webhely létrehozása, amely a felhasználók minden kategóriája számára kényelmes lesz. És mindenekelőtt azért, mert nehéz pontosan meghatározni, hogy a színvakok hogyan látják ezt vagy azt a színt. De ez még nem minden: azok, akik nem színvakok, kicsit másképp látják a színeket. Sok kutatást végeztek annak kiderítésére, hogy az emberek pontosan hogyan különböztetik meg a színeket különböző típusok színvakság. De ezek a vizsgálatok nem adtak pontos eredményt, így továbbra is nyitott a kérdés, hogy pontosan hogyan lát egy színvak.

Az oldal tervezésével kapcsolatos munka megkezdésekor azonnal gondoskodnia kell a navigációs elemek és a tartalom színes láthatóságáról. Ennek számos módja van, és a legelső az, hogy kontrasztos színeket használunk a hátterekhez és a fontos tervezési elemekhez. Például, ha fekete szöveget használ fehér alapon, a tartalom minden felhasználó számára elérhető lesz. De a fekete és a fehér nem mindegyik „biztonságos” szín – sokkal több van. Csak arra kell ügyelnie, hogy a hivatkozások, gombok és egyéb tervezési elemek láthatóak legyenek, és kitűnjenek a háttérből.

MILYEN SZÍNEKET HASZNÁLJON?

A színvak akadálymentesített weboldal létrehozásának legelső lépése a színpaletta kiválasztása. A tervező feladata ebben az esetben a sikeres színkombinációk kiválasztása, amelyek kontrasztos árnyalatokat tartalmaznak, és színhierarchiát biztosítanak.

Ebben az esetben óvatosnak kell lennie, és meg kell próbálnia nem használni néhány árnyalatot. A legtöbb színvak nehezen tudja megkülönböztetni a piros/zöld és a sárga/kék kombinációkat. Íme néhány veszélyesebb színkombináció:

  • barna/zöld
  • zöldes-kék
  • lila/kék
  • szürke/kék
  • zöld/szürke
  • fekete zöld
  • sárga/világoszöld

Mint látható, ezek a színkombinációk nem túl kontrasztosak, ezért a látássérültek számára megkülönböztethetetlenek lehetnek. Ezért jobb, ha nem használ olyan árnyalatokat a tervezésben, amelyek túl közel vannak egymáshoz a színkörön. Például tompa sárga és kék, amelyek nagyon rosszul különböznek egymástól.

Mindig emlékezni kell arra, hogy a színvak embereknek mindig jól meg kell különböztetniük a színeket, és nem számít, milyen színeket látnak - csak világossá kell tenni a színvak számára, hogy mit lát különböző színek. Arra is figyelni kell, hogy a színvakok jobban érzékelik az élénk színeket, és szinte nem látják a különbséget a tompa árnyalatok között.

KIEGÉSZÍTŐ ÁRNYÉKOK

A színkörön egymással szemben elhelyezkedő kiegészítő árnyalatok jobb kontrasztot biztosítanak, és javítják a tervezés hozzáférhetőségét. Meg kell jegyezni, hogy annak ellenére, hogy a zöld és a piros egymást kiegészítő árnyalatok, ezt a kombinációt nagyon óvatosan kell használni, mivel a színvakok ezeket a színeket rosszul különböztetik meg.

Mint tudják, egyes árnyalatok melegek, mások pedig hidegek. Ez a színséma kiválasztásakor is használható. A meleg színek hideg színekkel kontrasztjával vonzó és egyben hozzáférhető dizájnt hozhat létre. A színek kiválasztásakor azonban ne feledkezzünk meg a kontrasztról: például használhat sötét hideg árnyalatot világosabb meleg színnel kombinálva.

MONOKROM PALETTA

Amikor a rendelkezésre álló színsémán dolgozik, mindig meg kell győződnie arról, hogy a sikertelen színpárokból származó elemeket nem használják a közelben. A biztos színvak-barát oldal elkészítéséhez pedig a legjobb, ha monokróm palettát használunk. Nem számít, hogy a felhasználó hogyan érzékeli a színt - csak a kontrasztra fog összpontosítani. Ezenkívül a monokróm ma divatos, az ilyen palettákat manapság nagyon gyakran használják a minimalista kialakítású webhelyeken.

ESZKÖZÖK A SZÍNPALETTA KIVÁLASZTÁSÁHOZ

A Vischeck egy szimulátor, amellyel tesztelheti a weboldalak színvak hozzáférhetőségét. Ezzel az eszközzel megtudhatja, hogy a különböző típusú színvakságban szenvedők hogyan látnak egy adott webhelyet, és szükség esetén gyorsan módosíthatják a designt.

nagy és nagyon hasznos forrás, amely sok fontos információ a színvakság természetéről, típusairól és jellemzőiről. Az oldalon tesztek is találhatók színvak felhasználók számára, valamint eszközök a webhely színellenőrzéséhez.

Egy másik eszköz a weboldalak online ellenőrzésére a színvak hozzáférhetőség szempontjából. Ellenőrizheti, hogyan érzékelik a 216 színből álló palettát a különböző típusú színvakságban szenvedők.

KÖVETKEZTETÉS

Természetesen az oldal elérhetősége nem csak a színvilágától függ. Igen, az oldal legyen elérhető látássérültek számára, de ami a legfontosabb, hogy minél több ember számára elérhető legyen. több felhasználókat. De mindig emlékezzen a színekre, és folyamatosan ellenőrizze, hogy a színpaletta nem tartalmaz-e problémás színkombinációkat.

A szerzőtől: A szín a webdesign legfontosabb eleme. Ez egy kis trükk, amely nemcsak a webhelyen tartja a felhasználót, hanem bizonyos műveletek végrehajtására is irányítja. A tény az, hogy a webdesign különböző színei tudatalatti szinten különböző érzelmeket válthatnak ki, és ezek az algoritmusok az ókorban az emberi természettel való interakció eredményeként alakultak ki.

Sok fejlesztő sok időt tölt azzal, hogy nyelvi támogatást készítsen egy webhelyhez. Arra azonban kevesen gondolnak, hogy a színek milyen szerepet játszanak életünkben. Mégis, a termékválasztással, a hivatkozásra kattintással, a gombra kattintással stb. kapcsolatos döntéseink több mint 90%-a kizárólag a színen alapul. A webdesign aktívan használja ezt az eszközt, hogy felkeltse a felhasználó figyelmét, és interakcióra ösztönözze.

Éppen ezért olyan fontos, hogy ismerjük a színezés alapelveit és irányzatait a webdesignban, amelyekről mai cikkünkben kitérünk. És kezdjük egy zseniális, véleményem szerint színegyenlettel.

Johannes Itten egyenlet

Johannes Itten svájci művészt tudományos körökben a klasszikus és kortárs művészet színelveinek legnagyobb szakértőjeként ismerik. Sokáig tanulmányozta a különféle természeti tárgyak színpalettáját, valamint minden idők és népek műalkotásait.

Johannes Itten színegyenlete így néz ki:

Ennek a tizenkét részből álló körnek a referenciapontjai vagy színei a piros, sárga és kék. Körbe írunk egy elsőrendű színháromszöget, amelyre hatszöget építünk. A második sorrend minden színét az első szint két színének kombinálásával kapjuk. Így kapjuk:

Narancs = sárga + piros

Zöld = kék + sárga

Lila = kék + piros

A harmadik szint színét az első és a másodrendű tónusok keverésével kaphatjuk meg. Így világos hierarchia uralkodik a színpalettán.

Kontraszt és összehasonlítás

Az agy és a szem csak kontraszttal és összehasonlítással képes egyértelműen megkülönböztetni a színárnyalatokat. Nem titok, hogy egy fekete négyzet fehér alapon kisebbnek tűnik, mint ugyanaz a négyzet fekete alapon. Így a fekete szín csökkenti a méretet, míg a fehér képes kitágulni és túllépni.

Hétféle kontraszt-összehasonlításra is érdemes odafigyelni. Természetesen fekete és fehér színek a sötét és a világos kontrasztja a legkifejezettebb. A kék, piros és sárga azonban erős kontrasztos párokat is alkot.

Az egyes színpárok kifejezőképessége a webdizájnban különböző módon nyilvánul meg. A színkontraszt típusairól bővebben a "Színek kombinálása a webdesignban mint" című cikkben fogunk beszélni hatékony eszköz Marketing".

Modern trendek és megközelítések a webfejlesztésben

Tanulja meg a gyors növekedés algoritmusát a nulláról a weboldalkészítés során

Színek elnémítása kontraszttal

Véleményem szerint a kontrasztos webszínek a minimalista dizájnban működnek a legjobban. Például a Studio Stylistik webhelye türkiz elemeket használ fekete alapon. Minden egyes türkiz elem (logó, szöveg, kép), amely a fekete háttér előtt érezhetően kiemelkedik, jelentősen erősíti a grafikát, meghatározóvá teszi.

Kiemelkedő szöveg

Az élénk színek segítségével a webdesignban bizonyos szavak kiemelhetők. Ez különösen igaz halvány háttér esetén. A világos szövegválasztás befolyásolja az üzenet érzékelését, bizonyos hangsúlyt ad annak.

A következő példában a „Szerelem” szót vizuálisan hangsúlyozzuk, ami jó cselekvésre ösztönző a „Regisztráljon most!” gomb azonos színével kombinálva.

Így az élénk kontrasztos színek használatával mesterséges interakciót hozhat létre a gombok és az oldal egyéb elemei között, felhívhatja a felhasználó figyelmét a gombra, és általánosságban javíthatja a használhatóságot.

Ebben a példában a nem feltűnő háttérszín összeolvad a termék színével, kiemelve a narancssárga gombot, és vonzóbbá teszi a műveletet a felhasználó számára.

Kedvező színkombinációk

A legjobb szín meghatározásához webhelye webdizájnjában mindenekelőtt elemeznie kell a célközönséget, másodsorban pedig alkalmazkodnia kell annak lehetséges preferenciáihoz. Ha közönsége szerte a világon elterjedt, próbáljon meg helyi webhelyeket létrehozni.

Mik a színkombinációk titkai? Vegyük például a tőzsdét. Japánban, az Egyesült Királyságban és az Egyesült Államokban a negatív gördülő diagram indikátora piros, a pozitív pedig kék vagy zöld.

De Koreában és Tajvanon a színpreferenciák közvetlenül ellentétesek. Ez annak a ténynek köszönhető, hogy ott a piros szín a szerencsét és a jólétet szimbolizálja.

Így a színséma kiválasztásakor a különböző kultúrák jellemzőire kell összpontosítani. Ehhez meg kell vizsgálnia a színérzékelés legapróbb részleteit is egyik vagy másik ember, egy felhasználói csoport, egy adott személy által.

A szín érzelem

A színérzékelés korántsem univerzális nyelv, azonban vannak olyan webdesign-színek, amelyek hatása előre jelezhető.

Elgondolkozott már azon, hogy a kórházi személyzet miért van semleges fehér vagy tompa pasztell egyenruhában?

Egy ilyen választás nem nevezhető véletlennek. A lágy zöld, kék, lila tónusok megnyugtatják, ellazítják és megnyugtatják a betegeket. Vegyük például egy orvosi főiskola honlapját. Tekintse meg a webhely négy színét. Neked melyik tetszik a legjobban?

Általában a fekete szigort és professzionalizmust jelent, de orvosi kontextusban a halálhoz kapcsolódik. A vörös a vér színe, ezért orvosi helyszínre szintén nem nagyon alkalmas, sérülésekre utal, nem rehabilitációra. A zöld és a kék jól működhetne. De látod, a kék itt inkább „témához tartozik”, a zöld végül is túl világos ehhez a témához.

Végül

Ha Ön a kezdő webdesignerek kasztjának tartja magát, és még mindig nincs megfelelő tapasztalata és ízlése a színek kiválasztásában, azt tanácsolom, hogy tekintse meg a megfelelő videó tanfolyamokat, amelyek érthető nyelven vannak, valós példák, megmondja, hogyan válasszon harmonikus színsémát, valamint kezelje az emberi figyelmet a színek és a webdesign egyéb összetevői segítségével.

Ezzel elköszönök. Iratkozzon fel blogfrissítéseinkre, és maradjon naprakész a webdesign és webfejlesztés területével kapcsolatos összes hírrel. Amíg újra találkozunk, barátaim!

Modern trendek és megközelítések a webfejlesztésben

Tanulja meg a gyors növekedés algoritmusát a nulláról a weboldalkészítés során

A szín minden bizonnyal fontos érzelemforrás. A színek megadhatják a megfelelő hangot és közvetíthetik a szükséges érzelmeket a látogatók felé, felizgathatnak, sok érzést kiválthatnak, cselekvésre ösztönözhetnek. Ez egy rendkívül erős felhasználó befolyásoló tényező.

A helyszín színsémájának kiválasztásakor fontos, hogy azt helyesen végezze, a színelmélet alapelvei alapján. A cikk bemutatja a kiválasztás legfontosabb szempontjait, a kombináció alapelveit, a színek webdesignban betöltött célját és szimbolikus jelentését. Ezen kívül látni fogsz több jó példákösszhangban az uralkodó színekkel, valamint ismerkedjen meg néhány hasznos tippeket hogy a színeket hatékonyan használjuk a weboldal készítése során.

Szóval, ismerkedjünk meg a színek varázslatával...

Színelmélet: alapelvek. A színek összehangolásának képessége

Akkor jó, ha van ízlésed, és könnyen kiválaszthatod az oldal színvilágát. Nem minden ember tudja ezt könnyen megtenni. Azok számára, akik nem tudják, hogyan kell helyesen kombinálni a színeket weboldal készítésekor, azt javaslom, hogy ismerkedjenek meg a színelmélet alapjaival.

Vegye figyelembe a színkört.

Egy kis történelem: A színkört Isaac Newton találta fel. Miután 1666-ban alátámasztotta a fény- és színelméletet. Ő volt az alapja a modern optika kialakulásának és fejlesztésének, amelynek kicsi és szerves része a webdesign. Newton háromszögű üvegprizma segítségével hét színre (spektrumra) bontotta a fehér fényt, bizonyítva ezzel annak összetettségét (diszperziós jelenség), kromatikus aberrációt fedezett fel.

A színkör számos tervező és művész nélkülözhetetlen tulajdonsága szerte a világon. Ez a tökéletes bizonyítéka annak az elméletnek, hogy a zseniális mindig egyszerű. A kör lehetővé teszi olyan színek kiválasztását, amelyek egymással harmonizálnak. 6 alapszínből áll: piros, narancs, sárga, zöld, kék, lila és másodlagos szín.
A megfelelő színséma megtalálásához bármely két színt kell használni, amelyek egymással szemben vannak, vagy három, egyenlő távolságra lévő színt háromszög kialakításánál, vagy a négy szín bármelyikét, amelyek téglalapot képeznek (két színpár egymással szemben). A színsémák az elforgatási szögtől függetlenül helyesek maradnak.

Elsődleges színek
Három elsődleges szín létezik: piros (#ff0000 HTML-ben vagy #F00 CSS-ben), sárga (#FFFF00 HTML-ben vagy #ff0 CSS-ben) és ciánkék (#0000FF HTML-ben vagy #00f CSS-ben). Más színek keverésével nem érhetők el. E három szín kombinálásával komplementer színek alakíthatók ki.

Kompozit színek
Három fő is van: narancssárga (HTML-ben #ff9900 vagy CSS-ben #F90), zöld (HTML-ben #00FF00 vagy CSS-ben #0f0) és lila (HTML-ben #FF00FF vagy CSS-ben #f0f). Vörös és sárga (narancs), sárga és kék (zöld), valamint kék és piros (lila) összekeverésével kaphatod meg őket.

Harmadlagos színek
A harmadlagos színek valamelyikének eléréséhez össze kell keverni egy alapszínt és egy másodlagos színt. A harmadlagos színek lehetőségei végtelenek.

További színek
A komplementer színek közvetlenül egymással szemben helyezkednek el a színkörön: piros és zöld, kék és narancs, lila és sárga. Egymással kombinálva feltűnő kontrasztot alkotnak. Az ilyen kombinációkat általában a webhely bizonyos elemeinek kiemelésére használják.

Hasonló színek
Ezek a színek egymás mellett helyezkednek el a színkörön. Általában nagyon jól néznek ki együtt. Az ilyen színkombinációk használata kényelmes érzést kelt a webhely látogatóiban.

Színek a különböző kultúrákban: szimbolizmus

A webhely gamma kiválasztásakor figyelembe kell vennie azt a tényt, hogy a színnek sokféle jelentése lehet a különböző kultúrákban. A színszimbolika kulturális aspektusa nagyon erős lehet, ezért tisztában kell lennie azzal, hogy mi a webhely közönsége.
Nézzük meg, mit jelentenek a színek a különböző kultúrákban:
  • Kína: a menyasszony színe, sok szerencsét, ünnepeket
  • India: tisztaság
  • Dél-Afrika: gyászszínek
  • Kelet: öröm (fehérrel kombinálva)
  • Nyugat: izgalom, szerelem, szenvedély
  • USA: Karácsony (zölddel), Valentin-nap (fehérrel)
  • héberül: áldozat, bűn
  • Japán: élet
  • Kereszténység: áldozat, szenvedély, szeretet
  • Feng Shui: Yang, Tűz, Szerencse, Tisztelet, Védelem, Vitalitás, Pénz, Elismerés
  • Európa: nyugodt
  • Irán: gyász, az ég színe és a spiritualitás
  • Kína: halhatatlanság
  • Hinduizmus: Krisna színe
  • Judaizmus: Szentség
  • A kereszténység: Krisztus színe
  • Katolicizmus: Mária ruháinak színei
  • Közel-Kelet: Védelem
  • A világban: a biztonság színe
  • Feng Shui: Yin, Víz, Nyugalom, Szerelem, Gyógyítás, Relaxáció, Bizalom, Kaland
  • Nyugat: szomorúság, depresszió
  • Európa: boldogság, remény, öröm, veszélyben lévő gyávaság, gyengeség
  • Ázsia: a birodalmi szín
  • Egyiptom: gyász
  • Japán: Bátorság
  • India: kereskedők
  • Buddhizmus: bölcsesség
  • Feng Shui: Yang, Föld, szerencsés, napsugarak, hőség, mozgás
  • Európa: ősz, aratás, kreativitás
  • Írország: protestánsok (vallási)
  • USA: Halloween (feketével), olcsó áruk
  • Hinduizmus: sáfrány (barack narancs) szent szín
  • Feng Shui: Yang, Föld, célok, növeli a koncentrációt
Barna
  • Kolumbia: az értékesítés akadálya
  • Ausztrál őslakosok: a föld színei, ünnepélyes okker
  • Feng Shui: Yang, Föld, Ipar
Zöld
  • Japán: élet
  • Iszlám: remény, erény
  • Írország: az egész ország szimbóluma
  • Európa / USA: Tavasz, új születés, Szent Patrik napja, karácsony (pirossal)
  • USA: pénz
  • India: Iszlám
  • Feng Shui: Yin, fa, gyógyítás, egészség, nyugtató
Ibolya
  • Thaiföld: gyász (özvegyek)
  • Katolicizmus: halál, gyász, keresztre feszítés
  • Feng Shui: Yin, a testi és lelki gyógyulás színe
fehér
  • Európa: házasság, angyalok, orvosok, kórház, béke
  • Japán: a gyász, a fehér szegfű a halált jelképezi
  • Kína: gyász, halál,
  • India: szerencsétlenség
  • Kelet: temetés
  • Feng Shui: Yang, fém, halál, szellemek, gyász, egyensúly, magabiztosság
Fekete
  • Európa: gyász, temetés, halál, lázadás, nyugalom
  • Thaiföld: szerencsétlenség, gonosz
  • Judaizmus: szerencsétlenség, gonoszság
  • Ausztrál őslakosok: az emberek színe
  • Feng Shui: Yin, víz, pénz, karrier siker, jövedelem, stabilitás, érzelmi védelem, erő

A színek jelentése

Vessünk egy pillantást az egyes színekre, és nézzünk meg néhány kész megoldást.

Főleg szenvedéllyel, bátorsággal és vággyal társul. A piros a szeretet, az erő, az energia, a vezetés és az izgalom színe. Ez egy erős szín, és tisztában kell lennie néhány negatív érzelmével: veszély, szorongás.

Türelem, béke, nyugalom, megbízhatóság, szeretet, stabilitás. Az egyik legkedveltebb szín, különösen a férfiak számára. Összefügg a stabilitással és mélységgel, a professzionalizmussal, a bizalommal.

A szín leggyakrabban az élénkséggel társul. Energikus, boldogságérzetet ad. Emellett kíváncsisággal, szórakozással, örömmel, intelligenciával, óvatossággal társul.

Vidámság és kreativitás. A barátságossággal, magabiztossággal, játékossággal, bátorsággal, kitartással társul.

Ibolya
Hagyományosan a hatalommal, a nemességgel és a gazdagsággal társították. Bölcsesség, függetlenség, nemesség, luxus, ambíció, méltóság, mágia és titkok.
  • Optimális színszám. Ne tegye a webhelyét cirkuszsá.
  • Használja a szükséges számú színt. A színek minimális száma hozzájárulhat webhelye fakóságához.
  • Ha látogatót kell vonzani, használjon intenzív színeket.
  • A természethez közelebb kerülve találhat kiegészítő színsémákat.
  • Hasznos Linkek

    A színek óriási szerepet játszanak a webdesignban. A webhely színsémájának helyes kiválasztásához speciális szolgáltatások állnak rendelkezésre. Biztos vagyok benne, hogy minden webdesignernek van legalább egy a könyvjelzőjében.

    Néha leülsz és azon gondolkozol, hogy melyik kék árnyalatot válasszuk az oldal fő árnyalatának, egy kicsit világosabbat vagy kicsit világosabbat, esetleg sötétebbet... És még mindig fel kell vennie a továbbiakat. Természetesen szemmel is megteheti, de jobb, ha valamelyik speciális szolgáltatást használja.

    Nem beszélek színelméletről (ez túl terjedelmes információ), hanem egyszerűen közzéteszem a könyvjelzőim között szereplő és általam használt szolgáltatásokat.

    Évek óta barátkozom ezzel a hangszerrel. A legkényelmesebb eszköz a színek kiválasztásához (szerintem). Neki sok van további jellemzők. Például láthat egy példát egy világos és sötét oldalra a kiválasztott színekkel.

    Kiértékelhető, hogy a színvak és más látássérült emberek hogyan látják majd az Ön színsémáját. Választhat webbiztos színeket.

    Az Adobe Kuler a második internetes eszköz, amelyet elég gyakran használok. A színvilág választéka szinte ugyanaz, mint az előző oldalon, de én nem ezért szeretem. Amellett, hogy saját maga is létrehozhat színsémákat, megtekintheti és használhatja a mások által létrehozott sémákat.

    Ehhez kattintson a bal felső menü "Megtekintés" gombra. És látni fog egy galériát mindenféle színkombinációból.

    Ez az eszköz egy kicsit hasonlít a Colorscheme-hez, de kevesebb funkcióval rendelkezik, de látható, hogyan fognak kinézni a színblokkok.

    Alig használom ezt az oldalt, de mivel már benne van a könyvjelzőim között, úgy döntöttem, hogy hozzáadom.

    A következő két webhely palettát hoz létre az Ön által választott képből. Ez varázslat :)

    Kiválaszt egy olyan képet, amelynek színei tetszenek, a szolgáltatás elemzi, és színpalettát ad. Ez a két oldal csak abban különbözik, hogy miként lehet őket képpel ellátni.

    Ennek az oldalnak szüksége van Letöltés képet a számítógépéről.

    Nagyon praktikus színválasztó. A "tetszik - nem tetszik" elve alapján.

    flatcolors.net

    Ahogy a név is sugallja, itt választhat színeket a most divatos, lapos dizájnhoz. Az oldal érdekessége, hogy palettát választva Corel és Photoshop programokhoz is letölthető.

    materialpalette.com

    Egy másik divatirányzat az anyagdizájn. Ez az oldal segít kiválasztani a UI (felhasználói felület) színkombinációit. Ezenkívül a webhelyen számos ikon található.

    08/18/16 28,2K

    A webhely színsémájának kiválasztásának feladata lehetetlennek tűnhet, különösen, ha nem érti és nem túl jó a színkombinációkban:


    Ha minden jól megy, webhelye harmonikusan fog kinézni. Ha nem, horrorfilm stílusú képet kapsz!

    Ha egyáltalán nem használ színt a webhelyén, az nem lesz vonzó, és gyorsan elfelejtődik. Ha túlzásba viszi a színeket, az oldal rikítónak tűnik.

    Ki kell választania a megfelelő sablont és színpalettát a jövőbeli webhelyhez. Ez a két feladat lehet talán a legnehezebb az oldal létrehozásakor.

    Ha csak néhány szabályt ismer, a színek kiválasztása nem lesz olyan nehéz.

    A cikk elolvasása után megtudhatja, hogyan:

    • Válassza ki az oldalnak és a személyes márkának leginkább megfelelő színt;
    • Hogyan kombináljuk a tónusokat a harmonikus színséma érdekében;
    • Válassza ki a legjobb háttérszínt;
    • Csak szükség esetén használjon színes ékezeteket.

    Hogyan befolyásolja a szín a webhely és a márka megítélését?

    Ha megkérlek, hogy gondolj a Coca-Colára, mi jut először eszedbe? Valószínűleg a Coca-Cola piros logója fog felbukkanni a képzeletében:


    Elég nehéz erre az italra gondolni, és nem társítani a vörös színhez. A vörös olyan erősen kötődik a márkához, hogy ugyanolyan fontos, mint maga a híres ital.

    A piros szín a színsémában két fontos üzenetet hordoz:

    1. Az élénkpiros címkék igazán kitűnnek a többi közül az üdítőpultokon.
    2. Minden szín bizonyos érzelmeket vált ki. Amikor vöröset látunk, tudat alatt izgalom, szerelem és szenvedély van bennünk. A Coca-Cola ezeket az érzéseket akarja kiváltani italaival:
    Ha a megfelelő színsémát választja ki webhelye számára, akkor nem csak látványossá teszi azt, hanem egy emlékezetes márkát is létrehozhat.

    A vásárlók 85%-a elismeri, hogy a termék megvásárlásának fő oka a színe volt.

    A márka ismertsége 80%-kal növekszik színek használatakor.

    3 lépés a megfelelő színhasználathoz a webhelyen

    A weboldal tervezésénél a következőkre van szüksége:

    • Válassza ki a márkájának uralkodó színét;
    • Válasszon néhány hangsúlyos árnyalatot a színséma létrehozásához;
    • Válasszon egy háttérszínt a tervezés befejezéséhez.

    1. A domináns szín kiválasztása

    A márkája domináns színe vörös, mint a Coca-Cola? Segít kiváltani a szükséges érzelmeket az erőforrás látogatóiban, izgalom, szerelem és szenvedély érzését váltja ki az emberekben.

    Ez a szín az első dolog, amire az embereknek gondolniuk kell, amikor a cégedre gondolnak. Ha már van logója, győződjön meg arról, hogy az tartalmazza a márkája fő színét.

    Hogyan válasszuk ki a megfelelő színt

    A nagy cégek nem véletlenül választanak egyik vagy másik színsémát az oldalhoz. Ez egy tudatos választás, amely része a márkaépítésnek és a marketingnek.

    Mindegyik szín más-más vásárlói csoportot vonz, és akár választásukat is befolyásolhatja.:


    Piros-narancs, fekete és élénkkék vonzzák az impulzív vásárlókat. Ilyen színsémákat gyakran találhatunk gyorsétterem-láncokban, ruhaüzletekben és ajándéktárgyakban.

    A sötétkék és a türkiz korlátozott pénzösszeggel vonzza a vásárlókat. Ezek a színek megtalálhatók a bankokban és a nagy áruházakban.

    A bíbor, az azúrkék és a rózsaszín vonzza a klasszikus vásárlókat. Ruhaboltokban gyakori.

    Használja a különböző színek kombinációit, hogy megnyerje a szükséges vásárlókat.

    Kifejezetten vizuális színséma infografikát hoztunk létre, hogy megkönnyítsük a márkája domináns színének kiválasztását:

    Milyen színt használjon webhelyén?

    A zöld a gazdagságot, az egészséget, a nyugalmat és a természetet jelképezi. Ezt a színt a szem a legkönnyebben érzékeli, és ennek eredményeként ellazul. A zöld a második legkedveltebb szín mind a férfiak, mind a nők számára.

    A sárga a fiatalság, az optimizmus és a vidámság szimbóluma. Gyakran a figyelem felkeltésére használják. A sárga is feszültséget okozhat, ezért kis mennyiségben használja.

    A narancs a barátságossággal, az örömmel és a kreativitással társul. Serkenti az emberek aktivitását. Például arra ösztönöz, hogy vásároljon egy terméket vagy iratkozzon fel hírlevélre. Ez a szín vonzza az impulzív vásárlókat.

    A piros a szenvedélyt, az izgalmat, az energiát és a veszélyt szimbolizálja. Gyakran arra használják, hogy az emberek felfogásában sürgető vásárlási igényt keltsenek. Erős érzelmi reakciókat vált ki. Éttermekben használják az étvágy növelésére.

    A rózsaszín nőies, édes, ártatlan és romantikus. Gyakran használják magánszolgáltatások és áruk kínálására lányoknak és nőknek.

    A lila a nagyság, a gazdagság, a siker és a bölcsesség szimbóluma. Gyakran előfordul a kozmetikumokban. Nyugtató hatással van az emberekre.

    A kék a megbízhatóság, biztonság, stabilitás, béke és nyugalom jelzője. Gyakran használják bankok és nagyvállalatok. A kék szín a legkellemesebb mind a férfiak, mind a nők számára.

    A szürke szín a semlegességet, egyszerűséget, nyugalmat és logikát képviseli. A technológiához, a gyártáshoz, a pontossághoz, az ellenőrzéshez, a hozzáértéshez és még a tapasztalathoz is kapcsolódik.

    A fekete a hatás, a luxus, az élmény és az elegancia színe. Gyakran használják luxuscikkek népszerűsítésére, és a professzionalizmushoz, az erőhöz és a precizitáshoz kapcsolják.

    Fiatal és energikus vásárlók a célközönsége? Vagy tapasztaltabb emberek szilárd keresettel? Terméke (szolgáltatása) inkább férfiaknak vagy nőknek szól? Csak egy bizonyos korosztály számára alkalmas?

    Nem minden szín alkalmas vállalkozása megjelenítésére. Például ha jógaszőnyeget árul, lila ( gazdagság és nagyság) és fekete (erő és luxus) - nem a legtöbb legjobb lehetőségek. A zöld illik hozzád egészség, béke), szürke ( egyszerűség, nyugalom), kék ( béke, nyugalom), vagy talán még piros ( szenvedély, energia).

    A színérzékelés különbsége férfiak és nők között

    Főleg kiknek szól az oldala, férfiaknak vagy nőknek? Vagy talán mindkettő?


    Világos és tompa színsémák a webhelyhez

    A férfiak az élénk színeket részesítik előnyben, míg a nők a tompa színeket.

    A kísérlet kimutatta, hogy általában a férfiak és a nők egyformán reagálnak a világos és sötét árnyalatokra. De kiderült, hogy a nők inkább a tompított, a férfiak pedig a világos árnyalatok felé vonzódnak.

    akromatikus színek

    Általában a férfiak jobban kedvelik az akromatikus színeket, mint a nők. Az akromatikus színek a fehér, a fekete és a szürke minden árnyalata.

    Világos és sötét árnyalatok

    A nők a világos színeket részesítik előnyben. Ennek oka bizonyos színek fokozott érzékelése.

    Nők

    Kék, lila, zöld.

    Narancs, barna, szürke.

    Férfiak

    A legkedveltebb színek: kék, zöld, fekete.

    Legkevésbé kedvelt színek: barna, narancs, lila.

    A férfiak, nők vagy mindkettő által kedvelt színek kombinálásával és használatával az ember befolyásolhatja a márkáról alkotott tudatalatti felfogásukat.

    A színséma kutatások szerint a férfiak és a nők egyaránt szeretik a zöldet és a kéket. Mindketten nem szeretik a narancsot és a barnát. Ha mind a férfiak, mind a nők figyelmét fel akarja hívni, akkor a kéket vagy a zöldet kell használnia fő színként.

    A márka vagy termék színének kiválasztása attól is függhet, hogy az ügyfelek milyen benyomást szeretnének kelteni másokban.

    Az emberek gyakran vásárolnak bizonyos árukat vagy szolgáltatásokat, hogy bizonyos benyomást keltsenek másokban.

    Sok döntés azt tükrözi, hogy az ember mit gondol magáról, és hogyan szeretne megjelenni mások szemében. Másoknak ez jut eszébe, ha erre a személyre gondolnak:


    Tehát ha azt szeretné, hogy a természetet szerető emberek megvásárolják a termékét, használjon zöldet a HTML színsémájában. Szeretne olyan embereket vonzani, akik fiatalnak és magabiztosnak érzik magukat? Használj sárgát. Ha olyan emberek iránt érdeklődik, akik szolidnak és gazdagnak szeretnének kinézni, használjon feketét.

    Most már világos?

    Gondolj egy ideális képviselőre célközönség. Hogyan akar megjelenni mások előtt?

    Igen, ez hatással van a pszichológiára. De ezt meg kell értened egy sikeres márka létrehozásához.

    A fő szín használata a webhelyen

    Most, hogy eldöntötte webhelye fő színét, meg kell értenie, hogyan kell helyesen használni. A színek nagy figyelmet vonzanak, ezért ne próbálja mindenhol használni, ahol csak lehet.

    Csak azokon a helyeken használja az uralkodó színt, amelyekre fel kívánja hívni a felhasználók figyelmét, vagy egy bizonyos cselekvésre ösztönzi őket.

    Például hívjon fel egy telefonszámot, töltse ki az űrlapot, iratkozzon fel a frissítésekre stb.

    A domináns színnek szemet gyönyörködtetőnek kell lennie, kiemelve azokat a részleteket, amelyekre a felhasználóknak figyelniük kell:


    Hol használja az uralkodó színt az oldalon?
    • logó;
    • Menüfülek;
    • "Hívógomb;
    • Fontos információ;
    • Címek és címek;
    • Gombok.

    2. A kiemelő színek kiválasztása

    Ahhoz, hogy a design érdekesebbé és professzionálisabbá váljon, a webhelyhez kész hangsúlyos színsémákat kell használnia. Kijelölhetik a webhely azon részeit, amelyek figyelmet érdemelnek: idézőjelek, gombok vagy alcímek.

    Sokan félnek több színt egyszerre használni, mert intuitív módon nem mindig egyértelmű, hogy jól kombinálódnak-e. Az emberek úgy gondolják, hogy ahhoz, hogy megtanulják kombinálni őket, nemcsak alaposan tanulmányozni kell a színelméletet, hanem sok hibát is el kell követni.

    Mindenki számára elérhető egyszerűbb módszer. Ez egy színillesztő program, amely segít a színsémák összehangolásában, ahogy a profik teszik!

    A program használata kiemelő színek kiválasztására

    Miután kiválasztotta a domináns színt, semmi sem egyszerűbb, mint kiemelő színeket felvenni olyan programokkal, mint az Adobe Color CC Tool:


    Íme egy rövid útmutató, amely megmutatja, hogyan hozhat létre színsémát kétféleképpen:
    1. Domináns szín alapján

    1. lépés: Először találja meg az uralkodó szín kódját. Például a ColorPicker.com webhelyen. A színkód közvetlenül a színpalettát tartalmazó négyzet feletti téglalapban látható.

    Miután kimásolta a kódot a ColorPicker.com webhelyről, illessze be a " NEM X» Adobe Color eszköz. Ügyeljen arra, hogy a kódot a középső oszlopba illessze be:


    Illessze be webhelye domináns színkódját a KÖZÉPEN található mezőbe.

    Miután megadta a színt, az Adobe Color megjeleníti azt a képernyőn más kiegészítő színekkel együtt.

    2. lépés. A bal felső sarokban egy téglalap látható a következő színsémákkal:

    • Egymás utáni;
    • monokróm;
    • háromszög alakú;
    • kiegészítő;
    • Összetett;
    • Shades.
    Válasszon egy színsémát

    Kísérletezzen különböző színsémákkal, hogy megtudja, melyik a megfelelő az Ön számára. A program által javasolt összes szín jól kombinálható egymással.

    3. lépés Az egyik színválasztó mozgatásával még tovább javíthatja a színsémát.

    Fontos, hogy ne mozgassa a középen található rövid mutatót, hogy a domináns szín állandó maradjon:


    A CMS és a webhelykészítők lehetővé teszik színkódok beszúrását ( HEX) a webhely bármely részének kiemeléséhez:


    Másolja ki a színkódokat ( HEX) a webhely színsémájához.
    1. A neked tetsző fotó alapján

    Néha könnyebb színes megoldásokat keresni az interneten, és ihletet meríteni belőlük.

    Az Adobe Color-ba tetszőleges fényképet tölthet fel, amely alapján a program automatikusan generál egy színsémát.

    1. lépés: Töltsön fel egy fotót:


    Kép feltöltéséhez kattintson a kamera ikonra.

    2. lépés: Válasszon egyet az öt színhangulat közül:

    • színes;
    • Fényes;
    • tompított;
    • Telített;
    • Sötét.

    Kísérletezzen a színhangulatokkal, hogy megtudja, melyik áll közelebb Önhöz:


    Válasszon színhangulatot.

    3. lépés: Tegye még átgondoltabbá a színsémát az egyik színválasztó mozgatásával a kép körül:


    Mozgassa a mutatókat, ha más kiegészítő színeket szeretne kiválasztani.

    4. lépés: A javasolt színpaletta a kép alatt található. Így válasszon színsémát webdizájnjához.

    A kódok megtekintéséhez ( HEX) színeket, kattintson a jobb felső sarokban található színkörre:


    Kattintson a színkörre a színkódok megtekintéséhez:
    Másolja ki a színkódokat ( HEX) az Ön színsémájához.

    Hol helyezzük el a másodlagos színeket

    A kiegészítő színekkel kiemelt oldalrészletek nem a fő hangsúlyok. De még mindig kiemelkednek. Segédszínekkel lehet például kiemelni alcímeket, további gombokat, párbeszédpaneleket, kitölteni a hátteret stb.

    Válasszon egy vagy két kiegészítő szín közül. Ha több van belőlük, akkor a felhasználóknak nehéz lesz egy dologra összpontosítani:


    Hol használjon másodlagos színeket a webhelyén?
    • Aktív menü gomb;
    • feliratok;
    • A másodlagos információk elkülönítése.
    1. Háttérszín kiválasztása

    Volt már, hogy festeni kellett a falakat a házadban?


    Ha igen, akkor van némi tapasztalata, és tudja, hogy a színséma kiválasztása nem könnyű feladat.

    A színnek kellően nyugodtnak kell lennie ahhoz, hogy órákig a szobában tudjon lenni, és a szín ne nyomja meg. Ugyanakkor nem akarja, hogy a szín unalmas legyen, és a helyiség kórházinak tűnjön.

    Webhelye háttérszínének kiválasztása nem sokban különbözik a szobafesték kiválasztásától!

    Hogyan válasszuk ki a megfelelő háttérszínt

    Ha festéket választana egy modern ruhaüzlethez és egy vidéki házhoz, ugyanazt a színt választaná?
    Nyilvánvalóan nem. Ez a két szoba különböző célokat szolgál.

    Például egy ruhaüzlet esetében jobb, ha élénk színeket használnak, hogy felhívják a vásárlók figyelmét a ruhatartókra. Szükséges, hogy a falak színe ellentétben álljon a ruhás polcok színével, és a vásárlók az üzletbe belépve azonnal megértsék, mire kell figyelni.

    És összehasonlításképpen: ha vidéki házába érkezik, valószínűleg kikapcsolódást tervez. Azt szeretné, ha a falak színe és otthona elrendezése megnyugtató és pihentető hatású lenne.

    Webhelye háttérszíne attól függ, hogy mire szeretné figyelni a felhasználókat.

    Egyszerűen fogalmazva, a háttérszín közvetlenül függ a webhely létrehozásakor kitűzött céltól.

    1. típus – Sok tartalommal vagy online kereskedelmet tartalmazó források

    Észrevette, hogy az információs források és az online áruházak gyakran fehér vagy semleges színsémákat használnak a webhelyen?


    Ennek az az oka, hogy ezeknek a forrásoknak az a célja, hogy ötleteket vagy termékeket népszerűsítsenek.

    Ilyenkor a termékekre vagy szolgáltatásokra kell koncentrálni, nem az oldal kialakítására. A háttérszín csak egy alap a tartalom láthatóbbá és olvashatóbbá tételéhez.

    Információforrásokhoz és online kereskedelemhez a legjobb, ha világos hátteret, világos domináns és másodlagos színeket használ. Az uralkodó és hangsúlyos színek világossága garantálja az oldal egyediségét, és lehetővé teszi a részletek kiemelését. Ugyanakkor az értékesítési oldal semleges háttérszíne segít a felhasználónak csak a tartalomra vagy a termékekre összpontosítani.

    2. típus – Vállalati oldalak és szolgáltatások

    Alkotás közben vállalati erőforrás az egyik cél az áruk vagy szolgáltatások népszerűsítése.

    Attól függően, hogy mi a webhely célja, a háttérszínnek eltérőnek kell lennie.

    Márka promóciója

    Ha emlékezetes képet szeretne kialakítani a cégről, használja a domináns szín vagy márkaszín különböző árnyalatait a háttérnek.

    Ennek az az oka, hogy a szín közvetlenül befolyásolja a márkaismertséget ( Emlékszel a Coca-Cola példára?) Ha a márkaszín különböző árnyalatait használja háttérként, javítja azt, és emlékezetesebbé teszi az ügyfelek számára.

    Ha webhelyének domináns színe provokatív, akkor ennek háttérként való használata negatívan befolyásolhatja a felhasználók megítélését. Ilyen esetekben használja a legalacsonyabb intenzitású árnyalatokat:

    Szolgáltatás promóciója

    Ha az a cél, hogy felhívja a figyelmet munkája egy szolgáltatására vagy portfóliójára, használjon fehér vagy semleges háttérszínt.

    Mint abban az esetben információs források, nem kell túlterhelnie a webhelyet, és nem kell elterelnie a felhasználók figyelmét a közvetíteni kívánt tartalomról. Ha fehér vagy világos háttérszínsémát használ webhelyéhez, felhívja a figyelmet a tartalomra:

    3. típus – Stílusos és kreatív oldalak sok grafikával

    Ha kreativitással kapcsolatos oldalt akar létrehozni ( divat, design, étterem, szépség stb.), nincsenek korlátozások az Ön számára.

    Az ilyen típusú webhelyeken nincsenek szabályok a háttérszín használatára. A menüsávot feketévé teheti, hogy drámai legyen. Vagy hozzon létre egy hátteret a szivárvány összes színével, hogy felvidítsa a webhely látogatóit:


    Próbálj mindig egy szabályhoz ragaszkodni: soha ne válasszon olyan háttérszínt, amely nehezen olvashatóvá teszi a rajta lévő szöveget.

    A tökéletes háttérszín lehetővé teszi a tartalom kiemelését, és harmonikusan keveredik az elsődleges és másodlagos színekkel. A megfelelő háttérszín kellemessé teszi a felhasználói élményt az oldalon.

    Ha kétségei vannak, használjon fehér vagy világosszürke hátteret. Lehet, hogy nem ezek a leginspirálóbbak, de gondoskodni fog arról, hogy tartalma jól látható legyen.

    Következtetések és eredmények

    Ne vezessen személyes preferenciáktól vagy érzéktől a webhely színsémájának kiválasztásakor.

    Használjon olyan színeket, amelyek a potenciális közönségnek tetszenek, és akkor az erőforrás sokáig megmarad az emberek emlékezetében. Ez megkülönbözteti Önt versenytársaitól.

    A színpaletta kiválasztása semmi esetre sem lehet véletlen. Ez egy sor teendő:

    • Válassza ki a megfelelő domináns színt a webhelyhez;
    • Válassza ki a megfelelő másodlagos színeket a domináns színhez;
    • Válasszon megfelelő háttérszínt.

    Ez a kiadvány a "cikk" fordítása Hogyan válasszunk megfelelő színsémát webhelyéhez» egy barátságos projektcsapat készítette

    Jó Rossz



    Betöltés...
    Top