TutKit.com

Dreamweaver für Einsteiger & Aufsteiger

Kategorie: Webdesign | Trainer: Andreas Stocker

77 Video-Lektionen, über 10 Stunden zur modernen, responsiven Webentwicklung mit Adobe Dreamweaver
Wofür brauchst du all dies und wie wendest du es an: u. a. HTML, CSS, Bootstrap, Media Queries
Von der Idee bis zur Veröffentlichung: Layout setzen, Inhalte einfügen & formatieren, testen, veröffentlichen
Webentwickler Andreas Stocker stellt dir seinen Responsive-Webdesign-Workflow vollumfänglich dar

Kategorien:
Einführung
Responsive Webdesign
Bootstrap
Erste Schritte in Dreamweaver
Das Seiten-Layout
Website-Inhalte
Inhalte formatieren
Testen und Feintuning
Neuerungen in Dreamweaver CC 2017

Trainings-Informationen

Videos: 77
Kapitel: 9
Länge : 10 Stunden
Detailinformationen
Ähnliche Inhalte

Bewertungen

3 Kundenrezensionen Trailer ansehen
Gesamtinhalt herunterladen
Jetzt dabei sein Jetzt gratis testen

Einführung

Dreamweaver für Einsteiger & Aufsteiger: 1.1 Willkommen

In dieser Lektion erhältst du eine Übersicht darüber, was dich in diesem Kurs erwartet.

4 Min. mit Arbeitsdatei Kostenlos

Dreamweaver für Einsteiger & Aufsteiger: 1.2 Übersicht über die Module

In dieser Lektion bekommst du eine kurze Übersicht darüber, was dich in den einzelnen Modulen erwartet.

4 Min. Kostenlos

Dreamweaver für Einsteiger & Aufsteiger: 1.3 Lektionen in Modul 1

Hier bekommst du eine Übersicht zu dem, was dich in den Lektionen dieses Moduls erwartet.

1 Min.

Dreamweaver für Einsteiger & Aufsteiger: 1.4 Voraussetzungen für das Training

Du erfährst in dieser Lektion, welche Voraussetzungen für diesen Kurs notwendig sind. Keine Sorge – es sind nicht viele.

1 Min.

Dreamweaver für Einsteiger & Aufsteiger: 1.5 Von der Idee zur Planung

In dieser Lektion lernst du den ersten Teil meines Responsive-Webdesign-Workflows kennen. Diese vereinfachte Form zeigt dir die wichtigsten Schritte, um ein responsives Projekt auch wirklich erfolgreich realisieren zu ...

15 Min.

Dreamweaver für Einsteiger & Aufsteiger: 1.6 Vom Plan zur Umsetzung

In dieser Lektion lernst du den zweiten Teil meines Responsive-Webdesign-Workflows kennen. Jetzt geht es darum, den Plan aus dem ersten Teil in ein visuelles Design und anschließend in einen HTML-Prototypen zu ...

10 Min.

Dreamweaver für Einsteiger & Aufsteiger: 1.7 Warum HTML und CSS?

Nach dieser Lektion weißt du, warum du dich trotz der Verwendung eines visuellen Tools wie Dreamweaver ein wenig mit den Grundlagen von HTML und CSS beschäftigen solltest.

7 Min.

Dreamweaver für Einsteiger & Aufsteiger: 1.8 HTML-Grundlagen

In dieser Lektion bekommst du eine Einführung in HTML und du weißt dann, wie du mit HTML-Elementen und -Tags umgehst und wie du über den DOM auf die Elemente zugreifst.

8 Min.

Dreamweaver für Einsteiger & Aufsteiger: 1.9 CSS-Grundlagen

Nach dieser Lektion kennst du die Grundlagen von CSS. Du weißt, wozu CSS benötigt wird und wie eine CSS-Regel aufgebaut ist. Du kennst die Begriffe „Klassen“ und „IDs“ und weißt, wie man diese in CSS-Regeln ...

7 Min.

Dreamweaver für Einsteiger & Aufsteiger: 1.10 Zusammenfassung Modul 1

In dieser Lektion bekommst du eine Zusammenfassung über all das, was du in diesem Modul gelernt hast. Im nächsten Modul werden wir uns dann dem Thema responsive Design näher widmen.

1 Min.

Responsive Webdesign

Dreamweaver für Einsteiger & Aufsteiger: 2.1 Lektionen in Modul 2

