Responsive Websites mit Adobe MUSE

Mit seinem letzten Update im März dieses Jahres hat Adobe wieder einiges an Muse verändert. Einer meiner Kritikpunkte an Adobe Muse CC war bisher, dass man keine echten responsive Seiten mit dem Tool erstellen konnte. Das hat sich nun geändert, denn diese schon lang vermisste Funktion wurde endlich eingebaut. Adobe geht bei der Implementierung noch einen Schritt weiter, denn Adobe hat es bei einem Vortrag einmal so nett als visual responsive Design bezeichnet. 

Wie alles andere bei Muse, kann man sein responsive Layout völlig befreit von irgendwelchen Grid Systemen einfach mit Drag and Drop erstellen.

Wie gut das ganze funktioniert und ob es praktisch brauchbar ist, habe ich mir angesehen und in diesem Artikel zusammen gefasst. Leider ist nicht alles Gold was glänzt und daher werden in diesem Artikel auch ein wenig die Einschränkungen und Nachteile beleuchtet.

(mehr …)

Kategorien: Allgemein, Tutorials und Web Design.

Responsive Design mit Dreamweaver CC 2015 und Bootstrap Tutorials – Teil 3 und 4

Vor einigen Tagen habe ich den ersten und zweiten Teil meiner neuen Tutorial Serie „Responsive Design mit Dreamweaver CC 2015 und Bootstrap“ online gestellt. Jetzt ist es soweit – die Teile 3 und 4 sind ebenfalls online. Da Adobe bei der Erstellung von responsive Websites auf das Framework Bootstrap umgestellt hat, hat sich bei der Erstellung einer responsive Site doch einiges – zum Glück zum Vorteil verändert. Die Tutorial Serie zeigt Schritt für Schritt, wie man dabei vorgeht. In den Teilen eins und zwei wurden die Grundlagen erklärt und das Basis Gridsystem in Dreamweaver erstellt. In den Teilen drei und vier geht es um die Inhalte, im speziellen um das Einfügen verschiedenster Elemente und das anschliessende Formatieren.

(mehr …)

Kategorien: Allgemein, Trainings, Tutorials und Web Design.

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.

(mehr …)

Kategorien: Trainings, Tutorials und Web Design.

CSS Quick Tipp: CSS Namen mit Sonderzeichen (Doppelpunkt)

Wenn man seinen HTML Code selber schreibt, dann kommt man normalerweise nicht auf die Idee Sonderzeichen in Klassen und ID Namen zu verwenden. Werden aber diese Namen automatisch, wie zum Beispiel beim Einsatz von Frameworks wie Primefaces erzeugt, dann kann es passieren, dass die Klassen oder ID Namen einen Doppelpunkt enthalten. Wenn man jetzt versucht für solche Elemente CSS Regeln zu erstellen, dann wird man schnell daran scheitern, wenn man versucht den Namen so zu verwenden.

In dieser kurzen Beschreibung möchte ich zeigen, wie man dennoch für solche Klassen und IDs CSS Regeln erstellen kann.

(mehr …)

Kategorien: Allgemein, CSS, Tutorials und Web Development.

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.

(mehr …)

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