Układ Strony

Układ strony w języku HTML to sposób organizacji i układania elementów na stronie internetowej za pomocą znaczników HTML. Układ strony może zawierać elementy takie jak nagłówek, menu nawigacyjne, treść główną, stopkę, i inne sekcje, które pomagają w organizacji i strukturyzacji informacji na stronie. Układ strony jest ważny, ponieważ wpływa na wygląd i funkcjonalność strony, a także ułatwia użytkownikom znalezienie potrzebnych informacji.

Podstawowy układ strony składa się z następujących elementów

1. Nagłówka zawierającego metadane, takie jak tytuł strony i opisy

2. Ciała zawierającego treść strony

3. Nagłówka zawierającego logo i nawigację

4. Treści głównej zawierającą treść na stronie

5. Stopki zawierającej informacje o autorze, prawach autorskich i linki

Strona tworząca układ strony

								
<!DOCTYPE html>
<html>
  <head>
    <title>Układ strony</title>
  </head>
  <body>
    <h1>Mój pierwszy układ strony</h1>
    <header>
      <nav>
        <ul>
          <li><a href="#about">O nas</a></li>
          <li><a href="#services">Usługi</a></li>
          <li><a href="#contact">Kontakt</a></li>
        </ul>
      </nav>
    </header>
    <main>
      <section id="about">
        <h1>O nas</h1>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. A pulvinar ipsum pulvinar ac.</p>
      </section>
      <section id="services">
        <h1>Usługi</h1>
        <ul>
          <li>Usługa 1</li>
          <li>Usługa 2</li>
          <li>Usługa 3</li>
        </ul>
      </section>
      <section id="contact">
        <h1>Kontakt</h1>
        <form action="" method="post">
          <label for="name">Imię:</label>
          <input type="text" id="name" name="name">
          <label for="email">Email:</label>
          <input type="email" id="email" name="email">
          <label for="message">Wiadomość:</label>
          <textarea id="message" name="message"></textarea>
          <input type="submit" value="Wyślij">
        </form>
      </section>
    </main>
    <footer>
      <p>&copy; 2023 Moja firma</p>
    </footer>
  </body>
</html>