HTML5 (LF5)

gehört zum Lernfeld 5 (Eine Website gestalten, erfassen und bearbeiten)

Wettbewerb „Schule und Cloud“ startet am 1. März

Ein Cloud-Wettbewerb für Klassen an Berufsschulen soll in Deutschland starten. Es geht darum, in 40 Arbeitsstunden einen virtuellen PC bestmöglich einzurichten und im Schulalltag einzusetzen.

CHART.JS

CHART.JS

Hübsche Diagramme, leider offline Nick Downie hat mit Chart.js eine sehr kompakte Javascript-Bibliothek entwickelt, die hübsche Diagramme mit Hilfe des Canvas-Elements erstellt. Nur einen Tag, nachdem Downie Chart.js als Open Source veröffentlicht hatte, musste er sein Projekt wieder offline nehmen.   Am Montagmorgen kündigte Nick Downie Charts.js an, eine gepackt nur 4,5 KByte große Javascript-Bibliothek,…

[Weiterlesen]

Screenlayout berechnen Übungsaufgaben

Screenlayout berechnen   Konzeption und Gestaltung, Fachrichtung Gestaltung und Technik (Digital)   Ich vermute, dass es hier um die Aufteilung von Screens in bestimmten Verhältnissen geht.   28 Ein 960 Pixel breites Weblayout soll horizontal im Verhältnis 2 : 10 : 4 in Navigations-, Content- und Servicespalte aufgeteilt werden. Geben Sie bitte die Breiten der…

[Weiterlesen]

Video für Webseiten

Video für Webseiten

Speicherformate für Video im Internet Generell muss jedes Video für das Abspielen auf einer Webseite im Internet vorbereitet werden: Speicherformat, Codecs, Auflösung und Bitrate sind die vier Parameter für Video im Internet.   Die Frage nach dem besten Video-Format, dem besten Codec oder der optimalen Bitrate erübrigt sich im Internet: Hier wird das genommen, was…

[Weiterlesen]

Videos in Webseiten einbinden

Video für Webseiten Speicherformate für Video im Internet Generell muss jedes Video für das Abspielen auf einer Webseite im Internet vorbereitet werden: Speicherformat, Codecs, Auflösung und Bitrate sind die vier Parameter für Video im Internet. Die Frage nach dem besten Video-Format, dem besten Codec oder der optimalen Bitrate erübrigt sich im Internet: Hier wird das…

[Weiterlesen]

18 km hohe Website !

18 km hohe Website !

Wer zum Impressum der Seite will, der muss Zeit zum Scrollen haben oder den Fahrstuhl nehmen… Viel Spaß und Zeit: http://worlds-highest-website.com/de/

Android Emulatoren

Android Emulatoren

Hier kann man seine Websites auf Android-Emulatoren testen… https://www.manymo.com/emulators  

Studie zu „Bürgerreportern“

Studie zu „Bürgerreportern“

Gogol Medien veröffentlicht Studie zu Leserreportern Erkenntnisse aus 25 Projekten mit über 200.000 Bürgerreportern und Millionen von Beiträgen und Bildern Quelle: print.de: 26.04.2013 Michael Schüle Erstaunlich: Laut der Studie von Gogol Medien decken Leserreporter andere Themen ab als Lokaljournalisten Die Gogol Medien GmbH & Co. KG (Augsburg), Anbieterin des cloudbasierten Multichannel-Publishing-Systems Gogol Publishing Cloud, hat in…

[Weiterlesen]

Neue Typo3-Version verfügbar

Neue Typo3-Version verfügbar

Neue Typo3-Version verfügbar CMS 6.1 „Improve“ Quelle: print.de: 30.04.2013 Martina Reinhardt Typo3 hat eine neue Version seines Content-Management-Systems auf den Markt gebracht. Der Fokus soll dabei vor allem auf der Verbesserung und Politur der mit der vorausgegangenen Version 6.0 neu hinzugekommenen Funktionen liegen. Die aktuelle CMS-Version 6.1 ist ab sofort kostenfrei verfügbar. Die mit Typo3…

[Weiterlesen]

Die erste Website ist wieder online !!

