→ Сторінка чорний фон. Як легко зробити темне тло в ПК на комп'ютері в браузері або на телефоні з Андроїд? Як зробити темну тему на телефоні Android

Сторінка чорний фон. Як легко зробити темне тло в ПК на комп'ютері в браузері або на телефоні з Андроїд? Як зробити темну тему на телефоні Android

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

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

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

Отже, без зайвих слів, давайте вивчити цю чорну матерію далі!

Трохи про дизайн із чорним фоном

Кінцева мета дизайнерів - зробити контент сайту привабливим і таким, що виділяється з подібних. Однак ще більша мета (якщо не найголовніша) – створити веб-сайт, який служить його меті. Ось що вам потрібно знати: дизайнери повинні наголошувати на важливих елементах. Це їхня мета у всьому, що вони роблять, і їхнє завдання - створити ієрархію в цьому акцентуванні, щоб виділити найважливіші деталі на веб-сайті.

Чорний ідеально підходить, якщо ви хочете підкреслити щось на тлі іншого кольору, особливо на білому. Білий колір є порожнім стартом у нашому досвіді (він позначає денне світло, чистий папір, сторінку без контенту тощо), тоді як колір чорний вважається нічим іншим, як будь-яким іншим кольором, наприклад контентом. Ось чому білий колір є першим вибором для веб-сайту фону.

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


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

Насправді це звучить так:

  • Не використовуйте чорний колір, якщо у вас занадто багато вмісту.
  • Будьте особливо обережні з текстом на чорному / темному тлі.
  • Ви можете вільно використовувати чорний фон для зображень та графічних елементів.
  • Добре використовувати чорне тло для невеликих елементів, показуючи їх в іншому кольорі.

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

У чому проблема із чорним кольором?

Головна з них полягає в тому, що люди вважають його менш привабливим, ніж інші кольори.

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

Було доведено знову і знову, що люди очікують побачити білий колір, коли вони приходять на веб-сайт, і вони відчувають себе знайомими та в безпеці з ним. Ось чому експерти UX не надто зацікавлені у зміні стандартного білого на нетрадиційний чорний.

Як бачите, проблема із чорним кольором фону реальна.

Отже, чи є місце для темних фонів у дизайні?

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

  • Портфоліо
  • Студії дизайну
  • Ексклюзивні презентації продукції
  • Нетрадиційний контент





Насамперед: навіть при використанні чорного фону важливо створити багато «білого простору», тому що чорна поверхня візуально менша. Біле тло також є «розривом», який є річчю, яка відсутня на темному тлі. Також важливо ретельніше перевірити зручність використання. За досвідом, ви ніколи не повинні використовувати тоніки шрифту, і він завжди повинен бути на 2 або 3 пікселі більше, ніж той же шрифт на білому тлі.

Як уже згадувалося, найбільша проблема з чорним тлом - читання, і кожен дизайнер повинен знати, як з нею поводитися (підказка: збільшення розміру шрифту, кернінг).

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

