Sezon II — Opowieść Kartografa, odcinek 17

WPROWADZENIE

Poprzedni odcinek pokazał miasto z dekoracji od środka. Ten robi rzecz trudniejszą: każe przeczytać tę samą stronę dwa razy, raz jako człowiek, raz jako maszyna — i zobaczyć, ile z pierwszego czytania było w treści, a ile w głowie czytającego.

Zadanie brzmi: przejrzyj stronę jak człowiek, potem spróbuj ją zrozumieć jak maszyna. Co rozumiesz bez dopowiadania? Co się rozpłynie? Na ekranie stoi klasyczny hero z hasłem, przyciskiem, plakietką „bestseller" i kółkiem „−30%". Duch patrzy i mówi zdanie, które jest sednem całego odcinka: dla mnie to jasne. Ale dla Ciebie?

TRANSKRYPCJA ODCINKA

Nagłówek. Kartograf przy mapie, obok Duch i ekran ze stroną „TWÓJ SUKCES ZACZYNA SIĘ TUTAJ", przycisk „Zobacz ofertę", plakietka BESTSELLER, znacznik −30%. Podtytuł: Człowiek widzi sens. Maszyna potrzebuje dowodów. ZADANIE DLA DUCHA: Przejrzyj stronę jak człowiek. Potem spróbuj ją zrozumieć jak maszyna. Co rozumiesz bez dopowiadania? Co się rozpłynie? Duch: Dla mnie to jasne. Ale dla Ciebie?

Panel 1. Chłopiec patrzy na rząd rozpoznanych elementów. Podpis: Człowiek dopowiada. Widzę więcej niż to, co jest napisane. To jest sklep. To jest cena — 299 zł. To jest zaufane. To jest przycisk — KUP TERAZ. To jest opinia — ★★★★★. Adnotacja: Dopowiadam luki. Korzystam z doświadczenia. To dla mnie oczywiste.

Panel 2. Ten sam bohater przed monitorem z kodem. Podpis: Maszyna nie dopowiada. Czytam dosłownie. Nie zgaduję. Pytania: Co to jest? Ile to kosztuje? Czy można kupić? Jak to wygląda? Czy to ważne? Kod na ekranie: <div class="box">, <span style="…">PROMOCJA!</span>, <a class="btn">KUP TERAZ</a>, </div>. Adnotacja: Nie widzę sensu. Widzę tylko kod i strukturę.

Panel 3. Makieta strony otoczona etykietami: HERO, IMG, STYLE, DIV, BADGE, ICON, BTN, SPACER, ANIM, GRID, WRAPPER, SHAPE. Podpis: Gdzie ginie znaczenie? Czytelnik nie dopowiada. Gubi się w dekoracjach. Na makiecie: „TWOJA PRZEWAGA — Zacznij dziś", przycisk SPRAWDŹ, pod spodem Szybko / Bezpiecznie / Skutecznie. Adnotacja: Piękne miasto. Ale bez mapy i tabliczek. Duch nie wie, gdzie wejść.

Panel 4. Duch z rozłożoną mapą. Podpis: Co pomaga Duchowi zrozumieć? Daj znaczenie. Nie dekoracje. Jasna struktura (nagłówki, listy, sekcje). Znaczniki semantyczne (HTML). Opisy danych (Schema.org). Etykiety i atrybuty (ARIA). Linki, które mówią co prowadzą. Spójność i kontekst. Ścieżka: HTML → SCHEMA → KONTEKST → MAPA. Duch: Teraz rozumiem! Adnotacja: Kiedy strona mówi wprost – zyskują wszyscy.

Panel 5. Dwie karty zestawione obok siebie. Podpis: Dwa sposoby czytania. PIERWSZY CZYTELNIK (człowiek): widzę obraz, dopowiadam sens, czytam szybko, kieruję się emocją. DRUGI CZYTELNIK (maszyna / agent): widzę strukturę, potrzebuję dowodów, czytam powoli, kieruję się faktami. Adnotacja: Obaj czytamy tę samą stronę. Tylko każdy – inaczej.

