Was bewirkt <meta charset="utf-8">?

Ich habe mich in letzter Zeit ein wenig mit HTML beschäftigt und frage mich was <meta charset="utf-8"> genau bewirkt und was es für Folgen haben kann wenn man es nicht schreibt.

2 Antworten

ChrisCat1, UserMod Light

15.06.2019, 21:03

UTF-8 ist eine Art der Zeichenkodierung.
https://de.wikipedia.org/wiki/UTF-8

Mit diesem meta-Tag wird der Browser angewiesen diese Zeichenkodierung für die Darstellung des Seite zu verwenden.

Je nach verwendeter Zeichenkodierung können manche Zeichen nicht dargestellt werden.

Hier mal ein Bild von einem Beispieltext, wo die falsche Zeichenkodierung verwendet wurde: http://webkrauts.de/wp-content/uploads/2006/12/Beispieltext.png

Dory1

15.06.2019, 20:58

https://wiki.selfhtml.org/wiki/Zeichencodierung/Webdokumente

Ähnliche Fragen

was bedeutet meta charset='utf-8' ?

kann jmd von euch sagen was meta ist und charset und utf und die zahl bedeutet ??

...zur Frage

HTML Code funktioniert nicht Bild wir mit Platzhalter ersetzt?

<!DOCTYPE html>
<html lang="de">
 <head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>LIHI Haircuts</title>
 </head>
 <body>
  <img src="/Bilder/Salon.jpg">
 </body>
</html>

Das ist der Code bis jetzt und angezeigt wird mir nur ein Platzhalter. Ich haben einen Ordner namens "Haircut Seite" auf dem Desktop angelegt. Darin befindet sich die ".html" Datei und ein weiter Ordner Namens "Bilder", dort sind dann die Bilder die ich für die Website nutzen möchte. Die Bilder sind auch alle .jpg Dateien. Weiß jemand weiter ?

...zur Frage

HTML input in JavaScript-Variable?

Wenn ich in HTML ein form ausfülle und abschicke wie bekomme ich dann das eingegeben im Input in eine JavaScript Variable. Habe provisorisch mal das hier gemacht und komme nicht weiter. Danke für eure Hilfe :)

<!DOCTYPE html>

<html>

<head>

<title>Input to Variable</title>

var input = "Wie bekomme ich den eingegebenen input hier hin?"

</script>

</head>

<body>

<button>Submit</button>

</body>

</html>

...zur Frage

Vorschaubild für Link bei WhatsApp?

Welche Angaben muss ich im HTML-Head setzen, damit ich ein Vorschaubild beim senden eines Links erhalte?

Mein HTML-Head:

<head>
    <title>Webseitentitel</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
    <meta name="description" content="Webseiten Beschreibung" />
    <meta name="author" content="Max Mustermann" />
    <meta name="keywords" content="Schlüsselwort, noch ein Schlüsselwort, ..." />
    <meta property="og:title" content="Webseitentitel" />
    <meta property="og:description" content="Webseiten Beschreibung">
    <meta property="og:url" content="https://www.domain.de/" />
    <meta property="og:image" content="http://domain.de/images/logo.png" />
    <meta property="og:image:secure_url" content="https://domain.de/images/logo.png" />
    <meta property="og:image:type" content="image/png" />
    <meta property="og:image:width" content="325" />
    <meta property="og:image:height" content="325" />
    <meta property="og:type" content="website" />
    <meta property="og:locale" content="de_DE" />
    <link rel="icon" href="images/logo.png" type="image/png">
    <link rel="shortcut icon" href="images/logo.png" type="image/png">
    <link rel="icon" href="images/logo.png" sizes="32x32" />
    <link rel="icon" href="images/logo.png" sizes="192x192" />
    <link rel="apple-touch-icon-precomposed" href="images/logo.png" />
    <meta name="msapplication-TileImage" content="images/logo.png" />
    <link rel="apple-touch-icon" href="images/logo.png">
    <link rel="stylesheet" type="text/css" href="styles/style.css">
    <link rel='shortlink' href='https://domain.de/' />
    <link rel="canonical" href="https://domain.de/" />
    <script src="https://kit.fontawesome.com/secret_key.js"></script>
</head>

Laut diesem Post bin ich vorgegangen...

https://stackoverflow.com/questions/19778620/provide-an-image-for-whatsapp-link-sharing

...ich habe mir auch die Infos von https://ogp.me/ angeschaut.

Ich komme einfach nicht weiter :(

HILFEEEEEEEEE....

...zur Frage

Bild aus einem Input mit Javascript anzeigen?

Ich würde gerne, dass man eine Datei hochlädt und mit einem Button dann auf der Seite anzeigen lassen kann. Ich habe schon etwas rum probiert und es kommt immer nur " [object HTMLImageElement] " raus.

Mein Code ist dieser:

<!DOCTYPE html>
<html lang="de">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>

        function anzeigen() {

            let bild = new Image();
            bild.src = document.getElementById("input");

            document.getElementById("bild").innerHTML = bild;

        }


    </script>
</head>
<body>
    <input type="file" accept="image/png, image/jpg" id="input">
    <input type="button" onclick="anzeigen();">
    <div id="bild">



    </div>
</body>
</html>

Das hochladen von Dateien funktioniert perfekt. Nur wird das Bild nicht angezeigt.

(Bin Anfänger)

Danke für eure Hilfe^^

...zur Frage

Warum werden die Umlaute nicht richtig angezeigt im Browser wenn ich was in html schreibe?

Hallo,

hab jetzt <meta charset="utf-8"> geschrieben und eigentlich müsste das doch klappen.

Aber die ganzen ü,ä usw. werden wenn ich das mit Chrome öffne nicht richtig angezeigt. Was soll ich tun?

danke schonmal

...zur Frage

JavaScript - Erste Schritte, CSS wird blockiert?

Ich bekomme folgenden Error, wenn ich versuche meine ersten Versuche einer Webseite in Firefox zu laden.

Die Ressource von "http://localhost:63342/FirstTest/style.css" wurde wegen eines MIME-Typ-Konfliktes ("text/html") blockiert (X-Content-Type-Options: nosniff)

Das ist der Code von den Datein.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8"/>
    <title>Title</title>
    <link rel="stylesheet"href="style.css">
</head>
<body>
    <div class="placeholder">
        I'm in a div!
    </div>
    <div class="anotherClass">
        I'm in another class!
    </div>
</body>
</html>

CSS

.placeholder{
    background-color: red;
}

.anotherClass{
    background-color: lightseagreen;
}

Leider werden nur die div Elemente ausgeben, woran kann es legen? Ich werde aus der Fehlermeldung nicht schlau.

Schöne Grüße

...zur Frage

HTML-Formular funktioniert nicht richtig,warum?

Schönen Abend euch allen.

Ich lerne gerade über HTML und wollte gerade ein Formular schreiben.

Als Vorlage verwende ich das Tutorial. Bis zu Minute 10:32 habe ich alles genauso wie in dem Tutorial geschrieben.

Jedoch als im Tutorial dann Enter gedrückt wird und in der Adresszeile der Pfad und Benutzername=&Passwort=Passwort und ich genau dasselbe mache wird bei mir oben in der Adresszeile nichts angezeigt und auch das Passwort-Feld wird nicht "geleert".

Mein Code bis jetzt:

<!DOCTYPE html>
	<head>
	<html lang="de">
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width", initial-scale=1.0>
		<title>Daten über dich</title>
	</head>
	<body>
		<form action="" method="GET"> 
			<label for="Name">Name: </label>
			<input id="Name" name="Name" type="text">
			<br>
			<br>
			<label for="Passwort">Passwort: </label>
			<input id="Passwort" name="Passwort" type="password">
		</form>
	</body>
</html>

Danke im Voraus an alle !

...zur Frage

Umlaute auf HTML Webseite werden nicht richtig angezeigt?

Bei einer Webseite die ich schon vor längerem programmiert habe, werden plötzlich die Umlaute nicht mehr richtig angezeigt. Sowohl bei Firefox als auch bei Internet Explorer, und das nicht nur auf meinem Laptop, auch andere Besucher berichteten davon.

Habe im Internet recherchiert und habe dann folgenden META Tag hinzugefügt:

<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />

plus eine .htaccess erstellt mit dem charset:

AddDefaultCharset iso-8859-1

hat nicht funktioniert. Habe denn einfach das "iso-8859-1" mit "utf-8" ersetzt, hat jedoch auch nicht geklappt. hat jemand eine Idee?

...zur Frage

Wie kann ich eine .ts-Datei auf meiner Webseite abspielen lassen?

Ich möchte auf meiner Webseite eine .ts-Videodatei abspielen lassen und ich habe dafür auch schon einen kleinen HTML-Code geschrieben. Dennoch möchte er sie nicht abspielen.

Könnt ihr mir dabei helfen?

Schon einmal Danke im Voraus!

Der HTML-Code:

<html lang="de">
  <head>
    <meta charset=utf-8 />
  </head>
  <body>
    <div id='player'>
      <video width="400" height="300" src="TestVideo.ts" controls autoplay></video>
    </div>
  </body>
</html>

...zur Frage

Warum funktioniert dieser code nicht?

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Beta</title>
    <script>
        const bodyElement = document.querySelector("body");

        function setColorBlue() {
            bodyElement.background-color = "blue";
        };

        function setColorRed() {
            bodyElement.background-color = "red";
        };

        function setColorGreen() {
            bodyElement.background-color = "green";
        }
    </script>
</head>
<body>
    <div class="color-picker">
        <button onclick="setColorBlue()">Blue</button>
        <button onclick="setColorRed()">Red</button>
        <button onclick="setColorGreen()">Green</button>

    </div>
</body>
</html>

...zur Frage

was bedeutet meta charset="utf-8"?

bitte einfach erklären

...zur Frage

Warum funktioniert der PHP header ("Location: http://www.google.de"); exit; nicht?

Das was ich geschrieben habe:

<html>
  <head>
    <meta charset="UTF-8">
    <title></title>
  </head>
  <body>    
<?php
sleep(3);
header("Location: http://www.google.com/");
exit; 
?>
  </body>
</html>

Das funktioniert aber nicht. Danke für Antworten

...zur Frage

HTML Text verschieben?

Ich möchte den text horizontal mittig haben justify-content und align-items gehen beide nicht


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <style>
        .WelcomeTitle {
           display: flex;
           flex-direction: column;
          
            text-align: center;
            align-items: center;
            font-family: sans-serif;
        }
    </style>
    <h1 class="WelcomeTitle">Hier kommt ein Titel
        <br>
        hin der Lang ist!</h1>
</body>
</html>

...zur Frage

Was möchtest Du wissen?

Deine Frage stellen