HTML für Mikrocontroller

Chr. M. OP #4383822
Lesenswert?
• ▲
▼ 
Hallo,

ich bastle gerade mit dem ESP8266 als Webserver rum und für 
Steuerungsaufgaben über den Browser brauche ich dazu ein paar HTML 
Seiten.

Gibt es irgendwo im Netz ein Tutorial für HTML4µC oder gar ein paar gute 
CSS Templates die auf Minimalismus ausgelegt sind?

Ich bin gerade so dabei ein wenig C zu lernen und da möchte ich 
eigentlich nicht auch noch HTML und CSS gleichzeitig lernen müssen.
Antwort Zitieren Bearbeiten Thread verschieben Thread sperren Anmeldepflicht aktivieren Anpinnen Thread löschen Thread mit anderem zusammenführen Beitrag melden
Karl H. #4383845
Lesenswert?
• ▲
▼ 
Chr. M. schrieb:

> Ich bin gerade so dabei ein wenig C zu lernen und da möchte ich
> eigentlich nicht auch noch HTML und CSS gleichzeitig lernen müssen.

letzten Endes wird dir aber nicht viel anderes übrig bleiben. Du kannst 
erst mal CSS links liegen lassen. Aber ohne ein wenig HTML Kentnisse 
wird das nichts. Letzten Endes ist aber HTML auch nur ein Text, der von 
deinem Web-Server ausgeliefert wird. Und recht viel braucht es dazu 
nicht, damit ein Web-Browser mit diesem ausgeliefertem Text (aka dem 
HTML) etwas anzufangen weiss.

HTML Tutorials gibt es viele. Ich fand immer das hier
https://wiki.selfhtml.org/
recht brauchbar. Und natürlich
http://www.w3schools.com/html/

Wenn also dein Webbrowser diesen Text hier ausliefert (von w3schools 
'geklaut')
1
<!DOCTYPE html>

2
<html>

3
<head>

4
<title>Page Title</title>

5
</head>

6
<body>

7
Hallo world!

8
</body>

9
</html>

dann sollte dein Browser schon etwas anzeigen. Wenn man das ganze dann 
noch ein wenig nach logischer Gliederung einrückt, dann sieht man sehr 
schnell, das da eigentlich nicht viel dahinter steckt.
1
<!DOCTYPE html>

2


3
<html>

4
  <head>

5
    <title>Page Title</title>

6
  </head>

7


8
  <body>

9
    Hallo world!

10
  </body>

11
</html>


mit einer Handvoll HTML Tags kommt man schon recht weit.
Antwort Zitieren Bearbeiten Löschen Beitrag melden
Michael U. #4383890
Lesenswert?
• ▲
▼ 
Hallo,

kritisch ist der Header, die Beispile sind oft unsauber. Für HTML 1.1 
muß die Länge im Header angegeben sein.
Fehlt diese oder ist falsch passieren Browserabhängig seltsame Dinge.
HTML1.0 verlangt es nicht, wird von manchen Browsern aber falsch 
behandelt.

1
    sHeader  = "HTTP/1.1 200 OK\r\n";

2
    sHeader += "Content-Length: ";

3
    sHeader += sResponse.length();

4
    sHeader += "\r\n";

5
    sHeader += "Content-Type: text/html\r\n";

6
    sHeader += "Connection: close\r\n";

7
    sHeader += "\r\n";

Wichtig ist auch die Leerzeile am Ende des Headers vor dem HTML-Content.

Er hat es hier recht sauber angefangen:
https://blog.thesen.eu/stabiler-http-1-1-wlan-webserver-mit-dem-esp8266-microcontroller/

Gruß aus Berlin
Michael
Antwort Zitieren Bearbeiten Löschen Beitrag melden
Chr. M. OP #4383914
Lesenswert?
• ▲
▼ 
>dann sollte dein Browser schon etwas anzeigen.
Irgendwas anzeigen bekomme ich schon hin
aber natürlich soll es auch nach was aussehen. :)

Momentan nehme ich 
http://www.john-lassen.de/index.php/projects/esp-8266-arduino-ide-webconfig 
als Basis aber ich scheitere schon daran aus den Checkboxen Slider zu 
machen und einen Schieberegler bräuchte ich auch noch.

>Müssen die Ressourcen denn auf dem esp8266 liegen
ich finde die liegen da ganz gut,
noch habe ich ca.600kbyte Flash und ca.20kbyte RAM frei.
Antwort Zitieren Bearbeiten Löschen Beitrag melden
дамрфкнилх Gast #4384015
Lesenswert?
• ▲
▼ 
Eine Minimalstseite :

<html><head></head><body>Hallo world!</body></html>

CSS braucht man nicht, das geht schon unter Luxus.

Fuer das Kommunikationsformat, sprich fuer "http", schau die "rfc" an.
Antwort Zitieren Bearbeiten Löschen Beitrag melden
Dirk D. #4384057
Lesenswert?
• ▲
▼ 
Michael U. schrieb:
> Hallo,
>
> kritisch ist der Header, die Beispile sind oft unsauber. Für HTML 1.1
> muß die Länge im Header angegeben sein.
> Fehlt diese oder ist falsch passieren Browserabhängig seltsame Dinge.
> HTML1.0 verlangt es nicht, wird von manchen Browsern aber falsch
> behandelt.

Huh?
Du meinst http 1.1, richtig?
Die länge nicht anzugeben ist bei dynamisch generiertem Inhalt üblich, 
so kann man schon Anfang Inhalte zu senden obwohl man noch gar nicht bis 
zum Ende gerendert hat, das macht keine Probleme.

Guck, selbst dieser Thread macht das nicht:
1
$ wget -S --spider https://www.mikrocontroller.net/topic/384145?reply_to=4383890

2
Spider-Modus eingeschaltet.  Prüfe ob die Datei auf dem Server existiert.

3
--2015-12-10 21:43:50--  https://www.mikrocontroller.net/topic/384145?reply_to=4383890

4
Auflösen des Hostnamen »www.mikrocontroller.net (www.mikrocontroller.net)«... 188.40.52.210, 2a01:4f8:100:3067::2

5
Verbindungsaufbau zu www.mikrocontroller.net (www.mikrocontroller.net)|188.40.52.210|:443... verbunden.

6
HTTP-Anforderung gesendet, warte auf Antwort... 

7
  HTTP/1.1 200 OK

8
  Server: nginx/1.6.2

9
  Date: Thu, 10 Dec 2015 20:43:50 GMT

10
  Content-Type: text/html; charset=utf-8

11
  Connection: keep-alive

12
  Vary: Accept-Encoding

13
  X-Frame-Options: SAMEORIGIN

14
  X-XSS-Protection: 1; mode=block

15
  X-Content-Type-Options: nosniff

16
  Strict-Transport-Security: max-age=16070400

17
  X-Memcached: cached: 6

18
  Expires: Thu, 10 Dec 2015 20:43:50 GMT

19
  Cache-Control: private

20
  Vary: Cookie

21
  ETag: W/"d49983c5e402d7bed504cd36be2c783f"

22
  Set-Cookie: return_to=https%3A%2F%2Fwww.mikrocontroller.net%2Ftopic%2F384145%3Freply_to%3D4383890; path=/

23
  Set-Cookie: _forum_session=aTBqeHFiTENWWmg3c0NEdlNkSXIzaEE1eTltNjdPamdlOWZKQU1Mc244ZEN2VUVCL1FvWmwxRUs1RlJZaE4yWlVoeXgrUDhzQU0rUzB5czZsMm1DcFVhUTd3d0l0QmNuc1MwUzJiSkVYenl1ZG83aWJyVXJzUEtseEIwOWRNZnR1QXlvVVhVempnSFlFVUdoUGFhd3h4UU9Td25ucDNuZnVFaTZFdHBkQ2ZJbkpjYTQzNmVVQ2NiZ3AzWmVnK1NSLS1tbUhPV0IrUDg0TjliWUZLUEtLVG53PT0%3D--eae3d3dcb7889d8f3614d62f5fa042e752f9d5c4; path=/; expires=Sun, 20 Dec 2015 20:43:50 -0000; HttpOnly

24
  X-Request-Id: 708523c5-c18e-4d62-8afc-e71825456105

25
  X-Runtime: 0.028134

26
  Alternate-Protocol: 443:npn-spdy/3

27
Länge: nicht spezifiziert [text/html]

28
Datei auf dem Server existiert und könnte weitere Links enthalten,

29
aber Rekursion ist abgeschaltet -- kein Download.


Zum eigentlichen Thema, wenn du sein css und js woanders ablegen kannst 
/ willst, wäre bootstrap bestimmt ne option
Antwort Zitieren Bearbeiten Löschen Beitrag melden
Marc S. #4384513
Lesenswert?
• ▲
▼ 
Chr. M. schrieb:
>>dann sollte dein Browser schon etwas anzeigen.
> Irgendwas anzeigen bekomme ich schon hin

dann ist doch alles gut..

> aber natürlich soll es auch nach was aussehen. :)

dann lern es gefälligst

> als Basis aber ich scheitere schon daran aus den Checkboxen Slider zu
> machen und einen Schieberegler bräuchte ich auch noch.

das sind keine html elemente, da dürfte dein problem liegen.


>>Müssen die Ressourcen denn auf dem esp8266 liegen
> ich finde die liegen da ganz gut,
> noch habe ich ca.600kbyte Flash und ca.20kbyte RAM frei.

also du hast keine ahnung aber du findest wir haben unrecht?
Antwort Zitieren Bearbeiten Löschen Beitrag melden
Thread beobachten

Antwort schreiben

Bitte melde dich an, um einen Beitrag zu schreiben.

Bestehender Account

oder

Mit Google-Account einloggen

Noch kein Account?

Die Registrierung ist kostenlos und dauert nur eine Minute.

Jetzt registrieren