На що вам потрібно звернути увагу, то це те, які кольорові відтінки ви використовуєте. Це стосується того, як ви завжди повинні використовувати тонований чорний колір у дизайні і що цей відтінок повинен виходити з основного кольору, який ви використовуєте. У прикладах, які додані, використовуються тоновані та справжні чорні (#000), тому я думаю, що ідея не є обов'язковою.

Ідея відтінити базовий колір походить від природи, де дуже важко побачити відтінки #000000 і #ffffff (не тільки через формат).

Інша проблема полягає в тому, що нічні режими використовують саме це «проблемне» компонування (чорне тло). Кожне розширення браузера та інструмент для оптимізації у темному оточенні пропонує можливість використовувати темне тло та білий текст. Крім того, якщо можна змінити навколишній колір у додатку, завжди є варіант чорного фону.

Ситуації, в яких ви завжди можете використовувати чорний фон

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

  • Виділені розділи
  • Хедер, футер, навігація,

Google Chrome або Яндекс БраузерІноді може відображатися чорний екран на комп'ютері під керуванням Windows 10/8/7. Є багато причин, чому браузер може відображати чорний екран у Windows. Якщо ви часто стикаєтеся з проблемою, коли з'являється чорний екран у Google Chrome або Яндекс Браузер, то розберемо кілька причин, які можуть допомогти вам вирішити цю проблему. Я буду спиратися на прикладі "гугл хрому", але яндекс браузер зроблений так само, так що я думаю у вас не буде при вирішенні проблем.

1. Вимкнути розширення браузера

Розширення можуть спричинити проблеми. У моєму випадку саме розширення LastPass для Chrome створило чорний екран у браузері. Тому якщо ви встановили деякі розширення в Google Chrome, Яндекс Браузер, і у вас виникає проблема у вигляді чорного екрану. Вимкніть усі розширення та перевірте, чи вирішує це проблему чи ні. Якщо вирішує, потрібно включити встановлені розширення один за одним, щоб дізнатися проблемне розширення. Після з'ясування ви можете перевстановити його або видалити назавжди.

2. Вимкнути апаратне прискорення

За умовчанням Google Chrome Яндекс Браузер використовують апаратне прискорення для підвищення продуктивності. Однак, іноді ваше обладнання (точніше, графічний процесор) може не відповідати вимогам. Отже, можна бачити чорний екран. У цьому випадку ви можете спробувати вимкнути апаратне прискорення з панелі налаштувань. Для цього відкрийте сторінку налаштувань Google Chrome або Яндекс Браузера:

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

3. Вимкнути flags Chrome

Якщо ви використовуєте Chrome або Яндекс браузер протягом тривалого часу, ви, напевно, знаєте, що є деякі параметри, доступні за адресою Chrome://flags. Вам потрібно вимкнути деякі прапори, щоб перевірити, чи вирішена проблема. Для цього відкрийте браузер і введіть ось таку адресу Chrome://flagsу рядку URL. Після цього знайдіть такі прапори та відключіть їх:

  • GPU compositing on all pages
  • Threaded compositing
  • Do SHOW Presents with GD

Примітка:Не у всіх версіях є три ці перелічені опції. Вимкніть що знайдете та перезапустіть браузер.

4. Оновіть або завантажте Adobe Flash Player

Якщо ви ще не завантажили Adobe Flash Player на свій комп'ютер, настав час зробити це. Крім того, якщо у вас встановлена ​​більш стара версія цієї програми, вам слід відразу ж оновити її. Також ви можете зайти на офіційний сайт Adobe і завантажити Flash Player, але ми зробимо вбудованим способом.

  • Введіть адресний рядок браузера chrome://components
  • Знайдіть Adobe Flash Playerта натисніть оновити.

5. Скидання браузера Google Chrome

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


У старій версії браузера на движку Chrome 29 цей параметр не включений за замовчуванням, потрібно його активувати, для цього робіть такі кроки:

  • Введіть в адресному рядку браузера Chrome://flags
  • Знайдіть Enable Reset Profile Settingsта натисніть увімкнути.
  • Тепер введіть chrome://settings, натисніть "Додаткові параметри" і прокрутіть вниз.
  • У самому низу ви побачите нову функцію у старому браузері Chrome. Скинути налаштування браузера".

Вітаю. Спочатку невеликий вступ:
Я працюю в тьмяно освітленому приміщенні і, як наслідок, не витримую яскраві білі фони. Тому я використовую розширення Stylish https://addons.opera.com/ru/extensions/details/stylish/ . Це розширення дозволяє встановлювати теми (чорні зокрема) на різних веб-сайтах, які добрі люди світу цього викладають і оновлюють на веб-сайті https://userstyles.org/.
Сам користуюсь Opera, але описана далі проблема поширюється на всі браузери без винятку.

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

Кроки, щоб відтворити проблему (це приклад, не обов'язково мають бути саме ці сайти):
1). Зайти на сайт https://translate.google.com/ https://userstyles.org/styles/134994/dark-google-t...
2). Далі перейти на сайт https://en.wikipedia.org/wiki/White, із заздалегідь встановленою на ньому темою: https://userstyles.org/styles/42313/dark-wikipedia

Що я хочу зробити:
Змінити колір цієї білої сторінки на темно-сірий/чорний колір. Зауважу, якщо сторінка закешована, то це тло не з'являється, що природно.

Також зауважу, що на деяких сайтах колір "провантажувальної" сторінки змінений творцями сайту на темний (тобто проблема можна вирішити). І ще те, що я знаходив вирішення цієї проблеми, але не знав, як їх застосувати. Наприклад: https://superuser.com/questions/580228/prevent-whi... . Навіть якщо опустити той факт, що це рішення, мабуть, більше не діє, я все одно не знаю, що мені робити з цими кодами. Наслідування наведених "інструкцій" мене ні до чого не приводило.

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

  • Питання задано більше року тому
  • 2797 переглядів

Створюючи яндекс, розробники дбали про те, щоб він був легким і зрозумілим у використанні.

