Можно ли сразу учить HTML5 и CSS3?

@Einheit · Регистрация: 14.01.2012

Студворк — интернет-сервис помощи студентам

Извините что еще раз пишу этот вопрос,но не очень доволен 3 ответам)Посоветуйте пожалуйста все кто может из своего опыта по такому вопросу! Не зная вообще HTML и CSS стоит ли сейчас учить все с 0.Или можно сразу учить HTML5 и CSS3!Что бы делать полноценные красивые сайты?!Спасибо

И почему?

@conformist · 06.04.2012, 11:03

я уже писал, что в html5 основное новшество - добавление мультимедиа файлов, отречение от проприетарного флешплеера. а так - это все тот же html4.01

Добавлено через 14 минут
и доктайп теперь такой, какой должен быть

HTML5
1
<!doctype html>

а не то, что городили раньше -

HTML5
1
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

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

@Heleg · 06.04.2012, 13:20

ну вот, значит мы пришли к пониманию, что вопрос о том, что же учить, xhtml, html5 или html 4.01лишен смысла, так как "я делаю сайты в html5" может лишь означать, что я делаю сайт с использованием новых технологий, которые теперь поддерживают браузеры, а не использую какой-то совершенно новый язык

Добавлено через 4 минуты
это я всё пишу затем, чтобы не появлялись вот такие посты

@SlavAz · 06.04.2012, 13:36

Сообщение от Heleg

хочу задать вопрос всем: что вы понимаете под выражением "создавать сайты на html5"?

Если говорить коротко, то это упорядоченная, структурированная, ясная вёрстка в полной мере использующая специализированные теги. Т.е. верстать не кучей div'ов c id.

А если придавать некий сакральный смысл html5, то это ещё и отсутствие flash, новые тенденции в дизайне, больше интерактивности и гибкости.

@conformist · 06.04.2012, 17:27

Сообщение от SlavAz

Если говорить коротко, то это упорядоченная, структурированная, ясная вёрстка в полной мере использующая специализированные теги. Т.е. верстать не кучей div'ов c id

не смог пройти мимо - а как еще верстать, если не кучей дивов (правда с классами), кроме таблиц, которые мы согласно оттеснили к более древнему методу?

@Heleg · 06.04.2012, 17:34

дивы с кучей айди – это вот выравнивание таблицы. думаю, что SlavAz имел ввиду именно это

@SlavAz · 06.04.2012, 18:01

Да ладно... о чём мы тут говорили всё время?

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8>
<title>Пример для HTML5</title>
<!--[if IE]>
 
<script>
document.createElement('header');
document.createElement('nav');
document.createElement('section');
document.createElement('article');
document.createElement('aside');
document.createElement('footer');
</script>
 
<![endif]-->
 
<style type="text/css">
Здесь прописываем стили
</style>
</head>
<body>
 
<header>
Основной заголовок страницы
</header>
<nav>
Блок навигации
</nav>
 
<section>
<article>
<header>
Заголовок статьи
</header>
Сама статья или заметка в блоге
</article>
<article>
<header>
Заголовок второй статьи
</header>
Вторая статья
</article>
</section>
<aside>
Врезка
</aside>
<footer>
Подвал страницы. Авторское право, контакты
</footer>
</body>
</html>

где тут хоть один див?

отсыпте...

и я имел ввиду дивы именно с id. Если ты, conformist, пишешь

HTML5
1
<div class='footer'></div>

то я вообще сомневаюсь в твоей компетенции по поводу html'ей. Какой прок писать класс для элемента, который всего один на страницу (header content menu). Тем паче, что id быстрее классов.

@Heleg · 06.04.2012, 18:06

ха! и типа сайт готов? всем сайтам сайт. всё, дивам пора в deprecated

@SlavAz · 06.04.2012, 18:19

Сообщение от Heleg

ха! и типа сайт готов? всем сайтам сайт. всё, дивам пора в deprecated

Т.е. по твоему получается что достаточно написать

HTML5
1
<!doctype html>

и можно говорить что верстаешь на html5? для чего тогда теги <header> и другие из примера, если продолжать писать <div id="header">? В html5 div больше не имеет смысла основного элемента разметки, теперь его использовать стоит там, где без него не обойтись. А не лепить кучу дивов с id как я уже сказал.

@Heleg · 06.04.2012, 18:33

ну разметишь ты сайт, а дальше тебе придется впрягать туда ещё кучу дивов и с "кучей" айди.

Добавлено через 2 минуты

Сообщение от SlavAz

Т.е. по твоему получается что достаточно написать Код HTML5
1 <!doctype html>
и можно говорить что верстаешь на html5?

фактически это вообще то так. просто вы делаете из html5 какой-то культ

Добавлено через 2 минуты
ок, вопрос на засыпку. что если у юзера отключены скрипты и он не увидит всех твоих

JavaScript
1
2
3
4
5
6
document.createElement('header');
document.createElement('nav');
document.createElement('section');
document.createElement('article');
document.createElement('aside');
document.createElement('footer');

Добавлено через 1 минуту
неушто все эти костыли стоят того, чтобы хедер можно было засунуть в отдельный тег?

@SlavAz · 06.04.2012, 19:17

как об стенку горох.

На пальцах:

Это html5 документ в котором каждый блок имеет своё логичное название и функцию.

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8>
<title>Это HTML5</title>
</head>
<body>
 
<header>
 
 (!) Здесь могуть быть дивы.
 
</header>
 
<nav>
<ul><li></li></ul>
</nav>
 
<section>
<article>
<header>
Заголовок статьи
</header>
Сама статья или заметка в блоге
 (!) Здесь могут быть дивы (информационный бар например кол-во коментов дата и т.д.)
</article>
<article>
<header>
Заголовок второй статьи
</header>
Вторая статья
(!) Здесь могут быть дивы (информационный бар например кол-во коментов дата и т.д.)
</article>
</section>
<aside>
Здесь могут быть дивы (облако тегов, опросы)
</aside>
<footer>
Подвал страницы. Авторское право, контакты
</footer>
</body>
</html>

А это куча дивов:

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8>
<title>Это HTML5</title>
</head>
<body>
 
<div id="header">
 
 (!) Здесь могуть быть дивы.
 
</div>
 
<div id="navmenu">
<ul><li></li></ul>
</div>
 
<div id="content">
<div class="post">
<div class="post_header">
Заголовок статьи
</div>
Сама статья или заметка в блоге
 (!) Здесь могут быть дивы (информационный бар например кол-во коментов дата и т.д.)
</div>
<div class="post">
<div class="post_header">
Заголовок второй статьи
</div>
Вторая статья
(!) Здесь могут быть дивы (информационный бар например кол-во коментов дата и т.д.)
</div>
</div>
<div id="aside">
Здесь могут быть дивы (облако тегов, опросы)
</div>
<div id="footer">
Подвал страницы. Авторское право, контакты
</div>
</body>
</html>

Видишь разницу? Понимаешь о чём я? Тотаже...

Добавлено через 17 минут
А если, а если бы, да кабы - то во рту росли б грибы!

просто вы делаете из html5 какой-то культ

Не надо мне приписывать своих "мне так кажется" или "я так думаю" как выдвинутые мной мысли. Ни чего я из html5 не делаю. Я довожу до ваших уст, то чем он является.

фактически это вообще то так.

На самом деле не совсем так. Будет время похоливарим и на эту тему.

@Герц · 06.04.2012, 20:18

Сообщение от Heleg

ну разметишь ты сайт, а дальше тебе придется впрягать туда ещё кучу дивов и с "кучей" айди.

Добавлено через 2 минуты

фактически это вообще то так. просто вы делаете из html5 какой-то культ

Добавлено через 2 минуты
ок, вопрос на засыпку. что если у юзера отключены скрипты и он не увидит всех твоих

JavaScript
1
2
3
4
5
6
document.createElement('header');
document.createElement('nav');
document.createElement('section');
document.createElement('article');
document.createElement('aside');
document.createElement('footer');

Добавлено через 1 минуту
неушто все эти костыли стоят того, чтобы хедер можно было засунуть в отдельный тег?

Этот костыль (где Вы тут нашли множество костылей?) добавлен только ради морально-устаревшего IE6, пока еще живущего на компьютерах пользователей.
Если у человека отключены скрипты, он и так очень многого не увидит.

@SlavAz · 06.04.2012, 20:41

Некоторые вообще IE6 на сайт не пускают, выдавая заглушку. К тому же каков процент сидящих c отключенным js ? 3%? от силы... и каков процент из них используют IE6? Я лучше потеряю 1% потенциальных посетителей чем пожертвую семантикой и этикой вебдева. Под этикой подразумеваю использование гуру приёмов, объединения картинок и js, datauri, и другие плюшки...

@Heleg · 06.04.2012, 21:37

холивар эт я люблю.

Сообщение от Герц

добавлен только ради морально-устаревшего IE6

Сообщение от SlavAz

и каков процент из них используют IE6?

