Responsive Design mit Dreamweaver CC 2015 und Bootstrap Tutorials – Teil 1 und 2

In meinem Artikel „Warum du mit Dreamweaver CC jetzt endlich rasch und einfach responsive Websites erstellen kannst“ habe ich die Neuerungen von Dreamweaver bei der Erstellung von responsive Websites vorgestellt. Jetzt gibt es die versprochenen Tutorials. Im ersten Teil stelle ich vor, wie responsive Gridsysteme arbeiten und wie Bootstrap bei der Erstellung von Gridsystemen funktioniert. Im zweiten Teil zeige ich dann, wie man dieses Gridsystem praktisch mit Dreamweaver erstellt und an die unterschiedlichen Device Größen anpasst.

 

Nachdem, wie in meinem letzten Artikel schon erwähnt, die Art responsive Websites in Dreamweaver zu erstellen komplett geändert wurde, war es Zeit meine Video Tutorials auf den neuesten Stand zu bringen. Die Tutorial Serie „Responsive Design mit Dreamweaver CC 2015 und Bootstrap“ besteht aus insgesamt 4 Teilen.

Teil 1 und Teil 2 habe ich jetzt online gestellt.

 

Da noch nicht alle User mit responsive Gridsystemen und Bootstrap vertraut sind, gehe ich im ersten Teil auf dieses Thema ein. Hier wird kurz erklärt, was Gridsysteme und im speziellen responsive Gridsysteme sind und wie diese mit Bootstrap umgesetzt werden.

Diesen ersten Teil findet ihr in meinem Youtube Channel oder unter folgendem Link:

Teil 1: Responsive Design mit Dreamweaver CC 2015 und Bootstrap

 

Wenn Ihr diesen Teil durch habt oder bereits die Grundlagen von responsive Gridsystemen und Bootstrap bekannt sind, dann geht es im zweiten Teil zum praktischen Einsatz in Dreamweaver. Wichtig für diese praktische Umsetzung ist, dass ihr bereits die neueste Version CC 2015 verwendet, denn in den Vorgängerversionen wird noch ein anderes System verwendet.

In diesem Teil zeige ich euch, wie ihr ein komplett neues Projekt anlegt, das Layout mittels Bootstrap Gridsystem zusammenstellt und wie das Layout an unterschiedliche Device Größen angepasst wird.

Auch dieses Video findet ihr in meinem Youtube Channel oder unter folgendem Link:

Teil 2: Responsive Design mit Dreamweaver CC 2015 und Bootstrap

 

Ich wünsche euch viel Spass und Erfolg mit der den ersten Schritten und ich würde mich über eure Kommentare freuen, wie ihr die Videos findet und ob euch diese weitergeholfen haben.

Die restlichen 2 Teile in denen ich euch zeige, wie Inhalte eingefügt und formatiert werden, folgen diese Woche.

Wenn ihr übrigens noch mehr zu dem Thema wissen wollte, dann meldet euch bei meiner Kursplattform unter http://www.webdesign-coach.com zum Kursnewsletter an. Als besonderen Bonus, bekommen alle, die sich im Juli zum Newsletter anmelden den Kurs nach Fertigstellung kostenlos zu Verfügung gestellt.

 

 

Facebook

Ich würde mich übrigens freuen,
wenn Du auch meine Facebook Seite
besuchst und mein Fan wirst.

 

 

 

Kategorien: Trainings, Tutorials und Web Design.

Comments

  1. Joachim Reichel

    Sehr geehrter Herr Stocker
    Herzlichen Dank für die tollen Lehrvideos – ich habe wirklich zum ersten Mal das Gefühl das ganze (wieder) zu verstehen. Die Unterschiede zu früheren Dreamweaver Versionen und Methoden sind doch so erheblich, dass man sich da neu hineindenken muss, bzw. vergessen wie es früher ging…
    Mit Ihren Videos habe ich 100% genau das gelernt, was ich zum Einstieg dringen brauche! Nun warte ich nur noch (ungeduldig) auf die nächsten 2 Videos zu diesem Thema!

    Also nochmals vielen Dank ein dickes Lob für die Videos – mit diesen klaren und einfachen Schritten kann jeder verstehen wie’s mit CC 2015 geht!

    • Das freut mich, wenn die Videos gut ankommen und ihren Zweck erfüllen. Der dritte Teil ist übrigens schon online unter:

      https://youtu.be/irVLkttesr8

      Der vierte Teil folgt morgen oder übermorgen.

      Ich würde mich übrigens auch über positive Bewertungen und/oder Kommentare auf Youtube freuen.

      Viel Spass und Erfolg noch
      LG Andreas

Trackbacks

  1. […] Responsive Design mit Dreamweaver CC 2015 und Bootstrap Tutorials – Teil 1 und 2 […]

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.