/
index.html
154 lines (153 loc) · 10.5 KB
/
index.html
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
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
<!DOCTYPE html>
<html lang="ru">
<head>
<title>Научиться учиться</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="styles/normalize.css">
<link rel="stylesheet" href="styles/style.css">
</head>
<body>
<div class="page">
<header class="header">
<a class="logo__place_header_a" href="#"><img class="logo__place_header" src="images/logo.svg" alt="Логотип Яндекс Практикум"></a>
<h1 class="header__title">Научиться учиться</h1>
<p class="header__subtitle">Какие современные и эффективные подходы к обучению вы можете использовать в своей жизни?<a class="header__link" href="#"> Узнать →</a></p>
<img class="main__illustration" src="images/two_again.png" alt="Картина дети с мамой">
<div class="header__square_pic">
</div>
</header>
<main class="content">
<section class="description">
<div class="two-columns">
<div class="two-columns__brief">
<p class="two-columns__brief">Главные проблемы в обучении</p>
</div>
<div class="two-columns__main_text">
<p class="two-columns_paragraph">Ни в школе, ни в институте нас не учат тому, как правильно изучать материал. Мы готовимся к экзаменам и учим билеты. Мы тренируемся решать однообразные задачи, чтобы лучше сдать тест, но часто в итоге это не дает нам реального знания. Зубрежка быстро выветривается и не приносит пользы.</p>
<p class="two-columns_paragraph"><span class="two__columns_span_accent">Вывод:</span> учиться тоже нужно уметь, но почему-то этому мало где учат. Что с этим делать?</p>
<p class="two-columns_paragraph">Конкретные техники и упражнения помогают изменить подход к обучению, сделать его эффективным и захватывающим. Эти же техники применяются на примере обучения в Практикуме.</p>
</div>
</div>
</section>
<section class="digits">
<h2 class="section__title_digits">Цифры и факты</h2>
<h3 class="section__subtitle_digits">Про учебу и мозг</h3>
<div class="table">
<div class="table__cell">
<h4 class="table__heading">86 миллиардов</h4>
<p class="table__text">Число нейронов в мозге человека</p>
</div>
<div class="table__cell">
<h4 class="table__heading">2.1 миллиарда</h4>
<p class="table__text">Число нуждающихся в повышении квалификации</p>
<p class="table__text_lost">Всемирный Банк, 2017</p>
</div>
<div class="table__cell">
<h4 class="table__heading">1000 терабайт</h4>
<p class="table__text">Объём памяти человека</p>
</div>
<div class="table__cell">
<h4 class="table__heading">500 триллионов</h4>
<p class="table__text">Число ответственных за обучение нервных синапсов у взрослого человека</p>
</div>
<div class="table__cell">
<h4 class="table__heading">420 миллионов</h4>
<p class="table__text">Число взрослых людей моложе 25 лет, не имеющих образования для трудоустройства</p>
<p class="table__text_lost">Всемирный Банк, 2017</p>
</div>
<div class="table__cell">
<h4 class="table__heading">17–20 лет</h4>
<p class="table__text">Пик обучаемости</p>
</div>
<div class="table__cell">
<h4 class="table__heading">1885 год</h4>
<p class="table__text">Открытие кривой забывания</p>
</div>
<div class="table__cell">
<h4 class="table__heading">1889 год</h4>
<p class="table__text">Открытие условного рефлекса</p>
</div>
</div>
</section>
<section class="feinman">
<h2 class="feinman__title">Метод Фейнмана</h2>
<h3 class="feinman__subtitle">Выучить и не забыть.</h3>
<a class="feinman__link" href="#">Подробнее →</a>
<div class="feinman__img"></div>
</section>
<section class="kaufman">
<h2 class="section__title_kaufman">Принципы обучения</h2>
<h3 class="section__subtitle_theme">От Джоша Кауфмана</h3>
<div class=" table__theme">
<div class="table__theme_dark">
<h4 class="table__heading_dark">1</h4>
<p class="table__text_dark">Выберите привлекательный проект.</p>
</div>
<div class="table__theme_dark">
<h4 class="table__heading_dark">2</h4>
<p class="table__text_dark">Сосредоточьтесь на каком-то одном навыке.</p>
</div>
<div class="table__theme_dark">
<h4 class="table__heading_dark">3</h4>
<p class="table__text_dark">Определите целевой уровень мастерства.</p>
</div>
<div class="table__theme_dark">
<h4 class="table__heading_dark">4</h4>
<p class="table__text_dark">Разбейте навык на элементы.</p>
</div>
<div class="table__theme_dark">
<h4 class="table__heading_dark">5</h4>
<p class="table__text_dark">Приготовьте всё необходимое для занятий.</p>
</div>
<div class="table__theme_dark">
<h4 class="table__heading_dark">6</h4>
<p class="table__text_dark">Устраните препятствия для занятий.</p>
</div>
<div class="table__theme_dark">
<h4 class="table__heading_dark">7</h4>
<p class="table__text_dark">Выделите специальное время для занятий.</p>
</div>
<div class="table__theme_dark">
<h4 class="table__heading_dark">8</h4>
<p class="table__text_dark">Создайте быстрые петли обратной связи.</p>
</div>
<div class="table__theme_dark">
<h4 class="table__heading_dark">9</h4>
<p class="table__text_dark">Занимайтесь по расписанию, короткими интенсивными интервалами.</p>
</div>
<div class="table__theme_dark">
<h4 class="table__heading_dark">10</h4>
<p class="table__text_dark">Уделяйте внимание количеству и скорости.</p>
</div>
<img class="kaufman__triangle" src="images/triangle.svg" alt="Треугольник">
</div>
</section>
</main>
<footer class="footer">
<div class="footer__columns">
<div class="footer__column_content_copyright">
<a class="logo__place_footer_a" href="#"><img class=" logo__place_footer" src="images/logo_white.svg" alt="Логотип Яндекс Практикум"></a>
<p class="footer__author">© 2019. Denis Verakhab</p>
</div>
<div class="footer__column_content_info">
<h4 class="footer__column_heading">О Практикуме</h4>
<ul class="footer__column_link">
<li class="footer__column_link_li">Главная</li>
<li class="footer__column_link_li">Концепция</li>
<li class="footer__column_link_li">Наставники</li>
</ul>
</div>
<div class="footer__column_content_social">
<h4 class="footer__column_heading">Соцсети</h4>
<ul class="footer__column_link">
<li class="footer__column_link_li"><a class="footer__column_link_a" href="#"><img class="facebook" src="images/facebook_white.svg" alt="Иконка Facebook">Facebook</a></li>
<li class="footer__column_link_li"><a class="footer__column_link_a" href="#"><img class="vk" src="images/vk_white.svg" alt="Иконка Вконтакте">ВКонтакте</a></li>
<li class="footer__column_link_li"><a class="footer__column_link_a" href="#"><img class="instagram" src="images/instagram_white.svg" alt="Иконка Instagram">Instagram</a></li>
</ul>
</div>
</div>
</footer>
</div>
</body>
</html>