вы, ребята, пропагандируя свои новые технологии, даже не разобрались в поддержке их браузерами. все новые фичи пятого html'я не поддерживаются ишаком вплоть до 9 версии. пусть 3 фаерфокс и сафаря, которые стоят, например у меня на работе почти на всех компах, никого не интересуют, но доля восьмого ишака пока превосходит девятый, не говоря уже о всех предыдущих. вы просто объясните, чем <div id="header"> так сильно хуже просто <header>?

@Герц · 06.04.2012, 22:49

IE8 рендерит все названные выше элементы с помощью HTML 5 shiv.
То, что он не умеет применять стили для неизвестных ему элементов (из-за чего и требуется createElement()), является лишь проблемой самого IE.

@Heleg · 06.04.2012, 23:16

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

@Герц · 06.04.2012, 23:34

Преимущество новых тегов их такое же, как у тега <strong> над <b> - это семантическая разметка, div же это просто безликий раздел в разметке страницы, что бы ни было указано в class и id.

@Heleg · 06.04.2012, 23:39

ок </holywar>

@conformist · 07.04.2012, 11:41

я согласен, что кроме основных новшеств работы с мультимедиа в html5 (потому, что не нужны сопутствующее ПО, вроде плееров) есть еще и семантическая разметка. и в четвертой версии мы сами для себя комментируем <--header--> и прочее. изучать и знать это нужно, но для использования сейчас - рановато, поддержка есть но не на 100%, поэтому я на семантике не заострял внимание. кстати, внутри семантических тегов все равно будут дивы с ид и классами, если нужно создать что то более простого сайта с явной структурой - хедер, контент, футер.

Сообщение от SlavAz

Если ты, conformist, пишешь
Код HTML
1
<div class='footer'></div>
то я вообще сомневаюсь в твоей компетенции по поводу html'ей. Какой прок писать класс для элемента, который всего один на страницу (header content menu). Тем паче, что id быстрее классов

что быстрее #id или .class мы тут вообще не обсуждаем, и кто Вам сказал, что единожды встречающемуся элементу я присваиваю класс?

Не по теме:

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

@SlavAz · 07.04.2012, 12:03

Извини если задел, сам против такого беспредела. И первым беспричинно конфликтовать никогда не буду.

Сообщение от conformist

не смог пройти мимо - а как еще верстать, если не кучей дивов (правда с классами),

Я понял это как указание на то, что моя фраза "divвы с id" мол не верна, хотя я именно это и имел ввиду. Следствием этого умозаключения стала мысль о том, что ты оспариваешь мои слова не разобравшись о чём я говорю, что есть разновидность троллинга. Если это не так, то по справедливости прошу прощения.

а про скорость id или class это следствие вышеописанного обстоятельства. Так сказать довод в пользу моих слов.

А по теме: по моему мнению html5 в первую очередь это семантика. Просто вокруг <canvas> шума больше.

@conformist · 07.04.2012, 12:32

если не кучей дивов (правда с классами) - я так написал из за того, что хедер и футер обычно с ид, а в контентной части уже более классами удобнее пользоваться. на самом деле, это можно было и не указывать, просто по привычке.
ну мы поняли друг друга и можно сделать логический вывод:
html5 - это доктайп, семантика, мультимедиа. все очень удобно, но пока к сожалению плохо поддерживается

Новые блоги и статьи Все статьи Все блоги /
SDL3 для Web (WebAssembly): Реализация движения на Box2D v3 - трение и коллизии с повёрнутыми стенами 8Observer8 20.02.2026 Содержание блога Box2D позволяет легко создать главного героя, который не проходит сквозь стены и перемещается с заданным трением о препятствия, которые можно располагать под углом, как верхнее. . .	Конвертировать закладки radiotray-ng в m3u-плейлист damix 19.02.2026 Это можно сделать скриптом для PowerShell. Использование . \СonvertRadiotrayToM3U. ps1 <path_to_bookmarks. json> Рядом с файлом bookmarks. json появится файл bookmarks. m3u с результатом. # Check if. . .	Семь CDC на одном интерфейсе: 5 U[S]ARTов, 1 CAN и 1 SSI Eddy_Em 18.02.2026 Постепенно допиливаю свою "многоинтерфейсную плату". Выглядит вот так: https:/ / www. cyberforum. ru/ blog_attachment. php?attachmentid=11617&stc=1&d=1771445347 Основана на STM32F303RBT6. На борту пять. . .	Камера Toupcam IUA500KMA Eddy_Em 12.02.2026 Т. к. у всяких "хикроботов" слишком уж мелкий пиксель, для подсмотра в ESPriF они вообще плохо годятся: уже 14 величину можно рассмотреть еле-еле лишь на экспозициях под 3 секунды (а то и больше),. . .
И ясному Солнцу zbw 12.02.2026 И ясному Солнцу, и светлой Луне. В мире покоя нет и люди не могут жить в тишине. А жить им немного лет.	«Знание-Сила» zbw 12.02.2026 «Знание-Сила» «Время-Деньги» «Деньги -Пуля»	SDL3 для Web (WebAssembly): Подключение Box2D v3, физика и отрисовка коллайдеров 8Observer8 12.02.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами и вызывать обработчики событий столкновения. . . .	SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 11.02.2026 Содержание блога Библиотека SDL3 содержит встроенные инструменты для базовой работы с изображениями - без использования библиотеки SDL3_image. Пошагово создадим проект для загрузки изображения. . .

@Einheit 5 / 5 / 0 Регистрация: 14.01.2012 Сообщений: 130

	Можно ли сразу учить HTML5 и CSS3? 15.01.2012, 04:02. Показов 28131. Ответов 46 Метки нет (Все метки) Извините что еще раз пишу этот вопрос,но не очень доволен 3 ответам)Посоветуйте пожалуйста все кто может из своего опыта по такому вопросу! Не зная вообще HTML и CSS стоит ли сейчас учить все с 0.Или можно сразу учить HTML5 и CSS3!Что бы делать полноценные красивые сайты?!Спасибо И почему? 0

@Heleg 209 / 209 / 6 Регистрация: 23.10.2011 Сообщений: 971
	06.04.2012, 13:20
	ну вот, значит мы пришли к пониманию, что вопрос о том, что же учить, xhtml, html5 или html 4.01лишен смысла, так как "я делаю сайты в html5" может лишь означать, что я делаю сайт с использованием новых технологий, которые теперь поддерживают браузеры, а не использую какой-то совершенно новый язык Добавлено через 4 минуты это я всё пишу затем, чтобы не появлялись вот такие посты 1

@Heleg 209 / 209 / 6 Регистрация: 23.10.2011 Сообщений: 971
	06.04.2012, 17:34
	дивы с кучей айди – это вот выравнивание таблицы. думаю, что SlavAz имел ввиду именно это 0

@Heleg 209 / 209 / 6 Регистрация: 23.10.2011 Сообщений: 971
	06.04.2012, 18:06
	ха! и типа сайт готов? всем сайтам сайт. всё, дивам пора в deprecated 0

@SlavAz ѪѦѢ 599 / 168 / 5 Регистрация: 19.08.2011 Сообщений: 665 Записей в блоге: 3
	06.04.2012, 20:41
	Некоторые вообще IE6 на сайт не пускают, выдавая заглушку. К тому же каков процент сидящих c отключенным js ? 3%? от силы... и каков процент из них используют IE6? Я лучше потеряю 1% потенциальных посетителей чем пожертвую семантикой и этикой вебдева. Под этикой подразумеваю использование гуру приёмов, объединения картинок и js, datauri, и другие плюшки... 0

@Герц 545 / 344 / 12 Регистрация: 05.11.2010 Сообщений: 1,076 Записей в блоге: 1
	06.04.2012, 22:49
	IE8 рендерит все названные выше элементы с помощью HTML 5 shiv. То, что он не умеет применять стили для неизвестных ему элементов (из-за чего и требуется createElement()), является лишь проблемой самого IE. 0

@Heleg 209 / 209 / 6 Регистрация: 23.10.2011 Сообщений: 971
	06.04.2012, 23:16
	я о том и говорю, что ради неизвестно чего приходится городить скрипты, костыли и прочие извращения. ведь никто пока внятно не сказал, в чем явное преимущество вышеназванных тегов. и дело совсем не в том, что это создает сложности, а в том, что эти скрипты подгружаются и выполняются некоторое время. например 0

@Герц 545 / 344 / 12 Регистрация: 05.11.2010 Сообщений: 1,076 Записей в блоге: 1
	06.04.2012, 23:34
	Преимущество новых тегов их такое же, как у тега <strong> над <b> - это семантическая разметка, div же это просто безликий раздел в разметке страницы, что бы ни было указано в class и id. 0

@Heleg 209 / 209 / 6 Регистрация: 23.10.2011 Сообщений: 971
	06.04.2012, 23:39
	ок </holywar> 0

@conformist O tempora, o mores! 238 / 172 / 13 Регистрация: 15.01.2012 Сообщений: 681
	07.04.2012, 12:32
	если не кучей дивов (правда с классами) - я так написал из за того, что хедер и футер обычно с ид, а в контентной части уже более классами удобнее пользоваться. на самом деле, это можно было и не указывать, просто по привычке. ну мы поняли друг друга и можно сделать логический вывод: html5 - это доктайп, семантика, мультимедиа. все очень удобно, но пока к сожалению плохо поддерживается 1