Недавно на Хабре видел публикацию об интернете нулевых и поймал себя на мысли, что порой по нему скучаю. И дело даже не в том, что мне не хватает дизайна или вырвиглазных 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, он решил, что нужно создать сайт, но столкнулся с тем, что доступных инструментов для этого практически не было.

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 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 от 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 позволяла злоумышленникам заставить утилизировать все ресурсы процессора до перезапуска веб-службы, что приводило к закономерному падению сервера. А поскольку 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-редактор был вашим любимым и почему.