1 Создание сайта. Часть 4. Лучшие программы для веб-мастера
Регистрация  Напомнить пароль?
 Отправлено SergeyMarina 23 января 2014   

Создание сайта. Часть 4. Лучшие программы для веб-мастера Любой профессионал, чья деятельность связана с работой на компьютере, имеет свой набор полезных программ, которые помогают ему в работе. И точно так же, как художник не может обойтись без программы для рисования, а журналист — без текстового редактора, веб-мастер не сможет организовать эффективную работу без FTP-клиента и редактора кода. Но для постоянной работы над сайтом потребуется не одна и даже не две программы.

Сайт как готовый продукт имеет гораздо более сложную структуру, чем картина художника или статья журналиста, поэтому для работы над ним нужны самые разные программные инструменты. О них и пойдет речь в этой статье.





Назад Вперед

Читайте также:

Регистрация домена. Перенос домена
Выбор хостинга
Правильное создание файлов Robots.txt и Sitemap.xml

********************************

Редактор кода (или визуальный редактор) и FTP-клиент — это две главные программы, которые понадобятся, чтобы создать веб-ресурс и запустить его в свободное плавание по просторам Интернета. Для работы над дизайном сайта и подготовки изображений не помешает освоить какое-нибудь приложение для работы с графикой, например, бесплатный GIMP. Для удобной работы с цветом может понадобиться Color Mania. В процессе подготовки текстов помогут программы Textus Pro и Advego Plagiatus, которые помогут сделать материалы сайта максимально профессиональными и избежать неуникальных статей. Для оценки популярности сайта, его видимости поисковыми системами и подбора ключевых слов пригодится программа Site Auditor.

В принципе, без большинства этих программ можно обойтись: для редактирования кода сгодится и Блокнот, для работы с FTP можно использовать админ-панель хостинга, графику можно не делать вручную, а находить в Интернете, а программами для улучшения качества материалов сайта и анализа его видимости в поисковых системах вообще можно не пользоваться, полагаясь только на собственную интуицию. Вот только времени такой сайт будет забирать больше, а результаты работы могут быть совсем не такими, как хотелось бы. Но попробуйте работать с инструментами профессионалов, и вы вряд ли будете разочарованы.

Текстовый редактор NotePad++


Работа над собственным сайтом обязательно подразумевает редактирование кода. Даже если вы не создаете код веб-страниц с чистого листа, а используете одну из CMS, все равно код вам редактировать придется. Гибко настроить оформление сайта, улучшить вывод новостей на страницах, отредактировать способ вывода заголовков, чтобы сайт более красиво смотрелся в результатах поиска — все это и многое другое делается через редактирование кода файлов движка. Файлы, которые требуются для обеспечения работоспособности сайта, имеют разное расширение, но их все можно открыть для редактирования в текстовом редакторе. По умолчанию Windows предложит Блокнот, но работать с ним насколько неудобно, что эта программу не стоит использовать даже для внесения минимальных правок. Лучше обратиться к NotePad++ — мощному текстовом редактору с подсветкой кода и сотнями других функций.

Создание сайта. Часть 4. Лучшие программы для веб-мастера

Подсветка синтаксиса

Возможно, главное достоинство NotePad++, за которое его ценят тысячи веб-мастеров со всего мира — подсветка синтаксиса. NotePad++ работает с 50 языками программирования, поэтому найти язык, который бы не поддерживался, проблематично. Для включения подсветки в меню Синтаксис выберите сначала букву, на которую начинается название языка, а затем и сам язык.

Подсветка синтаксиса очень удобна, поскольку благодаря ей код легче читать и в нем легче искать ошибки. Самый простой пример использования этой функции — проверка правильности написания тегов в файлах HTML.

Создание сайта. Часть 4. Лучшие программы для веб-мастера

Создание сайта. Часть 4. Лучшие программы для веб-мастера

Если цвета, предлагаемые программой для подсветки, не нравятся, их можно легко изменить. Для этого в меню Опции выберите пункт Определение стилей. В списке Язык выберите нужный язык, а затем задайте свои параметры оформления для разных стилей.

Автозавершение ввода

Еще одна функция, которая может быть очень полезна начинающему веб-мастеру, это автозавершение ввода. При ручном вводе фрагментов кода она экономит массу времени. Как только вы вводите первые символы, программа тут же предлагает варианты завершения слов или функций. Для включения автозавершения ввода в меню Опции выберите пункт Настройки, а затем перейдите к разделу Auto_Completion и установите флажок в чекбоксе Enable auto-completion on each input. Можно выбрать автозавершение слов или функций. Также программа может выводить подсказки по параметрам функций.

Проверка орфографии «на лету»