In diesem Video erhältst du einen Überblick über die Lektionen dieses Moduls.

1 Min.

Dreamweaver für Einsteiger & Aufsteiger: 2.2 Was ist responsive Webdesign?

In dieser Lektion geht es um responsive Design. Du erfährst, wie es entstanden ist und was es wirklich genau ist.

7 Min.

Dreamweaver für Einsteiger & Aufsteiger: 2.3 Was sind Grid-Systeme?

In dieser Lektion erfährst du alles über Grid-Systeme, die die technische Basis für fast jedes responsive Design sind.

6 Min.

Dreamweaver für Einsteiger & Aufsteiger: 2.4 Responsive Design und Grid-Systeme

Wir haben in der letzten Lektion erfahren, wie ein statisches Grid-System arbeitet. In dieser Lektion möchte ich näher auf responsive Grid-Systeme eingehen.

6 Min.

Dreamweaver für Einsteiger & Aufsteiger: 2.5 Grid-Systeme und Bootstrap-Grid

Wir kennen jetzt Grid-Systeme und responsive Grid-Systeme – jetzt geht es um das Bootstrap-Grid-System, das wir bei Dreamweaver praktisch einsetzen.

4 Min.

Dreamweaver für Einsteiger & Aufsteiger: 2.6 Was sind Media Queries?

Ohne Media Queries wären responsive Layouts nur schwer realisierbar. Um dieses Thema geht es in dieser Lektion.

6 Min.

Dreamweaver für Einsteiger & Aufsteiger: 2.7 Media Queries in Dreamweaver CC 2015

Nachdem wir jetzt Media Queries als Basis für responsive Design kennen, sehen wir uns einmal kurz an, wie diese in Dreamweaver definiert werden.

9 Min.

Dreamweaver für Einsteiger & Aufsteiger: 2.8 Zusammenfassung Modul 2

In dieser Lektion bekommst du eine Zusammenfassung zu dem, was du in diesem Modul gelernt hast. Im nächsten Modul werden wir uns dann näher dem Bootstrap-Framework widmen.

1 Min.

Bootstrap

Dreamweaver für Einsteiger & Aufsteiger: 3.1 Lektionen in Modul 3

Du bekommst in diesem Video eine Übersicht darüber, was du in diesem Modul lernst.

1 Min.

Dreamweaver für Einsteiger & Aufsteiger: 3.2 Was ist ein HTML-, CSS-, JS-Framework?

In dieser Lektion geht es um HTML-, CSS- und JavaScript-Frameworks.

3 Min.

Dreamweaver für Einsteiger & Aufsteiger: 3.3 Was ist Bootstrap?

Nachdem wir wissen, was ein Web-Framework ist, sehen wir uns jetzt genauer an, was Bootstrap ist.

7 Min.

Dreamweaver für Einsteiger & Aufsteiger: 3.4 Was kann Twitter Bootstrap?

Wir haben uns bis jetzt angesehen, was Bootstrap ist. Nun geht es etwas genauer um die Funktionen des Frameworks.

9 Min.

Dreamweaver für Einsteiger & Aufsteiger: 3.5 Die Bootstrap-Elemente

In dieser Lektion sehen wir uns genauer an, welche CSS-Elemente und Components Bootstrap für die Website-Erstellung bereitstellt.

16 Min.

Dreamweaver für Einsteiger & Aufsteiger: 3.6 Bootstrap-Integration in Dreamweaver

Jetzt geht es darum, wie das Bootstrap-Framework in Dreamweaver eingesetzt wird.

10 Min.

Dreamweaver für Einsteiger & Aufsteiger: 3.7 Zusammenfassung Modul 3

In diesem Video erhältst du eine Zusammenfassung über das, was du in diesem Modul gelernt hast.

1 Min.

Erste Schritte in Dreamweaver

Dreamweaver für Einsteiger & Aufsteiger: 4.1 Lektionen in Modul 4

Du bekommst in diesem Video eine Übersicht darüber, was du in diesem Modul lernst.

1 Min.

Dreamweaver für Einsteiger & Aufsteiger: 4.2 Was ist und was kann Dreamweaver?

Du bekommst hier einen ersten Einblick in das, was Dreamweaver kann, und erfährst, was für den Einsatz dieser Software spricht.

2 Min.

