Изучить html: Доступность | MDN

— HTML | MDN

Элемент сильной значимости (<strong>) указывает на то, что его содержание имеет большое значение, серьёзность или срочность. Браузеры обычно отображают содержимое жирным шрифтом.

Этот элемент включает в себя глобальные атрибуты.

Элемент <strong> предназначен для контента, который имеет «большое значение», включая вещи большой серьёзности или срочности (например, предупреждения). Это может быть предложение, которое имеет большое значение для всей страницы, или вы можете просто попытаться указать, что некоторые слова имеют большее значение по сравнению с соседним контентом.

Обычно этот элемент отображается по умолчанию с использованием жирного шрифта. Однако, он не должен быть использован просто для применения жирного стиля; используйте свойство CSS font-weight для этой цели. Используйте элемент <b>, чтобы привлечь внимание к определённому тексту без указания более высокого уровня важности. Используйте элемент <em> element для выделения текста, который имеет выраженный акцент.

Другим приемлемым использованием для <strong> является обозначение ярлыков абзацев, которые представляют заметки или предупреждения в тексте страницы.

<b> против <strong>

Это часто путает новых разработчиков, почему существует так много способов выразить одно и то же на представленном веб-сайте. <b> и <strong> возможно, является одним из наиболее распространённых источников путаницы, заставляя разработчиков задавать себе вопрос: «Должен ли я использовать <b> или <strong>? Разве они не делают одно и тоже?»

Не совсем. Элемент <strong> для контента, который имеет большее значение, в то время как элемент <b> используется для привлечения внимания к тексту, не указывая на то, что это более важно.

Это может помочь понять, что оба являются правильным и семантическими элементами в HTML5, и это совпадение, что оба они имеют одинаковый стиль (полужирный) в большинстве браузеров (хотя некоторые старые браузеры фактически подчёркивают <strong>). Каждый элемент предназначен для использования в определённых типах сценариев, и если вы хотите жирный шрифт просто для украшения, вместо этого вы должные использовать свойства CSS font-weight.

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

<em> против <strong>

Добавление к путанице заключается в том, что, хотя HTML 4 определяет <strong> как просто указывающий на более сильный акцент, HTML 5 определяет <strong> как представляющий «большое значение для его содержимого». Это важное различие.

В то время, как <em> используется для изменения значения предложения, поскольку делается устный акцент («Я люблю морковь» против «Я люблюморковь«), <strong> используется, для придания предложению порции особого значения (например, «Предупреждение! Это очень опасно. «) Оба элемента <strong> и <em> могут быть вложены для увеличения относительной степени важности или усиленного акцента, соответственно.

Основной пример

<p>Прежде чем продолжить, <strong>убедитесь, что вы надели защитные очки</strong>.</p>

Результат:

Маркировочные предупреждения

<p><strong>Важно:</strong> прежде чем продолжить, убедитесь, что вы добавили много масла.</p>

Это приведёт к:

BCD tables only load in the browser

• Элемент <b>
• Элемент <em>
• Элемент font-weight

Last modified: 13 авг. 2022 г., by MDN contributors

Как учиться самостоятельно — Блог HTML Academy

Если вы попробовали проходить тренажёры, поняли, что вам интересно кодить и у вас уже что-то получается, пора двигаться дальше.

Теперь перед вами открылся дикий и огромный мир фронтенда, в котором есть языки разметки и программирования, много инструментов и программ. И первое, что нужно понять: полностью всё это изучить невозможно. Сама веб-платформа, разные библиотеки и фреймворки развиваются, стареют, забываются, перерождаются во что-то новое. Поэтому «выучить» фронтенд раз и навсегда не получится. Придётся всё время держать себя в тонусе и следить за обновлениями.

Определите траекторию развития

Для начала нужно обозначить цель — куда вы идёте. Например, вы стремитесь устроиться на стажировку фронтендером или научиться верстать по макету. Попробуйте расписать шаги, которые вам нужно сделать, чтобы достичь этой цели. Например, можно пойти от конечной точки к началу:

1. Устроиться на работу;
2. Успешно пройти собеседование;
3. Сделать сайт-портфолио и разместить на нём свои работы;
4. Сверстать 10 сайтов;
5. Сделать свой первый проект.

Когда у вас есть цель и траектория движения, вы можете отбросить всё ненужное, просто задав себе вопрос:

