Мини-лекции 6. Программы редакторы

Владимир Сысолятин
   Как мы и договаривались, что создавать HTML-документы мы будем:

1) Вручную. В текстовых редакторах;
2) С помощью HTML-редакторов;
3) С помощью визуальных редакторов.

   Про бесплатный сыр в мышеловке мы поговорим в одноимённой мини-лекции.

   Что значит вручную? Это то, что Вы сами каждую буковку, знак, весь код страницы будете лично вписывать в документ! Стало быть должны либо помнить наизусть весь этот чёртов HTML, либо? Правильно держать под рукой настольную книгу-справочник по этому HTML! А позже, естественно и по CSS! Конечно потом приспособитесь и? И создадите подсказку собрав нужные Вам HTML-запчасти и прочее... Далее будете для быстроты копировать и вставлять куда надо, а не писать каждый раз по новой?! Лучше бы конечно использовать более продвинуты текстовые редакторы чем БЛОКНОТ от микрософтика. Их сейчас развелось... Я Вам предлагаю свой SciTE фрагмент рабочего окна программы Вы и видите на рис1. Как Вы заметили цветная подсветка и есть настройка. Кроме всего программа поддерживает ЗАКЛАДКИ! Как-то у меня одновременно были задействованы десять закладок! В настройках я уже успел приложить свою лапу и изменил кое-что?! Так убрал всякие подсказки, которые больше мешают (как назойливые мухи?) чем помогают! Изменил шрифты и их размеры. Вот в таком виде (в виде архива RAR) я и предлагаю Вам по адресу: https://yadi.sk/d/jgkIKNfPasWoXg Вы можете и сами поменять настройки, выбрав в меню соответствующие опции. Одна наиболее полезная это: «Глобальные настройки». И если Вы уверены в себе, можете всё там переворошить!!! Не забудьте перед этим записать на бамашке: где, что и как выглядело?! :-))

   Теперь поговорим о так называемых HTML-редакторах. Их может не так много как блокнотов, но всё же... Это собственно тот же текстовый, но с некоторыми особенностями. И одна из них, те же пресловутые подсказки. Вот только организованы они по-разному... У меня на свалке нашлись только два редактора: HomeSite 5 и HtmlReader. Где-то в чём-то они перекликаются друг с другом, но? Но мне более понравился другой, HtmlReader. Фрагмент окна Вы и видите на рис3. Если у HomeSite подсказка выскакивала в виде отдельного окна с прокруткой и кучей подсказок, то в HtmlReader такого нет. Но есть куча всяких услуг которых нет в чисто текстовых редакторах. Вот на рис3a и рис3b врезки с этими самыми услугами. Кроме традиционных (верхняя строка), так называемая «Пользовательские» (нижняя строка).

   На рис3 Вы видите подсказку (для выделения я её подкрасил жёлтым) и стрелочку показывающую на то место окна программы. Щёлкнув на маленький треугольничек Вы получите меню выбора из четырёх опций. Одна из них «Пользовательские теги», а внизу строки те самые теги. Обозначив в окне место курсора и щёлкнув по тегу, получите в коде документа готовые два тега. В смысле открывающий и закрывающий. Щёлкнув по картинке на которую показывает белая стрелочка-указатель Вы откроете диалоговое окно. В этом окне все эти теги можете редактировать, удалять и вписывать свои. Кроме тегов можно вписать и коды символов тех которые Вам чаще всего бывают нужны. В SciTE же мне приходится сначала копировать, а затем вставлять что либо? Но зато «что либо» остаётся в памяти и его можно вставлять бесконечное число раз! Так же в «Пользовательские» можно выбрать «Цветовые коды», то, что Вы и видите на рис3а. Вместо кода цвета я сам вписал код открывающих скобочек «Ёлочек». По хулиганил немножко!

   Наконец-то мы можем разобраться с так называемыми ВИЗУАЛЬНЫМИ редакторами HTML+++ Самый первый мой знакомый FrontPage-2003. В моём компьютерном детстве встретилась (немного позже) наверное самая первая версия FrontPage Express. Чуть позже FrontPage98. Вот она по-видимому и шла вместе WINDOWS-98, а потом прекратили эту халяву! Но это всё осталось в прошлом. А, что сейчас? А сейчас вместо Фронта совершенно бесплатная программа (та же FrontPage) SharePointDesigner 2007 и адресок сайта: https://softdroids.com/index.php?do=download&id=683 Если это всё взамен FrontPage 2003, то она получается уже бросовая??? По крайней мере мне она нравится больше чем новая! Но Вам как чеченцу всё равно русский или китайский учить?!! Вы же не знаете ещё ничего, всё с нуля! Кроме этой программы существуют более ранние версии так называемой Macromedia Dreamweaver. Такой же визуальный редактор, типа кому-что нравится?! Но скачать халяву скорее всего не получится, только через всякие прибамбасы! Если Вы не очень, то лучше и не связывайтесь!!!

   На рис2 фрагмент окна FrontPage 2003. Во-первых (в отличие от друг программ) есть три режима: «Конструктор»; «С разделением» и «Код». И конечно просмотр в браузере. Режим «Конструктор, это когда Вы не в чём не разбираясь что-то делаете и всё это Вы видите перед собой. Режим «Код», только один код всей страницы. И если Вы ни в чём ни бум-бум, то и не будете знать, что Вам нужно делать?! Режим «С разделением», это когда половина (по умолчанию) окна программы занята режимом «Конструктор», а вторая «Код». То, что Вы и видите на рис2. Всё, что Вы методом тыка делаете в окне «Конструктор», автоматически отражается и в поведении кода страницы. На рисунке чёрная стрелочка показывает на курсор, подведённый к букве Б. Наверху в коде та самая буква зачернена, в смысле активирована и с ней можно, что-то делать. В некотором смысле как бы обучающий режим. В режиме «Конструктор» можно показывать как линейки, так и сетку в виде клеток. Это помогает форматировать пространство и внешний вид страницы. На будущее: если Вы в результате рейдерского захвата будете обладать этой FrontPage, то (при создании страницы) сразу же рис2а, смените кодировку windows-1252 на 1251!!! Если (скорее всего) на странице увидите много белиберды рис2а, нижняя строка, типа много цифр с амперсандом и решёткой, то?.. То, щёлкните по чистому полю страницы правой мышкой и в выпадающем меню по «Переформатировать HTML». Всё сразу же встанет на свои места! Если кодировку не поменять на 1251, то изменение после переформатирования HTML будет временным... Хотя всё это на  восприятие браузера никак не повлияет, а только на Вашу читабельность! А с кодировкой подсуетиться нужно!

   Если захотите посмотреть как на данный момент выглядит Ваша страница, жмите на «Просмотр». Но лучше после сохранения в обычном браузере! Желаю удачи!!!