Dreamweaver für Einsteiger & Aufsteiger: 4.3 Die Site-Verwaltung - Umgang mit Dateien

Für ein erfolgreiches Projekt ist es wichtig zu wissen, wie man am besten mit Dateien in einem Projekt umgeht. Darum geht es in dieser Lektion.

9 Min.

Dreamweaver für Einsteiger & Aufsteiger: 4.4 Projektstart

Ich zeige dir in diesem Video, wie du dein erstes Projekt in Dreamweaver startest.

9 Min.

Dreamweaver für Einsteiger & Aufsteiger: 4.5 Die Dreamweaver-Oberfläche

Du bekommst in dieser Lektion einen Überblick über die Oberfläche von Dreamweaver.

13 Min.

Dreamweaver für Einsteiger & Aufsteiger: 4.6 Panels in Dreamweaver

Ich erkläre dir in dieser Lektion die wichtigsten Panels, die für das Arbeiten in Dreamweaver hilfreich sind.

11 Min.

Dreamweaver für Einsteiger & Aufsteiger: 4.7 Die Views in Dreamweaver

Jetzt bekommst du eine Übersicht über die verschiedenen Views und du erfährst, für welchen Einsatzbereich diese geeignet sind.

8 Min.

Dreamweaver für Einsteiger & Aufsteiger: 4.8 Arbeiten mit HTML-Code in Dreamweaver

Wir sehen uns genauer an, wie man in Dreamweaver mit HTML-Code arbeitet und wie wir einfach auf das schon bekannte DOM zugreifen können.

7 Min.

Dreamweaver für Einsteiger & Aufsteiger: 4.9 Elemente einfügen

Jetzt geht es darum, wie man Elemente in Dreamweaver einfügen kann.

7 Min.

Dreamweaver für Einsteiger & Aufsteiger: 4.10 Texte und Bilder einfügen

Jetzt geht es darum, wie man Texte richtig einfügt, vor allem, wenn man die Semantik korrekt beachten will.

9 Min.

Dreamweaver für Einsteiger & Aufsteiger: 4.11 Bootstrap-Elemente einfügen

Jetzt geht es um das Einfügen der speziellen Bootstrap-Elemente.

8 Min.

Dreamweaver für Einsteiger & Aufsteiger: 4.12 Zusammenfassung Modul 4

In diesem Video erhältst du eine Zusammenfassung über das, was du in diesem Modul gelernt hast.

1 Min.

Das Seiten-Layout

Dreamweaver für Einsteiger & Aufsteiger: 5.1 Lektionen in Modul 5

Du bekommst in diesem Video eine Übersicht darüber, was du in diesem Modul lernst.

1 Min.

Dreamweaver für Einsteiger & Aufsteiger: 5.2 Das Layout in der Übersicht

In dieser Lektion zeige ich dir das fertige Layout und wir analysieren die Seite anhand der Wireframes.

12 Min.

Dreamweaver für Einsteiger & Aufsteiger: 5.3 Bootstrap-Container

In dieser Lektion zeige ich dir die verschiedenen Varianten von Bootstrap-Containern und wir sehen uns an, wie man diese einfügt.

5 Min.

Dreamweaver für Einsteiger & Aufsteiger: 5.4 Reihen und Spalten einfügen

Ich zeige dir in diesem Video die verschiedensten Varianten, wie man in ein Projekt Bootstrap-Reihen und -Spalten einfügt und bearbeitet.

10 Min.

Dreamweaver für Einsteiger & Aufsteiger: 5.5 Projektstart

In dieser Lektion definieren wir unsere Site und wir starten unsere praktische Projektübung.

6 Min.

Dreamweaver für Einsteiger & Aufsteiger: 5.6 Die Seite zusammenstellen

Jetzt geht es darum, unser Grundlayout zusammenzustellen und das Desktop-Layout zu definieren.

17 Min.

Dreamweaver für Einsteiger & Aufsteiger: 5.7 Responsive Layout einrichten

In dieser Lektion definieren wir die beiden noch fehlenden Layouts für Tablet und Mobile.

6 Min.

Dreamweaver für Einsteiger & Aufsteiger: 5.8 Zusammenfassung Modul 5

In diesem Video erhältst du eine Zusammenfassung über das, was du in diesem Modul gelernt hast.

1 Min.

Website-Inhalte

Dreamweaver für Einsteiger & Aufsteiger: 6.1 Lektionen in Modul 6