Могу ли я завершить текущий этап без этого?

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

Запишите задачи, которые вам нужно решить

Теперь надо заполнить промежутки между этапами мелкими, решаемыми за 1-2 дня задачами. Например, установить на компьютер редактор кода, изучить теорию и сверстать HTML-форму, посмотреть туториал по пользованию графическим редактором Figma и разобрать один макет. Полученная структура — это описание вашего маршрута.

Чтобы составить такую структуру, необязательно использовать какие-нибудь особенные сервисы. Достаточно записать всё по пунктам на бумаге или в документе. А если напротив задач вы будете ставить галочки или зачеркивать выполненные пункты — наблюдать своё движение будет проще.

Приготовьтесь к препятствиям

Цель и траектория — это не всё. Есть ещё стартовая точка, откуда вы отправляетесь в путь. Это вы сами. И если цели и траектории у разных людей могут быть похожими, то любой из нас — уникален.

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

У меня по образованию абсолютно не техническая специальность. Я врач, да ещё и в декрете, но проект успешно защитила. Сказал бы мне кто-нибудь год назад, что я с нуля сделаю сайт за 9 недель, не поверила бы. Все только в наших руках!

Анна Гуменюк, 29 поток «HTML и CSS. Профессиональная вёрстка сайтов»

Лучше заранее понимать, что может мешать обучению.

• Установки на данность, а не результат. «У меня нет талантов», «Мне уже поздно что-то начинать», «Ошибаться — плохо» и другие отговорки. Чаще всего они надуманы, возникают из-за страха и неуверенности в себе.
• Разочарование. В мыслях всё казалось просто и ярко, но на деле — сложно и рутинно. Времени не хватает, появляется чувство вины, ощущение низкой самоэффективности. Так обычно склонны думать все люди, когда сталкиваются с реальностью.
• Неблагоприятный фон для обучения. Проблемы со здоровьем, питанием, отсутствие времени или сил.
• Попытка взять на себя слишком много сразу. Обучение — это марафон, так что бросаться в многочасовые тренировки со старта не стоит. Нужно сберечь силы на весь путь.

Об всех этих препятствиях подробнее можно почитать здесь.

Помогайте себе

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

• Делайте каждый день по чуть-чуть — это искусство маленьких шагов.

• Относитесь к себе бережно. Не ругайте, если что-то не выходит, и хвалите, если получается.

• Настройтесь на учёбу. Минимизируйте стресс, хорошо высыпайтесь и питайтесь, не отвлекайтесь на посторонние дела, фокусируйтесь на обучении в определённое время.

• Делайте конспекты или ведите дневник обучения.

• Задействуйте больше органов чувств: слушайте, проговаривайте, пишите от руки, печатайте.
• Повторяйте материал время от времени. Сразу всё не запомнится, мозгу нужно время, чтобы разложить информацию по полочкам.

Оттачивайте навыки

Когда перед глазами есть траектория развития, вы чётко понимаете, какими умениями надо овладеть. Например, научиться экспортировать параметры и графику из Figma или строить сетки на флексах и гридах по макету и т. д. Чтобы прокачаться, можно воспользоваться готовыми инструкциями по овладению навыками веб-разработчика.

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

Порядок обучения

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

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

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

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

Если вы уверены, что освоили навык, проверьте свой код и сравните его с нашим эталонным решением.

Инструкции по овладению навыков помогут отточить конкретные умения, записать их в долговременную память, набить шишки. Они позволят в нужный момент самостоятельно освоить то, что вам необходимо. Воспринимайте каждый отдельный навык как заботливо укомплектованный «чемоданчик» для выживания в джунглях фронтенда на отдельном участке пути к вашей цели.

Итак, чтобы самостоятельное обучение было продуктивным, чётко сформулируйте свою цель. Распишите этапы, которые нужно пройти, чтобы достичь желаемого. Составьте список мелких задач и определите, какими навыками вам нужно овладеть. Осваивайте каждый навык планомерно, не уходите в частности, если на данном этапе это не важно. И не переживайте, если обучение окажется небыстрым. Главное — идти в нужном направлении.

Семантический HTML | Codecademy

SEMANTIC HTML

Размещение элементов

Встроение среды

<Рисунок> и <Фиг. Фиг.>

<Секция> и <Статья>

<за исключением> и .

Семантический HTML

 
 
<дел>
 
это нижний колонтитул