Поліпшення читання тексту. Як вибрати контрастні кольори

Тоді я не зрозумів, що це одне з головних правил дизайну, яке допомагає підбирати відстані між елементами, розміри полів, розташування кнопок, розмір логотипів та багато іншого. А головне, теорія дозволяє швидко зрозуміти, чи хороший перед вами дизайн чи ні, навіть якщо ви не дизайнер. Зазвичай теорію близькості ілюструють різними геометричними фігурами, які то ближче, то далі один від одного. Це очевидно, як і саме формулювання теорії, але коли справа доходить до практики, виникають проблеми. Тому я спробую пояснити основи теорії на прикладі букв: Навіть тут теорія близькості починає працювати: букви в словах мають бути ближчими один до одного, ніж слова. Як тільки відстань між літерами наближається до ширини пробілу, настає хаос: Це очевидно, але давайте застосуємо те правило до відстані між рядками. Що має бути пов'язане сильніше: рядки чи слова у рядках? Очевидно, що слова пов'язані сильніше, тому й відстані між словами мають бути відчутно ближчими, ніж між рядками. Що означає відчутно ближче? Якщо зробити міжрядкову відстань в півтора рази більше пробілу, вони почнуть явно відрізнятися:
Для порівняння - тут міжрядковий інтервал (інтерліньяж) перетиснутий і майже дорівнює ширині пропуску:
Відчувається, що його треба збільшити, але наскільки? Завдяки теорії близькості ми знаємо відповідь: щоб він став відчутно більше ширини пропуску. Багато дизайнерів роблять це на рівні інтуїції без розуміння внутрішньої логіки. У когось виходить краще, у когось гірше. Допустимо, нам треба розмістити текст на плашці. Теорія близькості працює як гравітація- об'єкти, які виглядають масивнішими «притягують» до себе дрібніші. А межі формату, чи то сторінка книги, вікно браузера чи край візитівки, можна уявити як межі з масивною чорною діркою – коли ми наближаємося до них, починає працювати зовнішнє тяжіння. Розташуємо текст на плашці:
Начебто все акуратно і рівно. Але якщо згадати теорію близькості, можна зрозуміти, що відступи від краю «сперечаються» з відстанню між абзацами, тобто вони майже рівні:
Потрібно зробити відступи відчутно більше відстані між абзацами, тоді однозначно сприйматиметься, що вони всередині формату, а не прагнуть назовні:
Давайте додамо заголовок:
Такої помилки дизайнери припускаються найчастіше. Заголовок або підпис мають однозначно ставитись до тексту. На практиці заголовки часто зависають рівно посередині між двома текстами або у відстань між заголовком і текстом втручається ілюстрація:
Давайте зверстаємо заголовок і текст слідуючи логіці теорії близькості: букви в словах пов'язані сильніше слів, слова пов'язані сильніше рядків, рядки пов'язані сильніше абзаців, абзаци пов'язані сильніше заголовка і тексту, заголовок разом із текстом пов'язані всередині формату. Це допоможе підібрати правильні відстані:
Користуючись теорією близькості, легко перейти від абстрактних «надто близько до краю» до конкретики: «підпис має бути ближчим до поля, до якого він відноситься, ніж до краю форми». Наприклад, у цій анімації дизайн форми крок за кроком змінюється за допомогою теорії близькості, і логічно пов'язані елементи стають ближчими один до одного.
Так, пов'язуючи та розділяючи елементи відстанню та масою, можна робити логічні та акуратні сайти, презентації, буклети. З іншого боку, теорія близькості допомагає об'єктивно оцінювати дизайн. Наприклад, тут дизайнер не морочився і розставив елементи абияк:
Відразу не зрозуміло, у якої новини який час публікації, заголовок завис між текстом та ілюстрацією. Знаючи теорію близькості легко зрозуміти, чи думав дизайнер про зручність сприйняття, а також легко дати чіткі інструкції щодо покращення. Поки інші просять «додати повітря» або «зачесати дизайн», з теорією близькості можна бути конкретним: «заголовок має бути ближчим до новини, до якої він відноситься». Звичайно, стовідсоткової точності до пікселя не можна домогтися, але можна зробити великий крок у бік об'єктивності, чого в дизайні так не вистачає. Сподіваюся, мені вдалося пояснити основи теорії близькості не надто абстрактно, але й не дуже заплутано. Думаю, вони допоможуть вам, як і мені колись, краще розуміти логіку дизайну та перейти від суб'єктивних відчуттів до конкретних та логічних дій.

