Redirects für den Relaunch automatisiert erstellen

Der Weg zur Lösung

Das Ziel: So soll die Lösung am Ende aussehen

Da für mich die bereits existierenden Lösungen keine ausreichenden Ergebnisse geliefert haben, habe ich mir überlegt, was ich mir wünschen würde, wie das Ergebnis aussieht. Ganz am Ende möchte ich eine Excel-Liste haben, in der die URL der alten Seite drin steht mit einer zugeordneten Ziel-URL. Aber auch nur, wenn der Inhalt wirklich übereinstimmt. Reicht die Übereinstimmung nicht aus, möchte ich ein zweites mögliches Ergebnis in einer weiteren Spalte haben. In diesem Fall kann ich dann manuell nachprüfen und mich für eins der beiden passenden Ergebnisse entscheiden. Sollte es kein passendes Ergebnis geben, möchte ich auch kein Eintrag in der Liste. So erspare ich mir das mühsame Löschen von URLs der Startseite, das gerne, in meinen Tests, als Fallback mit einem Similarity Score von 10% als Ergebnis eingetragen wurde.
Der Geschichte etwas vorgegriffen, habe ich mich durch Ausprobieren darauf festgelegt, wenn es ein Ergebnis mit einem Similarity Score von über 90% gibt, brauche ich nur eine passende URL in der Liste. Sollte die Ähnlichkeit der Inhalte nicht groß genug sein, aber immer noch hoch, also für mich zwischen 80% und 90%, dann möchte ich die zwei Ergebnisse zur Auswahl haben, die die größte Übereinstimmung haben.

Hürde: An die passenden Similarity Cores kommen

Jetzt stand ich vor der Frage, wie erhalte ich so hohe Similarity Scores, wenn es, wie oben in meiner Problemstellung beschrieben, so viele generische Inhalte auf den Produktdetailseiten gibt? Ich muss die Auswahl des Inhalts auf die einzigartigen Elemente beschränken, bevor daraus Vector Embeddings erzeugt werden. Das Custom JavaScript zur Erstellung dieser Vector Embeddings im SF SEO Spider muss also um weiteren Code ergänzt werden, damit nur wesentliche Teile des Inhalts an die OpenAI API übermittelt werden.

Um mir das Custom JavaScript so anzupassen, dass es das tut, was ich möchte, habe ich mir mit dem Custom GPT Kermit das JavaScript dahingehend angepasst. Ich habe hier selber erstmal viel rumexperimentiert. Vorher hatte ich bereits über die JavaScript Library Readability.js von Mozilla gelesen, welches eine Standalone-Version der Readability-Library ist, die für den Firefox Reader View verwendet wird. Ich hatte gehofft, damit den Inhalt der Seite auf das wesentliche reduzieren zu können. Was jedoch nicht geklappt hat. ChatGPT und ich haben dann eine eigene Lösung gebaut, um in dem Skript irrelevante Inhalte, wie die der Navigation, des Footers, etc. mit Hilfe der HTML-Elemente auszuschließen. Diese Liste der auszuschließenden Elemente allerdings, wäre für jede Website elendig lang und jedes Mal anders und müsste angepasst werden. Erstens wäre diese Liste zu erstellen äußerst zeitintensiv und zweitens sind mir immer wieder Elemente durchgerutscht, die dann doch mit von der Website extrahiert wurden. Es umzudrehen, nämlich die Elemente einzuschließen, die von der Website extrahiert werden sollen, machte gleich viel mehr Sinn. Außerdem, um genauer auswählen zu können (auch auf älteren Webseites), wurde die Liste der einzuschließenden Elemente um HTML-IDs, -Klassen und Role-Attribute erweitert. Das sieht dann so aus:

// Select elements that typically contain relevant content
    const elementsToInclude = document.querySelectorAll(`
        main, article, section, 
        div.content, div.main, div.article, 
        div.post, div.entry, div.body, div#product-name,
        p, h1, h2, h3, h4, 
        [role="main"], [role="article"]

Dabei sind durch Punkt getrennte Elemente Klassen-Selektoren HTML-Element.klasse und durch Rauten getrennte Elemente ID-Selektoren HTML-Element#id.

Zielgerade: Der letzte Feinschliff

An dieser Stelle sei angemerkt, dass ich das alles erst einmal ausprobiert habe mit einer kleinen Liste an URLs und ich mir auch erst nur den Inhalt extrahiert habe, ohne die Embeddings zu erstellen. So war ich in der Lage die Ergebnisse der Extraktion beurteilen zu können, ob die korrekten Elemente extrahiert wurden.

Nachdem dieser Ansatz funktionierte, habe ich den extrahierten Text noch minifiziert, um Zeilen- und Seitenumbrüche, doppelte Leerzeichen und optional auch Bindestriche aus dem Text zu entfernen. So habe ich einen reinen Textblock erhalten, in dem ich nachvollziehen konnte, welche Elemente extrahiert wurden.

// Minify the extracted content by removing unnecessary characters and whitespace
    content = content
        .replace(/(\r\n|\n|\r)/g, ' ')    // Remove all line breaks and replace them with a space
        .replace(/\s+/g, ' ')             // Replace multiple spaces with a single space
        .replace(/—/g, '')                // Optional: Remove dashes (if needed)
        .replace(/\u000C/g, '');          // Remove any page breaks (form feed character)

Dann war es wichtig, weil die extrahierten Texte teilweise recht lang sein konnten und das Token-Limit der API überschreiten konnten, dass der Text in kleinere Abschnitte unterteilt wird, wenn der Inhalt zu lang ist.

// Function to handle the API request
function chatGptRequest(content) {
    if (new TextEncoder().encode(content).length > 8191) { // Checking byte length approximation for tokens
        // Function to break the string into chunks
        function chunkString(str, size) {
            const numChunks = Math.ceil(str.length / size);
            const chunks = new Array(numChunks);
            for (let i = 0, o = 0; i < numChunks; ++i, o += size) {
                chunks[i] = str.substring(o, o + size);
            }
            return chunks;
        }
        // Divide content into manageable chunks
        const chunks = chunkString(content, 8191);

Ziel und Treppchen: Aus 2 Excel-Dateien mach 1

Nachdem das Custom Javascript jetzt genau die Daten geliefert hat, die ich haben wollte, konnte ich in einem neuen Chat mit ChatGPT das Python erstellen, um aus den zwei Excel-Dateien, die ich aus den Screaming Frog Crawls habe, mir eine Excel-Datei zu liefern, in der die URLs der alten Website mit den URLs der neuen Website gematcht werden, sofern die Ähnlichkeiten groß genug sind.

Wichtig war mir hier, wie oben auch schon beschrieben, dass ich bei großer Übererstimmung von 90% oder größer das beste Ergebnis zugewiesen bekomme und sollte die Übereinstimmung zwischen 80% und 90% liegen soll in einer weiteren Spalte das zweitbeste Ergebnis zugewiesen werden. Wenn die Übereinstimmung unter 80% liegt, soll kein Ergebnis in die Spalten geschrieben werden, da diese meiner Erfahrung nach dann nicht mehr passend genug sind und in aller Regel sowieso überschrieben werden müssen. Das vereinfacht am Ende des Korrekturprozess für mich.

Außerdem wollte ich vor allem mit Excel-Dateien hantieren, da ich das Abspeichern und Importieren von CSV-Dateien vermeiden wollte und je nach verwendetem Tool die Separatoren auch unterschiedliche sind. Und ich wollte beim Similarity Score nur mit zwei Dezimalstellen arbeiten, weil auch das die Übersicht am Ende verbessert. Dafür wird im Python der Similarity Score auf zwei Dezimalstellen gerundet. Wichtig war hier ChatGPT darauf hinzuweisen, dass der Similarity Score erst nach dem Zuweisen gerundet wird, damit die gesamte Zahl im Zuweisungs-Prozess genutzt wird.

Um das Skript ausführen zu können, nutze ich ein Notebook in Google Colab.
Nach dem Ausführen des Skripts, wird am Ende eine Excel Tabelle heruntergeladen, die in etwa so aussieht: