Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.Вивчайте Завдання: Семантичні Елементи | Розширений HTML
Основи HTML

book
Завдання: Семантичні Елементи

Завдання

Створіть HTML-документ для веб-сайту компанії з розробки Flutter, використовуючи семантичні HTML-елементи для покращення доступності та оптимізації для пошукових систем.

Переконайтеся, що кожен розділ веб-сайту обгорнутий у відповідні семантичні HTML-елементи (<header>, <nav>, <section>, <footer>).

html

index.html

copy
<!DOCTYPE html>
<html>
<head>
<title>Flutter Main Company</title>
<meta charset="UTF-8" />
</head>
<body>
<!-- Step 1: Provide the correct tag for the header section -->
<_____>
<h1>Flutter Main Company</h1>
<!-- Step 2: Provide the correct tag for navigation menu -->
<_____>
<ul>
<li><a href="#">About Us</a></li>
<li><a href="#">Services</a></li>
</ul>
</_____>
</_____>

<!-- Step 3: Provide the correct tag for the 'about us' section -->
<_____>
<h2>About Us</h2>
<p>
Welcome to Flutter Main Company, your premier destination for
professional Flutter app development services.
</p>
</_____>

<!-- Step 3: Provide the correct tag for the 'services' section -->
<_____>
<h2>Our Services</h2>
<ul>
<li>Flutter App Development</li>
<li>Cross-Platform Development</li>
<li>UI/UX Design</li>
<li>Testing and Quality Assurance</li>

Підказка

  • Крок 1: Використовуйте елемент header для розміщення основних елементів брендингу та навігації.
  • Крок 2: Використовуйте елемент nav для меню навігації.
  • Крок 3: Обгорніть кожен окремий розділ контенту в елемент section.
  • Крок 4: Елемент footer повинен містити інформацію про авторські права, посилання на політику та контактні дані.
html

index.html

copy
<!DOCTYPE html>
<html>
<head>
<title>Flutter Main Company</title>
<meta charset="UTF-8" />
</head>
<body>
<!-- Step 1: Provide the correct tag for the header section -->
<header>
<h1>Flutter Main Company</h1>
<!-- Step 2: Provide the correct tag for navigation menu -->
<nav>
<ul>
<li><a href="#">About Us</a></li>
<li><a href="#">Services</a></li>
</ul>
</nav>
</header>

<!-- Step 3: Provide the correct tag for the 'about us' section -->
<section>
<h2>About Us</h2>
<p>
Welcome to Flutter Main Company, your premier destination for
professional Flutter app development services.
</p>
</section>

<!-- Step 3: Provide the correct tag for the 'services' section -->
<section>
<h2>Our Services</h2>
<ul>
<li>Flutter App Development</li>
<li>Cross-Platform Development</li>
<li>UI/UX Design</li>
<li>Testing and Quality Assurance</li>
Все було зрозуміло?

Як ми можемо покращити це?

Дякуємо за ваш відгук!

Секція 5. Розділ 3
some-alt