Програми для створення сайтів. Створення сайту на HTML. HTML-редактори

  1. блокнот
  2. Notepad ++
  3. Microsoft FrontPage
  4. Macromedia HomeSite
  5. Adobe Dreamweaver
  6. Переваги і недоліки

Найпопулярніший мову для створення сайтів - HTML. Для створення сайту на HTML існує безліч різних програм. Одні з них є редакторами html, інші - редакторами серверних або клієнтських скриптів, а треті - редакторами таблиць css. Всі вони найчастіше візуалізують процес редагування, і Ви можете бачити як буде виглядати той чи інший елемент на Вашому сайті.

Кожен веб-сайт складається з веб-сторінок, кожна з яких, в свою чергу, складається з коду на мові html, який відповідає за оформлення сторінки, і власне вмісту. Тому редактори html - програми, створення сайту без яких неможливо. Які вони бувають? Що можна зробити з їх допомогою? Давайте спробуємо розібратися.

HTML-редактори можна розділити на дві умовні групи: текстові і візуальні. У текстових html-редакторах можна писати і правити html-код вручну. А за допомогою візуальних редакторів Ви можете, не знаючи мову html, створювати веб-сторінки, використовуючи візуалізовані компоненти.

блокнот

Отже, самий вірний і надійний редактор - звичайний вбудований в ОС Windows текстовий редактор «Блокнот» (Notepad). Для того щоб написати в блокноті html-код веб-сторінки не потрібно ніяких додаткових інструментів - досить запустити блокнот, написати в ньому html-код і зберегти документ з розширенням .html. Однак щоб писати і редагувати html-код в блокноті, необхідно дуже добре знати мову html і уважно стежити за написанням коду, так як написання великих обсягів коду вручну підвищує ймовірність виникнення помилок.

Notepad ++

Notepad ++ - розширена версія звичайного блокнота, яка поставляється окремо і звичайно безкоштовна. У Notepad ++ html-теги підсвічуються кольоровим шрифтом, і розробник може візуально відрізнити код від основного тексту сторінки. Тому можливі помилки і неточності в коді легше виявити, однак, так само як і при роботі в звичайному блокноті, в Notepad ++ потрібне гарне знання мови html.

Microsoft FrontPage

Microsoft FrontPage - html-редактор з пакету MS Office. Microsoft FrontPage є візуальним редактором (WYSIWYG - What You See Is What You Get - що бачиш, то і отримаєш), але в Microsoft FrontPage код можна також редагувати вручну. Інтерфейс Microsoft FrontPage схожий на інтерфейс Microsoft Word, звичний для більшості користувачів, тому дуже зручний для новачків у веб-дизайні. У Microsoft FrontPage для роботи доступні три режими: Normal, HTML і Preview.

У режимі «Normal» користувач може редагувати текст і картинки як в звичайному текстовому файлі. Засоби редагування в Microsoft FrontPage дозволяють легко форматувати текст, додавати таблиці (навіть таблиці MS Excel!) І малюнки, створювати марковані та нумеровані списки користувачам без знань мови html.

У режимі «HTML» користувач може переглядати і редагувати код створюваної веб-сторінки, а в режимі «Preview» може побачити як буде виглядати створювана веб-сторінка в браузері.

У режимі «HTML» користувач може переглядати і редагувати код створюваної веб-сторінки, а в режимі «Preview» може побачити як буде виглядати створювана веб-сторінка в браузері

Macromedia HomeSite

Macromedia HomeSite є одним з найбільш популярних html-редакторів. Цей редактор допомагає прискорити процес створення html-коду сторінок і сайту в цілому. Робочий простір ділиться на три частини. Перша - вікно з html-кодом, друга - перелік документів, що знаходяться на диску користувача, третя - різноманітні панелі інструментів, які можуть налаштовуватися користувачем на свій смак. В процес написання html-коду, HomeSite дає користувачеві зручні підказки з переліком можливих атрибутів для поточного тега, підсвічує теги по певній колірній схемі, яку можна змінювати, має в своєму розпорядженні на панелі інструментів найбільш часто використовувані теги для прискорення доступу до них.

Adobe Dreamweaver

У популярному візуальному редакторі Adobe Dreamweaver можна редагувати html-коди, причому робити це легко і невимушено. Якщо Ви досить добре знаєте мову розмітки html, то можете скористатися режимом «code», в якому на екрані відображається тільки вікно для редагування коду. Якщо ж Ви не знаєте html або знаєте його не дуже добре, можете скористатися режимом «design», в якому Ви «один до одного» побачите, як буде виглядати Ваш сайт в результаті. Хочете самі писати код і при цьому відразу ж бачити, що вийде в результаті? Будь ласка: режим «split» відображає два вікна, візуального і звичайного редагування html-кодів. Крім того, якщо Ви забудете який-небудь html-тег, Adobe Dreamweaver дасть Вам підказку з усіма доступними в даному місці документа варіантами тегів і їх атрибутів.

Переваги і недоліки

До переваг текстових редакторів, таких як Блокнот і Notepad ++ відноситься їхня простота і доступність. Крім того, текстові html-редактори часто безкоштовні, не створюють «зайвого» коду, що дозволяє зменшити розмір веб-сторінки. Однак суттєвим недоліком таких редакторів є неможливість переглянути «на льоту» вид створюваної сторінки і необхідність гарного знання мови html.

До переваг візуальних редакторів відносять можливість відразу бачити, як буде виглядати веб-сторінка, наявність підказок і підсвічування тегів, можливість легкої і зручної вставки різних об'єктів в сторінку без знань мови html. Недоліком же візуальних редакторів є їх вартість - хороші візуальні html-редактори платні. До того ж багато візуальні редактори створюють «зайву» код, який «ускладнює» сторінку.

Теги:
створення сайтів, програми для створення сайтів, html-редактори, веб-дизайн, html-верстка

Які вони бувають?
Що можна зробити з їх допомогою?
Хочете самі писати код і при цьому відразу ж бачити, що вийде в результаті?