Урок-Редакторы HTML

[ Новые сообщения · Участники · Правила форума · Поиск · RSS ]

Страница 1 из 1
1

Урок-Редакторы HTML

monolito-s

Дата: Пятница, 28.10.2011, 18:08 | Сообщение # 1

Киллер

Группа: Повелитель Зоны

Сообщений: 335

Персонаж: Каратель

1. Простейшие текстовые редакторы для создания HTML - документов

Так как HTML-файл - это текстовый файл, состоящий из обычных слов, названий файлов и специальных слов-кодов или тегов разметки (или дескрипторов), указывающих веб-браузерам, как отображать элементы веб-страницы в браузере, то для создания HTML-документов или веб-страниц можно использовать простые текстовые редакторы, находящиеся на каждом компьютере:

TextEdit - для MAC OS X; если предварительно сделать соответствующие настройки - подробнее;

Notepad - Блокнот - для Microsoft Windows.

Такие редакторы устанавливаются на компьютер при установке операционной системы. Поэтому их можно просто найти на своем компьютере в папке Applications/Программы для Мас или в папке Accessories для Windows. Коды HTML в этих редакторах не подсвечиваются.

Важно помнить, что у HTML-документа, созданного в текстовом редакторе, должно быть расширение .html или .htm , а не .txt, как у обычного текстового документа.

2. Редакторы HTML

Существуют специальные программы - редакторы HTML, облегчающие процесс написания тегов HTML и позволяющие вставлять в документ готовые конструкции языка HTML, что очень удобно.

В настоящее время широко используется редакторы, относящиеся к классу WYSIWYG - What You See Is What You Get - То, что вы видите (в редакторе), то вы и получите (в браузере).

Некоторые из них платные, например, широко известный, очень удобный редактор Dreamweaver [произносится так ], используемый для Мас и для Windows - http://www.dreamweaver.net.ru/. С ним мы сможем познакомиться позднее.

Существуют разные бесплатные HTML-редакторы, из которых наиболее удобны в использовании:

Aptana http://www.aptana.com/, ['Аптана],
профессиональный, многофункциональный редактор с англоязычным интерфейсом, работает с файлами в кодировке utf-8 .
Скачать Aptana Studio здесь. (Windows /Linux/Mac OS X )
Настройки для редактора Aptana:
1) Для всех заданий создается один проект. (File->New->Project->Web-> Default Web Project). При выполнении этих настроек необходимо выбрать свою папку "_Web-master" в качестве места сохранения всех файлов проекта из редактора Aptana (Аналогия с определением сайта в DW)
(Project location directory must be specified.
Снимите галочку в строке "Use default location" и выберите вашу папку).
2) Кодировка проекта - UTF-8.
3) В свойствах проекта, в разделе project natures должна быть выбрана Aptana Web Nature.
4) На рабочем пространстве должны быть только элементы "project Explorer" и окно с кодом. Все остальные элементы нужно закрыть.
P.S. Aptana построена на базе eclipse, и ее рабочее пространство во многом выглядит так же как eclipse. Можно посмотреть обучающее видео по eclipse: http://www.artlebedev.ru/tools.....
KompoZer http://kompozer.net/ - бесплатный HTML-редактор с англоязычным (русскоязычным при соответствующих настройках) интерфейсом, участник проекта "Mozilla", обладает некоторым набором возможностей из Dreamweaver (похож на DW), имеет редактор стилей, может переводить файл из одной кодировки в другую и пр., но в отличие от DW теги и их параметры подсвечиваются только в режиме просмотра "Split - Разделенный", в режиме просмотра "Исходный код" теги не подсвечиваются. Поддерживается проектом Mozilla, в основу взят редактор NVU http://nvu.mozilla-russia.org [читается "эн-вью"] который более не разрабатывается.
Скачать KompoZer здесь. (Windows /Linux/Mac OS X)
SeaMonkey http://www.mozilla-russia.org/products/seamonkey/ - участник проекта "Mozilla" - http://www.mozilla.org/ или http://mozilla-russia.org/, включает в себя браузер и HTML-редактор - Компоновщик, а также почтовый клиент, адресную книгу, чат. Редактор-Компоновщик - открывается командой: Файл/Редактировать страницу или Файл/Создать/Страницу Компоновщика,
Имеет функцию проверки русской орфографии на веб-странице, русскоязычные команды меню, поддерживает кодировки UTF-8, Windows-1251, позволяет загружать файлы на сервер. Коды HTML не подсвечиваются. Интересная возможность - редактирование кода HTML для выделенной части веб-страницы (Команда Вставить/HTML.)

Скачать SeaMonkey здесь. (Windows /Linux/Mac OS X)
При скачивании выбирайте из таблицы версию с русско-язычным интерфейсом.
Amaya http://www.w3.org/Amaya/ , http://amayaru.com/ - разработан международной организацией W3C, определяющей технологические стандарты для Всемирной паутины, главной целью которой является демонстрация новых веб технологий и помощь пользователям в создании правильных веб страниц. Но разработка остановлена.
Имеет функции:
русскоязычные команды меню,
подсветка синтаксиса,
проверка русской орфографии на веб-странице в будущем (русский словарь - в разработке),
поддержка кодировок UTF-8, Windows-1251,
широкая поддержка стилей,
загрузка файлов на сервер с использованием HTTP PUT метода,
поддержка MathML, SVG.
Скачать Amaya здесь. (Windows /Linux/Mac OS X)
Выбирайте архивный файл из первого столбца "http download" для своего типа компьютера и операционной системы. Скачав файл, разархивируйте его и инсталлируйте. Тип операционной системы на Мас можно увидеть, выполнив команду в Finder Яблоко/About This Mac.

TACO V1.7.2 http://www.maccentre.ru/soft/ ['Tако - ударение на первый слог] - для Мас OS, работает с файлами в кодировке utf-8, очень простой, удобный редактор с подсветкой синтаксиса, с функцией организации тегов на веб-странице, с встроенной проверкой синтаксиса. В настоящее время является платным, мы используем старую версию, которая была бесплатной.
Скачать с курса здесь: TACO V1.7.2 . (Mac OS X )
Notepad++ - Текстовый редактор для Windows с подсветкой синтаксиса.
Скачать Notepad++ здесь. (Windows)
SEEdit
AkelPad
Crimpson
Эти редакторы небольшие по объему. Выбрав один из них, нужно скачать его из интернета и самому установить на компьютер.

3. Редакторы - конструкторы сайтов

Существует множество редакторов-конструкторов сайтов, позволяющих довольно быстро создать небольшой сайт с использованием шаблонов веб-страниц. Мы познакомимся с некоторыми из них позже.

Примеры таких редакторов-конструкторов сайтов:
i-Web - для Мас,
WordPress - http://ru.wordpress.org/ - межплатформенный,
технологии Google-sites - https://sites.google.com
4. Это интересно

О редакторах HTML в глоссарии курса "Словарь терминов"
Открытое и свободное программное обеспечение - Wikipedia

Афанасьева Т.Н.