Die erste Website ist wieder online !!

Die allererste Website die im WWW erreichbar war, ist wieder in seinem Originalzustand zu sehen unter: http://info.cern.ch/hypertext/WWW/TheProject.html Schon faszinierend wie schnell die Zeit vergeht und was sich in diesen 20 Jahren verändert hat. Hypertext war damals das Zauberwort…  

Nette NonPrint-Links

  http://www.mediaevent.de/ http://de.selfhtml.org/  http://www.bjoernsworld.de/css/grundlagen.html

Buchtipp: Multiscreen Design

Buchtipp: Multiscreen Design 28.06.2013, 13:14 Uhr geschrieben von Jürgen Siebert Wir Menschen sind rund um die Uhr von verschiedenen Bildschirmen umgeben. Wer heute eine Website oder digitale Medien gestaltet (E-Book, Zeitung, Zeitschrift, …), für den ist Multiscreen-Denken ein essenzieller Teil der Designstrategie. Ganzheitliche Konzepte für unterschiedliche Endgeräte zu entwickeln ist ein verzwicktes Feld mit vielen…

[Weiterlesen]

Social Media Monitoring

Social Media Monitoring

Meinungen im Social Web beeinflussen heute immer häufiger die Wahrnehmung von Unternehmen und deren Produkten. Studien zeigen, dass Nutzer sich in ihrem Kaufentscheidungsprozess oftmals an Produktbewertungen und Diskussionen orientieren und diesen Vertrauen schenken. Ob Unternehmen also aktiv Social Media Kanäle betreiben oder nicht, gesprochen wird so oder so über sie. Die Frage ist also lediglich,…

[Weiterlesen]

HTML könnte DRM-Erweiterung bekommen

HTML könnte DRM-Erweiterung bekommen

Von Georg Wieselsberger – 07.10.2013, 08:25 W3C berät Das World Wide Web Consortium (W3C) hat beschlossen, dass die HTML-Arbeitsgruppe an einer umstrittenen DRM-Erweiterung arbeiten soll. Das könnte umfangreiche Folgen haben. DRM könnte bald ein Teil des HTML-Standards werden. Die EFF warnt vor den möglichen Folgen. Laut der Electronic Frontier Foundation (EFF) ist die Encrypted Media…

[Weiterlesen]

Werbung im Internet

Werbung im Internet Marc-Michael Schoberer am September 1, 2013 Das Internet hat sich seit seiner Erfindung rasant entwickelt. Immerhin 76,5% der Deutschen und 2,4 Milliarden Menschen weltweit sind regelmäßig online. Was anfangs nur mit dem Computer möglich und wenigen vorbehalten war, ist zu einer richtigen Massenbewegung geworden. Klar das hier ein riesiges Potenzial schlummert –…

[Weiterlesen]

Webtypografie

Webtypografie

Quelle: http://vimeo.com Status Quo der Webtypografie from Gerrit van Aaken on Vimeo.

CSS Box Modell Hierarchie

CSS Box Modell Hierarchie

CSS Box Modell Hierarchie Das CSS-Box Modell besteht aus mehreren Eben. Zum besseren Verständnis ist es 3-Dimensional hier aufgebaut.   Schauen wir uns den Aufbau nun Schritt für Schritt an. Der HTML-Code – dort steht außer dem Inhalt, also dem Text, nicht viel: <p> Hier kommt der Inhalt des … </p> Im Browser angezeigt bekommen…

[Weiterlesen]

Prüfungsvorbereitung NonPrint

Da ich hier speziell für den Printbereich Beiträge sammele oder erstelle, möchte ich an dieser Stelle auf eine interessante Seite verweisen: http://tarcgn.de/mediengestalter/

Was ist Responsive Webdesign?

Was ist Responsive Webdesign? Responsive Webdesign beschreibt eine Technik des Webdesigns, die es ermöglicht, Internetseiten auf diversen Endgeräten anzuzeigen, ohne dass der Nutzer hierfür unterschiedliche Versionen aufrufen muss. Vielmehr erkennt die Website selbst, welche Version für das Gerät des Nutzers die richtige ist, und spielt jedem Besucher die für ihn optimale Ausgabe aus. So werden…