У налаштуваннях оформлення та шрифту немає нічого зайвого, тому користувачі швидко зможуть зрозуміти, що до чого.

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

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

На те, щоб змінити вигляд свого Яндекс браузера, вам знадобиться тільки відволіктися на пару хвилин:

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

Можете не турбуватися про те, що кожного разу потрібно змінювати тло — цього не потрібно. Тепер щоразу при попаданні в «Експрес-панель» (навіть якщо ви закривали і знову відкривали яндекс) ви насолоджуватиметеся приємною картиною. А працювати з піднятим настроєм набагато цікавіше та легше!

Чи можна встановити на тлі щось своє?

Догодити кожному користувачеві пропонованими для зміни фону зображення розробники Яндекса, звичайно, не можуть. Переглянувши повний перелік доступних малюнків і не знайшовши нічого придатного, не засмучуйтесь.

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

Для того, щоб встановити на фон картинку зі свого пристрою, вам потрібно:

  • увімкнути Яндекс;
  • відкрити нове підвікно;
  • знайдіть функцію «Змінити фон» та натисніть на неї;
  • за останнім зображенням є значок "+", на нього вам потрібно натиснути;
  • виберіть фото, яке хочете бачити у браузері, та натисніть введення («Ентер»).

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


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

Вимкнення світла

Дане розширення для браузера Google Chrome створено з метою перегляду роликів на ютубі в нічному режимі, але для інших сайтів, в тому числі і вк, цей додаток дуже класно впишеться.

Все, що вам потрібно буде зробити, це увійти до налаштувань браузера, а потім вибрати «Додаткові інструменти»- "Розширення". Усередині розкрийте пункт «Розширення» та виберіть «Відкрити інтернет-магазин гугл хром».

Тепер, у пошуковому рядку напишіть «Вимкнення світла», або просто перейдіть по цим посиланням. Далі встановіть його у браузер, натиснувши на відповідну кнопку, після чого переходьте до самого ВК.

Темна тема ВК

Ще одне розширення для браузера. Але воно не просто вимикає світло, а робить реально красиву темну тему для контакту. Для того, щоб його активувати, знову йдіть до магазину гугла хром, та наберіть у пошуку «Темна тема вк». Після цього встановлюйте перше розширенняу списку доступних.

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

VK helper

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

Для початку вам потрібно буде зайти знову до магазину розширень та встановити додаток під назвою VK Helper. Для зручності можете відразу перейти по посиланню.

Після цього, зайдіть у дане розширення, яке знаходиться там, де і всі інші аддони, і додайте туди ваш обліковий запис, натиснувши на відповідну кнопку. Далі, вам просто потрібно буде авторизуватися, ввівши свій логін та пароль у форму. Не турбуйтеся за ваші облікові дані. Ви вводите все до офіційної форми ВК, а не до лівої контори.

Коли ваш обліковий запис активується, знову увійдіть у розширення, лише цього разу виберіть пункт «Параметри» . Після цього вам відкриється окреме вікно з багатьма налаштуваннями. Тут є де розгулятися.

У блоці "Інтерфейс" поставте галочку навпроти пункту "Нічна тема". Після цього просто зачиняйте вікно. Усі налаштування автоматично збережуться.

Як зробити темну тему на телефоні Android

На жаль, в офіційному додатку для мобільних телефонів, а також у браузерній веб-версії немає можливості встановлення нічного режиму. Єдиним виходом насолоджуватися чорним фоном — це встановити сторонню програму Play Market.

Насправді таких додатків існує кілька, але найкраще як альтернатива зарекомендував себе Kate Mobile. Воно є повнофункціональним альтернативним клієнтом. Єдиним недоліком даного клієнта є те, що тут не відображається ваша стрічка новин. В іншому це чудова заміна, яка до речі їсть набагато менше ресурсів вашого смартфона.

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

Щоб змінити фон, натисніть на стандартний значок трьох точок у верхньому правому куті екрана, а потім виберіть «Налаштування» . Далі, вибираємо «Зовнішній вигляд» «Тема оформлення». За умовчанням у вас стоїть "Індиго", а вам потрібно буде вибрати "Індиго темна". До речі, можете спробувати й інші фони, наприклад, рожеву, кавову або прозору.

Підсумок

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

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

Ну, а на цьому я закінчую. Обов'язково підписуйтесь на повідомлення мого блогу та паблики у соціальних мережах. Удачі вам. Бувай!

З повагою, Дмитро Костін.

 

 
Це цікаво: