У порівнянні зі своїми більш ранніми модифікаціями, сучасні чати сильно змінилися: у них з`явилася gif-анімація, інші технічні і дизайнерські «фішки». Але зробити чат, навіть з усіма згаданими технічними нововведеннями, як і раніше дуже просто для будь-якої людини, хоч трохи разбирающего в програмуванні.
Щоб створити чат, необхідне знання азів HTML
Розробка чату будь-якої складності починається зі створення HTML-документа. Його каркас повинен складатися з самого звичайного оголошення тегів так званого DOCTYPE - html, head, body. У тезі head необхідно вказати назву чату, а також прикріпити каскадну сторінку стилів - style.css. Після цього в тезі body прописується об`єкт #wrapper div. Цей об`єкт дуже важливий, так як відповідає за створення відразу 3 блоків: простого меню, екрану чату та відповідних div і id для кожного користувача, що вводить свої повідомлення.
Потім в документ необхідно додати ще кілька стандартних, але дуже важливих елементів - #menu div, #chatbox div і #wrapper div. Елемент #menu div буде складатися з двох параграфів, причому перший з них відповідає за вітання, другий - за посилання Вихід. Об`єкт #chatbox div повністю складається із записів чату. Їх можна буде завантажувати з окремого файлу за допомогою системи jQuery`s ajax. Елемент #wrapper div дуже важливий для чату, так як формує його основну форму. Вона, в свою чергу, складається з поля для введення і кнопки Надіслати.
Якщо ви розібралися з цими елементами, значить, робота зі створення чату вже наполовину готова. Щоб зробити чат, вам залишилося налаштувати систему скриптів і трохи попрацювати над його формою.
Щоб створити чат, необхідно вставити два важливих скрипта
Для того щоб сторінки чату завантажувалися набагато швидше, в них потрібно додати відповідні скрипти. Так як для створення чату використовується бібліотека jQuery, обов`язково імпортуйте скрипт Google jQuery CDN. Він буде відповідальний за завантаження всього коду чату після готовності документа.
Потім в файл style.css слід додати трохи css коду в довільній формі - це зробить інтерфейс чату більш привабливим. Після цього необхідно приступити до створення форми, в яку потрібно вводити ім`я перед початком роботи в чаті. У HTML-коді вона позначається як loginForm (). Для її фіксації потрібно використовувати оператора if-else, а також змінну $ _SESSION [ `name`].
Особливу увагу варто звернути й на використання функції htmlspecialchars (). Вона конвертує спеціальні символи в елементи HTML і захищає змінну імені від міжсайтового скриптинга - так званого Cross-site scripting, або XSS.
Для того щоб створити чат, залишилося лише ретельно перевірити весь його HTML-код і правильність оформлення основних скриптів. Як тільки фінальна ревізія буде завершена, найпростіший чат стане придатним для використання.