Ошибки на страницах сайта так же бросаются в глаза, как, скажем, опечатки на страницах книг. Чтобы в содержимом сайта было как можно меньше ошибок, стоит использовать проверку орфографии. И лучше всего, если текст проверяется на опечатки и прочие ошибки еще на этапе создания сайта. NotePad++ содержит встроенные средства для проверки орфографии «на лету». Проверка реализуется средствами дополнения DSpellCheck, которое по умолчанию входит в состав приложения. Для поиска ошибок может использоваться один из двух движков: Hunspell или Aspell. По умолчанию задействуется Hunspell (и доступна только проверка английского языка). Aspell, а также словари к нему можно бесплатно загрузить с официального сайта.

После установки нужно в меню Плагины выбрать пункт DSpellCheck, а затем — Settings. Далее в списке Library выберите Aspell, а в списке LanguageMultiple Languages. Установите флажки в чекбоксах напротив тех словарей, которые должны задействоваться при проверке. Например, для русского языка нужно выбрать ru. Английский язык тут тоже лучше вбрать, иначе словарь может работать некорректно.

Создание сайта. Часть 4. Лучшие программы для веб-мастера

Теперь, если в меню Плагины > DSpellCheck выбран пункт Auto-Check Document, будет работать проверка орфографии «на лету» с подчеркиванием неправильных слов. Щелчок по кнопке Создание сайта. Часть 4. Лучшие программы для веб-мастера выведет список вариантов. Кроме этого, можно будет пропустить слово или добавить его в словарь.

Особенности работы с документами

Каждый новый файл в NotePad++ открывается на отдельной вкладке. Если программа была закрыта, а затем снова запущена, все файлы, с которыми шла работа во время последней сессии, восстанавливаются. При желании можно сохранять сессии, а затем подгружать их.

В двух разных вкладках можно даже просматривать один и то же файл. Это удобно, если требуется одновременно держать в поле зрения разные части документа. Чтобы открыть тот же документ во второй вкладке, щелкните правой кнопкой мыши по названию вкладки и выберите пункт Дублировать в другом окне. Все изменения, которые вносятся на одной из вкладок, автоматически отображаются и на другой тоже.

Поиск и замена

При помощи NotePad++ можно выполнять замену символов в нескольких файлах одновременно. Для этого их даже не нужно открывать в программе. Инструмент Найти в файлах, который доступен в меню Поиск, дает возможность указать папку, файлы в которой нужно обрабатывать. Также при необходимости можно задать фильтры исключений, определиться с тем, нужно ли искать во вложенных папках.

Для замены символов во открытых документов используйте пункт Замена в меню Поиск. Часто очень ускоряет работу функция Заменить все во всех открытых документах.

Создание сайта. Часть 4. Лучшие программы для веб-мастера

Визуальный редактор BlueGriffon

Несмотря на растущую популярность CMS (по статистике сайта W3techs.com, более 30% всех сайтов уже используют системы управления контентом), все же бывают проекты, которые гораздо проще и быстрее создать на HTML. Скажем, сайт-визитка, состоящий из нескольких страниц, информация на котором обновляется раз в несколько месяцев. Но если вы не владеете премудростями языка разметки, создать сайт «с нуля» в редакторе наподобие Notepad++ вряд ли будет под силу. В подобных случаях лучше обратиться к визуальному редактору. В нем веб-мастер размещает на странице нужные элементы (кнопки, меню, формы), а программа сама генерирует код. Конечно, матерые профи считают автоматическое создание кода неприемлемым, так как в этом случае в него закрадывается много лишних тегов, но в случае необходимости код готовых страниц всегда можно открыть в том же Notepad++ и убрать все ненужное.

Сделать простой HTML-сайт можно, например, в бесплатном редакторе BlueGriffon, который основан на Gecko — том же движке, который используется в Firefox.

Создание сайта. Часть 4. Лучшие программы для веб-мастера

Для начала можно воспользоваться мастером, выбрав в меню File пункт New Wizard. На первом этапе выберите разметку сайта. Можно использовать более популярную HTML 4 или же новую HTML 5. Далее мастер предложит указать заголовок сайта, описание, язык и ключевые слова. На следующем этапе можно будет определиться с основными цветами, которые будут использоваться для фона, текста, ссылок и пр. Далее при необходимости можно загрузить фоновое изображение для сайта и определить его параметры.

Создание сайта. Часть 4. Лучшие программы для веб-мастера

Вставка всех основных элементов веб-страницы осуществляется при помощи кнопок на панелях инструментов. Например, чтобы добавить ссылку нажмите на кнопку Создание сайта. Часть 4. Лучшие программы для веб-мастера, после чего укажите, куда она должна вести и как открываться. Для вставки таблиц служит кнопка Создание сайта. Часть 4. Лучшие программы для веб-мастера, а при помощи кнопки Создание сайта. Часть 4. Лучшие программы для веб-мастера можно добавить на страницу изображение.

