kostenloser Webspace werbefrei: lima-city


Responsive Webdesign

lima-cityForumDie eigene HomepageHTML, CSS & Javascript

  1. Autor dieses Themas

    ein-leben-im-einklang

    ein-leben-im-einklang hat kostenlosen Webspace.

    Hallo,

    ich habe den tag/begriff">Begriff Responsive Webdesign schon öfters gehört, mich damit aber noch nie wirklich auseinander gesetzt.
    Bisher habe ich es lediglich in Shops gefunden auf denen man sich fertige Homepages kaufen kann oder in Programmen wie Website X5.
    Aber kann man das Responsive Webdesign auch selbst erstellen? Wenn ja wie?
    Und lässt sich eine bestehende Website so einfach ohne Weiteres mit einem Responsive Webdesign versehen?
  2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

  3. h***********r

    Was es ist: https://www.google.de/search?q=Responsive+Webdesign
    Aber kann man das Responsive Webdesign auch selbst erstellen?

    Ja, oder wie werden die da wohl dran gekommen sein die etwas in der Art verkaufen?
    Wenn ja wie?

    2. Ergebnis https://wiki.selfhtml.org/wiki/HTML/Tutorials/responsive_Webdesign
    + https://www.google.de/search?q=responsive+Webdesign+erstellen
    Und lässt sich eine bestehende Website so einfach ohne Weiteres mit einem Responsive Webdesign versehen?

    Kommt auf die Website drauf an. Ohne Arbeit wirds aber kaum gehen.

    Beitrag zuletzt geändert: 30.1.2018 20:10:53 von horstexplorer
  4. Autor dieses Themas

    ein-leben-im-einklang

    ein-leben-im-einklang hat kostenlosen Webspace.

    Dankeschön.
    Was es ist wusste ich bereits vorher schon. Gegoogelt hatte ich bereits auch schon mal und mir diverse Seiten angeschaut. Jedoch sind die sprachlich meist ziemlich kompliziert gehalten und ich bin mit meinen bescheidenen Kenntnissen relativ schnell verloren gewesen.

    Dass es selbst zu erstellen ist, das habe ich mir schon fast gedacht, sonst würde es die Codezeilen ja schließlich nicht geben...

    Ich hatte gehofft, dass jemand vielleicht eine schöne, leicht zu verstehende Step-by-step Anleitung hat mit der man sich spielen oder auch learning by doing an das ganze Thema heranfrickeln kann.
    Die Seite html-seminar ist diesbezüglich schon mal nicht so verkehrt, jedoch fehlen mir hier z.B. kleine Zwischenschritte um das ganze voll und ganz nachvollziehen zu können.
  5. g*******r

    Wie weit ist es denn um deinen Kentnissstand in HTML und CSS bestellt?

    Es gibt ein sehr simples framework namens bootstrap. Hab ich damals für den Einstieg auch benutzt, jedoch mag ich frameworks nicht sonderlich, da diese immer ne Menge Code liefern um sich auszutoben, den man am Ende aber garnicht komplett braucht.

    https://getbootstrap.com/

    Mach damit deine ersten Gehversuche um einwenig das System dahinter zu verstehen. Bootstrap arbeitet allem voran mit sogenannten Mediaquerries. Dies sind Formatabfragen des Bildschirms beim User, somit weiss man auf CSS Ebene welche Abmessungen der Bildschirm des jeweiligen Users hat und kann dafür im Vorfeld bestimmte Eigenschaften der Elemente festlegen.

    Z.B. bei einer Breite des Bildschirms von unter 1000px sollen alle Elemente nicht länger Rot sondern Grün dargestellt werden (ist natürlich auf jedwedes CSS Gehabe anwendbar).

    Eine Weitere Möglchkeit sind relative Anganben. Man kann einem Element ja z.B. eine Breite von 60px geben. Das ist absolut. Es wird immer mit dieser Breite dargestellt. Wenn ich jedoch angebe, das dieses Element eine Breite von 20% haben soll, ist die Anganbe relativ zur tatsächlichen Bildschirm/Fenstergröße.

    Wenn du jedoch wirklich responsive design schreiben möchtest, musst du dich mit dem FlexBox System von CSS3 auseinandersetzen. Sehr mächtig und wenn man es ersteimal verstanden hat auch total simpel.

    Abschließend sei noch das Grid System von CSS3 erwähnt.

    Mag für einen Anfänger vielleicht etwas viel input sein, aber niemand sagte das es leicht wird ;)
  6. Guten Tag,

    ich würde mal den kurzen Moment schnappen und dir @ein-leben-im-einklag auch http://materializecss.com/ empfehlen. Dies ist ebenfalls ein Framework welches ähnlich aufgebaut ist wie Bootstrap, jedoch nach meiner persönlichen Meinung etwas leichter ist und eine verständlichere Dokumentation besitzt.

    Das Framework an sich bietet dir dann die Möglichkeit gewisse "Templates" in deine Webseite einzubauen um nicht nur deinen Work-Flow zu steigern, sondern es auch für dich leichter zu machen eine solche Webseite von der Struktur zusammen zu setzen.

    Jedoch sind auch Sachen wie Bootstrap, SemanticUI eine Möglichkeit, jedoch empfehle ich Materillze. Wenn du Interesse hast, biete ich dir gerne an eine Art kleinen Grundkurs rund um HTML, CSS und JS zu machen. :) Bei Interesse einfach melden.
  7. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?

Über lima-city

Login zum Webhosting ohne Werbung!