Panel 6. Zagubiony bohater wśród sześciu tabliczek. Podpis: Kiedy Duch się gubi… Strona ładna, ale milcząca. Zbyt dużo ozdób. Ukryte treści w skryptach. Niejasne przyciski. Brak jasnych nagłówków. Nietyle treści w skryptach. Obrazy bez opisu. Adnotacja: Nie mogę potwierdzić. Nie mogę polecić. Nie mogę zacytować. Nie mogę wykonać.

Panel 7. Panorama miasta, Kartograf i Duch przy mapie. Podpis: Dopóki strona nie powie wprost, Duch będzie tylko zgadywał. Adnotacja: Miasto może być piękne. Ale tylko z mapą da się w nim żyć i bezpiecznie dojść do celu. Kartograf: Twoim zadaniem jest nie zgadywać. Tylko mówić jasno. Dla obu czytelników. Zawsze.

Puenta odcinka: Znaczenie to nie dekoracja. To most do zrozumienia.

ZASADA TEGO ODCINKA

Strona nigdy nie zawierała tyle treści, ile się wydawało. Resztę dokładał czytelnik.

Pierwszy panel opisuje coś, czego zwykle nie zauważamy, bo dzieje się poniżej progu świadomości. Nikt nie napisał na tej stronie „to jest cena". Napisał „299 zł", a to, że jest to cena, a nie numer katalogowy, waga produktu czy liczba klientów, wywnioskowaliśmy z pozycji, koloru, sąsiedztwa przycisku i dziesięciu tysięcy sklepów, które widzieliśmy wcześniej. Ta wiedza nie jest w kodzie. Jest w nas.

Dlatego drugi panel nie pokazuje strony zepsutej. <div class="box"> z <span>PROMOCJA!</span> i <a class="btn">KUP TERAZ</a>to poprawny, działający kod. On po prostu nie zawiera żadnego z tych ustaleń, które człowiek zrobił automatycznie: co to jest, ile kosztuje, czy da się to kupić, czy to ważne. Odpowiedzi na te pytania nigdy nie zostały zapisane, bo nigdy nie musiały.

Najostrzejsza jest adnotacja z szóstego panelu, bo pokazuje, że stawka nie jest abstrakcyjna: nie mogę potwierdzić, nie mogę polecić, nie mogę zacytować, nie mogę wykonać. To cztery różne rodzaje przegranej. Nie da się potwierdzić faktu, którego strona nie zadeklarowała. Nie da się polecić produktu, którego ceny i dostępności nie widać. Nie da się zacytować zdania bez autora i daty. I nie da się wykonać zakupu, jeśli nie wiadomo, który element jest przyciskiem kupna, a który dekoracją. Strona nie zostaje oceniona źle — zostaje pominięta, bo nie da się na niej nic zrobić.

Czwarty panel jest jedynym miejscem w tym sezonie, gdzie pada gotowa recepta, i warto zauważyć jej kolejność. Najpierw struktura, czyli nagłówki, listy i sekcje — to podstawa, którą HTML dawał od 1991 roku. Potem znaczniki semantyczne, czyli używanie elementów zgodnie z rolą. Dopiero potem Schema.org, czyli jawne deklaracje encji. Dane strukturalne dołożone do strony bez struktury nie naprawiają niczego — opisują coś, czego pod spodem nie ma. Kolejność HTML → Schema → kontekst → mapa nie jest przypadkowa i nie da się jej przeskoczyć.

Ostatnie zdanie Kartografa domyka odcinek uczciwie: mówić jasno dla obu czytelników. Nie zamiast człowieka, nie kosztem estetyki. Znaczenie to warstwa równoległa do wyglądu, nie konkurencyjna wobec niego. Miasto może być piękne — tylko potrzebuje tabliczek.

ZAPOWIEDŹ

Sezon powoli dobiega końca. Duch wie już, jak powstała sieć, co zyskała w wojnie o okno i co przy tym zgubiła. Pozostaje pytanie, co z tą wiedzą zrobić.