Веб-редактор це - комп'ютерна програма, що дозволяє створювати і змінювати веб-сторінки. Веб-редактори працюють з використанням HTML мови (мови гіпертекстової розмітки) - стандартна мова розмітки документів у мережі Інтернет. Більшість веб-сторінок містять опис розмітки на мові HTML. Мова HTML інтерпретується браузерами і відображається у вигляді документа в зручній для людини формі [2].
Текстові документи, що містять розмітку на мові HTML (такі документи зазвичай мають розширення Html або Htm), обробляються спеціальними додатками, які відображають документ у його форматованому вигляді. Такі додатки, звані «браузерами» або «інтернет-оглядачами», зазвичай надають користувачеві зручний інтерфейс для запиту веб-сторінок, їх перегляду (і виведення на інші зовнішні пристрої ) і, при необхідності, відправки введених користувачем даних на сервер. Найбільш популярними на сьогоднішній день браузерами є Google Chrome, Mozilla Firefox, Opera [1].
Веб-редактори можна поділити на два типи: текстові і візуальні. У зв’язку з цим, актуальність теми полягає в тому, інформаційні технології сьогодні є дуже популярними, що потребує більш детального розгляду та вивченні.
Мета доповіді полягає у розгляді та аналізі веб-редакторів, які дозволяють створювати та редагувати веб-сторінки.
Текстові HTML-редактори - це звичайні (txt) редактори оснащені сервісами по вставці і управлінню тегами і перегляданням отриманої веб-сторінки. У цих редакторах сам веб-майстер створює HTML-код [2].
HTML-редактори тегів. При роботі з ними користувач бачить, безпосередньо, HTML-код документа, можете оперативно змінювати його, контролюючи результат, переглядаючи створювану сторінку браузером. У цьому випадку, як правило, документ виходить більш компактним і витонченим (саме HTML-документ, а не сторінку, яку буде видно у вікні браузера). Такі редактори показують лише вихідний код - текст комп'ютерної програми на мові програмування або мові розмітки, який може бути прочитаний людиною. Вихідний код транслюється у виконуваний код цілком до запуску програми за допомогою компілятора (програми складеної на вихідній мові високого рівня, в еквівалентну програму на низькорівневу мову, близькою машинного коду), або може виконуватися відразу за допомогою інтерпретатора (програма, що робить порядковий аналіз, обробку та виконує запит) [2].
Приклади таких редакторів:
Notepad + + - вільний текстовий редактор з відкритим вихідним кодом для Windows з підсвічуванням синтаксису великої кількості мов програмування і розмітки. Він базується на компоненті Scintilla, написаний на C ++ з використанням STL, а також Win32 API і розповсюджується під ліцензією GPL. Базова функціональність програми може бути розширена як за рахунок плагінів, так і сторонніх модулів, таких як компілятори і препроцесори [2].
Можливості:
Підсвічування синтаксису - виділення синтаксичних конструкцій тексту з використанням різних кольорів, шрифтів і накреслень. Зазвичай застосовується в текстових редакторах для полегшення читання вихідного тексту, поліпшення візуального сприйняття. Часто застосовується при публікації вихідних кодів в Інтернеті.
Згортання коду - одна з функцій текстового редактора, що дозволяє приховувати певний фрагмент редагованого коду або тексту, залишаючи лише один рядок. В якості таких фрагментів можуть виступати будь логічно цільні фрагменти коду програми, наприклад, функція, клас, цикл тощо або фрагменти тексту, наприклад, абзац, глава, секція.
Автодоповнення і автоматичне закриття дужок і тегів
Закладки
Регулярні вирази для пошуку і заміни
Запис і відтворення макросів
Порівняння файлів
Менеджер проектів
Карта документа
Перевизначення будь-яких гарячих клавіш
Резервне копіювання файлів і файлів (включається в настройках)
Трансформація тексту за допомогою підключеного плагіна TextFX
Блокове виділення тексту , одночасне виділення декількох різних місць [2].
PSPad - безкоштовний текстовий редактор і редактор вихідних текстів програм для операційної системи Windows [6].
Можливості:
Робота з проектами
Робота над декількома документами одночасно ( MDI )
Збереження екранної сесії. При наступному вході PSPad автоматично відкриє всі відкриті на момент закриття файли
FTP клієнт - ви можете редагувати файли прямо з веб-сервера
Підтримка макросів : можна записувати, зберігати і завантажувати макроси
Пошук і заміна у файлах
Порівняння текстів з різнокольоровою підсвіткою відмінностей
Шаблони (HTML - теги, скрипт, шаблони коду)
Інсталяція містить шаблони для HTML, PHP, Pascal, JScript, VBScript, MySQL, MS-DOS, Perl.
Підсвічування синтаксису застосовується автоматично згідно типу файлу
Визначаються користувачем стилі підсвічування для екзотичних синтаксисів
Автокорекція
Інтелектуальний вбудований попередній перегляд HTML c використанням Internet Explorer і Mozilla Firefox
Повноцінний hex-редактор
Виклик зовнішніх програм, окремо для кожного середовища розробки
Кольорове підсвічування синтаксису для друку та додрукарський перед перегляд [6].
Arachnophilia - HTML-редактор, написаний на мові Java.
Програма може конвертувати в HTML документи RTF. Може на вибір користувача показувати результати в шести браузерах [4].
Можливотсі:
багатовіконний інтерфейс
настроюються користувачем панелі інструментів
пошук і заміна слів у всіх відкритих в редакторі документах
вбудований FTP-клієнт (File Transfer Protocol «протокол передачі файлів» - програма для спрощення доступу до FTP серверу).
У редакторі Arachnophilia є вбудована утиліта для автоматичного форматування вихідного коду (розстановки пробілів, табуляції, дужок та іншого). Так само є: майстер створення таблиць, переклад тегів в верхній або нижній регістр, стиск сторінок, майстер створення маркованих списків та інше.
У редактор Arachnophilia вбудована підтримка макросів і Java-класів користувача, що дає йому можливість підігнати програму «під себе» (через меню і текстові config-файли) [4].
Таким чином, текстові редактори дозволяють створювати сайти та веб-сторінки, а також редагувати їх. Але для цього користувачу необхідно володіти знанням мови HTML та всіх тегів, які в ній застосовуються. Також, важливим аспектом є знання англійської мови бо використання мови HTML іншим чином неможлива. Текстові редактори та побудовувачі у роботі призначені для більш досвідчених користувачів у цій галузі.
Візуальні веб-редактори нагадують редактори типа Word або видавничі системи. Тут користувач створює веб-сторінку звичними інструментами, а WYSIWYG-редактор сам генерує HTML-код. Це властивість прикладних програм або веб-інтерфейсів, в яких вміст відображається в процесі редагування і виглядає макcимально близько схожим на кінцеву продукцію, яка може бути друкованим документом, веб-сторінкою або презентацією [2].
Зараз обов'язковою особливістю будь-якої серйозної системи керування контентом є редактор для додавання, зміни, видалення, а саме головне - візуального оформлення текстової або графічної інформації сайту. Дуже складно користувачеві не знайомому з HTML щоразу дописувати в текстове поле, приміром, тэги ‹i› або ‹b› для виділення тесту курсивом або жирним шрифтом. Текстовий редактор допомагає задати для необхідної частини тексту необхідне форматування не вникаючи в стандарти й позначення HTML коду [1].
Це, так звана, можливість WYSIWYG-редагування (What You See Is What You Get - англ. що бачиш, то й одержуєш) - спосіб редагування, при якому матеріал у процесі редагування виглядає в точності так само, як і кінцевий результат.
Найвідомішими та найпопулярнішими з візуальних веб-редакторів є Adobe Dreamweaver, FrontPage, WYSIWYG Web Builder. Розглянемо, можливості цих редакторів.
Adobe Dreamweaver
Остання версія HTML-редактора Adobe DreamWeaver CS5, що відноситься до категорії WYSIWYG-редакторів, має дуже багато переваг: зручний інтерфейс, настроювання функцій, підтримка великих проектів і ShockWave-технологій, можливість закачування файлів через FTP, підтримка SSI і багато чого іншого. Для роботи в цій програмі не потрібно досконально знати HTML [3].
Проте DreamWeaver на кілька кроків випереджає інші редактори, що використовують технологію WYSIWYG, у першу чергу завдяки тому, що генерує «чистий» HTML-код. DreamWeaver дозволяє позбутися однотипної роботи при створенні сторінок (наприклад, верстка тексту) за допомогою використання опції «Запис послідовності команд» (записується послідовність вироблених вами команд, після натискаєте, наприклад, CTRL+P, DreamWeaver відтворює їх усі у тій самій послідовності).
Програма надає повний набір можливостей , щоб допомогти створити власний сайт. Працювати можна, починаючи з дизайну, оформлення, і закінчуючи рабою з кодом, скриптами, плагінами.
Dreamweaver повністю підтримує HTML5, а це дає нові можливості у використанні онлайн-відео, анімації , що, в свою чергу, додасть унікальність будь-якому сайту.
До програми приєднаний jQuery - це означає ї, що користувач з легкістю може використовувати Java-скрипти при створенні веб-сторінки.
Для початківців Dreamweaver є дуже зручним. При створенні перших сайтів він здатний значно полегшити навчання. Має сервіс підказок і пристойну кількість шаблонів, елементів оформлення, скриптів - за допомогою всього цього легко «набити руку».
Досвідчені веб-майстри, використовуючи Dreamweaver, мають значно більше можливостей. Наприклад, можна використовувати CSS3, розробляти сторінки під різні операційні системи ( iOS і Android ) та додатки. Є унікальна панель «багатоекранний перегляд», за допомогою якої можливо оптимізувати сайт під самі різні пристрої, не залежно від розмірів їх екранів (аж до мобільних телефонів ) і при цьому сайт буде виглядати так, як ви хочете, як вам потрібно [3].
Dreamweaver підтримує відомі движки, такі як WordPress і Joomla. Зміни можна вносити безпосередньо в код сайту , що покращує оптимізацію.
Перша версія Dreamweaver була випущена в 1997 році і на сьогоднішній день існує вже 8 його версій.
