Åtgärder

Konvertera en pdf till en webbsida

Från Skolbok

HTML5 de Erick Dimas.jpg

PDF-filer är bra genom att de ser exakt likadana ut som originalen. Hemsidor är bra eftersom det går att förstora- eller förminska dem utan att de blir suddiga och det går att ändra språk i dem med en högerklickning, om du surfar med Chrome.


Exakt kopia

För att kunna hantera innehållet i din PDF måste AI:n kunna läsa texten som text. Problemet r att det finns två varianter av PDF-filer; dels de som består av text och bilder som Worddokument, och dels de där hela sidorna är en enda stor bild. Om PDF-sidorna består av text och bilder måste du kunna ange en länk till din PDF-fil, eller så måste det finnas möjlighet att ladda upp den till din AI. I skrivande stund fungerar det bäst med Claude 3.7 eller Gemini 2.5.

Är det så att PDF-filens sidor är formaterade som bilder måste hela PDF-filen först köras genom ett OCR-program. Det finns mängder som är gratis på Internet. Sök efter "free pdf to ocr". Spara resultatet som en Wordfil på din egen dator och ladda slutligen upp filen till AI:n

Många gånger är texten i PDF-filer inte speciellt bra. Den kanske skrivs med otroligt många mellanslag, ibland ett mellanslag mellan varje bokstav. I värsta fall med en enda bokstav per rad. Då går det att snygga till partier av pdf-filen med följande prompt. AI.n har dock svårt att ta många sidor åt gången.

Du är lärare i svenska. Skriv om den här texten så att alla onödiga mellanslag försvinner och alla orden är vanliga svenska ord. Textens innehåll ska vara så lik den inklistrade textens innehåll som möjligt. Skriv dessutom om den som HTML kod.


Genomförande

PROMPT

Du är en skicklig och erfaren webbutvecklare med fokus på detaljerad konvertering från PDF till responsiva webbsidor. Du har fått uppdraget att omvandla en PDF-fil till en hemsida som så exakt som möjligt efterliknar originalets layout, färgschema och visuella hierarki.

Skapa en responsiv webbsida som:

1. Använder Bootstrap 5 för responsivitet
2. Implementerar en färgpalett som exakt matchar PDF-dokumentets färger (inklusive bakgrundsfärger, textfärger, rubriker, faktarutor och betonade element)
3. Använder samma typsnitt som originalet eller nära motsvarigheter från Google Fonts
4. Behåller originalets textstorlekar, avstånd och marginaler proportionellt
5. Återskapar eventuella tabeller, faktarutor, marginaldefinitioner och inramningar exakt som i originalet
6. Inkluderar placeholderkod för alla bilder med exakta positioner och bildtexter
7. Implementerar en sticky navigation överst med länkar till respektive sida från PDF:en
8. Har en sidfot på varje sektion som visar sidnumret från originaldokumentet
9. Innehåller exakt samma textinnehåll, ordlista och instuderingsfrågor som originalet
10. För faktarutor, definitioner och särskilda avsnitt: - Använd Bootstrap cards eller liknande komponenter med exakt matchande färger
11. Återskapa sidornas exakta layout inklusive sidointroduktioner, frågor, och andra speciella element
12. Behåll originalets formatering av punktlistor, numrerade listor och andra speciella formateringselement
13. Alla bilder ska kodas som placeholders med: - Exakt samma positionering som i original-PDF:en
14. Beskrivande alt-text baserad på bildtexterna i PDF:en
15. Antagandet att bildfilerna finns i en mapp kallad "images" relativt till HTML-filen
16. Koden ska vara ren, validerad och följa bästa praxis för HTML5 och CSS3.


AI:n har svårt att skapa mer än 8 sidor. Sedan blir det time out. Därför är det smart att ange att den bara skapar tre sidor åt gången. När den skapat sidorna 4-6 kopierar du bara html-koden och lägger till den i slutet på den hemsida som innehåller sidorna 1-3 och så vidare.

Vid testning (april 2025) Klarar Claude 7-9 sidor, beroende på textmängd, Gemini klarar 4-5. Claude gör dessutom ett mycket bättre arbete med att behålla färger och formatering från originalet.

Ett sätt att komma runt det är att lägga in vilka sidor som AI:n ska hantera. Börja med att lägga in Hemsidan ska bara bestå av de tre första sidorna i PDF-filen. i prompten. Sedan Hemsidan ska bara bestå av sidorna 4, 5 och 6 i PDF-filen. nästa gång, och så vidare.


SLUTSATS

Du kan inte använda en gratis AI till att konvertera en hel PDF-fil i dagsläget. Däremot kan du använda en gratis AI för att konvertera en lång PDF bit för bit. Detta kräver dock att du själv har grundläggande kunskaper i att hantera HTML-kod och CSS-kod för att kunna passa in bitarna på rätt ställen. Däremot behöver du inte kunna programmera javascript eller annan riktig programmeringskod.