Що таке справжня близькість? Це максимальна відкритість між двома людьми, які люблять, яка передбачає душевну вразливість. Коли обидва партнери 100% чесні один перед одним, не бояться довіряти свої думки, почуття, страхи чи мрії. Близькість — це можливість торкнутися душі людини, прийняти її сьогодення з усім тягарем минулого, витримати внутрішній опір. У близькості, як і в коханні, є свої правила, про які ми сьогодні поговоримо.

12 правил близькості: як треба кохати?

1. Близькість значить однаковість, коли партнери у всьому копіюють одне одного – стиль життя, інтереси, характер. Можна бути абсолютно різними, як день і ніч, мати різні життєві цілі та ідеали, але сходитися в головному цього буде достатньо.

2. Справжня близькість передбачає свободу вибору, дозвіл іншому бути іншим.Партнер може не погоджуватися з нами уявленнями про світ, може робити те, що нас дратуватиме – різниця поглядів і поведінки не применшуватиме нашої з ним близькості.

3. Близькість не стирає особистісні кордони партнерів, навпаки, робить їх набагато чіткішими і ясними.Чим інтимніше встановлюється спілкування, тим щільніше йде взаємодія, тим зрозуміліше правила гри.

4. Ця близькість передбачає можливість обговорення очікувань партнерів у відносинах, щоб чітко усвідомити їхні потреби. Розуміння лише на рівні інтуїтивного прозріння – міф.

5. Близькі відносини мають на увазі наявність особистого простору у кожного з партнерів.Бажання весь час проводити разом, повна відсутність особистої території говорить про залежні, а отже, невільні відносини.

6. Навіть у найближчих відносинах партнери не відповідають за щастя один одного.Про нас можуть дбати, ми самі можемо шукати привід порадувати половинку, але при цьому кожен сам несе за себе відповідальність, відповідає за свій настрій, самореалізацію та безпеку. Звинувачують, ображаються та шукають крайніх лише незрілі особистості.

7. Навіть у найближчих відносинах між подружжям можуть існувати секрети, це нормально.Але краще прагнути мінімалізувати сліпі зони, бути максимально відкритими.

8. Близькість виключають примус.Якщо партнер не хоче йти на компроміс або діяти відповідно до очікувань своєї половини, потрібно поважати його рішення. Відповідно, він також зобов'язується поважати і наше небажання.

9. Відмова від сексу не дорівнює відмові в коханні.Крім сексуальної близькості є ще багато варіантів прояву ніжних почуттів. Небажання інтимних відносин не означає, що партнери не можуть бути близькими.

10. Якщо партнери зазнали близькості, значить, вони обидва в якийсь момент цього хотіли і обидва несуть за це відповідальність. Нерозумно прикриватися виправданням, ніби один примушував силою, а другий не відповідав за свої дії.

11. Близькість передбачає любов до партнера просто через те, що він є.Ми не можемо закохуватися в надумані уявлення про людину, красиві залицяння чи власні мрії.

12. Близькість не дає жодних гарантій, що любов у парі триватиме вічно.Немає гарантій, що людина не піде, знайшовши своє щастя поруч із кимось іншим. Чужі почуття складно запрограмувати, вони є нашою власністю. Але коли наші світи перетнулися, краще постаратися зберегти в серці вогонь подяки.

Близькість – це більше, ніж кохання. Це можливість зіткнутися з чарами, пізнати душу партнера краще за себе самого.

Коли ж переходити до сексу? «Правила» залежать від вашого віку та особистих почуттів. Якщо вам 18 і ви - незаймана, дочекайтеся заручення. Якщо вам 39, то можете почекати місяць-другий. Звичайно, якщо ви - переконана противниця сексу поза шлюбом, можете чекати і до весілля. Люблячий чоловік поставиться з повагою до будь-якого рішення.

