Текстовый блокнот:
«молоток и зубило» в арсенале разработчика
На эту программу в составе ОС, пользователи редко обращают внимание – никакого функционала, только неформатированный текст. Но этого достаточно, чтобы профессиональный верстальщик создал простейшую (и не только) интернет-страницу. Ведь все наполнение сайта является ничем иным, как символьной разметкой веб-документа. Конечно, увидав подобную «китайскую грамоту», неподготовленный пользователь интернета ничего не поймет в наборе букв и знаков, но именно из них складываются все сайты сети и текстовые редакторы – это первый инструмент в арсенале разработки.
В этом смысле лидер – знаменитый MS Word – теряет свое превосходство и тихо отдыхает, пока работают менее наворочанные, но приспособленные для решения задач верстки программы. В них предусмотрена подсветка кода и подсказки по тегам, внедрен синтаксис языков разметки и программирования, осуществляется проверка ошибок и поиск дублей. Но при всех достоинствах, они так и остаются простейшими текстовыми редакторами, предназначенными для решения узких задач, одна из которых верстка веб-страниц. Штатный блокнот – это лишь пример для наглядной иллюстрации процесса.
Photoshop:
неизвестная веб-профессия
популярной программы
О том, как использовать продукт Adobe для обработки изображений, знают почти все. Понятие «отфотошопить» фотографию стало практически нарицательным. Даже далекий от графического дизайна человек, пытается найти в заполонивших интернет забавных котиках следы работы этой программы. Но к верстке продающих и других сайтов, все эти подробности отношения не имеют. Здесь иные задачи и способы их решения.
Получив дизайн-макет и приступив к физическому воплощению сайта, верстальщик должен максимально точно перенести на веб-страницу утвержденный заказчиком концепт.
- Вырезать изображения и внедрить их, не изменяя пропорций и размеров.
- Где возможно, перевести картинки в формат масштабируемой векторной графики SVG для облегчения веса страницы и ускорения ее загрузки.
- Получить информацию об используемых гарнитурах шрифтов, отступах, рамках, интервалах.
- Проанализировать прозрачность элементов оформления и перенести эти данные на страницу при помощи свойств CSS.
Учитывая тот факт, что рабочий формат PSD предполагает создание большого количества слоев с размещенными на них отдельными элементами дизайна и оформления, без труда ориентироваться в этом массиве графики способен только подготовленный профессионал. Ничего общего с известными большинству пользователей-дилетантов рамочками или удалением эффекта «красных глаз» эта работа не имеет.
Инструменты проверки:
валидность и кросс-браузерность
Если об ошибках кода и их выявлении в специализированных текстовых редакторах мы уже упоминали, то необходимость проверки корректности отображения интернет-страниц на различных платформах нужно упомянуть отдельно. Начиная с десктопных устройств и заканчивая мобильными гаджетами – на каждом из них вывод сайта должен соответствовать утвержденному прототипу. Здесь часто пользуются и программами, и онлайн-платформами, заточенными для решения нужной задачи. Чем полнее будет поведен процесс тестирования готового лендинга, тем меньше проблем возникнет у пользователей при его просмотре на различных устройствах и браузерах. И эта задача замыкает круг ответственности специалиста, занимающегося версткой сайта.
Нацеленность на продажи
Реклама и развитие сайта
Запуск за 2 недели
