CSS hat eine vergleichsweise einfache Syntax und erlaubt daher einen leichten Einstieg. Dennoch kann CSS in der Organisation schnell komplex werden. Das gilt besonders für größere Projekte mit mehreren involvierten Entwicklern, aber auch für kleine und mittlere Projekte in Eigenverantwortung. In diesem Beitrag fassen wir einige Tipps zusammen, die euch helfen sollen besseren CSS-Code zu schreiben.
Die Zusammenarbeit von Designern und Entwicklern gestaltet sich traditionell schwierig. Da bei der Erstellung von modernen Websites Design und Programmierung gemeinsam entwickelt werden, führen Kommunikationsprobleme zwischen Kreation und Development dazu, dass Projekte nicht wie gewünscht ablaufen können.
Der folgende Gastbeitrag stammt von UX-Designer Jonas Laufenberg. Er hat an der Rheinischen Fachhochschule Köln seine Bachelorarbeit zum Thema »Zusammenarbeit/Workflow von Designer und Programmierer« geschrieben und für seine Arbeit Interviews mit verschiedenen Designern und Programmierern geführt. Neben der schriftlichen Ausarbeitung der Bachelorarbeit hat er eine Microsite eingerichtet, in der er konkrete Handlungsempfehlungen aufführt.
Die Ergebnisse seiner Arbeit decken sich zu 100% mit meinen Erkenntnissen aus verschiedenen Projekten und werden so von mir auch in unseren Schulungen behandelt. Ich freue mich daher sehr, dass ich Jonas für diesen Gastbeitrag gewinnen konnte.
Mit verknüpften Smartobjekten hat Adobe im neuesten Update von Photoshop ein lange erwartetes Feature bereitgestellt. Mit verknüpften Smartobjekten können Layouts und Collagen modular verwaltet werden. Verschiedene Designer können nun gleichzeitig an verschiedenen Bereichen eines Projekts arbeiten und auch für den einzelnen Designer wird der Workflow enorm vereinfacht und beschleunigt.
Als Webdesigner hat man u. a. die Aufgabe die verschiedenen Elemente innerhalb eines Photoshop-Dokuments auszuwählen und im passenden Dateiformat zu exportieren. In jüngerer Vergangenheit wurde dieser Job zunehmend lästig, da der Workflow nicht mehr linear verläuft und neue Herausforderungen wie Retina-Optimierung & Co. den Aufwand erhöht haben. Mit den Bild-Assets in Photoshop CC (14.1) hat Adobe daher eine enorm hilfreiche Funktion für Web Designer integriert.
Das mobile Internet hat die Art und Weise wie wir Websites entwickeln grundlegend verändert. Vor einiger Zeit habe ich einen Artikel über den veränderten Workflow im Responsive Design veröffentlicht und erklärt, warum wir umdenken müssen, mit welchen Herausforderungen wir uns konfrontiert sehen und welche Lösungsansätze es gibt.
Doch nicht nur die Erstellung eines flexiblen Layouts ist wichtig. Auch die Performance-Optimierung, die Browserkompatibilität und die Informationsarchitektur sind entscheidend für den späteren Erfolg der Website.
In diesem Artikel möchte ich beschreiben, inwiefern sich die Sichtweise bei der Konzeption und Entwicklung von Websites verändert hat.
Die Entwicklung vom lokalen Desktop-Computer zum allgegenwärtigen „mobile Web“ zwingt uns dazu Webdesign-Projekte heute anders zu planen, zu gestalten und technisch umzusetzen als noch vor ein paar Jahren. Die schier unüberschaubare Anzahl an Displaygrößen, Geräten, Browsern und individuellen Einstellungen macht den bisherigen Workflow ineffizient, führt zu falschen Erwartungshaltungen bei Kunden und ist für langfristig angelegte Web-Projekte nicht mehr empfehlenswert. Die Anforderungen haben sich verändert und wir sollten darauf reagieren.
Designer müssen häufig eine große Anzahl an Dateien erstellen die sich zwar inhaltlich unterscheiden, vom verwendeten Raster oder der Gestaltung jedoch weitestgehend gleich bleiben sollen.
Als Beispiel sei hier eine Einladungskarte genannt, die über individuelle Namen und Anschriften verfügt. Alle Dateien einzeln in Photoshop zu erstellen ist ein zeitaufwändiger und langweiliger Arbeitsprozess den wir natürlich vermeiden wollen. Mit Microsoft Excel sowie der Möglichkeit in Photoshop Variablen zu verwenden lässt sich ein automatisierter Prozess starten der alle unliebsamen Aufgaben für uns erledigt.
Wie das im Handumdrehen funktioniert zeige ich Euch in diesem Screencast mit anschließender Checkliste zur Nachbereitung. Viel Spass mit Data Driven Images und einer weitestgehend unbekannten Funktion in Photoshop!
HTML5 Boilerplate ist ein extrem umfangreiche HTML5 Startpaket für die Arbeit mit HTML5-Websites. Allerdings müsst Ihr Boilerplate je nach Bedürfnis …
Beitrag zu Ende lesen