Добрый день!
Сегодня мы начинаем первую лекцию по HTML-программированию. В этой лекции мы с вами разберём, какие инструменты, как верстальщику нам понадобятся.
Инструменты верстальщика:
- браузер;
- инструменты разработчика в браузере;
- графический редактор;
- редактор кода.
Начнём по порядку.
Браузер.
Думаю, по поводу браузера пояснять не нужно. Браузеров в наше время большое количество: Google Chrome, Mozilla Firefox, Safari, Яндекс.Браузер, Opera, Microsoft Edge и, конечно, Internet Explorer.
По большей части, нас интересуют не сами браузеры, а движки, на которых они работают:
- Blink (Google Chrome, Яндекс.Браузер, Opera, Edge).
- Gecko (Firefox).
- WebKit (Safari).
- MSHTML (Internet Explorer) и EdgeHTML (старые версии Microsoft Edge).
Для начала, вы можете взять один любой, но должен предупредить, что когда вы начнёте самостоятельно работать с сайтами, потребуется проверять ваш сайт на всех движках, чтобы у пользователей ваш сайт отображался корректно в любом браузере.
Инструменты разработчика в браузере.
Встроенные инструменты разработчика есть в любом браузере. Именно они нам и понадобятся. На ОС Windows их можно вызвать с помощью меню браузера, клавиши F12 или комбинацией клавиш Ctrl+Shift+I. На ОС macOS вызываются с помощью комбинации Command+Option+I.
Они необходимы для того, чтобы быстро найти ошибки в коде при проверке нашего сайта через браузер.
Графический редактор.
Что касается графических редакторов, вы также можете выбрать наиболее удобный вам. Самые распространённые из них, которые чаще всего используются для создания макета:
- Adobe Photoshop;
- Sketch;
- Adobe Illustrator;
- Figma.
Совсем не обязательно досконально изучать их все. Полностью разобравшись в одном из них, вы поймёте принцип их работы и, если понадобится, разобраться в других вам не составит большого труда.
Редактор кода.
И переходим к выбору редактора кода. Также есть перечень редакторов, которыми пользуются чаще всего:
- Atom;
- Sublime Text;
- VS Code;
- Brackets.
Данный выбор зависит только от вашего вкуса. Нет абсолютно никакой разницы, в каком редакторе вы работаете. Сам код можно писать даже в Блокноте. Редактор кода просто облегчает нашу жизнь. Они могут различаться интерфейсами, видами меню и т. д. Все они решают задачу верстальщика и отвечают нашим запросам. Поэтому выбор редактора кода - только дело вкуса. Я привык работать в Brackets, и для меня он максимально удобный. Поэтому все примеры, которые я буду показывать будут именно из Brackets.
