Responsive Websites mit Dreamweaver erstellen

Responsive Webdesign war einer der Webdesign Trends 2013 und ist immer noch ein aktuelles Thema. Responsive Design wird bald kein Trend mehr sein, sondern normaler Alltag im Webdesign. Zunehmend wird das Internet mobiler und kaum ein Website Betreiber wird es sich in Zukunft leisten können auf diese mobilen Nutzer zu verzichten. In manchen Bereichen ist der mobile Zugriff bereits jetzt schon höher als der von Desktopgeräten. Umso mehr müssen sich Webdesigner dafür rüsten diese neue Technik auch für Ihre Projekte umsetzen zu können.

Mit Adobe Dreamweaver ist dies bereits seit einiger Zeit möglich. Wie es genau funktioniert zeige ich in meinem 2 teiligen Videotraining.

Die Erstellung der responsive Webseiten erfolgt mit einem flüssigen Rasterlayout, welches für 3 Screengrößen (Smartphone, Tablet und Desktop) eingerichtet wird. Die Spalten (Anzahl und Breite) lassen sich für jede Größe individuell konfigurieren. Das Verhalten (Position und Größe) der einzelnen Blöcke lässt sich ganz leicht mit der Maus zusammenbauen.

In dem 2 teiligen Videotutorial zeige ich wie von Grund auf eine responsive Webseite erstellt wird und  im Laufe des Tutorials eine komplette Seite entsteht.

 

Im ersten Teil werden die Grundlagen von responsive Webdesign mit Dreamweaver erklärt. Es wird ein Grundlayout für alle drei Darstellungen erstellt und der Content für unsere Website eingefügt.

 

 

Der zweite Teil beschäftigt sich damit, wie das vorhin erstellte Grundlayout mittels CSS zur fertigen Webseite wird.

 

 

Ich wünsche euch viel Spass und Erfolg mit diesen Video Tutorials.

 

Videos auf Youtube:

http://youtu.be/0AvitaxQoRw

http://youtu.be/-pCQkqsCdhU

 

Mein Video Tutorial Kanal:

https://www.youtube.com/user/asvideotrainings

 

 

Kategorien: Trainings, Tutorials, Web Design und Web Development.

Trackbacks

  1. […] schon mit den CS Versionen möglich. Dies habe ich auch schon in meinen Video Tutorials gezeigt (Responsive Websites mit Dreamweaver erstellen). Doch so richtig brauchbar war dieses Feature vor allem bei größeren Websites nicht wirklich. […]

Schreibe einen Kommentar

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