CoffeeCup, HotDog и другие: странные и прекрасные HTML-редакторы прошлого

Недавно на Хабре видел публикацию об интернете нулевых и поймал себя на мысли, что порой по нему скучаю. И дело даже не в том, что мне не хватает дизайна или вырвиглазных Flash-баннеров. Каждый лишний килобайт веб-страницы мог привести к тому, что человек просто оттуда уйдет, не дождавшись загрузки. Такие технические ограничения вынуждали веб-мастеров оптимизировать размер изображений и применять массу других приемов, которые позволяли снизить объем передаваемых данных.

Когда-то я тоже занимался подобным, а свой первый веб-сайт и вовсе создавал в обычном блокноте. И лишь спустя несколько лет я познакомился с приложениями, которые сильно упростили жизнь в то время. О них и пойдет речь. Наливайте себе чайку — и добро пожаловать в небольшое путешествие в прошлое.

Современная веб-разработка далеко ушла от классической связки из HTML + CSS. Мы создаем не просто какое-то количество взаимосвязанных друг с другом страничек, а полноценные веб-приложения с помощью довольно сложных фреймворков, вроде React, Vue или Angular. Код, конечно, пишется вручную, но в арсенале веб-разработчиков уже давно лежат продвинутые IDE с автодополнением, линтерами, форматтерами и даже ИИ-помощниками вроде CoPilot.

С другой стороны, рядовые юзеры, дизайнеры и маркетологи все чаще предпочитают использовать WYSIWIG-сервисы (What You See Is What You Get), позволяющие собрать готовый сайт как конструктор. Писать код при этом не нужно, хотя это и допускается. Таким образом, простой сайт можно создать без знаний программирования и за очень короткий срок.

Оба этих направления уже давно перестали конкурировать друг с другом и существуют параллельно. Они изначально выросли из единого набора условий и ограничений Early Web, но при этом пошли разными путями. Если в то время вам нужно было создать сайт, то вы так или иначе сталкивались с HTML-редакторами.

CoffeeCup HTML Editor

1996 год, США, штат Техас, город Корпус-Кристи. Интернет уже активно проникал в жизнь и постепенно становился обыденным явлением. Владелец небольшой кофейни The Raven & The Sparrow Николас Лонго (Nicholas Longo) решил, что будет отличным маркетинговым ходом предложить своим посетителям бесплатный доступ ко всемирной паутине. Купив домен www.coffeecup.com ^[1], он решил, что нужно создать сайт, но столкнулся с тем, что доступных инструментов для этого практически не было.

HTML-код писался в простом текстовом редакторе, а это, мягко говоря, не самый эффективный способ. Так и родилась идея написать собственную программу для редактирования HTML-кода с удобным интерфейсом, который бы позволял сразу просматривать и мгновенно загружать изменения на сервер. Такая программа была создана и получила название по имени домена — CoffeeCup HTML Editor.

Оно распространялось по модели Shareware с пробным периодом в 30 дней и ограниченной функциональностью. Каждое нажатие на любую кнопку интерфейса меняло большую надпись в желтом поле:

• I bet you with this big yellow thing wasn’t here

• Buy now and save on your refills (upgrades)

• Get five, hear that! FIVE more Javascripts when you Register

• A mere 20 bucks… That’s all we ask!

• Go to http://www.coffeecup.com/editor ^[2] to Register

• If we don’t get our money we’ll never do this again…

• In case you missed it, you get Five more Javascripts upon Registration

• Shareware means ‘Try now, pay later’... get the hint?

• [UNREGISTERED] means ‘you want us to starve’

Такой креативный подход не просто веселил пользователей, но и весьма своеобразно намекал на то, что было бы неплохо заплатить автору. Но давайте вначале посмотрим, а стоило ли приложение своей двадцатки. Начнем с настроек: их тут особо и нет. Зато есть смешные названия кнопок. Никаких вам шаблонных OK или Cancel:

Некоторые решения в этом приложении меня до сих пор приятно удивляют. Костяшки домино ни что иное, как уровни заголовков — от H1 до H6:

Выравнивание элементов обозначается чашкой кофе с ручкой влево, вправо и по центру:

Если перейти на вкладку Javascript, то появлялся ряд абсолютно одинаковых кнопок, каждая из которых вставляла разные скрипты — от JS-часов до реакции на перемещение мыши. Понять, какая кнопка за какой скрипт отвечает, можно было, только наведя курсор и увидев текстовую подсказку. Возможно, стоило сделать это выпадающим списком, но разработчик решил, что и так сойдет:

Ну а если вы совсем новичок и решили заглянуть в Help, то, помимо обычного справочника по HTML-тегам, наткнетесь еще и на откровенный стеб со стороны автора:

При нажатии на ссылку голос разработчика поржет над вами и напомнит, что нужно отправить ему 20 баксов. Вот такой любопытный артефакт, хотя постойте…

Оказалось, приложение до сих пор развивается и продается. Стоит уже 29 $, триал на 2 недели, но весьма неплохо прокачалось по своим возможностям. Плюс ненавязчиво продвигает их собственное облачное хранилище S-Drive:

Фирменного стеба и каких-то элементов того славного времени мне найти не удалось. Так что перехожу к следующему приложению, которое тоже было забавным.

HotDog Professional

Переносимся в Мельбурн, Австралия, где в 1995 году молодой новозеландский предприниматель Стив Ауттрим (Steve Outtrim) основал свою софтверную компанию Sausage Software. Столь странное название было вполне в духе свободной, творческой интернет-культуры 90-х. Оно почти такое же веселое, нелепое и запоминающееся, как Digital Juice, Inc., Bigfoot International или FatWire Software.

Идея создания своего HTML-редактора пришла Стиву, когда он безуспешно пытался сверстать веб-страницу с информацией о себе и любимой музыке в HoTMetaL ^[3] от SoftQuad Inc. Раз за разом редактор вылетал в BSOD. Затем то же самое произошло в приложении WebEdit, созданном Nesbitt Software.

Далее все по принципу «если хочешь сделать что-то хорошо, сделай это сам». Вооружившись Visual Basic, Стив написал простой визуальный редактор HTML-кода и назвал его HotDog. Для оформления иконки был выбран вовсе не бутерброд, а «горячая» красная собачья голова:

Несмотря на столь несерьезное название, у Стива действительно получилось сделать отличный визуальный редактор, похожий на стандартное офисное приложение. В большинстве случаев предполагалось, что пользователь будет писать HTML-код вручную, но при этом ему были доступны удобные подсказки и визуальные инструменты.

HotDog Professional позволял решить большинство стандартных задач вроде создания веб-форм. Их можно собирать из отдельных элементов или с помощью специального Form Wizard:

Точно так же, пошагово, в диалоговых окнах пользователю рассказывали и помогали настроить фреймы, таблицы и анимацию. Все это сделало его одним из самых популярных HTML-редакторов в свое время. Во многих учебных заведениях о нем рассказывали как об отличном инструменте для создания веб-сайтов. В 1997 году журнал Wired упомянул HotDog как одно из наиболее популярных приложений в интернете вместе с браузером Netscape Navigator и почтовым клиентом Eudora.

Стоил редактор, к слову сказать, немало. За базовую версию для Windows 95 просили аж 99,95 $, ну а расширения (Snaglets) стоили от 25 $ до 99,95 $. Хочешь поддержку Flash или встроенный редактор изображений — пожалуйста, за дополнительную плату. Как и в случае CoffeeCup, на сайте проекта в 1997 году нашлось место откровенному стебу. Одна из надписей внизу гласила:

We are a cyberware company; all our products are made from 100% Recycled Electrons!

Microsoft FrontPage

