HTML = javascript ( php ( $mysql ), $css );
DHTML (Dynamic HTML) – технология изменения веб-страницы на стороне клиента, улучшающая восприятие информации пользователем. Основана на манипуляциях DOM и CSS объектами с помощью JavaScript.

Практика JavaScript и PHP

Из всех языков веб-программирования важнейшим для нас является JavaScript. Кроме тех случаев, когда надо записывать данные на сервер. (Говорят, правда, что JavaScript бывает и для сервера, но мы будем исходить из сегодняшней реальности, когда синонимом понятия «серверный язык» de facto является PHP). Ничего ведь не изменилось. Как и раньше, люди в среднем больше читают, чем пишут. Только раньше они читали газеты и книги, а сейчас – тексты на веб-страницах. А JavaScript (точнее, технология DHTML) как раз и служит для более удобного представления информации читателям (пользователям). 

Эволюция ресурса

В начале этот домен (ir2.ru) был заведён для поиска и обнародования чего-либо интересного на иркутских сайтах (отсюда и название ИР2 – «ИРкутский ИнтеРнет»). Но нам это занятие быстро надоело: нельзя объять необъятное, да ещё Яндекс задавил своим фильтром каталог сайтов irweb.ir2.ru. Тогда мы решили поизучать всякие веб-технологии, а в процессе изучения записывать самые интересные находки. Сначала на сайте dn.ir2.ru – в основном о серверном программировании (PHP, MySQL). Но это тоже быстро надоело (в самом деле, ну что интересного можно сейчас найти в PHP?). И тогда мы (чтобы с чего-то начать) достали из загашников свой старенький учебник HTML и занялись наконец-то настоящим делом – оптимизацией веб-интерфейса.

Потому что клиентская HTML-страница – основа всего. Основа всего Интернета. Сайт может состоять только из HTML-страниц для чтения, которые видит пользователь, но не может состоять только из баз данных и серверных скриптов (которые вообще-то пользователю до лампочки). Бывают, конечно, интернет-магазины или интернет-форумы, когда сайт принципиально невозможен без серверного программирования. Но это особая часть – Интернет для работы или Интернет для учёбы – и она никогда не перекроет Интернет для развлечения. В последнем люди всегда будут больше читать (или смотреть); даже в бездонном болоте социальных сетей, технически построенных по «форумному» типу, наиболее «естественное» состояние пользователя – сидеть и тупо смотреть (на текст или фото).

На самом деле, количество тут, конечно, не особенно что-то решает. Просто страничка, которую видит пользователь, является основой Интернета всегда – в том числе и на форумах. Чтение (восприятие информации) первично, без него невозможен ни один интернет-сервис. А для хорошей подачи информации нужны две простые вещи: соблюдение стандартов W3C и RFC, – и одна сложная: умелое применение DHTML-технологии. То есть страничку нужно делать правильно (стандарты) и искусно (DHTML).

Со стандартами дело обстоит настолько плохо, что говорить о них совершенно неинтересно (а главное, бессмысленно). Стандарты не соблюдает практически никто. DHTML, наоборот, используют все (только не всегда об этом знают). Поэтому тут есть что обсуждать (осуждать неправых и восхищаться гениальными находками).

Определение

Так сложилось, что современные веб-разработчики вместо слова DHTML обычно используют JavaScript. Поэтому нам пришлось в названии сайта упомянуть именно JavaScript, а не DHTML (иначе мало кто поймёт, о чём речь). Но всё же попытаемся восстановить справедливость – дать определение DHTML.

В сети, на первых позициях поиска, можно встретить довольно корявые определения: «Динамический язык гипертекстовой разметки», «язык построения динамического гипертекста»... Википедия тоже выдаёт нечто коряво-осторожное: «способ создания интерактивного веб-сайта». (Да. Спасибо ещё, что HTML не «способ создания статичного веб-сайта»).

А ведь самое очевидное родовое слово тут «технология». Ну, и встречается оно в определении DHTML чаще всего. Даже бывает во множественном числе: «набор технологий, работающих на стороне клиента и призванных преодолеть статичность традиционных Веб-страниц». Да, и вот это призвание – преодолевать статичность и бороться за динамику – тоже чаще всего связывают с понятием Dynamic HTML.

Мы на странице dhtml.aspx используем такой упрощённый вариант: «Изменение текста и оформления страницы после её открытия в браузере». То есть сервер, с которого получена страница, уже в этом не участвует. Сервер может вообще отключиться, а страница на стороне клиента будет продолжать свою вполне независимую, долгую и прекрасную жизнь.

Что касается предназначения «сделать HTML страницу динамической», то, даже при самом минимальном количестве мозгов, у разработчика немедленно должен возникнуть вопрос: «А нахрена?» Динамика может быть самоцелью только для демонстрации таланта веб-мастера с отсутствием необходимого мозгового минимума: нажимаешь на кнопочку – что-то происходит; а зачем – вопрос совсем уже лишний.

Логика правильной веб-разработки требует не демонстрации возможностей какой-либо технологии, а создания удобств для пользователя. Жизненно важных удобств. Пример. Изначально, в «голом» тексте, такое удобство, как сноски (примечания), находится «во дворе» – в самом конце страницы: чтобы им воспользоваться, нужно «прокрутить» страницу до конца, а потом прокручивать её обратно, напряжённым взглядом отыскивая место остановки.

Гипертекст позволяет пристроить это удобство максимально близко к дому: нажимая на гиперссылки якорей, пользователь может перемещаться по странице одним щелчком, довольно точно попадая с текста сноски обратно к ссылке на сноску. Не абсолютно точно – страница всё равно может смещаться до половины своего размера.

Технология DHTML позволяет отображать тексты сносок вообще не отходя от ссылок. То есть как раз абсолютно точно (удобство в пятиэтажной хрущёвке). Пример есть в нашем старом учебнике на странице ir2.ru/html/omne/js3/wattsa.htm.

Таким образом, наилучшим на сегодняшний день мы считаем следующее определение:

DHTML (Dynamic HTML) –

технология изменения веб-страницы на стороне клиента, улучшающая восприятие информации пользователем. Основана на манипуляциях DOM и CSS объектами с помощью JavaScript. Наиболее частые задачи: 1) организация информации на странице с помощью скрытия-отображения текста; 2) проверка информации, вводимой пользователем; 3) хранение настроек (неавторизованного) пользователя.

Есть, правда, ещё одна типичная задача организации информации – получить фрагмент страницы без перезагрузки, но она решается не исключительно одним DHTML, а совместно с серверными скриптами. В веб всегда так – одно цепляется за другое, и попробуй найди концы.

Шаг в бесконечность

Развитие сайтов движется по спирали MySQL – PHP – JavaScript (DHTML). Описание этого развития тоже. Что и отражается в датах публикации статей на dn.ir2.ru (MySQL, PHP) и на ir2.ru (JavaScript – DHTML). Понимание DHTML per se так же может иметь несколько уровней – что сильно усложняет ситуацию в практике сайтостроения и упрощает поиск предмета разговора.

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

Отказ от ответственности

На этом сайте не используются (ни в работе, ни в обсуждениях) так называемые фреймворки типа jQuery. Хотя они могут быть достаточно интересны с научной точки зрения, но в работе «правильного» веб-мастера являются скорее костылями, чем микроскопом. Ну, например, вы хороший PHP-программист, и хотите делать сайты полностью самостоятельно, но серьёзно изучать JavaScript лень (или некогда – что, в общем, одно и то же).

Так вот, мы не отвечаем за то, что кто-то подумал, что он может что-то найти здесь о веб-костылях, но ничего не нашёл. И ещё, например, мы не участвуем в соревнованиях на самый лучший скрипт в мире. Зато с полной ответственностью утверждаем, что все идеи, описываемые здесь, взяты из практики, все примеры – рабочие и обязательно учитывают работу всех элементов веб-технологии – от сервера баз данных до финишного клиента (браузера).

D.M., admin
Конструктор сайтов Югайд

Комментарии

01.04.2015 03:10:02

Евгений 30.03.2015 08:12:49

Здравствуйте. Прикручиваю сейчас к Бигтаблсортеру возможность редактирования, есть одна проблема. При добавлении новой строки не получается добавить соответствующую этой строке новую ячейку к сортировочному массиву. То есть чтобы введённые данные сразу сортировались. Устал разбирать код, закручено для моего уровня сложно. Помогите мне пожалуйста.

Евгений 30.03.2015 03:38:17

Здравствуйте. Прикручиваю сейчас к Бигтаблсортеру возможность редактирования, есть одна проблема. При добавлении новой строки не получается добавить соответствующую этой строке новую ячейку к сортировочному массиву. То есть чтобы введённые данные сразу сортировались. Устал разбирать код, закручено для моего уровня сложно. Помогите мне пожалуйста.

Эдуард 04.01.2015 14:32:29

Тратить жизнь на jQuery – действительно не рационально. Т.к. есть еще океан более важных технологий.

fifa 26.10.2012 03:19:02

Добрый день, не могу удержаться от комментария :) Не сайт, а просто песня. Наконец-то нашлось то что искалось !!! Спасибо огромное!!! Так много всего полезного.

xcvxcv 14.06.2012 11:23:05

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

xcvxcv 14.06.2012 11:13:42

По мне, так проще разобраться как на JS тот или иной функционал, чем читать справку по использованию jQuery и разбираться в чужом коде. jQuery и прочие библиотеки отучают людей писать самостоятельно элементарные вещи. просто.

xcvxcv 14.06.2012 11:11:00

Спасибо за хорошее описание и разбор примеров, приведённых на сайте. Соглашусь, что jQuery выглядит монстром, когда нужно решить простые задачи: сортировка таблицы, создание фотогалереи, сносок и прочих простых вещей для удобства посетителя. Такие вещи можно решить самостоятельно написанным кодом, что не надо приписывать к "изобретанию велосипеда". Каждый сам решает, пользоваться чужим кодом или своим.

D.M., admin 15.11.2011 19:49:13

Пока сайт dn.ir2.ru находится в процессе переезда на другой домен, будем валить сюда всё в кучу: и javascript, и PHP.

D.M., admin 15.06.2011 20:04:29

Рустик, а как потом "сценарий" на ассемблере передать для интерпретации браузеру?

Рустик 14.06.2011 06:46:16

fff если для Вас библиотека jQuery является костылями, используйте сразу Ассемблер при написании сценариев

fff 30.03.2011 03:31:43

"На этом сайте не используются (ни в работе, ни в обсуждениях) так называемые фреймворки типа jQuery. Хотя они могут быть достаточно интересны с научной точки зрения, но в работе «правильного» веб-мастера являются скорее костылями, чем микроскопом." – это вообще на уровне дибилизма!

FRY 30.03.2011 03:29:19

"Но это тоже быстро надоело (в самом деле, ну что интересного можно сейчас найти в PHP?)" – фраза полного идиота!!!

D.M., admin 02.04.2011 18:12:14

FRY, спасибо за отзыв!

админ 28.10.2009 21:27:01

Спасибо, что протестировали новый сервис на сайте!