Але не дивуйтеся, якщо чоловік, з яким ви зустрічаєтеся, розсердиться на поцілунок у вестибюлі та прощання після другого побачення. Чоловіки часто розраховують на те, що ви запросите їх на філіжанку чаю. Чоловіків псують інші жінки – ті, хто погоджується на секс на першому чи другому побаченні. Ваша поведінка позбавляє його заслуженої нагороди. Не хвилюйтеся. Гнів – це ознака інтересу. Ви вразитеся, але він обов'язково передзвонить вам знову!

А якщо вам теж подобається займатися сексом і відмова так само важка для вас, як і для нього? Чи означає це, що потрібно погоджуватися на секс на першому чи другому побаченні? На жаль, ні, ні і ще раз ні. Ви повинні запастись терпінням. Повірте, ви не пошкодуєте про кілька тижнів або місяців помірності. Навіщо ризикувати? Ви можете здатися чоловікові легкою здобиччю, і він наступного дня викладе всі подробиці приятелям у роздягальні спортзалу. Краще нехай він сердиться і вигадує нові способи, які допоможуть йому спокусити вас на наступному побаченні, ніж вирушить до наступної дівчини. Очікування лише посилить його бажання, а пристрасть, коли ви нарешті зважитеся на секс, буде невгамовною.

Ми знаємо, що відкладати сексуальні стосунки з людиною, яка вам подобається, болісно, ​​але подумайте про майбутнє.

Помірність варта того. Якщо ви зробите все правильно, то зможете займатися сексом з цим чоловіком щоночі все життя. Після весілля!

Ви можете заперечити, що не проти зайнятися сексом із чоловіком на першому чи другому побаченні та випробувати долю, навіть якщо потім він не зателефонує. Зрештою, ви обоє - дорослі люди і самі вирішуєте долю своїх стосунків. З особистого досвіду ми точно знаємо, що дівчата, які заявляють щось подібне, просто брешуть самі собі. У глибині душі жінка страждатиме, якщо чоловік, з яким вона провела ніч, більше не зателефонує. Кожна жінка хоче, щоб чоловік, з яким вона займалася сексом, продовжував стосунки з нею – звичайно, якщо він їй по-справжньому подобається (а ми припускаємо, що жінки йдуть у ліжко лише з тими, хто дійсно їм подобається). Всі наші знайомі, які казали, що у розриві після сексу немає нічого страшного, дуже переживали, коли опинялися у подібній ситуації. Погоджуючись на секс на другому побаченні, ви не знаєте, чи виявиться ваш партнер джентльменом чи худобою. Дівчата "Правил" не ризикують. Вони повинні як слід дізнатися про людину, перш ніж погодитися на секс з нею.

Припустимо, ви почекали потрібний час і вже готові зайнятися сексом зі своїм чоловіком. Яким «Правилам» слідувати у ліжку? По-перше (і це головне), залишайтеся емоційно спокійною, хоч би яким гарячим виявився секс. Насправді більшість жінок псують стосунки з чоловіками не тим, що надто рано погоджуються на секс, а тим, що надто багато говорять про це у ліжку. Вони намагаються використати фізичну близькість для створення емоційної близькості, відчуття безпеки та впевненості у майбутньому. Теорії Мастерса і Джонсон (до речі, вони розлучилися) ігнорувати не слід, але, заради всього святого, чекайте достатньо часу, перш ніж починати довгі розповіді про свої потреби під час сексу або відразу після. Не перетворюйтесь на сержанта, який вимагає від новобранця того чи іншого. Ви повинні розслабитися та дозволити чоловікові вивчати ваше тіло як недосліджену територію. Повірте вам буде весело, і задоволення ви отримаєте. Бути з вами в ліжку має бути легко та приємно. Не потрібно труднощів та вимог. Не використовуйте аксесуари – червоні ліхтарі, ароматизовані свічки, щоб збагатити сексуальні враження. Якщо ви не можете порушити чоловіка без них, значить щось не так. Він повинен порушити одну перспективу зайнятися з вами сексом.

Відпочиваючи в ліжку після відмінного сексу, не кажіть:

- Хочеш, я звільню в шафі полицю для твоїх речей?

- Я поклала тобі зубну щітку у ванній.

Не чіпайте сакраментальних тем – шлюб, діти, спільне майбутнє. Цього не слід робити ні в ліжку, ні поза ним. Пам'ятайте: все це – вашіпотреби, а «Правила» закликають нас не бути егоїстками у відносинах. Чоловікові зовсім не хочеться лежати поряд із жінкою, переповненою сильними емоціями. Жінки цікавіші, їм усе хочеться знати.

– А тепер, коли ми спимо разом, як розвиватимуться наші стосунки? Що для тебе означає все, що сталося?

Хоча подібні думки напевно рояться у вашій голові і вам страшно хочеться викласти їх чоловікові, що лежить поруч, постарайтеся розслабитися і ні про що не думати.

Не ображайтеся, якщо цієї ночі або наступного ранку чоловік піде. Будьте спокійні. Не хвилюйтесь через те, що побачення закінчилося. При такому відношенні чоловік, напевно, захоче зустрітися з вами знову. Не намагайтеся утримати чоловіка, пропонуючи разом поснідати або приносячи каву з пончиками у ліжко. Якщо ви це запропонуєте, то він напевно втече снідати у будь-яку кав'ярню. Вранці спокійно займайтеся своїми справами: зачісуйте, чистіть зуби, робіть зарядку, варіть каву. Напевно, в такій ситуації чоловік почне масажувати вам плечі, запропонує зайнятися сексом або відправитися в якесь чудове місце для сніданку.

Якщо ви зустрічаєтеся з чоловіком місяць-другий і не збираєтеся займатися з ним сексом, справедливо дати йому знати. Інакше ви будете просто дражнити його. Але що, якщо сексу вам хочеться значно більше, ніж йому? "Правила" дають нам таку відповідь на це питання: не хочете проблем - не замовляйте про секс. Коли ваші стосунки стануть серйозними, коли ви зрозумієте, що він з розуму від вас сходить, тільки тоді можна буде заговорити про це - ненароком і жартома.

І, нарешті, займайтеся сексом лише з презервативами. Не піддавайтеся на вмовляння, що це буде лише разок. Пам'ятайте: ви – дівчина «Правил» і можете подбати про себе.

Вперше про теорію близькості я прочитав 2007 року. Вона була сформульована так: «об'єкти, розташовані близько один до одного, сприймаються пов'язано». Тоді я подумав: «Дякую, Кеп! Я якось і сам здогадався, що літеру “М” треба вішати ближче до чоловічого туалету, а не жіночого». Тоді я не зрозумів, що це одне з головних правил дизайну, яке допомагає підбирати відстані між елементами, розміри полів, розташування кнопок, розмір логотипів та багато іншого. А головне, теорія дозволяє швидко зрозуміти, чи хороший перед вами дизайн чи ні, навіть якщо ви не дизайнер.

Зазвичай теорію близькості ілюструють різними геометричними фігурами, які то ближчі, то далі один від одного. Це очевидно, як і саме формулювання теорії, але коли справа доходить до практики, виникають проблеми. Тому спробую пояснити основи теорії з прикладу букв:

Навіть тут теорія близькості починає працювати: літери в словах мають бути ближчими один до одного, ніж слова. Як тільки відстань між літерами наближається до ширини пробілу, настає хаос:

Це очевидно, але давайте застосуємо те саме правило до відстані між рядками. Що має бути пов'язане сильніше: рядки чи слова у рядках? Очевидно, що слова пов'язані сильніше, тому й відстані між словами мають бути відчутно ближчими, ніж між рядками. Що означає відчутно ближче? Якщо зробити міжрядкову відстань в півтора рази більше пробілу, вони почнуть явно відрізнятися:


Для порівняння - тут міжрядковий інтервал (інтерліньяж) перетиснутий і майже дорівнює ширині пропуску:


Відчувається, що його треба збільшити, але наскільки? Завдяки теорії близькості ми знаємо відповідь: щоб він став відчутно більше ширини пропуску. Багато дизайнерів роблять це на рівні інтуїції без розуміння внутрішньої логіки. У когось виходить краще, у когось гірше.

Допустимо, нам треба розмістити текст на плашці. Теорія близькості працює як гравітація- об'єкти, які виглядають масивнішими «притягують» до себе дрібніші. А межі формату, чи то сторінка книги, вікно браузера чи край візитівки, можна уявити як межі з масивною чорною діркою – коли ми наближаємося до них, починає працювати зовнішнє тяжіння. Розташуємо текст на плашці:


