[ Promptologia - Dojo ]

HTML to język znaczników — opisuje strukturę strony. Nie programuje, nie liczy - “mówi przeglądarce” co jest nagłówkiem, co akapitem, co obrazkiem.

Minimalny szablon który musi mieć każda strona:


Minimalny szablon który musi mieć każda strona

<!DOCTYPE html>
<html lang="pl">

  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Tytuł strony</title>
  </head>

  <body>
	  <h1>Moja pierwsza strona www</h1>
    <p>Tu idzie treść naszej strony.</p>
    <p>Tu idzie dalsza treść naszej strony.</p>
  </body>

</html>

Co to jest każda sekcja

Sekcja Do czego
<!DOCTYPE html> mówi przeglądarce: to jest HTML5
<html> korzeń - wszystko jest w środku
<head> niewidoczne ustawienia: tytuł, kodowanie, CSS, meta
<title> tekst w zakładce przeglądarki
<meta charset> polskie znaki działają
<meta viewport> strona działa na telefonie
<body> wszystko co widzi użytkownik

Zasada:

<head> = dla przeglądarki
<body> = dla użytkownika

Zasady przy generowaniu HTML przez LLM

1. Podaj kontekst - nie tylko "zrób stronę"

Powiedz: cel strony, target, styl, kolory, czy ma być responsywna. Im więcej kontekstu, tym mniej poprawek.

# źle
"zrób stronę landing page"

# dobrze
"zrób landing page dla SaaS B2B, ciemny motyw,
CTA 'Umów demo', sekcje: hero / features / kontakt"

2. Proś o wszystko w jednym pliku

LLM często rozdziela HTML / CSS / JS na osobne pliki. Na początku proś o jeden plik - łatwiej edytować i wklejać.

"wygeneruj jako JEDEN plik HTML z CSS i JS inline"