DHTML: Динамічне веб-кодування

• Може 20, 2024

DHTML розшифровується як Dінамічний НyperТдоб Маркуп Language і може бути визначений як мистецтво робити HTML-сторінки динамічними, поєднуючи HTML з Javascript та каскадними таблицями стилів (CSS). На відміну від інших чотирьох варіантів HTML, вивчених у попередніх чотирьох статтях цієї серії, DHTML не є стандартом, визначеним консорціумом W3. Скоріше, це "маркетинговий термін, який використовували Netscape та Microsoft для опису нових технологій, які підтримували б браузери 4.x" (консорціум W3). HTML 4.0 вперше представив два важливі компоненти, притаманні структурі DHTML:

• Каскадні таблиці стилів (CSS)
• Моделі об'єктних документів (DOM)

Зробіть свій код динамічним

CSS надає моделі стилів та макетів, тоді як DOM надає моделі вмісту документа для документів HTML. JavaScript і VBScript додають можливість писати сценарій коду для управління елементами HTML. Ці три компоненти складаються разом до динамічних HTML-сторінок. Одним із головних факторів стримування є несумісність браузера - Netscape та Microsoft досі не домовилися про те, що впровадити у своїх браузерах: таким чином, написання DHTML-сторінок, які добре працюють в обох браузерах, може бути складним. Щоб переконатися в цьому, ви можете отримати доступ до стандартів Microsoft та Netscape в Інтернеті:

• Бібліотека MSDN в Microsoft
• Динамічний HTML в Netscape Communicator

"DHTML відмінне у створенні ефектів із низькою пропускною здатністю, що покращують функціональність веб-сторінки. Її можна використовувати для створення анімації, ігор, додатків, надання нових способів навігації по веб-сайтах та створення макетів поза світовою сторінкою, які просто не є 'неможливо лише за допомогою HTML. Хоча багато можливостей DHTML можна дублювати або з Flash, або з Java, DHTML пропонує альтернативу, яка не потребує плагінів і легко вбудовується у веб-сторінку. "(Dan Steinman, 1998).

Для того, щоб зрозуміти складності DHTML, корисно вивчити його компоненти більш докладно.

Каскадні таблиці стилів

CSS - це складні коди, які відокремлюють веб-вміст від веб-дисплея - стиль, позиціонування, кольори, шрифти тощо. CSSP або CSS позиціонування дозволяє контролювати рівень пікселя за розміщенням елементів HTML. Відокремлення стилю презентації веб-документів від вмісту за допомогою CSS2 (рівень CSS 2) спрощує веб-розробку та обслуговування веб-сайтів. "CSS2 підтримує специфічні для медіа таблиць стилів, щоб автори могли адаптувати презентацію своїх документів до візуальних браузерів, слухових пристроїв, принтерів, шрифтів Брайля, кишенькових пристроїв тощо. Ця специфікація також підтримує позиціонування вмісту, шрифти, що завантажуються, макет таблиці, функції для інтернаціоналізація, автоматичні лічильники та нумерація, а також деякі властивості, пов'язані з інтерфейсом користувача "(Консорціум W3). W3C пропонує чудовий посібник для вивчення CSS2, який називається, Специфікація CSS2.

JavaScript

JavaScript - це спеціальна мова на основі браузера сценаріїв, яка використовується для керування елементами HTML та додавання функціональних можливостей формам, рамам, вікнам, перекиданням зображень, керуванням аудіо-відео та маніпулюванням DHTML. Netscape вперше назвав цей сценарій JavaScript, тому Microsoft придумала термін JScript для своєї конкретної марки сценаріїв. Результат? Дві версії JavaScript, які можуть бути прикро несумісними. Щоб детальніше вивчити цю проблему, відвідайте Netscape's JavaScript Центральний та Microsoft JScript сторінка ресурсу. Секрет динамічних ефектів контенту JavaScripted полягає у використанні об’єктів шару. Об'єкти шару змінюють текст, коли миша прокручує його; це змушує зображення або текст переміщатися по веб-сторінці; це також робить випадаючі меню, що випадають. Об'єкти шару розташовані в тегах div, із визначальними характеристиками, такими як колір, положення та видимість.

Збираючи їх разом

DHTML зазвичай застосовується для досягнення трьох завдань:

• Позиція або розміщення блоків вмісту на сторінці та переміщення їх
• Зміни стилів які змінюють зовнішній вигляд сторінки
• Обробка подій або пов’язання подій користувача зі змінами в позиціонуванні або іншими змінами стилю

У нових версіях Internet Explorer і Netscape (версії 5, 6 і новіших версій) DOM стає кодом вибору для більшості кодувань DHTML. Після освоєння DOM може допомогти веб-дизайнерам маніпулювати, додавати, видаляти та редагувати кодування документів, пов'язані зі всіма стилями, атрибутами (такими як href) та елементами (такими як HTML-теги) на сторінці. Це означає, що кожен тег та атрибут, спільний для html-документа, доступний через DOM. Наразі W3C рекомендують рівні моделей об'єкта документа 0 та 1. Рівень 2 також працює, але він ще не рекламований як стандарт для кодування DHTML.

Корисна група підручників доступна через HTML Goodies, що називається Підручник з DHTML та шарами.

Посилання, що містяться в цій статті, пропонують вступ та рекомендації для початку вашої подорожі в освоєнні цієї новітньої розробки в кодування html.Будь-який швидкий пошук в Google приверне ваші уваги ще багато ресурсів, доступних у вас під рукою. Оскільки виробники браузерів працюють над їх несумісністю, а використання браузерів вищої версії стає все більш звичним явищем, DHTML стане обов’язковою частиною маршруту будь-якого професійного дизайнера.

HTML Виділіть серію статей

ЧАСТИНА 1: Чи повинен надійний дизайнер знати HTML?
ЧАСТИНА 2: HTML 3.2 - Народження Вільбура
ЧАСТИНА 3: HTML 4.0 І 4.01 - більше корисної речі!
ЧАСТИНА 4: XHTML: Веб-кодування для вдосконаленого дизайну
ЧАСТИНА 5: DHTML: Динамічне веб-кодування

Відео Інструкція: Рисуем SVG чистым кодом (Може 2024).