HTML Dokument in Word erstellen, bearbeiten und speichern ...

    Ich möchte, bevor wir selbst mit einem Content Management System für Grundschulkinder kleine Websites erstellen, einmal zeigen, wie man das "per Hand" macht und wie eigentlich der Code einer Webseite aussieht, den der Browser dann darstellt. Ich möchte dazu lokal eine ganz kleine HTML-Datei erstellen, so dass die Kinder einmal in Word den Code sehen und auch an ein paar Stellen bearbeiten können und im Firefox oder Edge betrachten können, was der Browser daraus macht.


    Warum in Word? Das kennen die Kinder. Privat benutze ich notepad++.


    Ich kann in Word eine Datei erstellen und als Webseite abspeichern. Die Endung ist dann .html. Der Browser stellt dann allerdings den Code dar, schwarz auf weiß. Wenn ich ein identisches Dokument in notepad++ erstelle, klappt es.


    Zweites Problem: Ich kann zwar ein in notepad++ erstelltes html-Dokument auch in Word öffnen. Word zeigt mir dann aber nicht den Code, sondern stellt die Seite so ähnlich da wie ein Browser (statt "background-color:blue" ist der Hintergrund blau).


    Kann man das irgendwie lösen?

    Habe kein Windows, deshalb nur eine Mutmaßung: Was passiert, wenn du im "Speichern unter... "-Dialog als Dateityp entweder "Alle Dateien" (oder so ähnlich) oder "Textdokument" auswählt und dann selber die Endung .html vergibt?

    Zitat von Kimetto

    Habe kein Windows, deshalb nur eine Mutmaßung: Was passiert, wenn du im "Speichern unter... "-Dialog als Dateityp entweder "Alle Dateien" (oder so ähnlich) oder "Textdokument" auswählt und dann selber die Endung .html vergibt?

    Vielleicht 'ne doofe Frage, aber: Geht das denn noch? Ich kann mich daran noch erinnern, aber wenn ich heute ein Dokument über's Kontextmenü (rechte Maustaste) umbenenne, dann wird nur der Name verändert, nicht aber die Dateiendung. Aus "test.docx" kann ich z. B. "test.html.docx" machen, d. h. der Name ändert sich von "test" in "test.html", aber die Endung bleibt mit docx die gleiche.

    Nimm Notepad und gut is ... Ich glaube nicht, dass Deine Schüler gleich Schnappatmung bekommen, wenn sie mal ein anderes Programm als Word benutzen!

    Guck dir mal das Dokument das dir Word erstellt mit einem Editor an. Word versucht das was du in Word siehst in Code zu gießen, sodass es am Ende möglichst genau so aussieht...eben ein WYSIWYG-Editor. Die einfachste Lösung dürfte sein einfach einen Texteditor zu verwenden, Word ist einfach nicht dafür gedacht

    "In einer Gesellschaft in der Privatsphäre kriminalisiert wird, haben nur noch Kriminelle Privatsphäre" - frei nach Phil Zimmermann

    Gefällt mir 2

    Ich würde auch einen einfachen Texteditor nehmen, ohne allen Schnickschnack. Für so etwas Word zu benutzen setzt ein falsches Signal. Word ist nicht für so etwas gedacht und kann sehr viel, aber zum Lernen von html aus dem automatisch erzeugten Code ist es völlig ungeeignet.

    Viel besser sieht man es, wenn man die Textdatei als html abspeichert und - Überraschung - mit dem Browser öffnen kann, indem man doppelklickt. Dann sieht man auch, dass durch die Dateiendung der "Reiz" gesetzt wird, mit einem bestimmten Programm zu öffnen. Und dass man für das Bearbeiten ein anderes Programm braucht.

    Wenn die Schüler sowieso ein anderes Programm benutzen, würde ich aber eins mit vernünftigem Highlighting benutzen, Notepad++ bietet sich da zum Beispiel an...

    If you look for the light, you can often find it.
    But if you look for the dark that is all you will ever see.

    Wenn man in einem Word-Dokument den Code eingibt und das als HTML-Dokument speichert, kann das kaum was werden. Ich könnte in Word ja auch ein Märchen schreiben (jeder Buchstabe eine andere Farbe), das als HTML speichern - und ich habe die gewählte Formatierung als Webseite. Schreibe ich die HTML-Befehle in Word und speichere das als Webseite aus Word heraus, habe ich also gefühlt einen "doppelten" Code...

    (Das, was Word dann als HTML speichert, ist auch ganz grässlich und viel zu kompliziert. Im Browser (Firefox, Chrome) einfach mal STRG+u tippen, dann sieht man den HTML-Code...)


    Falls man wirklich Word verwenden möchte (damit die SuS den Umgang damit lernen): Wie bereits oben geschrieben als Dateiformat .txt zum Speichern verwenden und dann die Dateiendung ändern in .html [Fallstrick hier: An manchen Rechnern ist eingestellt, dass die Dateiendung ausgeblendet wird. Wenn man den Dateinamen dann ändert, denkt man vielleicht, man hätte das geändert zu "Beispiel.html", tatsächlich "erschafft" man "Beispiel.html.txt" (weil die ursprüngliche Dateiendung nicht angezeigt wird, löscht man sie nicht - es bleibt ein Textdokument und wird nicht zum HTML-Dokument. Das kann man in den Einstellungen des jeweiligen Ordners ändern.]


    Gerade bei "Mini-Projekten" wundert man sich auch mal über Hintergrundfarben, Schriftgrößen, -arten etc. Wenn keine Farbe definiert ist, greift der Browser zurück auf die persönlichen Einstellungen des Nutzers in seinem Browser. Wer da pink eingestellt hat, hat dann eben einen pinken Hintergrund ;)



    PS: "Meine" SuS (also schon etwas älter) haben immer wieder Probleme, sich in die Formalia einzudenken bei einer Erstbegegnung. Egal, ob HTML oder LaTeX. Also Probleme mit "Ich signalisiere den Beginn von etwas." Dann kommt der Inhalt. "Ich signalisiere das Ende von etwas." Eine gedankliche "Brücke", die oftmals geholfen hat, ist die Übertragung auf eine Unterrichtsstunde, die auch ineinander "verschachtelt" sein kann: "Ich habe ein Signal, dass jetzt der Unterricht beginnt"(<Begin>) <Begrüßung>"Hallo."</Begrüßung><Hausaufgabenkontrolle>...</Hausaufgabenkontrolle> <Aufgabe>...</Aufgabe> <End Unterrichtsstunde>

    Ich werd’ dann einfach den Texteditor von Windows 10 benutzten. Ich will mit den Kindern kein HTML lernen - die sind 8 und 9 Jahre alt ;) Sie werden vielleicht 10 Zeilen Code mit inline-CSS kriegen und dann einen kleinen Text schreiben und die Textfarbe und die Hintergrundfarbe ändern ... fertig. Eigene Seiten sollen sie dann auf einer Website namens Primolo erstellen, das ist im Grunde ein einfaches CMS.

Werbung