Начебто все акуратно і рівно. Але якщо згадати теорію близькості, можна зрозуміти, що відступи від краю «сперечаються» з відстанню між абзацами, тобто вони майже рівні:


Потрібно зробити відступи відчутно більше відстані між абзацами, тоді однозначно сприйматиметься, що вони всередині формату, а не прагнуть назовні:


Давайте додамо заголовок:


Такої помилки дизайнери припускаються найчастіше. Заголовок або підпис мають однозначно ставитись до тексту. На практиці заголовки часто зависають рівно посередині між двома текстами або у відстань між заголовком і текстом втручається ілюстрація:

Давайте зверстаємо заголовок і текст слідуючи логіці теорії близькості: букви в словах пов'язані сильніше слів, слова пов'язані сильніше рядків, рядки пов'язані сильніше абзаців, абзаци пов'язані сильніше заголовка і тексту, заголовок разом із текстом пов'язані всередині формату. Це допоможе підібрати правильні відстані:


Користуючись теорією близькості, легко перейти від абстрактних «надто близько до краю» до конкретики: «підпис має бути ближчим до поля, до якого він відноситься, ніж до краю форми». Наприклад, у цій анімації дизайн форми крок за кроком змінюється за допомогою теорії близькості, і логічно пов'язані елементи стають ближчими один до одного:


Так, пов'язуючи та розділяючи елементи відстанню та масою, можна робити логічні та акуратні сайти, презентації, буклети. З іншого боку, теорія близькості допомагає об'єктивно оцінювати дизайн. Наприклад, тут дизайнер не морочився і розставив елементи абияк:

Відразу не зрозуміло, у якої новини який час публікації, заголовок завис між текстом та ілюстрацією. Знаючи теорію близькості легко зрозуміти, чи думав дизайнер про зручність сприйняття, а також легко дати чіткі інструкції щодо покращення. Поки інші просять «додати повітря» або «зачесати дизайн», з теорією близькості можна бути конкретним: «заголовок має бути ближчим до новини, до якої він відноситься». Звичайно, стовідсоткової точності до пікселя не можна домогтися, але можна зробити великий крок у бік об'єктивності, чого в дизайні так не вистачає.

Сподіваюся, мені вдалося пояснити основи теорії близькості не надто абстрактно, але й не дуже заплутано. Думаю, вони допоможуть вам, як і мені колись, краще розуміти логіку дизайну та перейти від суб'єктивних відчуттів до конкретних та логічних дій.

Багато дизайнерів-початківців дуже часто роблять одну і ту ж помилку: проектуючи сайт або додаток, вони прагнуть заповнити елементами дизайну весь наявний простір. Ця страх порожнечі – одна з ознак новачка. Тим часом робота з білим або, як його іноді називають, негативним простором вимагає серйозного підходу. Біле місце – це все те, що оточує елементи дизайну, це порожнеча, яка на перший погляд не виконує якоїсь корисної функції. Але це лише на перший погляд. Елементами білого простору є:

• Поля та відступи
• Простір навколо зображень та графічних елементів
• Міжрядковий інтервал та відстань між літерами

І хоча деякі люди можуть вважати всі різновиди порожнечі марною тратою цінного простору, всі вони є дуже важливими елементами дизайну. Фактично всі поля, прогалини та відступи так само важливі, як і сам контент. Цю думку дуже чітко висловив Ян Чічолд: «Порожній простір слід розглядати як активний елемент, а не пасивне тло».

Всі добре спроектовані інтерфейси користувача відрізняються правильним співвідношенням порожнього простору і елементів дизайну. Відступи і поля можуть бути настільки ж важливими, як і все інше, хоча б тому, що кнопкам, логотипам, текстам та іншим об'єктам потрібне «повітря» інакше вийде візуальна каша.

Поліпшення читання тексту

Білий простір, якщо його використовувати зі знанням справи, може значно підвищити читання тексту. І навпаки, надто завантажена сторінка, де символам та рядкам надто тісно, ​​лише відштовхуватиме користувачів – люди не люблять читати негарно зверстані тексти. Дослідження показали, що правильне використання порожнього простору збільшує розуміння тексту на 20%. Це дуже високий показник, тому до порожнечі потрібно поставитися з усією серйозністю.

