Forum: PC-Programmierung erstellung von einfachen web pages


Announcement: there is an English version of this forum on EmbDev.net. Posts you create there will be displayed on Mikrocontroller.net and EmbDev.net.
von klaus (Gast)


Bewertung
0 lesenswert
nicht lesenswert
Hi
ich wollte eine html seite erstellen mit paar schickeren Buttons/und 
Slider.

Was habe ich vor mit python flask ein web app bauen. Python triggert 
dann eine Motorsteuerung.

Gibt es ein tool mit dem eine einfache HTML Seite mit schöne/moderne 
Knopfen /Slider/checkboxen erstellt werden kann?

von Hartmann (Gast)


Bewertung
-1 lesenswert
nicht lesenswert
MS Frontpage

von klaus (Gast)


Bewertung
0 lesenswert
nicht lesenswert
MS Frontpage ist discontinued? wird das heutzutage immer noch damit 
gemacht?

von MaWin (Gast)


Bewertung
2 lesenswert
nicht lesenswert
klaus schrieb:
> wird das heutzutage immer noch damit gemacht?

Nein, das ist nur das Letzte und Einzige was Hartmann kennt, als er sich 
im vorherigen Jahrhundert mal damit beschäftigt hat.

Hier wimmelt es vor ahnungslosen Trolls.

von Joachim (Gast)


Bewertung
0 lesenswert
nicht lesenswert
Ist jetzt eher kein "Tool", aber evtl. kommt es für Dich ja trotzdem 
infrage:
Einfaches HTML-Gerüst selbst schreiben, dann "Bootstrap" 
(https://v5.getbootstrap.com/) verwenden, um der HTML-Seite mit wenig 
Aufwand ein ansprechendes modernes Design zu geben, das sich automatisch 
an die Display-Grösse anpasst.
Dazu musst Du lediglich in Deiner HTML-Seite die Bootstrap-CSS-Datei 
einbinden:
1
<link haref="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-alpha3/dist/css/bootstrap.min.css" rel="stylesheet" />
Und bei den entsprechenden HTML-Elementen einfach noch gemäss Anleitung 
hier und da ein "class"-Attribut mitgeben.

Ein einfacher Slider, Button und Checkbox wäre dann bspw.:
1
<input type="range" min="0" max="360" class="form-range">
2
<button type="button" class="btn btn-primary">Drück mich</button>
3
<input class="form-check-input" type="checkbox" value="">

https://v5.getbootstrap.com/docs/5.0/forms/range/
https://v5.getbootstrap.com/docs/5.0/components/buttons/
https://v5.getbootstrap.com/docs/5.0/forms/checks-radios/

von Dennis S. (eltio)


Bewertung
0 lesenswert
nicht lesenswert
Das erwähnte Bootstrap ist kein Tool sondern ein Framework. In die 
gleiche Kerbe schlägt https://bulma.io/, welches ich von der Anwendung 
auch recht intuitiv finde.

https://bulma.io/documentation/elements/button/
https://bulma.io/documentation/form/checkbox/

: Bearbeitet durch User
von Frank M. (ukw) (Moderator) Benutzerseite


Bewertung
0 lesenswert
nicht lesenswert
Joachim schrieb:
> <link haref="https://cdn.jsdelivr.net/....

Kleine Korrektur:

 <link href="https://cdn.jsdelivr.net/....

Sonst hat das nicht den gewünschten Effekt ;)

von Thomas (Gast)


Bewertung
0 lesenswert
nicht lesenswert
Das Einarbeiten in HTML sollte nicht gescheut werden. Hier eine Seite 
auf der  gelernt und das Gelernte gleich Online getestet werden kann. 
Unschlagbar.

https://www.w3schools.com/

https://www.w3schools.com/html/

von 🐧 DPA 🐧 (Gast)


Bewertung
0 lesenswert
nicht lesenswert
Frank M. schrieb:
> Kleine Korrektur:

Er durfte es ja auch nicht richtig schreiben. Denn sonst kommt die 
Meldung "Der Beitrag scheint Spam zu enthalten", und dann geht das 
Senden nicht mehr.

von Joachim (Gast)


Bewertung
0 lesenswert
nicht lesenswert
Frank M. schrieb:
> Joachim schrieb:
>> <link haref="https://cdn.jsdelivr.net/....
>
> Kleine Korrektur:
>
>  <link xref="https://cdn.jsdelivr.net/....
>
> Sonst hat das nicht den gewünschten Effekt ;)

Hätte ich gerne geschrieben - aber die Forensoftware hält das offenbar 
für eine Art Voldemort-Attribut, dessen Name nicht genannt werden darf, 
und hat mich das nicht posten lassen. Auch gequotet muss ich es 
ersetzen.
Konntest Du das posten, weil Du Moderator bist, oder gibt's da einen 
Trick?

von Frank M. (ukw) (Moderator) Benutzerseite


Bewertung
0 lesenswert
nicht lesenswert
Joachim schrieb:
> Konntest Du das posten, weil Du Moderator bist, oder gibt's da einen
> Trick?

Ehrlich gesagt, ich weiß es nicht. Kann sein, dass im Moderatoren-Modus 
der Spam-Filter abgeschaltet ist.

von Wolfgang Höhne (Gast)


Bewertung
0 lesenswert
nicht lesenswert

von Jemand (Gast)


Bewertung
1 lesenswert
nicht lesenswert
klaus schrieb:
> Hi
> ich wollte eine html seite erstellen mit paar schickeren Buttons/und
> Slider.
>
> Was habe ich vor mit python flask ein web app bauen. Python triggert
> dann eine Motorsteuerung.
>
> Gibt es ein tool mit dem eine einfache HTML Seite mit schöne/moderne
> Knopfen /Slider/checkboxen erstellt werden kann?

Ich selbst nutze zum Schreiben von HTML gerne ein besonderes 
Spezialwerkzeug, das noch kein anderer Entwickler jemals gesehen hat: 
einen Texteditor. ;-)

Nein, im Ernst: HTML ist jetzt wirklich keine Raketenwissenschaft, und 
mit den Tags von Jinja2 (der Template-Engine in Flask) kommt leider kein 
mir bekanntes GUI-Werkzeug klar. Deswegen würde ich empfehlen, mithilfe 
der W3Schools und / oder Selfhtml ein bisschen HTML zu lernen und das 
tatsächlich manuell zu machen.

Für eine gefällige Darstellung mit Responsive Design & Co. bin ich (als 
großer Freund von minimalen Lösungen für minimale Probleme) bei Kube7 
gelandet. Dazu sind Kenntnisse in HTML, CSS und JavaScript jedoch auch 
geboten... Slider und Buttons sind jedenfalls schon fertig drin. Viel 
Erfolg!

Antwort schreiben

Die Angabe einer E-Mail-Adresse ist freiwillig. Wenn Sie automatisch per E-Mail über Antworten auf Ihren Beitrag informiert werden möchten, melden Sie sich bitte an.

Wichtige Regeln - erst lesen, dann posten!

  • Groß- und Kleinschreibung verwenden
  • Längeren Sourcecode nicht im Text einfügen, sondern als Dateianhang

Formatierung (mehr Informationen...)

  • [c]C-Code[/c]
  • [code]Code in anderen Sprachen, ASCII-Zeichnungen[/code]
  • [math]Formel in LaTeX-Syntax[/math]
  • [[Titel]] - Link zu Artikel
  • Verweis auf anderen Beitrag einfügen: Rechtsklick auf Beitragstitel,
    "Adresse kopieren", und in den Text einfügen




Bild automatisch verkleinern, falls nötig
Bitte das JPG-Format nur für Fotos und Scans verwenden!
Zeichnungen und Screenshots im PNG- oder
GIF-Format hochladen. Siehe Bildformate.

Mit dem Abschicken bestätigst du, die Nutzungsbedingungen anzuerkennen.