Lekcje >> Podstawy HTML 5
Polimax

Drukarnia w Warszawie realizująca druk wizytówek, plakatów jak również fotoksiążki, fotoobrazy i fotokalendarze - z wysyłką na terenie całego kraju.

Słowa kluczowe i opis strony

Słowa kluczowe

Są umieszczane w grupie meta. Słowem kluczowym może być jeden lub kilka wyrazów tworzących spójną zwięzłą informację. Słowa kluczowe oddzielamy przecinkami. Powinny krótko informować o zawartości strony. Kogo informować? Roboty sieciowe, które pozycjonują naszą stronę. Umieszczenie słów kluczowych powinno wyglądać następująco:

<!doctype html>
<html>
  <head>
    <title>Tytuł strony</title>
    <meta charset="UTF-8" />
    <meta name="keywords" content="Słowa kluczowe" />
  </head>
  <body>
  </body>
</html>

Zwróć uwagę, że pojawiły się dwa nowe atrybuty: name (nazwa) oraz content (zawartość). W zapisie stosujemy standard HTML; to znaczy nazwa atrybutu, następnie znak równości, następnie wartość w cudzysłowiu. Przykład szkieletu ze słowami kluczowymi:

<!doctype html>
<html>
  <head>
    <title>Kurs HTML5</title>
    <meta charset="UTF-8" />
    <meta name="keywords" content="kurs HTML5, kurs CSS, strona WWW, witryna internetowa, webmaster, 
    pozycjonowanie" />
  </head>
  <body>
  </body>
</html>

Ćwiczenie 1_1_2_1

Wykonaj stronę WWW na której będzie pokazany napis "Ćwiczenie umieszczania słów kluczowych". Jeżeli nie pamiętasz sposobu zapisywania ćwiczeń, to zajrzyj tutaj. W tym ćwiczeniu zwracam na to uwagę po raz ostatni. Zapamiętaj sposób numerowania i zapisywania ćwiczeń. Jeżeli nie zauważyłeś do tej pory reguły to zwróć uwagę na to, że trzy pierwsze liczby w nazwie ćwiczenia są identyczne jak w nazwie pliku dokumentu który przeglądasz, natomiast ostatnia liczba to numer kolejnego ćwiczenia na danej stronie. Taką samą numerację stosuj w nazwach tworzonych przez Ciebie folderów i plików.

  1. Utwórz folder dla tego ćwiczenia.
  2. Utwórz dokument HTML zawierający szkielet dokumentu uwzględniający słowa kluczowe.
  3. Strona powinna posiadać tytuł Słowa kluczowe.
  4. Umieść następujące słowa kluczowe: Słowa kluczowe, HTML, lekcja, nauka, technikum informatyczne.
  5. Napisz w dokumencie tekst podany w treści zadania.
  6. Zapisz utworzony dokument HTML w folderze utworzonym dla tego ćwiczenia.
  7. Otwórz ten plik przeglądarką.
  8. Sprawdź, czy jest pokazany tytuł strony.
  9. Pokaż źródło dokumentu i sprawdź czy są pokazane słowa kluczowe.
  10. Jeżeli musisz poprawić dokument, to otwórz go za pomocą Notepad++ i dokonaj stosownych korekt.

Tak powinna wyglądać poprawnie wykonana strona:

Opis strony

Podobnie jak słowa kluczowe, opis jest umieszczany w grupie meta. Zawiera jedno lub dwa zdania na temat zawartości strony. Wyszukiwarki często pokazują opis częściowo lub w całości jako wynik szukania. Właśnie na podstawie opisu strony internauta często zadecyduje, czy odwiedzić Twoją stronę. Pamiętaj więc, że opis powinien być sensowny oraz poprawny gramatycznie i stylistycznie. Szkielet uzupełniony o opis strony wygląda następująco:

<!doctype html>
<html>
  <head>
    <title>Tytuł strony</title>
    <meta charset="UTF-8" />
    <meta name="keywords" content="Słowa kluczowe" />
    <meta name="description" content="Opis strony" />
  </head>
  <body>
  </body>
</html>

Jak widać posiada atrybuty o tych samych nazwach co słowa kluczowe. Przykład szkieletu z opisem strony:

<!doctype html>
<html>
  <head>
    <title>Kurs HTML5</title>
    <meta charset="UTF-8" />
    <meta name="keywords" content="kurs HTML5, kurs CSS, strona WWW, witryna internetowa, webmaster, 
    pozycjonowanie" />
    <meta name="description" content="Podstawy HTML5 dla uczniów technikum informatycznego" /> 
  </head>
  <body>
  </body>
</html>

Ćwiczenie 1_1_2_2

Wykonaj stronę WWW na której będzie pokazany napis "Ćwiczenie umieszczania opisu strony".

  1. Utwórz dokument HTML zawierający szkielet dokumentu uwzględniający tytuł strony, słowa kluczowe oraz opis strony.
  2. Strona powinna posiadać tytuł HTML5 dla technika informatyka.
  3. Umieść następujące słowa kluczowe: Technik informatyk, HTML5, lekcja, nauka, kurs.
  4. Umieść następujący opis strony : Nauka podstaw HTML5 w technikum informatycznym.
  5. Napisz w dokumencie tekst podany w treści zadania.
  6. Zapisz utworzony dokument HTML.
  7. Otwórz ten plik przeglądarką.
  8. Sprawdź, czy jest pokazany tytuł strony.
  9. Pokaż źródło dokumentu i sprawdź czy są pokazane słowa kluczowe oraz opis strony.
  10. Jeżeli to konieczne, dokonaj stosownych korekt.

Tak powinna wyglądać poprawnie wykonana strona:

Ćwiczenie 1_1_2_3

Wykonaj stronę WWW, której szkielet uwzględnia tytuł strony, słowa kluczowe oraz opis strony. Będzie to strona na temat Twojego hobby lub zainteresowań jak sport, muzyka itp. W sekcji body napisz Strona poświęcona moim zainteresowaniom

Praca domowa

  1. Wykonaj ponownie Ćwiczenie 1_1_2_1.
  2. Wykonaj ponownie Ćwiczenie 1_1_2_2.
  3. Wykonaj ponownie Ćwiczenie 1_1_2_3.
  4. Przepisz do zeszytu szkielet dokumenu i naucz się go na pamięć. Musisz umieć omówić znaczenie poszczególnych elementów.

Jeżeli nie jesteś pewny, jak wykonane zadania zapisać na pendriwie, to zajrzyj do pierwszego ćwiczenia, w którym zostało to dokładnie wytłumaczone.