2 added
1 removed
Original
2026-01-01
Modified
2026-02-26
1
<p><strong>Летом 2021 года в блоге Mozilla появилась<a>статья об истории синей гиперссылки</a>. Она очень понравилась читателям и стала очень популярной, но имела мало общего с реальностью. Спустя полгода автор статьи нашла человека, который мог рассказать правду. Эту вторую, правдивую, историю мы для вас и перевели.</strong></p>
1
<p><strong>Летом 2021 года в блоге Mozilla появилась<a>статья об истории синей гиперссылки</a>. Она очень понравилась читателям и стала очень популярной, но имела мало общего с реальностью. Спустя полгода автор статьи нашла человека, который мог рассказать правду. Эту вторую, правдивую, историю мы для вас и перевели.</strong></p>
2
<p>Сделать ссылки синими предложил никому не известный студент из Мериленда. Эта идея побывала на всех конференциях по гипертексту, пока не превратилась в новый тренд. Понадобилось восемь лет, прежде чем тренд стал стандартом отрасли.</p>
2
<p>Сделать ссылки синими предложил никому не известный студент из Мериленда. Эта идея побывала на всех конференциях по гипертексту, пока не превратилась в новый тренд. Понадобилось восемь лет, прежде чем тренд стал стандартом отрасли.</p>
3
<p><em>Это адаптированный перевод статьи<a>Revisiting why hyperlinks are blue</a>, автор -<a>Elise Blanchard</a>, старший UX-дизайнер Mozilla. Повествование ведется от лица автора.</em></p>
3
<p><em>Это адаптированный перевод статьи<a>Revisiting why hyperlinks are blue</a>, автор -<a>Elise Blanchard</a>, старший UX-дизайнер Mozilla. Повествование ведется от лица автора.</em></p>
4
<h2>Содержание</h2>
4
<h2>Содержание</h2>
5
<ul><li><a>Как я начала исследовать историю гиперссылок</a></li>
5
<ul><li><a>Как я начала исследовать историю гиперссылок</a></li>
6
<li><a>Я напала на след</a></li>
6
<li><a>Я напала на след</a></li>
7
<li><a>Как все начиналось</a></li>
7
<li><a>Как все начиналось</a></li>
8
<li><a>Тем временем вне лабораторий</a></li>
8
<li><a>Тем временем вне лабораторий</a></li>
9
<li><a>Воркшоп 1990 года</a></li>
9
<li><a>Воркшоп 1990 года</a></li>
10
<li><a>Поворотный момент</a></li>
10
<li><a>Поворотный момент</a></li>
11
<li><a>Подводя итог</a></li>
11
<li><a>Подводя итог</a></li>
12
<li><a>После публикации</a></li>
12
<li><a>После публикации</a></li>
13
-
</ul><p>Мне стало как-то грустновато после публикации первой статьи. Конечно, в это время ураган Ида пытался снести мой дом, но это мелочи. Загадка синей ссылки все равно меня беспокоила.</p>
13
+
</ul><h2>Как я начала исследовать историю гиперссылок</h2>
14
+
<p>Мне стало как-то грустновато после публикации первой статьи. Конечно, в это время ураган Ида пытался снести мой дом, но это мелочи. Загадка синей ссылки все равно меня беспокоила.</p>
14
<p>При работе над прошлой статьей я узнала только то, что первым браузером, который стал использовать синий цвет гиперссылок, был<a>Mosaic</a>.</p>
15
<p>При работе над прошлой статьей я узнала только то, что первым браузером, который стал использовать синий цвет гиперссылок, был<a>Mosaic</a>.</p>
15
<p>Но я так и не выяснила, почему для ссылок выбрали именно синий цвет. Много лет ссылки вообще не выделяли никаким цветом, зачем и почему начали это делать?</p>
16
<p>Но я так и не выяснила, почему для ссылок выбрали именно синий цвет. Много лет ссылки вообще не выделяли никаким цветом, зачем и почему начали это делать?</p>
16
<p>Я подозреваю, что дело в распространении RGB-мониторов. Но тогда у нас появляется целая палитра возможных цветов, почему все же синий цвет? Почему не зеленый? Зелеными были ссылки в Microsoft 3.1, например. Да и потом, создатели Mosaic вряд ли выбрали синий цвет без всякой причины.</p>
17
<p>Я подозреваю, что дело в распространении RGB-мониторов. Но тогда у нас появляется целая палитра возможных цветов, почему все же синий цвет? Почему не зеленый? Зелеными были ссылки в Microsoft 3.1, например. Да и потом, создатели Mosaic вряд ли выбрали синий цвет без всякой причины.</p>
17
<p>В общем, меня мучили эти вопросы, поэтому я и написала ту, первую, статью: надеялась, что люди в комментариях укажут на мои заблуждения и вместе мы докопаемся до истины.</p>
18
<p>В общем, меня мучили эти вопросы, поэтому я и написала ту, первую, статью: надеялась, что люди в комментариях укажут на мои заблуждения и вместе мы докопаемся до истины.</p>
18
<p>Прошло два месяца с тех пор, как закрутилась моя первая статья (и мой дом в том урагане, хех). Пришло время снова взяться за расследование!</p>
19
<p>Прошло два месяца с тех пор, как закрутилась моя первая статья (и мой дом в том урагане, хех). Пришло время снова взяться за расследование!</p>
19
<h2>Я напала на след</h2>
20
<h2>Я напала на след</h2>
20
<p>Сижу я и пью свою первую чашку кофе, читаю гневные комментарии к своим статьям - ну знаете, обычная утренняя рутина. И тут вижу такое! Комментарий от<a>Дона Хопкинса</a>, где он советует поговорить с неким<a>Беном Шнейдерманом</a>.</p>
21
<p>Сижу я и пью свою первую чашку кофе, читаю гневные комментарии к своим статьям - ну знаете, обычная утренняя рутина. И тут вижу такое! Комментарий от<a>Дона Хопкинса</a>, где он советует поговорить с неким<a>Беном Шнейдерманом</a>.</p>
21
<p>На самом деле<em>профессор</em>Бен Шнейдерман - это тот человек, благодаря которому гиперссылки и стали синими. Но тогда я этого еще не знала и просто написала ему. Профессор подробно рассказал все, что я хотела знать - и это было невероятно. Все байки, исторические факты и старые программы внезапно соединились, чтобы показать мне невероятной красоты картину.</p>
22
<p>На самом деле<em>профессор</em>Бен Шнейдерман - это тот человек, благодаря которому гиперссылки и стали синими. Но тогда я этого еще не знала и просто написала ему. Профессор подробно рассказал все, что я хотела знать - и это было невероятно. Все байки, исторические факты и старые программы внезапно соединились, чтобы показать мне невероятной красоты картину.</p>
22
<p>Ниже я привожу наш разговор и показываю на некоторые источники, которыми меня снабдил профессор Шнейдерман. Еще я добавила пару фактов из предыдущей статьи. Я как могла постаралась показать связь между работой профессора и утверждением синего цвета для гиперссылок в браузере Mosaic.</p>
23
<p>Ниже я привожу наш разговор и показываю на некоторые источники, которыми меня снабдил профессор Шнейдерман. Еще я добавила пару фактов из предыдущей статьи. Я как могла постаралась показать связь между работой профессора и утверждением синего цвета для гиперссылок в браузере Mosaic.</p>
23
<h2>Как все начиналось</h2>
24
<h2>Как все начиналось</h2>
24
<p><strong>Дата: 1985 год</strong></p>
25
<p><strong>Дата: 1985 год</strong></p>
25
<p><strong>Место действия: Университет Мэриленда. Лаборатория по исследованию<a>человеко-компьютерного взаимодействия</a></strong></p>
26
<p><strong>Место действия: Университет Мэриленда. Лаборатория по исследованию<a>человеко-компьютерного взаимодействия</a></strong></p>
26
<p>Бен Шнейдерман только развил идею, которую предложил один из его студентов, Дэн Остов. Вместе они провели множество экспериментов - конечно, при участии других студентов старших курсов.</p>
27
<p>Бен Шнейдерман только развил идею, которую предложил один из его студентов, Дэн Остов. Вместе они провели множество экспериментов - конечно, при участии других студентов старших курсов.</p>
27
<blockquote><p>"Красная подсветка хорошо выделяла текст, но затрудняла чтение и запоминание. Синий же цвет хорошо читался, причем неважно, черным или белым был фон", - из письма профессора Шнейдермана.</p>
28
<blockquote><p>"Красная подсветка хорошо выделяла текст, но затрудняла чтение и запоминание. Синий же цвет хорошо читался, причем неважно, черным или белым был фон", - из письма профессора Шнейдермана.</p>
28
</blockquote><p><strong>Дата: 1982 год</strong></p>
29
</blockquote><p><strong>Дата: 1982 год</strong></p>
29
<p><strong>Место действия: HyperTIES</strong></p>
30
<p><strong>Место действия: HyperTIES</strong></p>
30
<p>Окей, может это не совсем место действия. HyperTIES - это система для гипертекстовой разметки, которую придумали в Cognetics Corporation. Компания была первопроходцем в своей области. Именно в HyperTIES впервые внедрили идею синей гиперссылки - конечно, после проведения всех экспериментов в лаборатории Мэриленда.</p>
31
<p>Окей, может это не совсем место действия. HyperTIES - это система для гипертекстовой разметки, которую придумали в Cognetics Corporation. Компания была первопроходцем в своей области. Именно в HyperTIES впервые внедрили идею синей гиперссылки - конечно, после проведения всех экспериментов в лаборатории Мэриленда.</p>
31
<p><strong>Дата: апрель 1986 года</strong></p>
32
<p><strong>Дата: апрель 1986 года</strong></p>
32
<p><strong>Место действия: Журнал<a>Communications of the ACM</a></strong></p>
33
<p><strong>Место действия: Журнал<a>Communications of the ACM</a></strong></p>
33
<p>Исследования о синей ссылке<a>попали в уважаемое отраслевое издание</a>. Профессор Шнейдерман написал эту статью в соавторстве со своим студентом,<a>Ларри Коведом</a>, который сейчас работает в исследовательском центре IBM.</p>
34
<p>Исследования о синей ссылке<a>попали в уважаемое отраслевое издание</a>. Профессор Шнейдерман написал эту статью в соавторстве со своим студентом,<a>Ларри Коведом</a>, который сейчас работает в исследовательском центре IBM.</p>
34
<p><strong>Дата: ноябрь 1987 года</strong></p>
35
<p><strong>Дата: ноябрь 1987 года</strong></p>
35
<p><strong>Место действия: The Hypertext Conference, Северная Каролина</strong></p>
36
<p><strong>Место действия: The Hypertext Conference, Северная Каролина</strong></p>
36
<p>Синюю ссылку обсуждали на самой первой конференции, посвященной гипертекстовой разметке. Это было групповое заседание, где профессор рассказывал об<a>интерфейсе</a>, разрабатываемом для Cognetics Corporation (пионеры гипертекста, помните?).</p>
37
<p>Синюю ссылку обсуждали на самой первой конференции, посвященной гипертекстовой разметке. Это было групповое заседание, где профессор рассказывал об<a>интерфейсе</a>, разрабатываемом для Cognetics Corporation (пионеры гипертекста, помните?).</p>
37
<p>Вот что профессор<a>сказал</a>на той конференции:</p>
38
<p>Вот что профессор<a>сказал</a>на той конференции:</p>
38
<blockquote><p>"Мы провели примерно 20 эмпирических исследований, где рассматривали самые разные варианты интерфейсов, представленные на этой конференции или опубликованные в книгах и журналах. Мы рассмотрели следующие элементы: светло-синий цвет гиперссылок, концепция стека для истории браузера, кнопку назад, длина статей, глобальный поиск".</p>
39
<blockquote><p>"Мы провели примерно 20 эмпирических исследований, где рассматривали самые разные варианты интерфейсов, представленные на этой конференции или опубликованные в книгах и журналах. Мы рассмотрели следующие элементы: светло-синий цвет гиперссылок, концепция стека для истории браузера, кнопку назад, длина статей, глобальный поиск".</p>
39
</blockquote><p><strong>Дата: апрель 1988 года</strong></p>
40
</blockquote><p><strong>Дата: апрель 1988 года</strong></p>
40
<p><strong>Место действия: Журнал Communications of the ACM</strong></p>
41
<p><strong>Место действия: Журнал Communications of the ACM</strong></p>
41
<p>Шнейдерман подвел итог лабораторной работе, опубликовав<a>серию статей</a>в журнале ACM. Получилось девять работ, серию назвали: "Hypertext on Hypertext".</p>
42
<p>Шнейдерман подвел итог лабораторной работе, опубликовав<a>серию статей</a>в журнале ACM. Получилось девять работ, серию назвали: "Hypertext on Hypertext".</p>
42
<h2>Тем временем вне лабораторий</h2>
43
<h2>Тем временем вне лабораторий</h2>
43
<p>В 1989 Тим Бернерс-Ли опубликовал статью<a>Информационный менеджмент: моё предложение</a>, в которой затронул много интересных тем, в том числе вопрос гипертекстовой разметки. Вот что он написал:</p>
44
<p>В 1989 Тим Бернерс-Ли опубликовал статью<a>Информационный менеджмент: моё предложение</a>, в которой затронул много интересных тем, в том числе вопрос гипертекстовой разметки. Вот что он написал:</p>
44
<blockquote><p>"Возрастает количество исследований, посвященных гипермедиа - как в университетах, так и в частных лабораториях. Как итог, новые решения для гипертекста появились в некоторых коммерческих продуктах. Кроме того, было две конференции, посвященные гипертексту, а еще нас ждет воркшоп в следующем году. Академиков прежде всего интересует то, как с гигантским информационным пространством взаимодействует человек. Перед нами множество проблем: нам нужна легкая навигация, но при этом мы не хотим страдать от чувства информационной перегрузки. Я не хочу обесценить достижения академического сообщества и все же скажу, что большинство пользователей используют терминалы, а потому вопрос сложного интерфейса для нас сейчас не так актуален".</p>
45
<blockquote><p>"Возрастает количество исследований, посвященных гипермедиа - как в университетах, так и в частных лабораториях. Как итог, новые решения для гипертекста появились в некоторых коммерческих продуктах. Кроме того, было две конференции, посвященные гипертексту, а еще нас ждет воркшоп в следующем году. Академиков прежде всего интересует то, как с гигантским информационным пространством взаимодействует человек. Перед нами множество проблем: нам нужна легкая навигация, но при этом мы не хотим страдать от чувства информационной перегрузки. Я не хочу обесценить достижения академического сообщества и все же скажу, что большинство пользователей используют терминалы, а потому вопрос сложного интерфейса для нас сейчас не так актуален".</p>
45
</blockquote><p>Разумеется, я лишь предполагаю, что Бернерс-Ли включает в свои выводы синюю ссылку. Но это справедливое предположение, поскольку он приводит все источники, где синяя ссылка упоминалась. Но при этом браузер, который сам Бернерс-Ли в тот момент разрабатывал, не использовал синий цвет для гиперссылок. Браузер назывался<a>WWW</a>.</p>
46
</blockquote><p>Разумеется, я лишь предполагаю, что Бернерс-Ли включает в свои выводы синюю ссылку. Но это справедливое предположение, поскольку он приводит все источники, где синяя ссылка упоминалась. Но при этом браузер, который сам Бернерс-Ли в тот момент разрабатывал, не использовал синий цвет для гиперссылок. Браузер назывался<a>WWW</a>.</p>
46
<h2>Воркшоп 1990 года</h2>
47
<h2>Воркшоп 1990 года</h2>
47
<p>С 16 по 18 января 1990 года проходил воркшоп по стандартизации гипертекста. Бернерс-Ли участвовал в нем, как и многие другие пионеры области. Несмотря на то, что синий цвет ссылок<a>упоминался</a>, Бернерс-Ли по-прежнему игнорирует этот тренд, рассказывая о воркшопе в личном отчете. А вот официальный отчет все же коснулся темы:</p>
48
<p>С 16 по 18 января 1990 года проходил воркшоп по стандартизации гипертекста. Бернерс-Ли участвовал в нем, как и многие другие пионеры области. Несмотря на то, что синий цвет ссылок<a>упоминался</a>, Бернерс-Ли по-прежнему игнорирует этот тренд, рассказывая о воркшопе в личном отчете. А вот официальный отчет все же коснулся темы:</p>
48
<blockquote><p>"Нас интересует читабельность гипертекста. Возможно, мы будем оценивать ее по тому, не сливаются ли ссылки в единое целое при чтении. Эта оценка приведет к развитию дизайна гипертекстовой разметки в отдельную инженерную дисциплину".</p>
49
<blockquote><p>"Нас интересует читабельность гипертекста. Возможно, мы будем оценивать ее по тому, не сливаются ли ссылки в единое целое при чтении. Эта оценка приведет к развитию дизайна гипертекстовой разметки в отдельную инженерную дисциплину".</p>
49
</blockquote><p>В этой же работе говорится о том, что динамические характеристики гипертекста - это суть современных интерфейсов. Вот что авторы написали об этом в докладе:</p>
50
</blockquote><p>В этой же работе говорится о том, что динамические характеристики гипертекста - это суть современных интерфейсов. Вот что авторы написали об этом в докладе:</p>
50
<blockquote><p>"Представьте себе ссылку, которая меняется со временем. Такой ссылкой может служить закрашенная область, которая меняет расположение, цвет и размер, чтобы привлечь к себе больше внимания. Еще мы могли бы использовать небольшую анимацию".</p>
51
<blockquote><p>"Представьте себе ссылку, которая меняется со временем. Такой ссылкой может служить закрашенная область, которая меняет расположение, цвет и размер, чтобы привлечь к себе больше внимания. Еще мы могли бы использовать небольшую анимацию".</p>
51
</blockquote><h2>Поворотный момент</h2>
52
</blockquote><h2>Поворотный момент</h2>
52
<p>В конце 80-х воркшопы и конференции оказывали гигантское влияние на индустрию. Там люди обменивались идеями, обсуждали тренды и утверждали новые стандарты. В результате гиперссылка все же обрела синий цвет.</p>
53
<p>В конце 80-х воркшопы и конференции оказывали гигантское влияние на индустрию. Там люди обменивались идеями, обсуждали тренды и утверждали новые стандарты. В результате гиперссылка все же обрела синий цвет.</p>
53
<p>Надо понимать, что в то время понятие гипертекста предполагало не только использование ссылок. Сюда также включали кнопки<em>закрыть окно</em>,<em>назад</em>,<em>вперед</em>,<em>печать</em>. И как мы уже узнали, большое внимание уделялось визуальной динамике.</p>
54
<p>Надо понимать, что в то время понятие гипертекста предполагало не только использование ссылок. Сюда также включали кнопки<em>закрыть окно</em>,<em>назад</em>,<em>вперед</em>,<em>печать</em>. И как мы уже узнали, большое внимание уделялось визуальной динамике.</p>
54
<p><strong>21 октября 1991 года, Macintosh System 7:</strong></p>
55
<p><strong>21 октября 1991 года, Macintosh System 7:</strong></p>
55
<p>При выборе пользователем иконки или текста те меняли цвет на синий.</p>
56
<p>При выборе пользователем иконки или текста те меняли цвет на синий.</p>
56
<p><strong>6 апреля 1992 года, Windows 3.1:</strong></p>
57
<p><strong>6 апреля 1992 года, Windows 3.1:</strong></p>
57
<p>При выборе элемента его текст обретал синюю подсветку.</p>
58
<p>При выборе элемента его текст обретал синюю подсветку.</p>
58
<p><strong>1992 год, HyperTIES</strong></p>
59
<p><strong>1992 год, HyperTIES</strong></p>
59
<p>Из руководства пользователя для принтера HP LaserJet4 мы узнаем, что для кнопок используется синий цвет, а для ссылок - голубой. Этот стандарт пришел из HyperTIES, который мы упоминали в начале статьи, помните?</p>
60
<p>Из руководства пользователя для принтера HP LaserJet4 мы узнаем, что для кнопок используется синий цвет, а для ссылок - голубой. Этот стандарт пришел из HyperTIES, который мы упоминали в начале статьи, помните?</p>
60
<p><strong>1992 год, декабрь. Framemaker 3.0 (на Windows)</strong></p>
61
<p><strong>1992 год, декабрь. Framemaker 3.0 (на Windows)</strong></p>
61
<p>Framemaker - это программа для создания и работы с документами большого размера. Раньше я думала, что синяя ссылка дебютировала именно в Framemaker, но нет. Что любопытно, у программы были и монохромные версии, под другие операционные системы. Спасибо моим коллегам за то, что запустили ради меня эмулятор и сделали скриншот!</p>
62
<p>Framemaker - это программа для создания и работы с документами большого размера. Раньше я думала, что синяя ссылка дебютировала именно в Framemaker, но нет. Что любопытно, у программы были и монохромные версии, под другие операционные системы. Спасибо моим коллегам за то, что запустили ради меня эмулятор и сделали скриншот!</p>
62
<h2>Подводя итог</h2>
63
<h2>Подводя итог</h2>
63
<p>Можем ли мы теперь ответить на вопрос о том, как синяя ссылка попала в первые браузеры? Не совсем. Но мы знаем, что создатели браузера Mosaic вдохновлялись другим браузером 1992 года под названием<a>ViolaWWW</a>, а там были синие гиперссылки. Было ли кроме вдохновения что-то еще? Знали ли они про исследования Шнейдермана или просто пошли за трендом?</p>
64
<p>Можем ли мы теперь ответить на вопрос о том, как синяя ссылка попала в первые браузеры? Не совсем. Но мы знаем, что создатели браузера Mosaic вдохновлялись другим браузером 1992 года под названием<a>ViolaWWW</a>, а там были синие гиперссылки. Было ли кроме вдохновения что-то еще? Знали ли они про исследования Шнейдермана или просто пошли за трендом?</p>
64
<p>Я думаю, такие детали не имеют большого значения. Главная причина в том, что синий цвет для гиперссылок к 1993 году стал стандартом, проделав большой путь за восемь лет. За эти годы синие гиперссылки обсуждали на конференциях и в научных статьях, спорили о них на форумах. Несмотря на критику Бернерса-Ли, индустрия признала: цвет имеет значение. И даже если Mosaic не брал в расчет мнение экспертов, его брали в расчет все вокруг: Macintosh, Microsoft, HyperTIES, LaserJet, Framemaker and<a>Cello</a>. Конечно, это все еще были годы экспериментов, но синий цвет прочно занял свое место.</p>
65
<p>Я думаю, такие детали не имеют большого значения. Главная причина в том, что синий цвет для гиперссылок к 1993 году стал стандартом, проделав большой путь за восемь лет. За эти годы синие гиперссылки обсуждали на конференциях и в научных статьях, спорили о них на форумах. Несмотря на критику Бернерса-Ли, индустрия признала: цвет имеет значение. И даже если Mosaic не брал в расчет мнение экспертов, его брали в расчет все вокруг: Macintosh, Microsoft, HyperTIES, LaserJet, Framemaker and<a>Cello</a>. Конечно, это все еще были годы экспериментов, но синий цвет прочно занял свое место.</p>
65
<p>Мне нравится история синей гиперссылки потому, что синий цвет выбрали в ходе тщательных экспериментов и многочисленных обсуждений. Этот стандарт стал плодом работы всего сообщества.</p>
66
<p>Мне нравится история синей гиперссылки потому, что синий цвет выбрали в ходе тщательных экспериментов и многочисленных обсуждений. Этот стандарт стал плодом работы всего сообщества.</p>
66
<h2>После публикации</h2>
67
<h2>После публикации</h2>
67
<p>После публикации статьи я еще несколько раз контактировала с профессором Шнайдерманом. Он рассказал мне, что Бернерс-Ли был его коллегой. Более того, Бернерс-Ли несколько раз упоминал синие гиперссылки в собственных работах, и всегда ссылался в этом на публикации Шнейдермана для журнала ACM. Теперь мы знаем, что работа, проделанная в Мэриленде, повлияла на множество исследований в этой области!</p>
68
<p>После публикации статьи я еще несколько раз контактировала с профессором Шнайдерманом. Он рассказал мне, что Бернерс-Ли был его коллегой. Более того, Бернерс-Ли несколько раз упоминал синие гиперссылки в собственных работах, и всегда ссылался в этом на публикации Шнейдермана для журнала ACM. Теперь мы знаем, что работа, проделанная в Мэриленде, повлияла на множество исследований в этой области!</p>
68
<p>А еще мои<a>читатели нашли</a>синие гиперссылки в графических рабочих станциях NeXT 1991 года (<a>скриншот</a>). Спасибо вам!</p>
69
<p>А еще мои<a>читатели нашли</a>синие гиперссылки в графических рабочих станциях NeXT 1991 года (<a>скриншот</a>). Спасибо вам!</p>