იყენებთ ფერს თქვენს ინტერფეისში, რომელიც ძაბავს მომხმარებლის თვალებს?

თუ თქვენ იყენებთ ნათელ და გაჯერებულ ფერს თქვენი ფონისთვის, მაშინ ამცირებთ დროს, რომელსაც მომხმარებელი ატარებს თქვენს გვერდზე. ნათელი და მდიდარი ფერები დიდ ყურადღებას იპყრობს. მაგრამ ასეთი ფერების გამოყენება დიდი რაოდენობითძლიერად ძაბავს მომხმარებლის თვალებს.

რომელ დინამიკს შეგიძლიათ უფრო დიდხანს უყუროთ?

მაგალითი. დააკვირდით ფერებს ზემოთ მოცემულ სურათზე.

მარცხენა სვეტი შეიცავს ფერებს მაქსიმალური სიკაშკაშით და გაჯერებით. მარჯვენა სვეტი შეიცავს ფერებს, რომელთა სიკაშკაშე და გაჯერება ტოლია 80%.

თქვენი ყურადღება მარცხენა სვეტისკენ უფრო დაბალი იქნება, ვიდრე მარჯვენაზე, რადგან ნათელი ფერებიდიდ ზეწოლას ახდენს თვალებზე.

სიკაშკაშე vs გაჯერება

სიკაშკაშე და გაჯერება სხვადასხვა ფერის თვისებებია. პირველი თვისება ეხება იმას, თუ რამდენი თეთრი ან შავი არის შერეული ფერში. მეორე თვისება არის ის, თუ რამდენ ნაცრისფერს შეიცავს ფერი.

სიკაშკაშის გაზრდით, თქვენ არ ამცირებთ გაჯერებას. როდესაც ამცირებთ გაჯერებას, თქვენ ურევთ ფერს ნაცრისფერი ელფერით. სიკაშკაშის გაზრდისას ფერს ნათელს ხდის, მაგრამ ნაცრისფერს არ ხდის.

ზედა: მზარდი სიკაშკაშე - მეტი თეთრი. ქვედა: მცირდება გაჯერება - უფრო ნაცრისფერი

ფერის გავლენა ყურადღებასა და აღგზნებაზე

კვლევის შედეგების მიხედვით, „ტონის, გაჯერების და სიკაშკაშის ეფექტი“, აღმოჩნდა, რომ ფერები მაღალი გაჯერებითა და ბზინვარებით იზიდავს. უდიდესი ყურადღება. ამ კვლევის ავტორმა დაასკვნა, რომ ფერის ეს თვისებები უფრო მნიშვნელოვანია ყურადღების მიქცევაში, ვიდრე ჩრდილები.

ორმა სხვა კვლევამ, "ფერების გაჯერების აგზნების ეფექტი" და "ფერი და ემოცია", დაადგინა, რომ გაჯერებული ფერები ასოცირდება უდიდეს აღგზნებასთან. შეფერილობა ასევე მოქმედებს აგზნებაზე, მაგრამ გაჯერება და სიკაშკაშე ყველაზე ძლიერ გავლენას ახდენს.

გამოიყენეთ ნათელი და მდიდარი ფერები ღილაკებში

ნათელი და გაჯერებული ფერები იპყრობს მომხმარებლის ყურადღებას, მაგრამ დიდხანს არ იჭერს მას. ამ ფერების გამოყენება მომხმარებლის გვერდით ყვირილს ჰგავს. თქვენ მხოლოდ ცოტა ხნით მიიპყრობთ მათ ყურადღებას.

ამიტომ, თქვენ უნდა გამოიყენოთ მხოლოდ ისეთი ფერები ინტერფეისის ელემენტებში, რომლებიც მოითხოვს მომხმარებლისგან მოქმედებას - მაგალითად, ღილაკებს. ეს ფერები მომხმარებლის ყურადღებას გაამახვილებს კონტროლზე და გაამარტივებს მათ საჭირო დროს პოვნას.

მარცხნივ: ფონი ნათელი და გაჯერებულია. ამიტომ, მთელი ყურადღება ექცევა ფონს და არა ღილაკს. მარჯვენა: ღილაკი იყენებს ნათელ და გაჯერებულ ფერს. ის იპყრობს მომხმარებლის ყურადღებას

გამოიყენეთ მუქი და ნაკლებად გაჯერებული ფერი ფონისთვის

ამის გაკეთება ჯობია ფონის ფერიმუქი და ნაკლებად გაჯერებული. როგორც ფერი ბნელდება, თეთრი შემცველობა მცირდება. გაჯერების შემცირებისას იზრდება ნაცრისფერი რაოდენობა.

შედეგად მიღებული ფონი არ გადაიტანს მომხმარებლის ყურადღებას გვერდის ტექსტიდან ან შინაარსისგან. ეს საშუალებას აძლევს მომხმარებელს წაიკითხოს გვერდი მარტივად და ყურადღების გაფანტვის გარეშე.

მარცხნივ: თვალისთვის უსიამოვნო. ფონი ნათელი და მდიდარია. მაქსიმალური სიკაშკაშე და გაჯერება სურათზე მარცხნივ. მარჯვენა: ადვილად თვალებზე. ფონი მუქი და ნაკლებად გაჯერებულია. სიკაშკაშე და გაჯერება დაბალია

ფონის ოპტიმალური ფერის პოვნა

არსებობს მრავალი სიკაშკაშის და გაჯერების კოეფიციენტები, რომლებიც შეგიძლიათ გამოიყენოთ თქვენი ფონის ფერისთვის. ფერადი ნიმუშების ბადის შექმნა დაგეხმარებათ იპოვოთ ფონის ოპტიმალური ფერი.

პირველ რიგში, აირჩიეთ მთავარი ელფერი და დააყენეთ მისი სიკაშკაშე და გაჯერება მაქსიმუმზე. ტონის მნიშვნელობა შენახულია და ემსახურება საკონტროლო წერტილისიკაშკაშისა და გაჯერების რეგულირებისთვის.

დააკოპირეთ ძირითადი ფერის ჩრდილი (swatch), რათა შექმნათ ოთხი ახალი ფერის ნიმუში გაჯერებისა და სიკაშკაშის დაბალი დონით.

შეამცირეთ ორი შექმნილი ფერის ნიმუშის სიკაშკაშის დონე. და შეამცირეთ დანარჩენი ორი ნიმუშის გაჯერება. ფერის რეგულირებისას გამოიყენეთ ათი ნამატი.

განათავსეთ გაჯერებული ფერის ნიმუშები ორიგინალური შეფერილობის მარცხნივ, სიკაშკაშე და გაჯერება დაყენებული 100%. მარჯვნივ, მოათავსეთ ფერის ნიმუშები მინიმალური და მაქსიმალური სიკაშკაშით.

ახლა შექმენით ფერადი ნიმუშების მეორე რიგი. შეამცირეთ სიკაშკაშე და გაჯერება ფერების პირველ რიგში. მნიშვნელობების შემცირებისას გამოიყენეთ ერთი და იგივე მნიშვნელობა ფერის სქემების თითოეული ნაკრებისთვის.

შედეგად, მეორე რიგის არცერთ ფერს არ აქვს 100% გაჯერება და სიკაშკაშე. ეს ნიშნავს, რომ ეს ფერები ყველაზე შესაფერისია სამუშაოში გამოსაყენებლად.

შეგიძლიათ სცადოთ შექმნათ ფერადი ნიმუშების კიდევ ერთი რიგი, თუ არ ხართ კმაყოფილი შედეგებით. ამისათვის შექმენით მესამე დონის ფერის ნიმუშები და შეამცირეთ სიკაშკაშის და გაჯერების მნიშვნელობები თითოეული მათგანისთვის.

ახლა თქვენ გაქვთ სულ რვა ოპტიმალური ფერი სხვადასხვა სიკაშკაშისა და გაჯერების კოეფიციენტებით.

კარგი და ცუდი ფერების მაგალითები ვებსაიტის ფონზე გამოსაყენებლად

ქვემოთ მოცემულია გვერდების მაგალითები, რომლებიც სასიამოვნო და სასიამოვნოა თვალისთვის. დააკვირდით, რამდენ ხანს შეგიძლიათ ნახოთ თითოეული მაგალითის გვერდი.

