Webdesign

Abschlussprüfung Mediengestalter Sommer 2016, Alle Fachrichtungen: U5: Meta-Elemente

Veröffentlicht am von Thomas A. Reinert
TARThemes.com Metadaten

Definition „Meta-Elemente“ bzw. „Meta-Daten“ bzw. „Meta-Informationen“ Metadaten oder Metainformationen sind Daten, die Informationen über Merkmale anderer Daten enthalten, aber nicht diese Daten selbst. Quelle: Wikipedia Im Allgemeinen handelt es sich dabei primär um die („fälschlicherweise„) so genannten Meta-Tags, die im <head> einer Website notiert werden. Unter modernen Gesichtspunkten kann man dazu allerdings auch die Opengraph-Tags sowie…

Abschlussprüfung Mediengestalter Winter 2015/2016, Konzeption und Gestaltung: U5: Mobile Navigationselemente (Alle Fachrichtungen)

Veröffentlicht am von Thomas A. Reinert
By Maryana (WMF) (Own work) [CC BY-SA 3.0 (http://creativecommons.org/licenses/by-sa/3.0)], via Wikimedia Commons

Theme der Mediengestalter Abschlussprüfung – Mobile Navigationselemente. Was könprnte alles bei diesem extrem umfangreichen Thema drankommen? Welche „mobilen Navigationselemente“ gibt es? Wo liegen die jeweiligen Vor- und Nachteile? Wo liegen überhaupt die Unterschiede zwischen einer klassischen Desktop-Navigation und welche Anforderungen gibt es an eine mobile Navigation? Gibt es eine bestmögliche Lösung für beide Einsatzbereiche? Dies versucht…

Abschlussprüfung Mediengestalter Sommer 2015, Medienproduktion, Alle Fachrichtungen: U5: HTML5-Dokumentstruktur

Veröffentlicht am von Thomas A. Reinert
HTML5 Logo

Einen Beitrag zur letzten Abschlussprüfung, in der das Thema „HTML5“ lautete, gibt es bereits. Dort werden auf der zweiten Seite auch die semantisch strukturellen Tags zur HTML5-Dokumentstruktur  erwähnt und erklärt. Dieser weiterführende Artikel soll einen tieferen Einblick mit Anwendungsbeispielen und möglichen Aufgabenstellungen liefern.

AP Mediengestalter Sommer 2014 – Schwerpunkte veröffentlicht

Veröffentlicht am von Thomas A. Reinert

Der ZFA hat heute die Prüfungsschwerpunkte Mediengestalter für die Abschlussprüfung der Sommer 2014 veröffentlicht. Ein Beispiel für eine solche AP hat der ZFA vor einiger Zeit einmal unter folgendem Link veröffentlicht. Anbei wie immer eine Liste der Themen zu denen ihr hier in Kürze (voraussichtlich, so ich die Zeit finde) mehr finden werdet. Von hier aus…

Mockup / Prototype / Entwurf erstellen – MGDP Digital Praktische AP Winter 2013 / 2014

Veröffentlicht am von Thomas A. Reinert
Style Tiles für Photoshop

Aufgabenteil a.) der Abschlussprüfung Winter 2013/2014 für Mediengestalter Digital und Print, Fachrichtung Digital sieht die Entwicklung eines Entwurfs einer responsiven Website einschließlich Navigationskonzepts für die drei Viewports 480px, 768px und 1280px Breite vor.  Die Bewertung für die Gestaltung hat hierbei den Faktor 25, ist also entsprechend hoch angesetzt. In meinem persönlichen Workflow ist nicht vorgesehen,…

CSS Autoprefixing mit Sublime Text 2

Veröffentlicht am von Thomas A. Reinert
Sublime Text 2

Vor einigen Tagen habe ich schon mal einen Dienst vorgestellt, mit dessen Hilfe es möglich ist, alle nötigen CSS-Vendor Prefixes zu setzen. Ist zwar ganz hilfreich, nervt aber dennoch, dies jedes mal händisch vornehmen zu müssen. Da ich mich in letzter Zeit zunehmend mehr in Sublime Text 2 einarbeite (der mittlerweile Notepad++ bei mir komplett…

Meine Sublime Text 2 Plugin Favoriten – November 2013

Veröffentlicht am von Thomas A. Reinert
Sublime Text 2

Sublime Text entwickelt langsam sich zum Defacto Standard der Codeeditoren – und das aus gutem Grunde! Denn ST bringt nicht nur alle möglichen Funktionen bereits mit, sondern lässt sich auch mit Dutzenden weiterer Plugins erweitern. Anbei eine kleine Liste der meiner Meinung nach hilfreichsten, die ich selbst auch regelmäßig in Gebrauch habe. Solltet ihr Ergänzungen oder…

Bootsnipp.com – Hilfreiche Bootstrap Ressourcen

Veröffentlicht am von Thomas A. Reinert
Bootsnipp Design elements, playground and code snippets for Bootstrap HTML/CSS/JS framework

Eine weitere sehr hilfreiche Website im Bootstrap Universe ist Bootsnipp. Dabei ist Bootsnipp im Prinzip nichts anderes als eine „einfache Liste“ mit Bootstrap Beispielcodes. Neben zahlreichen Codeschnipseln für unterschiedliche Bootstrap-Versionen, unter anderem auch nach Tags sortiert,  bietet die Site außerdem einen interessanten Formular-Builder und einen Button-Generator.

Bootply – JSFiddle für Bootstrap Projekte

Veröffentlicht am von Thomas A. Reinert
Bootply.com

Die meisten Webdesigner werden früher oder später wohl bereits einmal über JSFiddle oder ähnliche Dienste gestolpert sein, mit denen sich HTML, CSS und Javascript Code online darstellen und bearbeiten lässt. Dies ist besonders dann hilfreich, wenn man eine Lösung für ein Problem sucht und in einem Forum, StackOverFlow oder ähnlichen Seiten andere Entwickler mit einbeziehen…

Rapid Bootstrap-Prototyping mit LayoutIt!

Veröffentlicht am von Thomas A. Reinert
LayoutIt! Bootstrap Rapid Prototyper

Als wenn es mithilfe von Bootstrap nicht ohnehin schnell genug möglich wäre, einen funktionalen Prototypen zu erstellen, der mit relativ wenig Aufwand nach der Präsentation beim Kunden auch schnell in eine finale Version übersetzt werden kann, gibt es nun auch einen Dienst namens LayoutIt!, mithilfe dessen das ganze auch noch direkt im Browser möglich wird.…