כמה צבעים צריכים להיות באתר? 60/30/10
בחירת הצבעים בעיצוב האתר מסתכמת ביותר מסתם אסתטיקה. על מנת ליצור פלטת צבעים יעילה לאתר, חשוב להבין תחילה את תורת הצבעים, הפסיכולוגיה וההרמוניה. משם, אתה יכול ליצור פלטה שמתיישרת עם ערכי המותג, המסרים ושוק היעד של המותג.
בפוסט זה, נלמד אותך כיצד להשתמש בצבע כדי ליצור אתרים בעלי השפעה וערך גבוה עבור הלקוחות שלך.
1. שקול את ההקשר התרבותי
למרות שלצבעים שונים יש משמעויות שונות ברמה האישית, לצבעים מסוימים יש גם משמעות תרבותית שורשית. לדוגמה, בתרבויות מערביות, אדום הוא צבע שמושך תשומת לב המסמל סכנה ודחיפות (תחשוב על תמרורי עצור). אולם בתרבויות מזרחיות מסוימות, כמו סין והודו, אדום מייצג מזל. כדוגמה נוספת, שחור הוא צבע המוות והאבל בתרבויות המערב. בחלק מהתרבויות המזרחיות, הצבע המקביל הוא לבן.
כפי שממחישות הדוגמאות לעיל, ההקשר הוא קריטי בקטע הצבע. תלוי היכן מבוסס שוק היעד של המותג, הצבעים המשמשים באתר האינטרנט שלו יכולים לשלוח מסר שונה מאוד. אז איך אתה יודע מאילו צבעים לכלול או להימנע על סמך שוק היעד של הלקוח? חיפוש פשוט בגוגל אמור לעשות את העבודה.
אם למותג יש שוק יעד גלובלי, שקול להימנע מצבעים כמו אדום שיש להם משמעות תרבותית עמוקה. מכיוון שמשמעויות צבע תרבותיות כל כך מושרשות בנפשנו, ייתכן שלא נבין במודע שאנו סולדים מצבעים מסוימים. כמובן, יש כמה יוצאי דופן. חברת קוקה קולה ידועה באופן אוניברסלי בזכות צבע המותג האדום המובהק שלה. במקרה זה, ההכרה הקשורה לצבע המותג עוצמתית מספיק כדי להאפיל על כל קונוטציות שליליות הקשורות לצבע האדום בחברה המערבית.
2. להבין את תורת הצבעים
תורת הצבעים היא קבוצה של עקרונות יסוד השולטים כיצד ליצור שילובי צבעים הרמוניים. הבנת העקרונות הללו היא צעד ראשון חשוב ביצירת פלטות צבעים יעילות עבור מותגים ואתרי אינטרנט.
גלגל הצבעים
כלי נהדר להבנת היסודות של תורת הצבעים הוא גלגל הצבעים. כולנו ראינו בעבר גלגל צבעים בווריאציה כזו או אחרת, אבל למטרות הפוסט הזה, נשתמש בו כדי לבחון צבעים ראשוניים, משניים ושלישוניים.
צבעי יסוד
שלושת צבעי היסוד הם אדום, צהוב וכחול. בשילוב, צבעי יסוד יוצרים צבעים משניים.
צבעים משניים
הצבעים המשניים הם סגול (אדום + כחול), ירוק (כחול + צהוב), וכתום (אדום + צהוב). שילוב של צבעים משניים עם צבעי יסוד יוצר צבעים שלישוניים.
צבעים שלישוניים
הצבעים השלישוניים הם שילובים של צבעים ראשוניים ומשניים (כלומר אדום-סגול, צהוב-כתום, כחול-ירוק וכו')
גוונים, גוונים וגוונים
צבעים ראשוניים, משניים ושלישוניים נחשבים לצבעים טהורים . הם רוויים, חיים ועליזים. גוונים הם תוספת של צבעים לבנים על טהורים. זה יוצר צבעים בהירים ופחות עזים. גוונים נוצרים בתוספת של שחור לצבעים טהורים. לבסוף, הוספת שחור ולבן לצבעים טהורים יוצרת גוונים . גוונים מאופקים יותר מצבעים טהורים.
עכשיו כשאתה מבין איך צבעים שונים נוצרים ומסודרים בגלגל הצבעים, יהיה קל יותר ליצור פלטות צבעים מושכות חזותית. לוחות הצבעים מכוסים ביתר פירוט להלן בשלב 4.
שימוש בקונטרסט
עיקרון חשוב נוסף של תורת הצבעים נוגע לשימוש בקונטרסט. ככל שהניגודיות גבוהה יותר, כך שני צבעים בולטים זה מזה.
בעת הערכת ניגודיות, חשוב לקחת בחשבון לא רק את הצבעים (כלומר כחול וירוק), אלא גם את הגוון שלהם. שני צבעים שונים עם גוון אחיד אינם יוצרים ניגודיות גבוהה. טריק קל לקביעת רמת הניגודיות של שני צבעים הוא להמיר אותם לגווני אפור – ההבדל בניגודיות יהיה הרבה יותר ברור.
באופן כללי, אנו רוצים להשתמש בצבעים עם ניגודיות גבוהה בעיצוב אתרים בגלל קריאות רבה יותר. לדוגמה, טקסט לבן על רקע כהה, או להיפך. ניגודיות מושכת תשומת לב ויכולה לגרום לאלמנטים חשובים מסוימים לבלוט חזותית. עם זאת, ניגודיות צבע רבה מדי באתר יכולה לשחוק את העיניים שלנו. האתר שלהלן הוא דוגמה טובה לאיך לאזן בין ניגודיות גבוהה ונמוכה בעיצוב אתרים.
3. השתמש בפסיכולוגיה של צבע כדי לתקשר מסרים וערכים של המותג
פסיכולוגיית הצבע מתייחסת להשפעת הצבע על הרגשות, הרגשות וההתנהגויות שלנו. למרות שזה קצת סובייקטיבי, פסיכולוגיית הצבע יכולה לעזור לנו להשפיע באופן לא מודע על אנשים שמבקרים באתר שלנו בדרכים משמעותיות. זה הופך אותו לכלי רב עוצמה לעיצוב ושיווק.
צבעים מעוררים רגשות
אנשים נמשכים לצבעים מסוימים בין השאר בגלל איך שהם גורמים להם להרגיש. בצד ההפוך, צבעים יכולים גם לגרום לתגובת בטן שתוביל מישהו להימנע מלהתקשר אליהם. אם זה נשמע קצת מעורפל, זה בגלל שחסר לנו חלק מכריע בפאזל: ההקשר. בהקשר מסוים, אדום עשוי לגרום לנו לחוש פחד וחרדה. באחר, זה יכול לעורר תשוקה והתרגשות.
אם אתה רוצה להשתמש בצבע בעיצוב אתר כדי להעביר רגש מסוים, הוא צריך להשתלב בצורה חלקה עם שאר האלמנטים בדף הנחיתה, כגון טיפוגרפיה, תמונות והעתקה. עם האזהרה הזו בחשבון, בואו נסקור כמה מהאסוציאציות הנפוצות ביותר בין צבע לרגש.
אסוציאציות צבע נפוצות
אסוציאציות הצבע שלהלן יכולות לשמש כמדריך התייחסות כאשר אתה שוקל אילו צבעים יייצגו בצורה הטובה ביותר מותג מסוים. איך קהל היעד אמור להרגיש כאשר הוא נתקל באתר המותג? אילו פעולות עליהם לנקוט? עם ההקשר הנכון, צבע יכול לעשות את ההבדל בין לקוח פוטנציאלי מעורב לעובר אורח חסר עניין.
- אדום : תשוקה, כוח, אהבה, סכנה, התרגשות
- כחול : רוגע, אמון, יכולת, שלווה, היגיון, אמינות
- ירוק : בריאות, טבע, שפע, שגשוג
- צהוב : אושר, אופטימיות, יצירתיות, ידידותיות
- כתום : כיף, חופש, חום, נוחות, שובבות
- סגול : יוקרה, מסתורין, תחכום, נאמנות, יצירתיות
- ורוד : טיפוח, עדינות, כנות, חום
- חום : טבע, ביטחון, הגנה, תמיכה
- שחור : אלגנטיות, כוח, שליטה, תחכום, דיכאון
- לבן : טוהר, שלווה, בהירות, ניקיון
4. צור פלטת צבעים
כעת, לאחר שיש לך הבנה טובה יותר של תורת הצבעים והפסיכולוגיה, אתה מצויד היטב ליצור פלטת צבעים מכוונת עבור אתר האינטרנט של הלקוח שלך. הצבע הראשון שתבחר צריך להיות הצבע העיקרי של המותג. אין להתבלבל עם צבעי יסוד בגלגל הצבעים, במקרה זה "צבע ראשוני" מתייחס לצבע הראשי בפלטה. זה המקום שבו פסיכולוגיית הצבע באמת באה שימושית.
סוגי לוח צבעים
ישנם חמישה סוגים עיקריים של לוחות צבעים: אנלוגיים , מונוכרומטיים , טריאדים , משלימים ומפוצלים משלימים . כל אחד מאלה יכול לשמש ליצירת פלטת צבעים יעילה עבור אתר אינטרנט. להלן נסתכל על כמה דוגמאות לאופן השימוש בכל אחד מסוגי לוח הצבעים הללו בעיצוב אתרים.
מקביל
צבעים אנלוגיים הם צבעים שיושבים זה ליד זה בגלגל הצבעים. סוג זה של פלטה יכול להיראות יפה מאוד כי הצבעים משתלבים זה בזה כל כך יפה. עם זאת, ההשפעה עשויה להיות עדינה מדי , ולמנוע מכל אלמנט להתבלט מספיק.
גוון אחיד
פלטות צבעים מונוכרומטיות מבוססות על צבע יחיד בשילוב עם גוונים וגוונים שונים. כמו פלטות אנלוגיות, פלטות מונוכרומטיות יכולות להיות מאוד נעימות למראה. עם זאת, כדאי להוסיף צבע משלים לפלטה מונוכרומטית בעיצוב אתרים על מנת למשוך תשומת לב לאלמנטים חשובים.
שלושה גוונים
פלטות הצבעים המשולשות מורכבות משלושה צבעים המרוחקים זה מזה באופן שווה על גלגל הצבעים, ויוצרים משולש. סוג זה של לוח צבעים הוא קצת מסוכן לשימוש בעיצוב אתרים מכיוון שהוא יכול להיראות רועש. עם זאת, בהתאם להקשר, פלטות צבע משולשות יכולות להיות יעילות מאוד עבור מותגים צעירים, שובבים ו/או אמנותיים.
משלים
לוחות צבעים משלימים מכילים צבעים בקצוות מנוגדים של גלגל הצבעים. פלטות אלו יעילות מאוד לעיצוב אתרים מכיוון שהן יוצרות איזון ומתח ויזואלי. עם זאת, אם משתמשים בצבעים באופן שווה, המתח יכול להיות גבוה מדי. במקום זאת, בחר אחד מהצבעים המשלימים כצבע המותג העיקרי, והשתמש בשני כצבע מבטא.
פיצול משלים
פלטות צבעים משלימים מפוצלות דומות לפלטות משלימות אך עם צבע שלישי שנזרק פנימה זה ליד אחד הצבעים המשלימים בגלגל הצבעים. סוג זה של פלטת צבעים יעילה מאוד גם בעיצוב אתרים ויכולה להוסיף ריגוש ויזואלי יותר מבלי ליצור יותר מדי רעש.
איך להשתמש בפלטות צבעים בעיצוב אתרים
ישנם כלים מקוונים שונים שבהם תוכלו להשתמש כדי לסייע בתהליך יצירת לוחות צבעים. מועדף אישי, המודגם בצילומי המסך למעלה, הוא Adobe Color . עם הכלי הזה, אתה יכול לשחק עם גלגל הצבעים כדי ליצור פלטה מותאמת אישית עם כל אחד מחמשת סוגי לוח הצבעים המפורטים למעלה. אתה יכול גם להעלות תמונה כדי לחלץ ממנה צבעים, או ללחוץ על הכרטיסייה חקור כדי לעיין בדפים ובעמודים של פלטות צבעים.
כדי להתחיל, אני ממליץ לבחור שלושה צבעים עבור הפלטה שלך: צבע ראשי (או ראשי) , צבע משני וצבע דגש . לאחר מכן, השתמש בכלל 60/30/10 כדי ליישם צבעים אלה בעיצוב האתר שלך. על פי כלל זה, 60% מהצבע המשמש צריך להיות הצבע הראשי, 30% הצבע המשני ו-10% צבע המבטא. זכור, שחור ולבן נחשבים גם כצבעים.
הערה חשובה לגבי כלל ה-60/30/10 היא שזה באמת יותר קו מנחה מאשר כלל. לדוגמה, ייתכן שתרצה לשלב יותר משלושה צבעים בלוח שלך. הנקודה העיקרית היא להתמקד בצבע הראשי ולהשתמש בצבעים אחרים כדי לחלק אלמנטים, ליצור ניגודיות ולהדגיש תכונות חשובות.