მარცხნივ არის ცუდი მწვანე (პანიკა ან პრიზმული). მარჯვნივ არის კარგი მწვანე (

ფონის ფერი საკმარისია მნიშვნელოვანი ელემენტინებისმიერი ვებ გვერდი. პირველ რიგში, ის ეკითხება სწორი განწყობადა საიტის ზოგადი განწყობა და მეორეც, ეს ხელს უწყობს ტექსტის აღქმას.

ვებ გვერდის ფონის ფერი დაყენებულია ტეგის bgcolor ატრიბუტის გამოყენებით .

მაგალითი 1: ფონის ფერის შეცვლა

ფერი შეიძლება განისაზღვროს როგორც თექვსმეტობითი მნიშვნელობა ან მისი სახელით.

მიუხედავად იმისა, რომ თქვენ შეგიძლიათ მიუთითოთ ნებისმიერი ფერი ფონისთვის, საიტების უმეტესობა იყენებს უპირატესად თეთრ ფონს და შავ ასოებს, როგორც ყველაზე დამკვიდრებულ ვარიანტს.

ფონის სურათი

თქვენ შეგიძლიათ გამოიყენოთ ნებისმიერი შესაფერისი სურათი ფონად. ფონი არ უნდა გადაიტანოს ყურადღება ტექსტიდან, მაგრამ კარგად უნდა იყოს შერწყმულიფერის სქემა .

ვებ გვერდები და იყოს მცირე ზომის, რომ სწრაფად ჩაიტვირთოს.

თუ ყოველივე ზემოთქმულის შემდეგ კვლავ გსურთ ფონის სურათის დამატება გვერდზე, უნდა გამოიყენოთ ტეგის ფონის ატრიბუტი მაგალითი 2: ფონის დამატებათუ გამოსახულება

იმის გამო, რომ ფონის სურათი იტვირთება უფრო ნელა, ვიდრე ფონის ფერი, შეიძლება დასრულდეს წაუკითხავი ტექსტი გარკვეული ხნით, სანამ სურათები არ ჩაიტვირთება. იგივე შეიძლება მოხდეს, თუ სურათები გამორთულია ბრაუზერში. ამიტომ რეკომენდირებულია ყოველთვის დააყენოთ ფონის ფერი ფონის სურათთან ერთად (მაგალითი 3).

მაგალითი 3: ფონის სურათის და ფონის ფერის გამოყენება

დაფიქსირებული ფონი

ნაგულისხმევად, როდესაც იყენებთ გადახვევის ზოლს, ფონის სურათი მოძრაობს ვებგვერდის შინაარსთან ერთად. Internet Explorer საშუალებას გაძლევთ დააფიქსიროთ ფონი bgproperties ="fixed" ტეგის ატრიბუტის გამოყენებით .

მაგალითი 4: ფიქსირებული ფონის დაყენება

bgproperties ატრიბუტის მითითებით, როგორც ნაჩვენებია მაგალით 4-ში, ვებ გვერდზე ფონის სურათი დარჩება სტაციონარული, მაგრამ ტექსტი, გრაფიკა და სხვა ელემენტები გადაადგილდება გადახვევის ზოლთან ერთად.

ირჩევთ თუ არა ფერებს თქვენი ინტერფეისისთვის, რომლებიც დაძაბავს მომხმარებლის თვალებს?

თუ ფონისთვის ნათელ და გაჯერებულ ფერს იყენებთ, მომხმარებლებს ცხოვრებას ურთულებთ: მათთვის მაშინვე რთული ხდება გვერდის ნახვა. ნათელი, მდიდარი ფერები ყველაზე დიდ ყურადღებას იპყრობს. მაგრამ თუ ასეთი კაშკაშა ფერი ბევრია, ეს ქმნის გაზრდილ დატვირთვას ბადურაზე და ზედმეტად მოგიწევთ თვალების დაძაბვა.

მაგალითად, დააკვირდით ზემოთ მოცემულ სურათზე მოცემულ ფერთა ნიმუშებს. მარცხენა სვეტი შედგება ფერებისაგან მაქსიმალური სიკაშკაშით და გაჯერებით. მარჯვენა სვეტი შედგება ფერებისაგან 80% სიკაშკაშით და 80% გაჯერებით. მარცხენა სვეტის ტოლერანტობა უფრო დაბალი იქნება, ვიდრე მარჯვენა, რადგან ნათელი, გაჯერებული ფერები ძალიან მკაცრია თქვენს თვალებზე.

მოდით ვისაუბროთ იმაზე, თუ რატომ არ უნდა გამოიყენოთ ნათელი ფერები ვებსაიტის ან აპლიკაციის ფონისთვის. დიახ, დღეს ეს არის ახალი ტენდენცია - სიკაშკაშის მაქსიმალურად მიცემა. მაგრამ თქვენ ყოველთვის არ უნდა მიჰყვეთ მოდას, მით უმეტეს, თუ ის სიგიჟეს საზღვრავს ან ხელს უშლის თქვენი პროდუქტის გამოყენებას.

დავიწყოთ თეორიით.

სიკაშკაშე vs. გაჯერება

სიკაშკაშე და გაჯერება არის სხვადასხვა თვისებებიფერები. პირველი არის ის, თუ რამდენი თეთრი ან შავი არის შერეული ეს ფერი, ხოლო მეორე ეხება ნაცრისფერ რაოდენობას.

სიკაშკაშის გაზრდა არ ნიშნავს იმას, რომ გაჯერებაც მცირდება. როდესაც ამცირებთ გაჯერებას, ფერს აქცევთ ნაცრისფერ ჩრდილში. როდესაც გაზრდით სიკაშკაშეს, თქვენ გაზრდით ფერის კომპონენტის რაოდენობას, მაგრამ არ გახადოთ ფერი ნაცრისფერი ().

სრული ფერადი გამოსახულების კონტურის სიმკვეთრის კორექტირების სპეციფიკა

1. ფერის ტონიდა გაჯერება

2. კონტურის სიმკვეთრე

3. ავტომატური კორექტირება

ფერის ფონი და გაჯერება

შემდეგ ფერის კორექციაგამოსახულების დამახინჯება უნდა აღმოიფხვრას ან, შესაბამისად მაინც, მნიშვნელოვნად შემცირდა. მაგრამ ფერის გაჯერება შეიძლება არ იყოს საკმარისი. ამ შემთხვევაში, თქვენ უნდა გამოიყენოთ გაჯერების კორექტირების მეთოდი.

ეს მეთოდი დანერგილია გრაფიკულ რედაქტორებში, როგორც გამოსახულების კორექტირება HSL ფერის მოდელში.

ეს კომპიუტერის ფერის მოდელი პრინციპში მსგავსია HSB (HSV). მაგრამ მისი ძირითადი პარამეტრებია: ტონი, სიმსუბუქე და გაჯერება. თუ HSL ფერის მოდელს ფიგურად წარმოვიდგენთ, ეს იქნება ორმაგი (არეკლი) ექვსკუთხა კონუსი. მისი საფუძველი, ისევე როგორც HSB, არის ძირითადი ფერებიდა წვეროები: თეთრი, კონტროლდება გაჯერებით და შავი, ხასიათდება სიმსუბუქით. ამრიგად, HSL ფერის მოდელი არის ტონის, გაჯერების და სიკაშკაშის ინტუიციური კონცეფციების ერთ-ერთი ყველაზე ძლიერი მაგალითი.

სურათზე ან მის შერჩეულ ზონაში ფერის გაჯერების გაზრდა ხდება პიქსელის ფერის ფორმულის S პარამეტრის მნიშვნელობის გაზრდით.

გამოსახულების კორექტირების ინტერფეისის მაგალითი HSL ფერის მოდელში

როდესაც იზრდება ფერის გაჯერებასიფრთხილეა საჭირო, რომ არ გასცდეს იმ მოწყობილობის ფერთა გამას, რომელზედაც გამოსახულების ჩვენება იგეგმება.

ნორმალური ფერის გაჯერება

სცილდება ფერთა გამას

არ არის აუცილებელი გამოსახულების HSL ფერის მოდელზე გადაყვანა სიმსუბუქისა და ფერის გაჯერების გამოსასწორებლად, მაგრამ შეიძლება სასარგებლო იყოს კონტურის სიმკვეთრის კორექცია.

მენიუს მდებარეობა ნიღაბი ნიღაბი

ფილტრის შედეგად წარმოიქმნება მკვეთრი დაფარვა, პროგრამა აკეთებს გამოსახულების ასლს, პოულობს ასლის ზონებში ფერისა და ტონის მნიშვნელოვანი ცვლილებებით (მკვეთრი გადასვლა, ძლიერი კონტრასტი) და ამძაფრებს მათ კიდეებს, რაც იწვევს სიმკვეთრის გაზრდას; კონტურები (კონტრასტი "საზღვრებთან") და არ მოქმედებს დარჩენილ ("ბრტყელ") უბნებზე. ამ მკვეთრ გამოსახულებაზე დაყრდნობით, იქმნება მკვეთრი ნიღაბი და ზედმიყენებულია ოდნავ ბუნდოვან ორიგინალურ სურათზე.

კონტურის სიმკვეთრის გაზრდის სიმულაციისას, პიქსელების არეები შემცირებული და გაზრდილი სიმსუბუქით აგებულია კონტურების გასწვრივ. სრული ფერადი გამოსახულების პიქსელებთან ამის გაკეთებამ შეიძლება გამოიწვიოს ფერის დამახინჯება, რის შედეგადაც კიდეების გასწვრივ უფერული ზოლები გამოჩნდება. IN კომპიუტერული გრაფიკაასეთ არტეფაქტებს ფერადი ჰალო ან ფერადი ჰალო ეწოდება .