Pull to refresh

Только разработчики 90-х помнят это

Reading time 5 min
Views 70K
Original author: Zach Holman
Часто ли ты вставлял <blink> в <marquee> тег? Это сейчас Pixar получает все награды, а тогда в 90-х именно этот метод был наивысшим искусством в анимации. Ты был новатором, если совмещал эти теги; личностью, создающей инновацию; человеком, которому все подражали.

Ты был разработчиком в 1990-х.

Но с таким статусом ты понимал, что делал полную хрень, поскольку распространял ужасные стандарты по всему интернету, к которым мы не возвращались с тех самых пор.

Отложим jQuery в сторону, отвлечемся от нереляционных баз данных… У нас есть более важные вещи, о которых и пойдет разговор.


1х1 GIF


должен был получить премии Grammy, Pulitzer, Most Improved, Third Grade Gym Class и какие-нибудь другие. Это самое важное достижение в компьютерной науке со времен появления гиперссылок. Это было не то будущее, которое мы заслужили, это было будущее, в котором мы нуждались (до тех пор пока не появился долбаный box model).

Если кто-то не знаком с трюком, то вот он:

Все еще не видите? Вот он, отступ:
image

Он же spacer.gif или transparent.gif — это всего лишь прозрачное изображение с шириной и высотой в один пиксель в формате GIF. Самый функциональный CSS фреймворк, но с миллиардными размерами файла он полностью оптимизирован под отзывчивый веб. Ты должен был использовать продвинутые атрибуты, чтобы почувствовать всю эту мощь:

<IMG SRC="1x1.gif" WIDTH="150" HEIGHT="250" />

Используя это, мы могли позиционировать что угодно ЛЮБЫМ СПОСОБОМ НА СТРАНИЦЕ. Совместив это с семантически-правильными элементами-контейнерами, у тебя бы получился удивительный результат:

<TABLE>
  <TR>
    <TD><IMG SRC="" WIDTH=300></TD>
    <TD><FONT SIZE=42>Hello welcome to my <MARQUEE>Internet Web Home</MARQUEE></FONT></TD>
  </TR>
  <TR>
    <TD BGCOLOR=RED><IMG SRC="/cgi/webcounter.cgi"/></TD>
  </TR>
</TABLE>

В те дни это был единственный способ вертикального центрирования элементов.

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;


Изображения слишком трудны для тебя? В книге «HTML для чайников» тег <img> не встречал до четвертой главы? Ты счастливчик: "&nbsp" тег уже тут!

Ты можешь сказать себе: «Я знаю абсолютно все о сущности HTML. Что это за ерунда?».

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

PLEASE SIGN  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;MY GUESTBOOK BELOW:
<HR><HR>

Если бы я получал по центу каждый раз, когда писал &nbsp, то в 90-е мне бы этого хватило, чтобы покрыть месячную статью расходов AOL.

Пунктирные подчеркивания и эффект рамки


К концу золотого века HTML на сцене появляется CSS — многообещающий мир разделенного контента и стилей. И мы имеем дело с этой катастрофой до сих пор.

Безусловно, первым нашим применением CSS было удаление подчеркивания ссылок. Внезапно весь интернет превратился в кучу шлака, где текст выглядел как ссылки и ссылки как текст. Пользователи не имели представления куда кликать, но, черт возьми, это не имело значения, потому что мы разрабатывали различные эффекты с курсором. Люди не покидали страницу и водили курсором до тех пор, пока за ним не появлялись двенадцать шаровых молний.

Это было такое захватывающее применение продвинутых технологий. Это было буквально всем, чем мы пользовались из CSS вначале. У меня даже есть доказательство в index.shtml (да черт это SSI) файле 2000 года:

<style type="text/css">
<!--
a:hover {text-decoration: none; color: #000000}
-->
</style>

Это все. И все было инлайновым. Конечно же же речь идет о CSS. Будь уверен, что при наведении на ссылку уберется подчеркивание и цвет поменяется на черный. С этого рождались все интерактивные сайты.

DHTML


Вскоре после того, как мы стали обладателями технологии удаления подчеркивания у ссылок, мы решили совместить это с мощностью показа alert("Welcome to my website!") сообщений при загрузке страницы. CSS и JavaScript объединили силы для формирования Технологии Террора: DHTML.

DHTML, который начиналcя как «распределенный HTML» был финальным пером на нашей шляпе инструментов для разработки. Он выдержал испытание временем гарантируя, что мы можем заставить падать снежинки с верху страницы, создавать меню гармошку, анимируя image map или собственные <marquee>, исключая семантический тег <div>

DHTML способствовал переходу веб-разработки из хобби в полноценную самостоятельную профессию. Сайты наподобии Dynamic Drive предназначались для того, чтобы не изобретать эксклюзивные решения проблемы, а просто скопировать 50 строк кода и все будет исправлено. Фактически DHTML был Twitter Bootstrap'ом современности.

Пиксельные шрифты


Компьютерные экраны не были большими. Точнее, я имею ввиду то, что они были большие, но из-за дерьмовых CRT проекторов было отвратительное разрешение. Поэтому лучшим применением этих пикселей было написание чего-либо маленьким шестипунктным шрифтом.

image

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

Кнопки


Сейчас пойдет речь о том, что многие ненавидят Internet Explorer. Порой мне трудно в это поверить, так как современный IE произошел от самой чистейшей формы браузера — Internet Explorer 4.0

IE 4.0 был воплощением совершенства в браузере. В нем был Active Desktop. В нем были Channels. Да в нем были долбаные Channels — наикрутейшая технология, которую так и не воспринял рынок. IE 4.0 был настолько хорош, что он уже стоял на наших ПК, хотели мы этого или нет.

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

Мы размещали множество кнопок с размером 88x31 пиксель на наших сайтах:
image
Это было повсюду. Это напоминало погоны на форме военного офицера, рассказывающие историю о всех сражениях, которые привели нас туда, где мы сейчас находимся. Другими словами, на каком бы редакторе (само собой Frontpage '98) сайт не создавался, на каком бы сервере он не размещался (Geoсites, идиот), какой аудиторией он не обладал, все равно на нем были эти кнопки.

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

С гордостью подними стакан и сделай для всех на одолжение: вставь чертову тонну &nbsp; в твой следующий pull request, для того, чтобы твоя команда помуд… сь немного.

Примечание переводчика: я начал заниматься сайтостроением лишь в 2006, но отголоски веба 90-х на тот момент были еще заметны. А те же , позиционирование с &nbsp, могущественный DHTML и даже прозрачный GIF (во втором пришествии этого хака для IE PNG Fix) я успел опробовать. Возможно, я чокнутый, но сайты с похожим дизайном, методы/хаки, технологи и возможности того времени у меня вызывают сентиментальные чувства, как к добрыми и милым старикам. Удивляет то, как западные профессионалы (Zach Holman работает в GitHub) критикуют современный веб, когда я дико радуюсь тому, то сейчас есть тени, анимации, градиенты, все округленное и для этого не требуются изображения, а закругленный углы не приходится резать и ставить в bg крайних ячеек таблицы. А скоро совсем исчезнут все ухищрения благодаря Flex Box и Shapes. Про перевод: в некоторых местах (особенно в конце) либо я не правильно перевел, либо я не до конца понимаю достаточно грубый юмор автора.
Tags:
Hubs:
If this publication inspired you and you want to support the author, do not hesitate to click on the button
+109
Comments 188
Comments Comments 188

Articles