Наконец, пришла пора поговорить о самом известном визуальном HTML-редакторе того времени. И создан он был вовсе не Microsoft, а давно забытой компанией Vermeer Technologies Inc. из Кембриджа (штат Массачусетс) в 1995 году. Более того, предполагалось, что FrontPage будет работать не сам по себе, а в паре с серверным приложением Personal Web Server.

Война браузеров сподвигла Microsoft на активные действия, в частности на покупку профильных компаний. Так что в январе 1996 года они попросту поглотили Vermeer Technologies за крупную по тем временам сумму в 133 млн $. Этим они получили сразу два продукта, которые выпустили уже под своим брендом — Microsoft FrontPage и Microsoft Personal Web Server (PWS).

Задача продвижения собственного браузера Internet Explorer предрешила все дальнейшее развитие FrontPage. Он был заточен исключительно на то, чтобы создавать веб-страницы, оптимизированные под IE. При этом он старался максимально скрывать детали HTML-кода, ориентируясь на WYSIWIG. Получалось у него, мягко говоря, так себе, и сгенерированный код порой выдавал неприятные сюрпризы.

Microsoft стремились к тому, чтобы создаваемые при помощи FrontPage веб-сайты давали пользователю уникальный опыт. Делалось это за счет проприетарных тегов и атрибутов (так называемый SmartHTML), которые функционировали только в IE. Разумеется, они не входили в стандарт, разработанный консорциумом W3C, и официально не поддерживались другими браузерами. Самый известный пример — тег <marquee> для создания бегущей строки:

Идеальный сайт, по версии Microsoft, должен был размещаться на их же веб-сервере. Так что Personal Web Server (PWS) был в итоге переименован в Internet Information Services (IIS). Тесная связь с FrontPage была реализована с помощью специального набора серверных плагинов — FrontPage Server Extensions (FPSE). Это позволяло прямо из FrontPage публиковать веб-сайты на удаленном сервере, создавать динамический контент через компоненты WebBot и даже автоматически обновлять ссылки.

Увы, но такой подход принес больше проблем, чем пользы. FPSE, помимо дополнительных возможностей, создали целый ряд брешей в безопасности. Уязвимость в обработчике shtml.dll ^[4] позволяла злоумышленникам заставить утилизировать все ресурсы процессора до перезапуска веб-службы, что приводило к закономерному падению сервера. А поскольку FPSE по умолчанию были активированы на IIS 4.0, 5.0 и 5.1, то это автоматически делало серверы уязвимыми.

2006 год стал окончанием истории Microsoft FrontPage. Последователями стали Microsoft Expression Web и Microsoft SharePoint Designer. Де-факто это был один и тот же продукт, просто первый представлял собой универсальный HTML-редактор для сайтов в сети интернет, а второй — для интранет-порталов на базе Microsoft SharePoint. Первый продержался до 2012, а поддержка второго была прекращена годом позже.

Заключение

Казалось бы, HTML-редакторы сделали невозможное — упростили до предела сложный процесс создания сайта и по логике вещей должны быть востребованы. Но, увы, современному пользователю они фактически не дадут ничего. Причиной этому стал резкий рост сложности веба и значительные изменения в самом процессе разработки.

Мы не пишем готовый HTML-код, а генерируем его. Появилось четкое разделение на Frontend и Backend, который может быть написан вообще на любом языке. Такие сервисы, как GitHub, сильно упростили и стандартизировали работу над проектами для целых команд, а большие нейросетевые модели уже вполне способны написать код веб-приложения за вас.

Но история циклична, поэтому no-code- и low-code-платформы твердо стоят на ногах. Они дают возможность любому пользователю сделать за несколько минут то, на что у профессионального разработчика уйдут часы.

Предлагаем отдать дань уважения тем инструментам, с которых все начиналось. Напишите нам в комментариях, какой HTML-редактор был вашим любимым и почему.