Klistra in din trasiga HTML här och klicka på "Fixa HTML!!" för att reparera denSkriv ogiltig HTML

Vad är HTML-fixaren?

Har du HTML som är nästan rätt men sabbar sidan? En ostängd <p>, en vilsen </div>, eller en href som saknar citattecken kan kasta resten av dokumentet i ett konstigt parsningstillstånd. Webbläsaren gör så gott den kan med dålig markup — men resultatet är sällan det du tänkt dig. Klistra in det här så får du tillbaka något parsern är nöjd med, enligt reglerna i WHATWG HTML Living Standard.

Riktar in sig på de vanliga tabbarna: en saknad sluttagg, ett citattecken som inte escapeats, ett attributvärde utan ", ett listobjekt som inte stängdes, ett blockelement nästlat där det inte ska vara. Sånt som den officiella W3C-validatorn flaggar ett fel i taget. Fixaren läser hela dokumentet på en gång och ger dig en ren version du kan släppa rakt tillbaka i projektet.

Din markup skickas till reparationstjänsten över HTTPS och sparas inte. Har du inline-hemligheter som API-nycklar inbakade i <code><script></code> eller <code>data-*</code>-attribut, plocka bort dem innan du klistrar in.

Så använder du HTML-fixaren

Tre steg. Funkar på fragment, hela dokument, eller vad du nu fick tillbaka från den där CMS-exporten.

Klistra in trasig HTML eller ladda exempel

Släpp din HTML i editorn till vänster. Tryck HTML-exempel för en liten orderbekräftelsesida med de typiska felen — en <head> som aldrig stängs, ett listobjekt utan </li>, en ociterad href. Exempel på trasig HTML:

<p>Your order <strong>SKU-101 ships tomorrow.
<ul>
  <li>1 x Laptop Stand
  <li>2 x USB-C Cable</li>
</ul>

Tre fel här: <strong> stängs aldrig, första <li> avslutas inte, och det finns ingen </p>. Fixaren stänger dem i rätt ordning.

Klicka på Fixa HTML!!

Tryck på den gröna Fixa HTML!!-knappen. Vi skickar din markup till reparationstjänsten som stänger öppna element enligt HTML-syntaxreglerna, återställer attribut-citattecken och rättar nästling där det är uppenbart fel. Din text, dina klasser, id:n och inline-stilar lämnas orörda.

Granska den fixade utdatan

Högerpanelen har den reparerade HTML:en. Kasta in den i en webbläsare, in i vår HTML-validator för en sanity-check, eller tillbaka i CMS:et. För en djupare tillgänglighetsgranskning, använd ett dedikerat a11y-verktyg — det är en separat sak från syntaxreparation.

När du faktiskt vill ha den här

Fixa utdata från CMS eller mejlmallar

WYSIWYG-editorer och mejlmallsbyggare älskar att leverera subtilt trasig markup — föräldralösa <p>-taggar, saknade alt-attribut, en och annan ostängd <td>. Kör exporten genom det här en gång innan du publicerar så att den renderade sidan inte hoppar oväntat mellan webbläsare.

Rädda markup som klistrats in från Office-appar

Word och Google Docs klistrar in en härva av <span> och egna attribut som ofta har obalanserade taggar eller vilsna  . Fixaren städar strukturen så du kan fortsätta redigera resultatet i stället för att skriva om det från scratch.

Reparera handskrivna komponenter

Snabba och fula HTML-snuttar i en tutorial, en wiki-sida eller en gammal README — kopiera in, få det rensat, klistra in där det ska. Användbart för att låsa upp dig själv när du copy-pastear exempel som funkade i någon annans blogginlägg men inte ditt.

Sanera scrapade sidor innan parsning

När du scrapeer HTML för att mata en extraktor sätter trasig markup käppar i hjulen för DOM-baserade parsrar. Kör sidorna genom det här först för att ge din parser en stabil struktur att jobba med. Para ihop med en riktig validator om du behöver strikt konformans.

Vanliga frågor

Sparas eller delas min HTML?

HTML:en du klistrar in skickas till vår backend över HTTPS för att köra reparationen, och vi behåller den inte efter att svaret returnerats. Det finns inga tredjepartsspårare i request-vägen. Som sagt: om sidan innehåller hårdkodade API-nycklar, interna URL:er eller analytics-tokens, behandla den som vilken annan publik klistring som helst — ta bort de känsliga värdena först.

Vilka sorters HTML-fel fixar den faktiskt?

Ostängda taggar (<p>, <li>, <td>, <span>), felmatchade stängningar, saknade eller obalanserade attribut-citattecken, felaktig DOCTYPE, vilsna &/</> i textinnehåll som borde vara entiteter, och uppenbara nästlingsfel (blockelement inuti ett inline-element). Den hittar inte på saknat innehåll och skriver inte om giltig markup.

Ändrar den mina klasser, id:n eller inline-stilar?

Nej. Fixaren får uttryckliga instruktioner att bara reparera syntax — klassnamn, id:n, inline-style-attribut, data-*-attribut och event-handlers som onclick skickas igenom orörda. Om utdatan någonsin ser ut som om något av det modifierats är det en bugg.

Producerar den HTML5, XHTML eller båda?

Den siktar på HTML5 — det är det varje aktuell webbläsare parsar. Självstängande taggar på void-element som <br /> accepteras på input men utdatan använder standard-HTML5-form. Behöver du specifikt strikt XHTML-utdata (sällsynt idag), använd ett XHTML-medvetet verktyg i stället.

Varför inte bara köra min HTML genom W3C-validatorn?

Det bör du, för sista passet — W3C-validatorn är sanningens källa för vad som räknas som giltig HTML. Men den visar fel ett i taget och fixar dem inte. Fixaren är till för när du vill att dokumentet stängs upp i ett pass först; sen kör du validatorn för att bekräfta.

Och tillgänglighet — lägger den till saknade alt eller ARIA?

Nej, och det är medvetet. ARIA-roller och alt-text är innehållsbeslut, inte syntaxbeslut. Att lägga till en platshållare alt="" skulle dölja ett verkligt tillgänglighetsproblem. Kör en dedikerad a11y-granskning (axe, WAVE, Lighthouse) för det.

Andra HTML-verktyg du kan behöva

Att fixa syntaxen är bara början. När det väl parsar är de här bra nästa steg: