Изучение HTML5 и CSS3

Представьте, что кто-то сегодня, 1 марта 2011 года, никогда не писал веб-страницу и хотел бы знать, что они должны прочитать, чтобы начать создавать веб-страницы сегодня. Они не заботятся о обратной совместимости, но хотят строить с помощью веб-стандартов, чтобы они были переносимыми как можно больше браузеров (да, я говорю, мне все равно, не работают ли мои веб-страницы с IE 4- 8, Opera, Netscape, Mozilla и т.д. Мне действительно все равно, потому что я их никогда не использовал, и это, вероятно, верно в отношении тех, кто будет использовать инструменты, которые я создаю).

У этого человека есть нулевые предубеждения или вредные привычки, потому что они никогда не делали этого раньше. Они также гиперактивны, поэтому, если им нужно прочитать 200 страниц о том, "зачем использовать веб-стандарты" или "почему веб-стандарты лучше, чем" старый способ ", они будут обескуражены и отвлечены и выбросят книгу, и поплавать. Говоря об этом, мои волосы мокрые.

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

Учитывая все эти данные об индивидууме, и я знаю это много об этом человеке (этот человек, конечно, я), какие книги или ресурсы вы бы порекомендовали?

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

Ответ 1

Некоторые хорошие ресурсы для запуска:

Сеть разработчиков Mozilla: для HTML, CSS, Javascript и DOM.
Погрузитесь в HTML5: Чтобы узнать все о HTML5
JSfiddle: для возиться, не создавая целую страницу каждый раз.
HTML Validator: Убедитесь, что HTML, который вы пишете, действителен.
Предварительный просмотр CSS3: Выполнение некоторых новых функций CSS3.
Официальная спецификация HTML5: если вам нужна полная информация прямо из источника.
jQuery: Возможно лучшая структура для упрощения написания javascript для сайтов.
A List Apart: "Для людей, создающих веб-сайты". Определенно не для начала, но хорошо читать регулярно.
Firebug: если вы используете Firefox, это обязательно.
Инструменты разработчика: встроен в Chrome и Safari (в основном firebug для webkit)

Кроме того, не используйте ~~W3 Schools~~. Пожалуйста, см. W3 Fools для длинного списка причин. Школы W3 часто появляются в верхней части результатов поиска, но, пожалуйста, не поддавайтесь искушению использовать его.

Ответ 2

Для тех, кто никогда не закодировал веб-страницу, убедитесь, что вы еще не втянулись в рекламу HTML5 и CSS3. Несмотря на то, что у них отличные возможности, все они считают, что немного знают предыдущие версии, и все "предварительные просмотры" покажут вам фрагменты, связанные с улучшенной интерактивностью, а не с поддерживаемыми структурными элементами.

Придерживайтесь обучения CSS2.1 и HTML4.01/XHTML, который даст вам хорошее заземление, на которое вы сможете применить новый материал позже.

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

Ответ 3

для html5: Погружение в HTML5 для css3: http://www.css3.info/preview/

и если вы хотите использовать javascript, было бы полезно использовать jquery: http://jquery.com/

Ответ 4

Я сам учу себя веб-дизайну и разработке, и у меня есть опыт в технике. Вам комфортно с компьютерами, поэтому вы в хорошей форме. Для начала я взял несколько онлайн-курсов из http://www.hwg.org/. Курсы являются самостоятельными, но умеренными, и вы получаете много практического опыта сразу, и вы получаете онлайн-сообщество, чтобы помочь вам подпрыгнуть.

Я взял курс HTML, почти все курсы CSS и некоторый JavaScript. После того, как вы получите базовый опыт и изучите основы, вы можете решить, какую часть другого материала вам нужно, например, PHP/MySQL, или вам нужны некоторые курсы дизайна, чтобы сделать вещи красивыми.

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

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

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

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