Веб-разработка — с чего начать?

Итак, я решил заняться веб-разработкой и у меня возник вопрос: с чего начать? Читать профильные сайты/блоги/форумы? Познакомиться с PHP-программистами? Нет, я решил, что лучше начинать с «мягкой пищи».

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

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

Я искал множество литературы в Интернете, благо на эту тему ее множество. Выбор был огромный, информация везде примерно одинакова, и я искал книги, которые было бы легко читать. Такими оказались книга Джейсона Кренфорда Тиге «DHTML и CSS для Internet» и «Каскадные таблицы стилей» Эрика Мейера. Последнюю особенно рекомендую, так как это фактически библия CSS. Прочитав ее Вы сэкономите себе кучу времени и нервов. Я же начал с книги Тиге, однако намного полную информацию о CSS получил из книги Мейера.

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

  • Вот спасибо, вот с этого и начну:) Есть еще какие либо советы?

    • Как я начинал: возьмите любой бесплатный psd-шаблон и сверстайте его кроссбраузерно. Сделайте так 2-3 раза. После этого идите на Maultalk или Searchengines и создайте тему о верстке за отзыв. Сделав так штук 5 работ, вы получите отличный опыт + отзывы. После этого можно работать с реальными коммерческими заказами за деньги.

  • Ну спасибо за совет:) А что значит кроссбраузерно? Скажите а что самое сложное в верстке? И смогу ли я верстать если не разу не занимался web-программированием?

    • Самое сложное — это кроссбраузерность 🙂 То есть на выходе должна получится страница, которая одинаково смотрится во всех распространенных браузерах. Обычно это Internet Explorer 6-8, Opera 9-10, Firefox 2-3, Chrome, Safari. Более ранние версии безнадежно устарели и уже не используются.
      Верстать сможет любой, было бы желание учится, копаться в учебниках и искать свои ошибки.

  • Спасибо за советы:) Пока себе еще не представляю как это, но скачал уже несколько готовых псд макетов….

  • Ilyas

    Здравствуйте Neolot давно читаю ваш блог, почитал как вы стартовали в вебе после сисадмина, я просто поражен как вы писали в статье «после 2-х месячной теории начали активно практиктиковать», я вот уже год стартую, начинал вообще не с тех книг вами рекомендуемых, в итоге все деньги кончились и снова нужно идти работать по специальности (строитель), прочитал дурацкую Подробное пуководство по XHTML HTML (по сравнению с другими нормальными книгами просто отстой много времени на ней потерял) помню вставал в 5-ть утра и заставлял ее читать. Посоветуйте как наращивать свои знания в правильном русле. Сейчас изучаю руководство для блондинок по WordPress.

    • Те книги, что я посоветовал — это мой путь, мне они дались более-менее успешно, а вам могут подойти другие, ведь все люди разные. Вот, выложил подборку, может что-то себе выберете (339 Mb): http://dl.dropbox.com/u/6388357/webmastering.7z
      А так рецепт простой: как только почувствовали, что теории пока хватит — начинайте верстать, в сети можно найти много бесплатных psd. Трудные и непонятные моменты ищите в Гугле, книгах, форумах. Главное не останавливаться и идти по нарастающей. Чем больше сверстаете, с тем большими трудностями столкнетесь, тем больше и быстрее освоите.

  • Ilyas

    Вы говорите про поиск сторонних PSD,вообще-то идея, а то все голову ломаю как в фотошопе нарисовать исходник, рисовать в фотошопе как раз таки не умею

  • buko

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

    • Я скажу так: в любом деле, когда его изучаешь, что-то копируешь. Без этого нельзя ничему научится, и в этом нет ничего зазорного. С опытом придет понимание, а с ним собственный взгляд на вещи. Вот тогда уже вы будете делать что-то по-своему или изобретать новое, а новички будут у вас копировать.

  • buko

    Если я правильно понял нужно смотреть как сверстан шаблон и гуглить те моменты которые непонятны!
    Как долго этим заниматься, вот я пока сделал 6 шаблоном, сколько еще нужно их сверстать, какие шаблоны брать в интернете(сложные, легкие), стоит ли начать учить параллельно вордпресс, является ли javascript и php итд обязательными для верстальщика (на рынке труда верстальщиком требования предъявляются такие).
    Извиняюсь что так много несвязных слов, спросить не у кого. Относительно недавно принял решение заниматься версткой, и очень надеюсь что окончательное, а по образованию инженер, но всегда тянуло к компьютеру больше чем к чертежам.

    • Тренируйтесь, пока не почувствуете, что готовы отвечать за свою работу.
      Беритесь за сложные вещи, но не слишком, тут лучше идти по нарастающей. Конечно, сложные вещи делать дольше, но на них учишься.
      Пробуйте разные методики, например, кроссбраузерные скругленные углы. Их число уже давно перевалило за полсотни, выберите что больше по душе.
      Что касается CMS и программирования, то тут ситуация такая. Как и в любой профессии, если вы будете богом в верстке, то без работы никогда не останетесь, но на это уйдет несколько лет напряженного труда, и на фрилансе богом вы не станете.
      Для средней руки верстальщика достаточно уметь свободно верстать IE6+, знать Javascript + jQuery на уровне написания несложных скриптов (сейчас это почти в каждом проекте), и разбираться хотя бы в нескольких популярных CMS: WordPress, Joomla, ModX.
      Если ставите задачу делать сайты «от и до», тогда, конечно, PHP очень нужен, так как чем более специфичен сайт, тем больше придется писать какие-то свои вещи, тем больше будете зарабатывать.
      И как итог, чем лучше будете все это знать, тем более будете востребованы.

  • Жорик

    Cсылка на народ устарела, не могли бы перезолить???

  • О моем первом фрилансерском опыте.

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

    Как то раз нарисовал дизайн по ТЗ и скинул скриншот наобум, не особо расчитывая на отклик. Как ни странно заказчику приглянулся мой дизайн http://dalance.ru/UserFiles/portfolio/020/846/727a2a8383.png ; ему нужна была ещё верстка.

    Договорились по цене, сделал несколько правок в дизайне, приступил к верстке. Тут то и начался геморрой. Начал верстать с чистого листа, но по ходу возникло несколько глюков, много нервов потратил (не хотелось завалить первое дело:))
    В итоге прибег к помощи одного из фреймворков(YAML).

    Сейчас, прежде чем дальше продолжать, чувствую необходимость в собственном фреймворке, более универсальном, с учетом последних тенденций в веб-дизайне.

    По книгам могу порекомендовать «Дэн Седерхольм — CSS ручной работы», только для начинающих желательно прочитать сначала предложенные выше книги.

    • Тру верстальщики не пользуются фреймворками =)

  • Vatrolf

    Здравствуйте! Скажите, достаточно ли начать с указанных вами книг при обучении веб-разработке с нуля? Т.е. совсем с нуля, опыта в каком-либо программировании у меня почти нет. Достаточно ли это мягкая пища, или есть ещё и птичье молоко?

    • Да, этого будет вполне достаточно