Ostatnio edytowany:

Kontekst logiczny

Autor: Virtual Patriot

Podczas poznawania kontekstów wewnętrznych oraz kontekstów zewnętrznych kolejnych elementów HTML możemy natrafić na wiele różnych informacji, różnych reguł, różnych zasad, różnych wyjątków, które musimy przestrzegać.

Znajomość zasad, gdzie i kiedy możemy umieścić interesujący nas element HTML w innym interesującym nas elemencie HTML jest bardzo przydatna, ponieważ dzięki wspomnianej wiedzy nie popełniamy błędów w naszym kodzie HTML ze względu na nieprzestrzeganie prawidłowego kontekstu wewnętrznego oraz ze względu na nieprzestrzeganie prawidłowego kontekstu zewnętrznego elementów HTML.

Nie należy bać się tego, iż język HTML oferuje nam wiele różnych elementów HTML, które mogą zostać przez nas wykorzystane w wielu różnych sytuacjach, na różny sposób, to znaczy nie należy zniechęcać się do tego, że każdy element HTML posiada swój własny model kontekstu wewnętrznego oraz swój własny model kontekstu zewnętrznego (niekiedy kilka wariantów wspomnianych modeli kontekstów naraz), które powinniśmy znać, ponieważ jeżeli zechcemy sprawdzić, czy nasz kod HTML zawiera jakiś błąd ze względu na nieprawidłowe umieszczenie przez nas elementu HTML w naszym kodzie HTML, wtedy do wspomnianego celu możemy wykorzystać walidator kodu HTML.

Oprócz kontekstu wewnętrznego oraz kontekstu zewnętrznego elementu HTML w języku HTML występuje pewna rzecz, którą możemy nazwać kontekstem logicznym.

Czym jest kontekst logiczny?

Zawartością pudełka na pierścionek może być pierścionek. Rzeczą, w której możemy umieścić pierścionek może być pudełko na pierścionek. Gdy umieścimy pierścionek w pudełku na pierścionek, wtedy pierścionek jest prawidłowym kontekstem wewnętrznym pudełka na pierścionek, a pudełko na pierścionek jest prawidłowym kontekstem zewnętrznym pierścionka. Lecz co dalej? W jakiej sytuacji możemy wykorzystać nasze przykładowe powiązane ze sobą rzeczy? Załóżmy, że nasz przykładowy pierścionek jest pierścionkiem zaręczynowym. Teoretycznie, jak również praktycznie, pudełko wraz z pierścionkiem zaręczynowym możemy podarować każdej kobiecie (innymi słowy każda kobieta może być prawidłowym kontekstem zewnętrznym dla pudełka wraz z pierścionkiem zaręczynowym), lecz w niektórych sytuacjach czynność ta będzie pozbawiona logiki (przecież nie podarujemy pudełka wraz z pierścionkiem zaręczynowym: siostrze lub kobiecie, która ma już narzeczonego czy męża, lub kobiecie, która nie ma ochoty na związek z nami itd.). Innymi słowy, mimo że każda kobieta jest prawidłowym "kontekstem zewnętrznym" dla pudełka wraz z pierścionkiem zaręczynowym nie oznacza to, że każda kobieta może być prawidłowym "kontekstem logicznym" dla pudełka wraz z pierścionkiem zaręczynowym. Jedynie kobieta, która nas kocha oraz którą my kochamy może być prawidłowym kontekstem logicznym dla pudełka wraz z pierścionkiem zaręczynowym.

Przykład:

<p>
  Moim ulubionym kwiatem jest <b>róża</b>.
</p>

Jaki element HTML może być kontekstem zewnętrznym elementu p?

Kontekstem zewnętrznym elementu p może być element HTML, który tworzy wewnętrzny kontekst opływający. Spróbujmy więc wybrać, jakiś element HTML, który należy do wspomnianej kategorii HTML, na przykład element nav.

Przykład:

<nav>
  <p>
    Moim ulubionym kwiatem jest <b>róża</b>.
  </p>
</nav>

Element nav należy do kategorii element HTML, który tworzy wewnętrzny kontekst opływający, a kontekstem zewnętrznym elementu p może być element HTML, który tworzy wewnętrzny kontekst opływający, dlatego w tym wypadku nasz przykładowy element p posiada prawidłowy kontekst zewnętrzny...

Lecz czy aby na pewno w tym wypadku wszystko jest w porządku?

Przeznaczeniem elementu nav jest to, aby element nav reprezentował w swojej zawartości elementy HTML tworzące nawigację pomiędzy różnymi dokumentami HTML lub ich częściami...

W naszym przykładzie zawartością elementu nav jest element p, którego zawartość reprezentuje treść mówiącą nam o tym, że naszym ulubionym kwiatem jest róża, dlatego w tej sytuacji kontekst logiczny wspomnianego elementu nav jest nieprawidłowy.

Sprawmy, aby kontekstem zewnętrznym naszego przykładowego elementu p był element article.

<article>
  <p>
    Moim ulubionym kwiatem jest <b>róża</b>.
  </p>
</article>

Element article należy do kategorii element HTML, który tworzy wewnętrzny kontekst opływający, a kontekstem zewnętrznym elementu p może być element HTML, który tworzy wewnętrzny kontekst opływający, dlatego w tym wypadku nasz przykładowy element p posiada prawidłowy kontekst zewnętrzny. Dodatkowo w zaistniałej sytuacji wspomniany element article posiada prawidłowy kontekst logiczny, ponieważ zawartością elementu article między innymi powinny być elementy HTML tworzące treść przykładowego artykułu. W tym wypadku treścią naszego przykładowego artykułu jest treść reprezentowana przez zawartość elementu p mówiąca nam o tym, że naszym ulubionym kwiatem jest róża.

Ponadto, aby nadać tytuł dla treści naszego przykładowego artykułu na przykład możemy skorzystać z elementu h1.

<article>
  <h1>Mój ulubiony kwiat</h1>

  <p>
    Moim ulubionym kwiatem jest <b>róża</b>.
  </p>
</article>

Od tej pory elementy HTML tworzące naszą przykładową strukturę HTML posiadają prawidłowy kontekst wewnętrzny, kontekst zewnętrzny, kontekst logiczny oraz kilka innych rzeczy, które poznamy wkrótce.

Aby łatwiej nam było zrozumieć kontekst logiczny, aby posługiwanie się różnymi elementami HTML było dla nas o wiele łatwiejsze, musimy poznać przeznaczenie oraz zastosowanie poszczególnych elementów HTML. Dlatego na tego typu rzeczach i nie tylko skupimy się w następnych krokach tego kursu HTML.