HTML – die neusten Beiträge

HTML projekt wie findet ihr die vorarbeit?

html:

<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<Header>
</Header>
<div class="input">
<main>
<form action="" method="post">
<h2>Anmeldung</h2>
<input type="email" name="Email" placeholder="Email hier eingeben" required="@" id=""> <br>
<input type="text" name="Benutzer" placeholder="Benutzer hier eingeben" required="A-z" > <br>
<input type="password" name="passwort" placeholder="password hier eingeben " id=""> <br>
<input type="submit" value="Anmelden">
<input type="reset" value="reset">
</form>
</div>
<hr>
<a href="#">Impressum</a>
<a href="#">kontakt</a>
<a href="#">Über uns</a>
</main>
<footer>
</footer>
</body>
</html>

css

body {
font-family: Arial, Helvetica, sans-serif;
color: white;
}
body{
background-color: black;
}
.input {
display: flex;
margin: 700px;
margin-top: 300px;
flex-direction: column;
justify-content: center;
align-items: center;
box-shadow: 1px 1px 3px 3px white;
border-radius: 30px;
height: 300px;
width: 300px;
}
a{
font-family: Arial, Helvetica, sans-serif;
display: flex;
justify-content: center;
align-items: center;
}
a:hover{
color: green;
text-decoration-line: none;
}
input{
padding: 5px;
border-radius: 10px;
}
input[type="submit"] {
font-size: 1.0em; padding: 1px 6px;
font-family: Roboto, sans-serif;
font-weight: 100;
color: teal;
border: 1px solid silver;
background-image: linear-gradient(to top, gainsboro 0%, white 90%);
border-radius: 20px;
}
input[type="reset"] {
font-size: 1.0em; padding: 1px 6px;
font-family: Roboto, sans-serif;
font-weight: 100;
color: teal;
border: 1px solid silver;
background-image: linear-gradient(to top, gainsboro 0%, white 90%);
border-radius: 20px;
}

Bild zum Beitrag
HTML, Webseite, CSS, HTML5, Programmiersprache, Webdesign, Webentwicklung

Zugriff auf svg Element in HTML gibt immer "null" zurück?

Hallo zusammen,

folgendes Problem:

Ich möchte aus meinem javascript Code zu laufzeit auf meine sonarGrafik.svg zugreifen können um deren Elemente zu manipulieren (oder neue hinzufügen zu können).

So sieht erstmal der ganze HTML Code aus:

<!DOCTYPE html>
<html>
<head>
    <title>Arduino Daten</title>
    <link rel="icon" href="data:,">
    <script src="scripts/script.js"></script>
    <link rel="stylesheet" href="styles/style.css"> 
</head>
<body>
    <object id = "svgObject" data="styles/sonarGrafik.svg" type="image/svg+xml"></object>
</body>
</html>

Der betroffene Teil in meinem javascript Code:

function insertDots(cx, cy) {
    const svgObject = document.getElementById("svgObject");
    console.log(svgObject.contentDocument) // hier erhalte ich in der Console immer "null"


    svgObject.addEventListener("load", function() {
        if (svgObject && svgObject.contentDocument) {
            const sonarSVG = svgObject.contentDocument.getElementById("sonar");
            console.log(sonarSVG);
        }
    });
}

(Die funktion insertDots(cx, cy) wird alle paar sekunden aufgerufen und ich erhalte in der Browser Konsole immer nur null. Dementsprechend ist die if Bedienung darunter auch nie wahr)

In meiner .svg Datei gibt es definitv die id= "sonar":

<svg id="sonar" width="700" height="700" xmlns="http://www.w3.org/2000/svg">
  <rect x="0" y="0" width="100%" height="100%" fill="rgba(128, 128,   128, 0.25)" />
</svg>

So sieht meine Ordnerstruktur aus:

Website
│   SonarVisuallisierung.html
│
├── scripts
│       script.js
│
└── styles
        style.css
        sonarGrafik.svg


Gibt es irgendwo einen Fehler oder eine andere Möglichkeit auf die Elemente der .svg Datei über das script zuzugreifen? (Den Inhalt der .svg will ich ausgelagert lassen und nicht in das HTML einfügen wegen der Übersichtlichkeit)

Danke für alle Lösungsvorschläge.

HTML, Webseite, JavaScript, Code, Programmiersprache

Google Search Console einzelne Unterseiten entfernen lassen?

Bild zum Beitrag
PC, Computer, Marketing, Software, Windows, Browser, Google, Hardware, HTML, IT, Webseite, programmieren, CSS, WordPress, JavaScript, Mozilla Firefox, Suchmaschine, Google Chrome, Bing, CMS, Edge, Informatik, PHP, Programmiersprache, SEO, Webdesign, Webentwicklung, Indexierung, Laravel, google search console

Cross Origin Anfrage blockiert?

Ich möchte gerade eine REST-API für mein Heimnetzwerk einrichten um über z.B. einen button einen CMD befehl auf dem Server PC auszuführen.

Mein Pythonscript für die API:

from flask import Flask, request, jsonify
from flask_cors import CORS

app = Flask(__name__)
CORS(app)

@app.route('/execute-command', methods=['POST'])
def execute_command():
  # Hier wird der Code zum Ausführen des Befehls eingefügt
  result = "Befehl wurde ausgeführt."
  return jsonify({"response": result})

if __name__ == '__main__':
  app.run(host='0.0.0.0', port=5000)
Mein HTML Script<!DOCTYPE html>
<html>
<head>
  <title>API Test</title>
</head>
<body>
  <button id="executeBtn">Befehl ausführen</button>
<script>
  document.getElementById('executeBtn').addEventListener('click', function() {
    fetch('http://localhost:5000/execute-command', { // Verwende absolute URL
      method: 'POST',
    })
    .then(response => response.json())
    .then(data => {
      console.log(data);
    })
    .catch(error => {
      console.error('Fehler:', error);
    });
  });
</script>
</body>
</html> 

Ich bekomme als Fehler von Firefox in der Konsole:

Quellübergreifende (Cross-Origin) Anfrage blockiert: Die Gleiche-Quelle-Regel verbietet das Lesen der externen Ressource auf http://localhost:5000/execute-command. (Grund: CORS-Anfrage schlug fehl). Statuscode: (null).

Fehler: TypeError: NetworkError when attempting to fetch resource

Entschuldigung wenn es offensichtlich ist, bin da noch sehr frisch und habe keine Lösung gefunden.

Netzwerk, HTML, Webseite, JavaScript, HTML5, Code, Netzwerktechnik, Port, Programmiersprache, Python, Webentwicklung, JSON, Flask

IT-Fachkräfte im Informatik Unterricht in Schulen?

Hallo,

der klassische Weg um in Deutschland Lehrer zu werden ist über ein Lehramtsstudium oder mit zunächst Berufserfahrung sammeln im jeweiligen Fachbereich und dann auch mit einem Studium Berufsschullehrer werden.

Doch sind wir uns selbst mal gegenüber ehrlich welcher Fachinformatiker wird freiwillig, wenn er nicht auf den Kopfgefallen ist und 9+ Jahre Berufserfahrung hat auf das Jahresgehalt von jenseits über den 50.000,€ verzichten, um in einer unterbezahlten Lehrer Position anzufangen ?

Dieses Phänomen macht sich an den grund- und weiterbildenden Schulen [Grundschule, Realschule, Gymnasium,...] bemerkbar.

In den ersten Schuljahren gelten wichtigere Prioritäten wie lesen und schreiben lernen.

Doch aller spätestens ab der 5. Klasse werden die ersten Grundkenntnisse zum Computer vermittelt .

Im Unterricht wird meist mit den wichtigsten Office Programmen aus dem Hause Microsoft oder Open Office angefangen, doch dies zieht sich meiner Erfahrung nach bis zum Erhalt des Abschlusses.

Schüler mit Technischem Interesse erledigen die Textformatierung- oder Tabellenkalkulationsaufgabe in unter 15 Minuten und langweilen sich dann die Restliche Zeit der Unterrichtsstunde.

Und trotz des Informatikunterrichts werden IT´ler Tagtäglich zu Fehlertickets her zitiert wie z.B. mein Drucker druckt nicht, Passwort vergessen, Herr/Frau Ich-weiß-alles-besser und weiteren gerufen.

Bei uns in der Kommune hat nun ein neuer junger Bürgermeister angefangen, der sich die Digitalisierung auf die Fahne geschrieben hat.

Meine Idee wäre ihn an sein Wahlprogramm zu erinnern ihm von meiner damaligen Erfahrung mit Win 2000 im Jahre 2009 im Informatikunterricht  zu berichten und den späteren Erfahrungen in der weiterführenden Schule mit dem Quantensprung auf Windows 10.

Gleichzeitig möchte ich auch einen Vorschlag unterbreiten, um die Schüler für die sich stetig weiterentwickelte Computerwelt zu wappnen auch in Bezug auf das Internet [Social Media,..] und den damit verbundenen Risiken.

Also konkret IT-Fachkräfte planen aktiv den Unterricht gemeinsam mit den Lehrkräften, bieten außerdem eine Informatik AG an und kümmern sich um die IT-Infrastruktur der Schule.

Funfakt unser damaliges Netzwerk war so schlecht eingerichtet, dass jeder Schüler Admin Rechte am PC hatte und mit etwas Ahnung per Remote ganze Rechner herunterfahren konnte.

Wäre das rein rechtlich möglich das IT-Fachkräfte beratend ohne Lehrerstudium am Unterricht beteiligt sind ?

Bzw. der Bürgermeister das, wenn auch mit Abstimmung des KM einführen darf.

Computer, Microsoft Word, Lernen, Studium, Microsoft Excel, Schule, Microsoft PowerPoint, Netzwerk, HTML, CSS, Bildung, Java, Unterricht, JavaScript, Schüler, ASCII, Beamte, Fachinformatiker, Informatik, Informatiker, Informationstechnik, Informationstechnologie, Lehrer, Lehrerin, Pascal, Python, Team, turbo pascal, Rathaus, Bürgermeister, Fachinformatiker Systemintegration, kultusministerium, PowerShell, schulcomputer, Angular, lehren

Wie kann ich bei dieser Website den Link nach oben rechts verschieben?

Ich habe einen Link erstellt, der mich wieder zurück zur Hauptwebsite bringt. Nur möchte ich, dass der Link oben rechts ist. Kann mir da jemand helfen?

Die Webseite:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Preise</title>
  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  <link href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&display=swap" rel="stylesheet">
  <style>
    body {
      font-family: 'Open Sans', sans-serif;
      padding-left: 100px;
      padding-right: 100px;
    }

    .preise-navbar {
      padding-left: 100px;
      color: rgb(52, 57, 56);
    }

    .preise-container {
      background-color: white;
      padding: 16px;
    }

    table {
      border-collapse: collapse;
    }

    td,
    th {
      padding: 16px;
      border-bottom: 2px solid #8ebf42;
      text-align: center;
      padding-left: 100px;
    }

    a {
    }
  </style>
</head>
<body>
  <div class="preise-container">
    <h1 class="preise-navbar">Preise:</h1>
  </div>
  <table>
    <tr>
      <th></th>
      <th></th>
    </tr>
    <tr>
      <td>Erwachsene:</td>
      <td>20€</td>
    </tr>
    <tr>
      <td>Kinder unter 18</td>
      <td>10€</td>
    </tr>
    <td>Kinder unter 6</td>
    <td>3€</td>
  </table>
  <a href="Index.html">Zurück</a>
</body>
</html>
HTML, Webseite, CSS, HTML5, Programmiersprache, Webdesign, Webentwicklung, Visual Studio Code

Was haltet ihr von der Idee (Umfrage)?

Ich möchte gerne eure Meinung zu einem Projekt einholen. Um genau zu sein würde ich gerne folgendes wissen:

  • Wäre Satori etwas für euch?
  • Haltet ihr Satori für sinnvoll?
  • Würdet ihr Satori weiterempfehlen?

Es handelt sich um die Lernplattform "Satori". Zunächst einmal: Auf Satori ist alles kostenlos. Alles, was wir hier beschreiben, wird kostenlos umsetzbar sein. Bitte denkt nicht an den kommerziellen Aspekt, dieser ist für mich zumindest zu Beginn nicht besonders wichtig. Satori hat andere Ziele als nur finanziellen Erfolg.

Das Konzept von Satori ist sehr einfach. Menschen können ihre Projektideen hochladen, inklusive Logo, Konzept und mehr. Die Community kann dann diese Ideen ähnlich wie auf Reddit einfach hochvoten und wenn ein Projekt genehmigt wird, können sie sich darauf bewerben.

Wenn Satori Kapazitäten frei hat, nehmen wir uns das Projekt vor, das zu diesem Zeitpunkt die meisten Upvotes erhalten hat. Wir setzen uns dann mit den Projektbesitzern in Verbindung. Wenn alles passt, gehen wir das Konzept mit den Projektbesitzern durch, verfeinern es und anschließend bildet der Projektbesitzer sein Team. Danach werden Aufgaben verteilt. An diesem Punkt beginnt der Prozess, und das Team unterstützt (bei der Planung und gegebenenfalls auch bei der Programmierung), um das Projekt voranzutreiben.

Sobald das Projekt abgeschlossen ist, wird es auf Satori gehostet, und im Laufe der Zeit können bei Bedarf neue Aufgaben erstellt und zugewiesen werden, um eventuelle Fehler zu beheben.

Satori verfolgt hiermit mehrere Ziele:

  • Satori eröffnet neue Möglichkeiten für größere Open-Source-Projekte. Oft bleiben Programmierer bei kleineren Projekten, da ihnen entweder die Beherrschung aller benötigten Technologien fehlt oder es ihnen schwerfällt, ein solides Team auf die Beine zu stellen. Doch Satori ändert diese Dynamik grundlegend.
  • Satori vermittelt Programmierern die Kunst der Teamarbeit, eine Fähigkeit, die viele von ihnen nicht beherrschen. Auf Satori wird der Umgang mit GitHub durch praktische Erfahrungen erlernt. Dank eines kompetenten Teams als Rückhalt haben auch weniger erfahrene Programmierer die Möglichkeit, ohne das Projekt zu beeinträchtigen, aktiv mitzuwirken.

Danke im Vorraus und lg.

Computer, Arbeit, Software, online, Forum, Technik, Community, HTML, Webseite, programmieren, Java, JavaScript, Communitys, development, Geschäft, Geschäftsidee, Ideen, Konzept, Open Source, Projekt, Softwareentwicklung, Team, Technologie, User, Software Update, github, Discord

Meistgelesene Beiträge zum Thema HTML