[Weiterlesen]

HTML 5 (Videos)

Webdesign-Grundlagen für mobile Websites

Webdesign-Grundlagen für mobile Websites

Praxis-Guide: Webdesign-Grundlagen für mobile Websites Aus dem t3n Magazin Nr. 28 06/2012 – 08/2012 Autor: Jonas Hellwig Online gestellt: 02.11.2012 Das Web ist mobil und Trends wie Responsive Webdesign sind in aller Munde. Doch es gibt auch andere mobile Ansätze und der Weg zur perfekten mobilen Website ist steinig. Wir zeigen, welche konzeptionellen und gestalterischen…

[Weiterlesen]

Intention.js im Überblick

Intention.js im Überblick

Das nächste Level im Responsive Design? Intention.js im Überblick Autor: Mario Janschitz Datum: 15.10.2013, 08:30 Uhr Responsive Design ist in aller Munde. Zurecht. Neben Media Queries, spannenden HTML-Konstrukten und diversen Scripts gibt es jetzt intention.js: HTML-Transformation für verschiedene Ausgabegeräte. In einfachen Worten und aus technischer Sicht kann gesagt werden, dass im Responsive Design Media-Queries genutzt…

[Weiterlesen]

CSS-Bibliotheken und Frameworks

CSS-Bibliotheken und Frameworks

7 CSS-Bibliotheken und Frameworks, von denen du gehört haben solltest CSS-Bibliotheken und Frameworks ersparen viel Zeit beim Entwickeln von Web-Projekten. Wir haben sieben Frameworks zusammen getragen, von denen man schon mal gehört haben sollte. CSS-Bibliotheken und Frameworks sind nützliche Wegbegleiter, wenn es darum geht neue Websites zu erstellen. Einige Bibliotheken beinhalten nur die wichtigsten Elemente,…

[Weiterlesen]

Screenlayout berechnen – Screendesign optimieren

Einen interessanten Artikel zum Thema Screenlayout findet ihr hier: http://www.pahl-4u.de

Weblayout berechnen

Weblayout berechnen Konzeption und Gestaltung, Fachrichtung Gestaltung und Technik (Digital) Hier dürfte es um die Aufteilung von Screens in bestimmten Verhältnissen gehen. 37  Ein 960 Pixel breites Weblayout soll horizontal im Verhältnis 2 : 10 : 4 in Navigations-, Content- und Servicespalte aufgeteilt werden. Geben Sie bitte die Breiten der drei Spalten sowohl in Pixel als auch in Prozent an….

[Weiterlesen]

Video im Internet • Videos in Webseiten einbinden

Video im Internet • Videos in Webseiten einbinden

Speicherformate für Video im Internet Video für Webseiten Generell muss jedes Video für das Abspielen auf einer Webseite im Internet vorbereitet werden: Speicherformat, Codecs, Auflösung und Bitrate sind die vier Parameter für Video im Internet. Die Frage nach dem besten Video-Format, dem besten Codec oder der optimalen Bitrate erübrigt sich im Internet: Hier wird das…

[Weiterlesen]

CSS-Boxmodell (Videos)

HTML & CSS (Videos)

Das Boxmodell: Die Navigation: Headerbild: Spaltenlayout: Inhalte:

Responsive Webdesign (Videos)

Mobile First, Content First – Responsive Webdesign – MyVideo

Was bedeutet Media Queries / Media Query?

Was bedeutet Media Queries / Media Query?

Bei einem Media Query handelt es sich um ein CSS-Technik, mit der innerhalb eines Stylesheets gerätespezifische Eigenschaften abgefragt werden können. Zu diesen Eigenschaften gehören beispielsweise die Größe des Viewports, die Abmessungen des Bildschirms, die Auflösung des Displays oder die Ausrichtung eines mobilen Endgeräts (Hoch- oder Querformat). Media Queries sind elementarer Bestandteil des sog. „Responsive Webdesign“;…

[Weiterlesen]

Das ist doch gar nicht „responsive“!

Das ist doch gar nicht „responsive“!

  Responsive, Adaptive, Fluid, Mobile First oder Elastic – wir alle haben davon gehört, aber was bedeuten diese Begriffe eigentlich genau? Ein Guide ohne eine einzige Zeile Code. Vor drei Jahren, genauer gesagt am 25. Mai 2010, hat Ethan Marcotte einen legendären Artikel auf „A List Apart“ veröffentlicht, der die Web-Entwicklung nachhaltig verändert hat. Fast…

[Weiterlesen]

Adaptive Website vs. Responsive Website

Ein kurzer Screencast, der euch an zwei Live-Beispielen den Unterschied zwischen den Website-Typen „Adaptive“ und „Responsive“ zeigt. Das Video ist Bestandteil des Artikels „Adaptive Website vs. Responsive Website“

Responsive Icons

Responsive Icons

Responsive Icons: The next big thing?   Responsive Icons beheben ein Art-Direction-Problem, über das du dir wahrscheinlich noch gar nicht im Klaren bist. Sind Responsive Icons wirklich das nächste große Ding oder eher unnötige Spielerei? Wir verraten dir unsere Einschätzung.   Icons sind das Mittel der Wahl, wenn es darum geht, eine Methode zur Visualisierung…

[Weiterlesen]

Drupal im Vergleich mit anderen Content-Management-Systemen

Drupal im Vergleich mit anderen Content-Management-Systemen

Das Content-Management-System Drupal gehört mit seinen über 24.000 Modulen und weit über 29.000 Entwicklern zu einem der größten Content-Management-Systeme (CMS) weltweit. Selbst Webauftritte wie bspw. die des Weißen Hauses basieren auf Drupal. Grund genug, sich das System Drupal einmal näher anzusehen und die Vor- und Nachteile gegenüber anderen großen CMS aufzuzeigen und ggf. im Anschluß…

[Weiterlesen]

Responsive Webdesign testen mit Duo

Responsive Webdesign testen mit Duo

Duo ist ein Browser, der dabei helfen soll, Responsive Webdesign zu testen. Dazu stellt er eine mobile Ansicht neben einer Desktop- oder Tablet-Ansicht dar.   Responsive Webdesign: Duo hilft beim Testen von Webseiten. (Bild: Apple App-Store) Responsive Webdesign: Duo hilft beim Testen von Webseiten. (Bild: Apple App-Store)   Respsonsive Webdesign: Duo soll die Arbeit vereinfachen…

[Weiterlesen]

Facebook rennen jugendliche Nutzer davon

Facebook rennen jugendliche Nutzer davon

Schwindend ist die Beliebtheit von Facebook bei Jugendlichen, wurde jetzt im Rahmen einer Studie ermittelt, die auch von der EU mitfinanziert wird. Ein simpler Grund für das Abwandern der 16 bis 18jährigen ist wohl der, dass zunehmend Erwachsene, also auch Eltern in sozialen Netzwerken unterwegs sind. Und spätestens wenn Mutter auf Facebook die Tochter um…

[Weiterlesen]

Abseits des Virtuellen – Wenn Hacker basteln

Abseits des Virtuellen – Wenn Hacker basteln

von Carolin Fromm, NDR.de Chaos herrscht an Tag drei des Chaos Communication Congress überall. Leere Flaschen und Dosen stehen zwischen roten, gelben und blauen Kabelbergen auf den Tischgruppen. Auf Bänken und Stühlen im Messezentrum CCH in Hamburg schlafen junge Männer. Am Morgen ist es ruhig, einige Teilnehmer sitzen an schwarzen Laptops und tippen Zahlen- und…

[Weiterlesen]

Wenn Farben im Internet nicht so aussehen wie sie sollten…

Wenn Farben im Internet nicht so aussehen wie sie sollten…

… liegt’s meistens am Farbmanagement   Drei Einflussgrössen, Monitor, Betriebssystem und Browser sind für die farbliche Darstellung verantwortlich. Untenstehende Farbkontroll-Grafik bietet die Möglichkeit einer schnellen Überprüfung der Farbfähigkeit von Monitor, Betriebssystem und Browser.   Wenn alles passt – zeigt der Gamma-Checker PC an – sehen beide Bilder identisch aus – erscheint eine einheitliche blaue Farbfläche,…

[Weiterlesen]

CSS-Regions vor dem Aus: Google und Opera stellen sich gegen die Adobe-Technik

CSS-Regions vor dem Aus: Google und Opera stellen sich gegen die Adobe-Technik

CSS-Regions vor dem Aus: Google und Opera stellen sich gegen die Adobe-Technik Google- und Opera-Entwickler sehen keine Zukunft für CSS-Regions in der Blink-Engine. Bei Google sieht man in der Unterstützung vor allem ein Performance-Hindernis. CSS-Regions basiert auf einem Vorschlag von Adobe und soll komplexe Layouts im Web ermöglichen. So lässt sich damit Fließtext über verschiedene…

[Weiterlesen]

Mobile Nutzerzahlen und Trends – Responsive Webdesign Artikel | Webdesign Forum

Um zu klären wie wichtig das Thema Responsive Webdesign überhaupt ist, sind zunächst konkrete Werte zur aktuellen Entwicklung der mobilen Nutzerzahlen wichtig. Denn je mehr Nutzer die eigene Webseite über das Smartphone oder Tablet besuchen, desto wichtiger ist auch eine angepasste Darstellung an das entsprechende Endgerät. Immer mehr Menschen nutzen Smartphones. Zu dieser Erkenntnis kommen…

[Weiterlesen]

Hover.css: 50 Hover-Effekte für deine Webseite

Hover.css: 50 Hover-Effekte für deine Webseite

Hover.css: 50 Hover-Effekte für deine Webseite Hover.css bietet dir eine Sammlung von Hover-Effekten, die du auf verschiedene Elemente deiner Website anwenden kannst. Heute stellen wir dir diese kleine, aber feine CSS-Bibliothek kurz vor.   Mit CSS3 stehen Webworkern viele Möglichkeiten zur Verfügung, um Websites noch spannender zu gestalten. Eines der interessantesten Features sind CSS-Transitions, die…

[Weiterlesen]

Flexbox im Praxiseinsatz

Flexbox im Praxiseinsatz

 

CeBIT Relaunch – Responsive. Flat. Fun.

CeBIT Relaunch – Responsive. Flat. Fun.

Die CeBIT erhält ein neues digitales Profil – und eine neue Website. Getreu dem Motto „Mobile First“ wurde die cebit.com im Responsive Design umgesetzt – sprich alle Inhalte sind unabhängig vom Endgerät von Desktop über Tablet bis Smartphone gleichermaßen abrufbar. Jedoch nicht nur das Design wurde überarbeitet; auch die gesamte inhaltliche Strategie wurde neu ausgerichtet….

[Weiterlesen]

blink-Tag: Google-Easteregg bringt den Usability-Fail der 90er zurück

blink-Tag: Google-Easteregg bringt den Usability-Fail der 90er zurück Ein Google-Easteregg bringt den vielleicht größten Usability-Fail der 90iger zurück. Das blink-Tag. Probiert es aus! Das blink-Tag sorgte für Aufmerksamkeit: Flackernde Texte überall Einige von euch werden es noch kennen: das blink-Tag. In den 90iger-Jahren mussten Webseiten vor allem aus der Masse herausstechen – der mit dem…

[Weiterlesen]

OpenType und CSS: Nützliche Snippets rund um font-feature-settings

OpenType und CSS: Nützliche Snippets rund um font-feature-settings   Mit dem relativ neuen CSS-Attribut font-feature-setting ist es möglich, die Möglichkeiten von OpenType-Schriftarten auszureizen. Ihr wollt Ligaturen, Brüche oder sogenannte „Swashes“ mit euren Schriften darstellen? Dann seid ihr hier genau richtig. OpenType und CSS: Nützliche Snippets rund um font-feature-settings Holt mehr aus euren OpenType-Schriften raus. (Quelle:…

[Weiterlesen]

CSS-Diner: Nerd-Spiel mit CSS-Selektoren für zwischendurch

CSS-Diner: Nerd-Spiel mit CSS-Selektoren für zwischendurch

CSS Diner ist ein kleines Spiel, bei dem ihr mit CSS-Selektoren verschiedene Elemente aus einer interaktiven Grafik auswählen müsst. In diesem Artikel zeigen wir euch, warum dieses Spiel nicht unbedingt für Anfänger geeignet ist.   CSS-Diner: Nerd-Spiel mit CSS-Selektoren für zwischendurch   CSS-Diner kürt dich zum Gott. (Grafik: CSS-Diner) „CSS Diner“ präsentiert sich in 26…

[Weiterlesen]

Zu wenige Freelancer können Android-Apps entwickeln

Zu wenige Freelancer können Android-Apps entwickeln

Firmen suchen immer mehr Android-App-Entwickler. Doch es gibt nicht genügend Freiberufler, die die Aufträge übernehmen können. Die Gesuche für Freelancer für iOS sind massiv zurückgegangen. Die IT-Projektbörse Gulp hat zu wenige Entwickler für Android-Apps. In 88 Prozent der Projektanfragen, in denen Mobile-App-Spezialisten gesucht werden, waren Android-Kenntnisse gefragt, wie das Unternehmen am 26. März 2014 bekanntgab….

[Weiterlesen]

Conversion-zentriertes Design

Conversion-zentriertes Design

Die 7 Prinzipien von Conversion-zentriertem Design Wie sollte eine Seite gestaltet werden, um die maximale Conversion-Rate zu erreichen? In einer ausführlichen Präsentation versuchen die Marketing-Experten Oli Gardner und Dan McGaw diese Frage zu beantworten. Oli Gardner von Unbounce und Dan McGaw von KISSmetrics haben sich mit der Frage beschäftigt, wie eine Seite gestaltet werden sollte,…

[Weiterlesen]

Responsive Webdesign Workflow

Responsive Webdesign Workflow

Responsive Webdesign verkaufen: So sieht der optimale Workflow aus Mit „Responsive Webdesign“ werden oft nur die technischen Komponenten in Verbindung gebracht – wie Breakpoints, Responsive Images und progressive Enhancement. Kein Wunder, dass RWD-Projekte zum Scheitern verurteilt sind. Denn Responsive Webdesign ist deutlich mehr. Es ist eine (im Grunde gar nicht so) neue Sicht auf den…

[Weiterlesen]

Grid – eine einfache Einführung in Responsive Webdesign

Grid – eine einfache Einführung in Responsive Webdesign

Grid – eine einfache Einführung in Responsive Webdesign Autor: Ilja ZaglovDatum: 24.05.2014, 13:42 Uhr Willst du schnell den Einstieg in Responsive Webdesign finden oder die Basics auffrischen? Mit diesem Tutorial ist beides kein Problem. Grid – eine einfache Einführung in Responsive WebdesignGrid LogoResponsive Webdesign ist keine Zauberei: Dennoch ist die richtige Herangehensweise an die Herausforderungen…

[Weiterlesen]

Zahlengliederung digital

Zahlengliederung digital

Zahlengliederung digital Immer wieder liest man, daß Zahlen im Printbereich zur besseren Lesbarkeit gegliedert werden sollten, während eine Gliederung »für elektronische Vorgänge nicht zulässig ist« – was natürlich völlig unsinnig ist. Schrift: New Paris KingSize Air   In beiden Bereichen dient die Gliederung dem besseren visuellen Erfassen der Zahlen. Während im Printbereich Zahlen nur gelesen werden,…

[Weiterlesen]

Warum Webfonts?

Webfonts sorgen für ein vielfältiges und angenehm lesbares Internet. Die Online- Schriften sind ausschließlich für den Einsatz im Internet angefertigt. Webdesigner sind endlich nicht mehr allein auf die wenigen Systemschriften angewiesen, die bei allen Website-Besuchern installiert sind. Webfonts werden so in den Code einer Website programmiert, dass HTML-Texte für alle Besucher die gleiche, individuelle Typografie aufweisen…

[Weiterlesen]

Webfarben (Videos (LF5))

Webfarben (LF5)

Webfarben (LF5)

auch als Hexcode: (ff,0,ff), entspricht Magenta…