Пятница, 24 Мая 2013 08:05

С чего нужно начать верстальщику

Written by 
Оцени эту запись
(12 Голоса)

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

 

С чего нужно начать верстальщику

Первым шагом всегда должно быть ознакомление с тематикой. Основные элементы верстки -- это HTML и CSS. Нужно о них прочесть пару статей, усвоить понятие HTML тегов и CSS свойств и селекторов. А также узнать о самых важных из них. Также вы должны освоить Photoshop, хотя бы основные методы работы с ним.

 

 

 

В моем случае следующим шагом были курсы WEB-дизайна. Это не обязательно, но курсы имеют свои плюсы:

 

  • изучение и понимание основ верстки
  • первый опыт верстки готовых макетов, которые кто-то будет проверять

 

 

Вместо курсов, вы можете проштудировать пару учебников по верстке сайтов. Это вам даст базовые знания о всех HTML тегах, CSS селекторах и свойствах. А практические задачи учебника помогут вам эти знания закрепить на рабочих примерах.

 

 

Далее будет полезно заняться фрилансом, даже если вы на этом не заработаете! :-) В случае фриланса, у вас будет заказчик, который более опытно и критично оценит вашу работу и укажет на ее недостатки.

 

Далее вы уже можете искать работу! :-)

 

 

Что нужно знать для вакансии HTML-верстальщика

 

 

HTML:

 

  • принцип строения HTML страницы -- теги html, head, body и какие элементы в них могут находиться
  • основные HTML элементы -- table, ol, ul, a, p, div, h1-h6, span и другие, а также для чего именно они используются. Нужно знать разницу между строчными и блочными элементами.
  • версии HTML и какие теги в них присутствуют
  • блочная верстка и ее отличия и преимущества перед табличной
  • HTML5, хотя бы основные элементы

 

 

CSS:

 

  • виды селекторов
  • основные свойства CSS -- фон, цвет, размер, отступы, шрифт, границы и другие
  • особенные свойства CSS -- float, position и другие. Опыт работы с ними
  • версии CSS и какие свойства к ним относятся
  • какие свойства различно работаю в разных браузерах
  • умение делать блочную структуру страницы
  • CSS3, многие свойства из этой версии уже широко используются верстальщиками

 

 

Photoshop:

 

  • нарезка макета
  • определение размеров
  • получение цвета
  • вырезание графических элементов

 

 

JavaScript или jQuery:

 

В наше время JavaScript очень нужен для верстки сайта. Далее список по уровню важности или желательности.

  • очень нужно хотя знать что это и для чего применяется
  • скрыть/показать блок (лайтбокс)
  • анимация -- слайдер, скроллер
  • умение изменить стиль/класс элемента
  • умение получить/изменить значение элемента

 

 

Общие знания верстки:

 

  • кроссбраузерность
  • валидность
  • семантика

 

 

Нужно понимать эти понятия и знать как их добиться при верстке сайта.

 

Кроме всего этого, вы должны уметь пользоваться элементами разработчика -- просматривать HTML и CSS код, пользоваться консолью.

 

Очень желательно уметь верстать шаблоны для популярных CMS -- Joomla!, WordPress. Там очень много своих особенностей, ведь шаблон должен быть динамичный.

 

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

 

 

 

 

 

Additional Info

Комментарии  

 
+3 #4 Сергей 10.03.2015 22:45
Насколько актуальна сегодня профессия верстальщика?
 
 
0 #3 buildmak 01.08.2014 07:06
Здравствуйте стартовал новый сервис который помежет начинающим делать сруктуру сайтов даже полноценные странички
buildmak.com
 
 
+2 #2 kat-khmara 28.07.2014 09:59
Полностью согласна! Главное - это практика. Именно практика наталкивает нас на новые ситуации, новые проблемы, которые нужно решать и таким образом учиться и развиваться)
 
 
+3 #1 Владислав 26.07.2014 18:25
В свое время читал книгу по CSS и параллельно выполнял тестовые задания. Таким образом набивал руку. В этом деле главное - практика. Нужно постоянно что-то делать-делать-д елать
 

You have no rights to post comments

верстка | CSS | верстка сайтов | HTML | верстальщик | блочная верстка | JavaScript | css верстка | профессиональная верстка сайтов