Du bekommst in diesem Video eine Übersicht darüber, was du in diesem Modul lernst.

1 Min.

Dreamweaver für Einsteiger & Aufsteiger: 6.2 Grundlagen zu Bildern im Web

In dieser Lektion erhältst du die Grundlagen zur Verwendung von Bildern in Webseiten. Du erfährst dabei, welche Bildformate es gibt und welche Eigenschaften, Vor- und Nachteile diese haben.

13 Min.

Dreamweaver für Einsteiger & Aufsteiger: 6.3 Bilder vorbereiten

In dieser Lektion erfährst du, mit welchen Methoden du deine Bilder für deine Website generieren kannst. Ich zeige dir das anhand von Adobe Photoshop.

19 Min.

Dreamweaver für Einsteiger & Aufsteiger: 6.4 Text- und Bild-Inhalte einfügen

In diesem Video geht es um das Einfügen von Bild- und Text-Inhalten in deine Website.

21 Min.

Dreamweaver für Einsteiger & Aufsteiger: 6.5 Formular-Elemente und iFrames

In dieser Lektion erfährst du, wie man Formular-Elemente, Buttons und fremde Inhalte mit iFrames einbaut.

12 Min.

Dreamweaver für Einsteiger & Aufsteiger: 6.6 Verschachtelte Reihen

In dieser Lektion sehen wir uns an, wie man verschachtelte Reihen verwendet und welche Layout-Möglichkeiten der Einsatz bietet.

14 Min.

Dreamweaver für Einsteiger & Aufsteiger: 6.7 Zusammenfassung Modul 6

In diesem Video erhältst du eine Zusammenfassung über das, was du in diesem Modul gelernt hast.

1 Min.

Inhalte formatieren

Dreamweaver für Einsteiger & Aufsteiger: 7.1 Lektionen in Modul 7

Du bekommst in diesem Video eine Übersicht darüber, was du in diesem Modul lernst.

1 Min.

Dreamweaver für Einsteiger & Aufsteiger: 7.2 Der CSS Designer

In dieser Lektion stelle ich dir den CSS Designer von Dreamweaver vor, der das Tool für das Arbeiten mit CSS ist.

10 Min.

Dreamweaver für Einsteiger & Aufsteiger: 7.3 Selektoren ermitteln

In diesem Video zeige ich dir, wie du die richtigen Selektoren für deine CSS-Regeln findest.

12 Min.

Dreamweaver für Einsteiger & Aufsteiger: 7.4 Inhalte und Layout aus Photoshop

In dieser Lektion zeige ich dir, wie du aus deinem Visual Design in Photoshop einfach CSS-Inhalte bekommst.

8 Min.

Dreamweaver für Einsteiger & Aufsteiger: 7.5 Bootstrap-Regeln verändern

Ich zeige dir hier, wie man am besten bestehende Bootstrap-CSS-Regeln verändert und wie man Selektoren von bestehenden Elementen ermittelt.

13 Min.

Dreamweaver für Einsteiger & Aufsteiger: 7.6 Bootstrap-Menü anpassen

In diesem Video zeige ich dir einige Methoden, mit denen du dein Menü schnell und einfach erstellen und formatieren kannst.

15 Min.

Dreamweaver für Einsteiger & Aufsteiger: 7.7 Text und Bilder formatieren - Teil 1

In dieser Lektion geht es darum, die Inhalte unseres Beispielprojektes mittels CSS zu formatieren.

18 Min.

Dreamweaver für Einsteiger & Aufsteiger: 7.8 Text und Bilder formatieren - Teil 2

Wir setzen die Formatierung unserer Inhalte mit CSS in dieser Lektion fort.

11 Min.

Dreamweaver für Einsteiger & Aufsteiger: 7.9 Abstände und Links formatieren

In dieser Lektion verfeinern wir unser Layout, indem wir noch verschiedene Abstände anpassen und unsere Links formatieren.

5 Min.

Dreamweaver für Einsteiger & Aufsteiger: 7.10 Layout für andere Größen

In dieser Lektion sehen wir uns die Layouts für Tablet und Mobile an und führen dort noch einige Anpassungen durch.

12 Min.

Dreamweaver für Einsteiger & Aufsteiger: 7.11 Zusammenfassung Modul 7

In diesem Video erhältst du eine Zusammenfassung über das, was du in diesem Modul gelernt hast.

