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

Браузер многогранен, он может, как показывать истинный вид нашего сайта (лучше использовать несколько браузеров, каждый отображает по-разному внешний вид) так и помочь с решением проблемы. К примеру, необходимо передвинуть элемент сайта или изменить размер, и чтобы не на глаз выполнять, для этого достаточно в браузере изменить параметры сайта и все, мы получаем исходный наш вариант и потом просто переносим данные на хостинг в движок файла.

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

Более подробно поговорю про каждый из браузеров. Чтобы в опере перейти в режим моделирования страницы, для этого необходимо всего лишь нажать на нужной нам странице Вашего блога правой мышкой и выбрать изменю «Проинспектировать элемент». После чего появиться внизу браузера подобное окно (см. рисунок, кликай для увеличения).

опера

Теперь при выборе нужного нам элемента, в нижней левой части экрана появиться html код данного элемента, а в правой – css параметры элемента. Тем самым, изменяя данные в левой или правой части, Вы сможете наглядно увидеть, как изменяется Ваш сайт. Позднее, я напишу статью на наглядных примерах, как визуальное изменение на мониторе перенести в реальные на блоге.

Еще в опере, в данной панели, мне нравиться вкладка «инструменты». С её помощь Вы сможете при наведение мышки на понравившийся цветовой элемент, узнать код данного цвета, а позднее вставить его в нужное место у себя на сайте. Более детально останавливаться в этот раз на опере не стану.

В хроме аналогичная функция включается, как и в опере, для этого через правый клик мыши выбираем «Просмотр кода элемента». Внешне панель похожа на аналогичные от других браузеров. С неё я практически не работал, поэтому расписывать про неё не буду (см. рисунок, кликай для увеличения).

Хром

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

Фаерфокс

Функционал, как и браузерах, про который писал выше. Чтобы посмотреть свойства нужного нам объекта для этого кликаем левой мышкой на вторую иконку слева на панели (в виде курсора на прямоугольнике) и потом выбираем нужный нам элемент. Теперь в панели css или в самом html коде можно изменить настройки элемента. Если Вам необходимо сдвинуть, подвинуть элемент или расширить, удлинить то рекомендую на панели css выбрать вкладку «макет». В правой части появиться пирамида, состоящая из четырех прямоугольников. Самый внутренний задает длину и ширину элемента, второй — отступ внутри элемента (расстояние от стенки элемента до текста в элементе), третий – ширину бордюра, четвертый отступ всего элемента от точки в которой он находиться в данный момент времени. Кликая на число мы изменяем нужный нам параметр, и параллельно на экране браузера объект будет изменяться. Изменения будут прописываться в html коде, что в последствие можно будет отразить непосредственно в файлы на хостинге.

На этом ставлю точку в вопросе браузеров в качестве инструментов вебмастера.

Следующим на очереди стоят фтп программы. Я использую FileZilla и Wincom (windows commander или тотал коммандер).

FileZillaFileZilla – один из лучших бесплатных FTP менеджеров, который поможет Вам как загрузить файлы на сервер хостинга, так их и скачать. Программа имеет понятный и удобный интерфейс, имеет возможность разрывать соединение, если долго не пользовались ей. Программа имеет как portable версию, так и версии под любые операционки. Если работали с ФТП программами то в этой не заблудитесь.

total commanderTotal Commander – очень популярная программа, мой друг её пользуется уже более 8 лет постоянно. Она умеет просматривать мультимедию и графические файлы, имеет хороший FTP-клиент скачка, закачка файлов, поддерживается докачка), распаковщики архивов и дополнительные DLL. Умеет даже разрезать и склеивать большие по размеру. Еще через неё можно искать не только нужный нам файл на хостинге для внесения коррективов, но и искать нужную программную строчку. Про это поговорю попозже. Из минусов данная программа платная.

И напоследок к оставшимся инструментам вебмастера, я бы выделил редакторы. К ним я отнесу notepad++ и Adobe Dreamweaver. Вторая программа платная и я с ней фактически не работал, поэтому поговорю про бесплатную отличную программу — notepad++.

Notepad++Notepad++ — свободный текстовый редактор для Windows с подсветкой синтаксиса большого количества языков программирования и разметки. Программу можно расширит за счет дополнительных плагинов, так же она имеет возможность фтп соединения с хостингом, что позволит обходиться без других фтп клиентов.

Рекомендую её ставить не задумываясь. Выкиньте старый свой блокнот.

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

А какими Вы пользуетесь программами или инструментами вебмастера?