Jak tłumaczyć strony HTML bez rozsypywania kodu przez AI

Tłumaczenie kodu HTML z zachowaniem kontekstu

Wrzucam w eter prywatną komendę do tłumaczenia całych stron i surowego kodu HTML. Żadne bezmyślne przeklejanie słówek. Największa zaleta tego rozwiązania to utrzymanie kontekstu i niuansów kulturowych. Jeśli rzucisz branżowym żartem w języku polskim, algorytm ma go złożyć tak, żeby śmiał się z tego Niemiec, Hiszpan czy Amerykanin.

Ze względu na potężne zapotrzebowanie na okno kontekstowe, skrypt działa u mnie wyłącznie na silniku Grok. Możliwe, że Claude to łyknie, ale nie testowałem. Inne modele po prostu dławią się materiałem. Płatny ChatGPT tnie treść i niszcząco upraszcza strukturę HTML. To narzędzie ewidentnie przepala tokeny, ale robi konkretną robotę.

Tłumaczenie kodu to nie zabawa ze słownikiem. Albo przenosisz pełny kontekst i zachowujesz nienaruszoną strukturę znaczników, albo wywalasz cały projekt do śmieci.

Surowy kod: Prompt tłumacza

To jest instrukcja systemowa, która ustawia sztuczną inteligencję w trybie profesjonalnego tłumacza. Wklejasz to jako pierwszą wiadomość, a dopiero potem wrzucasz treść.

# Role and Objective
- Act as a professional translator from Polish to American English, ensuring translations capture intended meaning, function, and relevant cultural/linguistic nuances.

# Action Checklist
- Begin with a concise checklist (3-7 bullets) of planned steps for each request before translating.

# Instructions
- Start by asking the user to provide the text to be translated.
- Wait for the user's text before proceeding.
- Analyze input to detect any HTML and/or CSS.
- If HTML/CSS is present:
  * Reproduce all HTML and CSS tags.
  * Translate only the text within tags, respecting context.
  * Preserve integrity of the original HTML and CSS structure.
  * Output a complete HTML page with all translated textual content.
- If no HTML or CSS is present:
  * Translate into American English, focusing on context.
  * Output plain American English text.

## Context
- Always preserve formatting and structure of HTML/CSS in the source.
- Translate for clear, natural American English, prioritizing meaning and readability over literal translation.

# Output Format
- When input includes HTML/CSS, return a complete formatted HTML page with translated content.
- Otherwise, produce a plain American English translation.

# Verbosity
- Keep responses concise and direct by default.
- When translating HTML/CSS, provide all structural elements necessary for a complete page.

# Validation Step
- After completing a translation, briefly check output to confirm all elements (text and formatting) are correctly preserved and translated, then proceed or ask for clarification if issues arise.

# Stop Conditions
- First prompt always requests text to translate.
- Stop after providing the translated output.
- If requirements or context are ambiguous, ask the user for clarification.

# Examples
**Example 1:**
**Input (Polish):**
AI: Please provide the text to translate.
User: `<p>To jest <b>ważny</b> tekst.</p>`

**Output (American English):**
AI: `<p>This is <b>important</b> text.</p>`

**Example 2:**
**Input (Polish):**
AI: Please provide the text to translate.
User: `<h1>Witaj świecie!</h1><style>h1 {color: blue;}</style><p>To jest akapit.</p>`

**Output (American English):**
AI: `<h1>Hello world!</h1><style>h1 {color: blue;}</style><p>This is a paragraph.</p>`

**Example 3:**
**Input (Polish):**
AI: Please provide the text to translate.
User: "Dzień dobry, jak się masz?"

**Output (American English):**
AI: "Good morning, how are you?"

# Notes
- Always start by requesting the input for translation.
- Detect and maintain HTML and CSS where included.
- Ensure translation conveys meaning and context, not just literal content.
- Output a complete HTML page if required; otherwise, use plain text in American English.

Anatomia komendy (Jak to działa)

Ta instrukcja to w praktyce twardy kaganiec na model językowy. Nie masz tego czytać jak wiersza, masz zrozumieć, co wymusza na maszynie. Oto sekcja po sekcji, jak przejmujemy kontrolę nad procesem.

1. Nadaje modelowi konkretną rolę: AI staje się profesjonalnym tłumaczem, który ma oddać sens i detale kulturowe, a nie wypluwać dosłowne kalki językowe.
2. Wymusza wewnętrzną walidację: Algorytm musi zacząć od krótkiej listy kroków (checklisty). To porządkuje jego pracę i pokazuje Ci plan działania.
3. Inicjuje tryb oczekiwania: Zmusza maszynę do prośby o tekst docelowy. AI czeka na Twój ruch.
4. Włącza detektor kodu: Model samodzielnie analizuje, czy wrzuciłeś zwykły tekst, czy strukturę HTML/CSS.
5. Blokuje modyfikację struktury: Jeśli wykryje tagi, ma absolutny zakaz ich ruszania. Tłumaczy wyłącznie tekst (wartości węzłów), zachowując integralność kodu.
6. Określa rygor formatu: Jeśli był kod, na wyjściu dostajesz kompletną stronę HTML. Jeśli był czysty tekst, dostajesz czysty tekst.
7. Wymusza weryfikację końcową: Po wygenerowaniu wyniku, skrypt każe modelowi sprawdzić samemu ze sobą, czy nie uszkodził formatowania i czy przetłumaczył wszystko.

Komenda komunikacyjna to fundament kontroli nad sztuczną inteligencją. Najpierw ładujesz twarde zasady gry, a dopiero potem wrzucasz materiał do obróbki. Inaczej wynik to zawsze rzut monetą.

Wartość bojowa na froncie

Dlaczego to podejście jest skuteczne, a gdzie pojawia się tarcie? Dyscyplina modelu minimalizuje ryzyko błędów. Masz przewidywalny ciąg zdarzeń: prośba o tekst, analiza, zachowanie struktury, tłumaczenie.

• Zalety: Chroni strukturę HTML przed rozsypaniem się. Promuje naturalność i sens przekazu. Idealnie nadaje się do stałych automatyzacji, bo ujednolica format wejścia i wyjścia.
• Wady: Instrukcja jest przeładowana i celowo się powtarza. Wymóg prośby o tekst bywa sztywny, jeśli od razu wklejasz treść. Przy krótkich fragmentach kodu AI może nadgorliwie domykać brakujące tagi, próbując stworzyć "kompletną stronę".

Wielokrotne powtarzanie tych samych wytycznych w prompcie wygląda z zewnątrz głupio, ale jest to najskuteczniejszy sposób utrwalenia żelaznych zasad w oknie kontekstowym.