1 Min.

Testen und Feintuning

Dreamweaver für Einsteiger & Aufsteiger: 8.1 Lektionen in Modul 8

Du bekommst in diesem Video eine Übersicht darüber, was du in diesem Modul lernst.

1 Min.

Dreamweaver für Einsteiger & Aufsteiger: 8.2 SEO - Suchmaschinenoptimierung

In dieser Lektion zeige ich dir, was du tun musst, damit deine Website optimal für Suchmaschinen aufbereitet ist.

16 Min.

Dreamweaver für Einsteiger & Aufsteiger: 8.3 Interaktivität für unsere Seite

In dieser Lektion zeige ich dir, wie du mit einigen Zeilen JavaScript-Code nette Interaktivitäten in deine Webseite bekommst.

14 Min.

Dreamweaver für Einsteiger & Aufsteiger: 8.4 Weitere Seiten anlegen

In diesem Video geht es darum, wie du deinem Projekt weitere Seiten hinzufügst und wie diese miteinander verlinkt werden.

16 Min.

Dreamweaver für Einsteiger & Aufsteiger: 8.5 Seiten testen

In dieser Lektion zeige ich dir verschiedene Möglichkeiten, wie du dein Web-Projekt testen kannst und solltest.

16 Min.

Dreamweaver für Einsteiger & Aufsteiger: 8.6 Inhalte ins Netz stellen

Nachdem unser Web-Projekt nun fertig und getestet ist, geht es in dieser Lektion darum, wie das Projekt am einfachsten ins Internet gestellt werden kann.

8 Min.

Dreamweaver für Einsteiger & Aufsteiger: 8.7 Zusammenfassung Modul 8

In diesem Video erhältst du eine Zusammenfassung über das, was du in diesem Modul gelernt hast.

1 Min.

Dreamweaver für Einsteiger & Aufsteiger: 8.8 Danke

Du hast es geschafft und den Kurs abgeschlossen. In diesem Video fasse ich noch einmal kurz zusammen, was du in diesem Kurs gelernt hast.

2 Min.

Neuerungen in Dreamweaver CC 2017

Dreamweaver für Einsteiger & Aufsteiger: 9.1 Neues in Dreamweaver CC 2017 - Übersicht

Du bekommst in diesem Video eine Übersicht darüber, was neu ist in Dreamweaver und was du in diesem Modul lernst.

3 Min. Kostenlos

Dreamweaver für Einsteiger & Aufsteiger: 9.2 Neues in Dreamweaver CC 2017 - der Code-Editor

Der Code-Editor in Dreamweaver baut auf dem freien Code-Editor Brackets auf. Welche praktischen Funktionen dieser anbietet, zeige ich dir in dieser Lektion.

13 Min.

Dreamweaver für Einsteiger & Aufsteiger: 9.3 Neues in Dreamweaver CC 2017 - Code-Snippets

Code-Snippets sind in Dreamweaver eine praktische Funktion, um schnell Code verschiedenster Art zu verwalten und hinzuzufügen.

7 Min.

Dreamweaver für Einsteiger & Aufsteiger: 9.4 Neues in Dreamweaver CC 2017 - Suchen und Ersetzen

Die Suchen und Ersetzen-Funktion wurde in Dreamweaver 2017 stark verbessert. Ich stelle dir in diesem Video diese Funktion vor.

8 Min.

Dreamweaver für Einsteiger & Aufsteiger: 9.5 Neues in Dreamweaver CC 2017 - Versionsverwaltung mit Git

Für Software-Entwickler sind Versionsverwaltungen fast selbstverständlich. Bisher konnte Dreamweaver mit Subversion umgehen. Jetzt gibt es auch die Möglichkeit, mit Git zu arbeiten. Wie das geht, zeige ich in dieser ...

11 Min.

Dreamweaver für Einsteiger & Aufsteiger: 9.6 Neues in Dreamweaver CC 2017 - Oberfläche, Aussehen und Browser-Vorschau

Die Oberfläche wurde nur minimal verändert. Es wurde eher an Details gearbeitet, optimiert und mehr Übersicht geschaffen. Die Browser-Vorschau wurde um die Echtzeitvorschau erweitert.

7 Min.

Diese Inhalte könnten dich ebenfalls interessieren

Wir sind auf der Suche nach interessanten Trainings für dich, bitte gib uns einen Moment.

Top