Начинающим веб-мастерам проще создавать веб-страницы на основе уже готового шаблона, поэтому при необходимости выберите пункт One Click Templates в меню File, чтобы получить доступ к онлайн-библиотеке шаблонов и загрузить подходящий. Правда, услуга скачивания из библиотеки платная.

Создание сайта. Часть 4. Лучшие программы для веб-мастера

FTP-клиент Filezilla

Файлы, необходимые для работы сайта, загружаются на сервер по протоколу FTP. По большому счету, можно обойтись и без FTP-клиента, поскольку многие хостеры предлагают интерфейс для загрузки файлов в админ-панели. Кроме того, встроенные FTP-клиенты часто можно встретить в редакторах для веб-мастеров (в том же NotePad++ по умолчанию есть плагин NppFTP). Однако самостоятельное приложение дает больше возможностей по управлению файлами и в целом более удобно. Один из самых популярных бесплатных FTP-клиентов — это Filezilla.

Создание сайта. Часть 4. Лучшие программы для веб-мастера

Начальная настройка клиента

Для начала работы с Filezilla потребуется ввести данные сервера. Их обычно можно узнать в админпанели хостинга или из письма, которое было отправлено хостером после оплаты услуг. Введите IP-адрес сайта в поле Хост, затем укажите данные учетной записи в полях Имя пользователя и Пароль. Для работы с FTP, как правило, используется порт 21, поэтому введите его в одноименном поле. Заполнив все поля, нажмите на кнопку Быстрое соединение. Если данные верны, то содержимое сервера отобразится в правой панели программы. Файлы сайта обычно загружаются в директорию WWW. В левой панели отображается содержимое локальных дисков. Перейдите к папке, в которой хранятся файлы будущего сайта, и перенесите ее содержимое в папку на удаленном сервере. Для начала копирования файлов выберите пункт Выполнить задание в меню Передача. На вкладке Успешные передачи можно будет наблюдать статистику всех загруженных файлов, а на вкладке Неудавшиеся передачи — тех, которые загрузить не удалось.

Разрешение конфликтов

FTP-клиент понадобится не только для первой загрузки файлов, они пригодится также для создания резервных копий сайта, в тех случаях, когда потребуется выполнить обновление движка или внести в некоторые файлы изменения. Если при загрузке с сервера или закачке на сайт обнаружится, что файл уже существует, Filezilla спросит, как с ним поступить. Однако работу клиента можно автоматизировать, чтобы каждый раз не отвлекаться на выбор варианта вручную. Настроить поведение программы можно как для текущей сессии, так и глобально. Для изменения настроек для активной сессии выберите пункт Действие по умолчанию, если файл существует в меню Передача. Выберите один из вариантов поведения программы. Например, можно автоматически заменять более старые файлы, все файлы, размер которых отличается, докачивать файлы, пропускать их, переименовывать и т.д.

Создание сайта. Часть 4. Лучшие программы для веб-мастера

Для изменения глобальных параметров разрешения конфликтов выберите пункт Настройки в меню Редактирование и перейдите к разделу Действие, если файл существует.

Создание сайта. Часть 4. Лучшие программы для веб-мастера

Управление правами доступа к файлам

Права доступа к файлам имеют очень большую роль для обеспечения безопасности сайта. Как правило, при использовании популярных CMS в инструкции по установке обязательно содержатся советы относительно того, права на доступ к каким файлам нужно поменять после их загрузки на FTP-сервер.

Сделать это в FileZilla очень просто. Просто выделите нужный файл на сервере, щелкните по нему правой кнопкой мыши и выберите пункт Права доступа к файлу. Установите флажки в нужных чекбоксах или же требуемое числовое значение.

Создание сайта. Часть 4. Лучшие программы для веб-мастера

Если нужно изменить атрибуты больше, чем одного файла в папке, можно просто выделить несколько одновременно. FileZilla также дает возможность выполнять эту операцию для папок и всех файлов, которые в них содержатся. Если перейти к настройкам прав доступа папки, можно определиться с тем, нужно ли применять изменения к файлам, к вложенным папкам или же ко всем файлам и директориям.

Назад Вперед








Еще по теме:

  • Создание сайта. Часть 3. Правильное создание файлов Robots.txt и Sitemap.xml
  • Уроки GIMP: создание эффектов
  • Много места для файлов в «облаке»: Mega, Bitcasa, 4Sync
  • Медиапроигрыватели для Windows и управление ими со смартфона/планшета
  • WYSIWYG: визуальные редакторы для создания сайтов



  • Информация

    Посетители, находящиеся в группе Гости, не могут оставлять комментарии к данной публикации.

    Форум Топик Ответов
    Будьте в курсе новостей