Є два основні моменти, які слід враховувати при оптимізації текстового вмісту: це межі абзаців та міжрядковий інтервал, тобто пробіл між двома сусідніми рядками. Міжрядковий інтервал може значно покращити читання. Як правило, чим більше інтервал, тіл краще досвід користувача, який переглядає сторінку. Однак все добре в міру - занадто великі прогалини ускладнюють читання, заважаючи погляду вільно переміщатися від одного рядка до іншого.

Уточнення співвідношення елементів

Будь-який макет є сумою всіх його частин, але співвідношення між усіма частинами визначається навколишнім простором. каже, що об'єкти, які розташовані поруч, здаються нам схожими. У цьому випадку порожній простір посилає користувачу чіткий сигнал, відокремлюючи один елемент від іншого. Погляньте на зображення нижче:

Ось як працює правило близькості - практично кожен, хто дивиться на картинку, помічає дві групи однакових кіл, просто один вертикальний вертикальний, а інший горизонтальний. Думка про те, що це 12 однакових кіл, приходить пізніше, та й то, за певного контексту. Отже, якщо дизайнеру потрібно поєднати однотипні елементи в єдиний візуальний блок, йому потрібно розташовувати їх поряд. Але якщо елементи різні та виконують різні функції, відстань між ними потрібно збільшити настільки, наскільки це дозволяє зробити загальна композиція макета.

У випадку з інтерфейсами користувача це означає, що об'єкти, що знаходяться в безпосередній близькості однозначно сприймаються як блок. Тому при створенні різних веб-форм рекомендується розміщувати заголовки та мітки поруч із відповідними полями для введення даних. Коли заголовки та підписи розташовані ближче до полів, відносини між ними стають максимально зрозумілими для користувача.

Дизайнер може використовувати порожній простір для того, щоб повідомити користувача щось важливе, те, що має бути помітним з першого погляду. Відстань між об'єктами та приверненням уваги має міцний зв'язок – чим більша відстань, тим більше уваги привертає об'єкт. Відсутність інших елементів поблизу призведе до того, що об'єкт більше виділятиметься на тлі. Знання цього правила дозволить дизайнеру керувати увагою користувача – оточуючи головні елементи порожнім простором, він «вестиме» погляд глядача від однієї частини дизайну до іншої. Порожнеча навколо елемента змушує подивитися на нього просто тому, що поряд нічого більше немає. При цьому білого простору не повинно бути занадто багато – інакше в дизайні зникне логіка, і люди перестануть сприймати співвідношення між елементами.

Візуальна ієрархія

Коли білий простір використовується належним чином, він створює на сторінці баланс і візуальний потік, що дозволяє краще донести ідею через дизайн. Простір між частинами контенту та графічними елементами допомагає підтримувати загальну ієрархію у макеті. Також не варто забувати про симетрію та асиметрію. Симетрія дозволяє створити гармонію в дизайні.

Mailchimp, як можна побачити з наведеного вище прикладу, є великим прихильником використання порожнього простору у всіх своїх проектах. Коли відвідувач потрапляє на головну сторінку Mailchimp, кнопка безкоштовної реєстрації Sign Up Free привертає увагу майже відразу. Використовуючи симетрію, дизайнер може створити збалансоване компонування з однаково важливими правими та лівими частинами макета.

Асиметрія, у свою чергу, чудово підходить для привернення уваги до певної області сторінки. Коли якийсь елемент асиметричний по відношенню до інших елементів і при цьому оточений досить великим білим простором, він відразу виділяється, буквально притягуючи до себе погляд користувача.

Висновок

Біле місце це не порожнеча, це потужний інструмент проектування. Вона така ж важлива, як і простір, що займається різними об'єктами – текстом, зображеннями та елементами навігації. Порожній простір виконує свою функцію та підтримує візуальну цілісність макета. І хоча все це видається досить простим, правильно використання негативного простору важко освоїти, тому що це одночасно наука та мистецтво. Розуміння того, скільки порожнього місця має бути в макеті, потребує знань та постійної практики.