HTML5 und CSS3: Neue Kurse ab September 2012

Logos der Auszeichnungssprache HTML5 und der Formatierungssprache CSS3
Die offiziellen Logos der Sprachen HTML5 und CSS3

Lernen Sie, wie man Webseiten erstellt von einem Praktiker und Fachbuchautor!

Die Sommerferien sind vorbei und die neue Weiterbildungssaison hat begonnen! Los geht es mit den Anfängerkursen. Hier liegt der Schwerpunkt auf HTML5. Sie erfahren, wie man HTML-Dokumente nach dem neusten Stand der Technik erstellt. Unterrichtet wird an modern ausgestatteten PCs (Windows7) in der Volkshochschule Bonn. Damit die Wege für alle Bonner auf jeden Fall kurz bleiben, finden zwei Anfängerkurse statt: einer in Godesberg und einer in Duisdorf.Der Fortgeschrittenenkurs findet im November statt. Dann liegt der Schwerpunkt auf der Formatierungssprache CSS3, mit der Webseiten gestaltet werden können. Im Anfängerkurs bekommen Sie schon eine ganz kurze Einführung in CSS3, im Fortgeschrittenen-Kurs lernen Sie auch anspruchsvollere Aufgaben Layouts umzusetzen.

Bringen Sie Ihre eigenen Ideen ruhig mit. Wenn irgend möglich werde ich Ihre Gestaltungswünsche und Ideen für Ihre persönliche Homepage berücksichtigen und Ihnen die Techniken zeigen, damit Sie Ihre Webseite so aussehen lassen können, wie Sie es sich vorstellen. “HTML5 und CSS3: Neue Kurse ab September 2012” weiterlesen

Amazons Kindle-Deal mit US-Außenministerium geplatzt | heise online

Amazon Kindle mit einem Textauszug aus Moby Dick
Foto: Wikipedia (Lizenz und Urheber)

Immer wieder werden Argumente für die Erstellung  barrierefreier Webseiten genannt, die nicht rein altruistisch sind. Amerika ist zwar nicht Deutschland, aber dennoch hier ein nettes Beispiel dafür, dass Unzugänglichkeit auch für Menschen ohne Behinderungen problematisch sein kann. Der Kindle verwehrt nicht nur Blinden den Zugriff auf seine Inhalte, auch der Hersteller Amazon bekommt so keinen Zugang zur (amerikanischen) Regierung. Ich finde: daran sollten wir uns ein Beispiel nehmen. “Amazons Kindle-Deal mit US-Außenministerium geplatzt | heise online” weiterlesen

Neues Projekt ukraine.mhis.de gestartet

Unter einer vorläufigen Domain habe ich das Projekt ukraine.mhis.de gestartet. Jeder der etwas dazu beitragen möchte, ist dazu herzlich eingeladen. Zunächst einmal gilt es Material zu sammeln. Dann bekommt die Seite auch eine hübsche Adresse.

Wer sich – aus welchem Grund auch immer – berufen fühlt, Informationen über die Ukraine bereit zu stellen – die von allgemeinem Interesse sind – ist dazu herzlich eingeladen.

Gerne bin ich auch bereit Artikel Korrektur zu lesen und beim Verfassen oder Übersetzen ins Deutsche behilflich zu sein. Vom Russischen, Ukrainischen oder Englischen. Allerdings behalte ich mir das Recht vor zu lektorieren oder Artikel abzulehnen.

Für eine noch freiere Meinungsäußerung, ist ein Forum geplant. Dort werden nur Beiträge entfernt, die rechtlich problematisch sind.

Ich freue mich über jeden Mitstreiter!

Web 2.0

Grobes schwarz-weiß-Bild
QR-Code Porträt von Marc Haunschild

Ein nicht mehr frischer Speicherfund (allerdings ist mit „Speicher“ nicht der Raum unterm Dach gemeint, sondern Bits und Bytes auf elektronischen Medien, die meist ebenso nutzlos sind und die auch niemand wirklich gerne aufräumen will – so bitte ich im Voraus um Verzeihung, wenn der eine oder andere Link nicht mehr funktioniert…):

Web 2.0

Oder die Verwandlung eines Informationsmediums zum Jahrmarkt der Eitelkeiten

Eine kritische Betrachtung des liebgewonnenen globalen Dorfes

Der Hype kommt nun doch. Langsamer als gedacht und mit 10 Jahren Verspätung haben sich aus einigen der ehemaligen Startups solide Schwergewichte in den internationalen Börsen entwickelt. In deren Schlepptau entstehen neue Dienste und Anwendungen. So bietet der Verkaufsgigant Amazon verteilte Datenserver zur weltweit schnellen Auslieferung großer Datenmengen an. Für Akamai ist dies sogar das Kerngeschäft – so entstand von der Öffentlichkeit weitgehend unbeachtet eine Firma, die über einen Datenpool verfügt, den Google sich kaum jemals zusammen sammeln kann.

Überhaupt Google und Yahoo! – lange Zeit schien es, als wüsste man gar nicht so recht, wie aus vielen der neuen Dienste Geld zu machen sei. Nach dem Platzen der New Economy Blase wurde aus unbegründetem Optimismus vielerorts unbegründeter Pessimismus.

Dabei hat es sich gezeigt, dass sich aus Suchergebnissen, die man mit unauffälliger Werbung unterfüttert, Milliarden generieren lassen – obwohl: die Bankenkrise zeigt uns ja gerade, dass sich Geld doch nicht generieren lässt, auch wenn es manchmal ganz danach aussehen mag. Jedenfalls: Der Online-Werbemarkt lebt – in Form von AdWords und Co ebenso wie in der Gestalt von Kleinanzeigen und einer modernen Form der Mund-zu-Mund-Propaganda: Bewertungen von Kunden für Kunden allerorten.

Im Web 2.0 kommt der Nutzer zu Wort. Leider ist der Nutzer nicht eine einzige Person, sondern der Nutzer ist der Mensch an sich – millionenfach, ja milliardenfach mischt er sich ein. Manchen die vom Segen des Web 2.0 reden und wie beispielsweise Vitaly Friedmann einen Qualitätssprung daran festmachen wollen, empfehle ich die Lektüre des heise-Forums. Vorzugsweise Freitag nachmittags und am Wochenende. Besonders empfehlenswert sind die Beiträge von Computerprofi, IT-Fachmann und Meisterprogrammierer.

Aber dennoch: Vitaly Friedmann ist eine bemerkenswerte Persönlichkeit und er hat das lesenswerte „Praxisbuch Web 2.0“ verfasst, das – wie sollte es auch anders sein – bei Amazon Deutschland zu kaufen ist. Und das Web braucht Menschen wie ihn, die mit Hoffnung und Optimismus an die Zukunft des Internet und seine Möglichkeiten glauben und die Perlen aus dem Internet heraussuchen, aus diesem Netz, das heutzutage mehr Müll als Schätze bereithält.

Aber das Web wächst und wächst und auch die Schätze werden mehr. Sie sind nur schwerer zu finden, weil sie in diesem riesigen Müllberg verborgen sind. Auf Youtube, Flickr und Co – wo jeder das Ergebnis seiner Selbst-Verwirklichung darstellen kann (früher musste man hierfür Töpferkurse besuchen und ausstellen oder unter dem Einfluss von bewusstseinsverändernden Drogen vor Publikum musizieren) – inzwischen kann jeder Grundschüler seinen Wulst (nach Liebermannscher Definition, das was einer will, im Gegensatz zu dem was einer kann) zur Verfügung stellen – was nicht heißt, dass die Beiträge von Gymnasialschülerinnen hochwertiger sein müssen. Wer es sich antun möchte, der mag hinter dem folgenden Link ein willkürlich ausgesuchtes, aber recht typisches Beispiel für deutsche Netzkultur nachvollziehen, wo sich R_Mayfair (IT-Fachfrau, mit unnützem Abitur auf der Suche nach einem besser bezahlten Job, in dem sie weniger arbeiten muss) über zwei Baptistinnen ihrer ehemaligen Schule auslässt. Dass man solche Beiträge zum frei verfügbaren Wissen der Menschheit auch noch kommentieren kann, macht die Sache nicht besser. Soviel zur Intelligenz der Massen,

Das hat uns das Mitmach-Internet wirklich gebracht. Dennoch nehmen auch die wertvollen Beiträge zu, sei es wissenschaftlicher Art (z. B. Im Rahmen der Open Access-Initiative) oder literarischer Art (z. B. Das Projekt Gutenberg).

Aber das ist nicht Web 2.0, sondern klassisches Web der ersten Stunde. Inhalte werden eingestellt und zum Download angeboten.

Web 2.0: das sind die Blogs und Chats und Foren und Video-Portale und Online-Games und all die anderen Jahrmarktbuden, an denen jeder unreflektiert seine durchdachten oder undurchdachten Meinungen in die weite Welt hinausschleudern darf.

Von Demokratisierung ist hier oft wohlwollend die Rede. Tja, das sind wohl größtenteils Wähler, die dort bloggen und simsen und twittern und voten und flickrn und chatten und videotuben und uns auf diese Weise an ihrer Einmaligkeit teilhaben lassen, auf dass jeder nachvollziehe: vor Gott mögen wir alle gleich sein, im Internet sind wir es deswegen noch lange nicht. Obwohl in Second Life sind wir dann doch zumindest meistens schlank und groß und ebenmäßig. Doch auch hier hört das Schwallen und Labern nicht auf, heute wird nicht nur 24 Stunden täglich empfangen, sondern ebensolang gesendet.

Das Web 2.0 ist eigentlich TV 2.0 – das Internet ist zum Mitmachfernsehn geworden, das uns die Intendanten der großen Sender seit dem ersten TED versprochen hatten. Im Web ist jeder Programmdirektor, Meinungsmacher, Werbefachmann, Computerprofi, Frauenarzt, Astronaut, Feuerwehrmann oder was er auch sonst schon immer hatte werden wollen und nun nicht mehr werden muss, weil er vorgeben kann, es bereits zu sein – wenn er will auch alles auf einmal – wer soll (und will) ihm denn das Gegenteil beweisen.

So kann man mit dem Netz der Netze Menschen fischen, wie dies Petrus tat. Nun ist man selbst der Köder: zauberisch schön und verführerisch blinkend, ganz wie man es möchte. Nur entpuppen sich viele Fische ebenfalls als aufgeblasene Köder und selbst in unseren modernen Zeiten behalten die alten Wahrheiten ihren Wert: es ist nicht alles Gold, was glänzt.

9 Beispiele für den Einsatz von CSS3 – XHTML / CSS

CSS3-BeispieleZwar nicht mehr ganz frisch, aber trotzdem eine nette Sammlung von CSS3-Beispielen. Das Gute an nicht mehr frischen Beispielen: inzwischen funktionieren sie in den meisten Browsern.
Wichtig trotzdem: selber testen, ob die zu unterstützenden Browser tun, was sie sollen!

9 Beispiele für den Einsatz von CSS3 – XHTML / CSS

Mit CSS3 sollte sich jeder Webdesigner ernsthaft auseinandersetzen, da die Möglichkeiten von CSS3 oft verblüffend sind….

9 Beispiele für den Einsatz von CSS3 | onlinecasinodemar.com

Übersicht Webseiten-Techniken

3D CSS Box Model Diagramm von Jon Hicks.
3D CSS Box Model Diagramm von Jon Hicks.

Eine sehr schöne und kompakte Übersicht über Techniken, die auf jeder Webseite zum Einsatz kommen, gibt es auf der Seite isobar.com

Eine ganze Reihe namhafter Autoren hat sich zusammengesetzt, um Herangehensweisen, vorbildliche Beispiele und sinnvolle Arbeitsweisen vorzustellen.

Die Autoren sind

 

 

 

 

Der Artikel ist in englischer Sprache abgefasst.

http://na.isobar.com/standards

Rezension: The CSS3 Anthology: Take Your Sites to New Heights

Das Buch ist leicht verständlich. Technisch sind mir keine größeren Fehler aufgefallen.

Allerdings gibt es doch viele Dinge, deretwegen ich das Buch nicht selber nutzen oder gar für den Unterricht verwenden würde. Dazu gehören Kleinigkeiten, wie die gedankenlose Bemerkung, dass inline-styles die einfachste Methode sind, Formatierungsanweisungen anzuwenden. Das klingt gerade für Anfänger verlockend und scheint daher das Mittel der Wahl. inline-styles gelten aber zu recht als schlechter Stil und sie führen (wie von der Autorin später selber dargelegt) die Vorteile von CSS ad absurdum. Die einzige sinnvolle Anwendung von CSS geschieht in einer zentralen Datei. Wie gesagt, das wird dann später noch dargelegt, aber ich kenne es aus eigener Erfahrung, dass ich, wenn ich mich in ein Thema einarbeite, gerne erst einmal die Methode ausprobiere, die als „am einfachsten“ bezeichnet wird. Das führt dann dazu, dass man die Methode die „am besten“ ist, später nochmal lernen muss. Unnötiger Aufwand und daher didaktisch unklug solche Sätze zu verwenden. Wie gesagt, das mag kleinlich erscheinen. Aber es zieht sich durch das Buch. So wird behauptet, dass feste Layouts auf einem Desktop-Computer mit großem Bildschirm gut zu nutzen sind. Gerade das von der Autorin verwendete Beispiel mit absoluten Positionen, in Pixeln angegebenen Breiten und relativen Schriftgrößen kann sehr schnell zu Problemen führen, da lange Worte nicht in die vorgegebenen Boxen passen werden, wenn ein Besucher die Schriften im Browser vergrößert. Die Verwendung des Seitenzooms wird zudem dazu führen, dass das Layout schnell aus dem Browserfenster wächst.
Schon die nächste Kapitelüberschrift „How do I create a design that works well on mobile devices“ unterstellt, dass ein herkömmliches (nicht responsives) Layout auf mobilen Geräten nicht funktioniert. Tatsächlich ist die Desktop-Version einer ordentlich gemachten Webseite aber mein persönlicher Favorit auf iPhone, iPad und Co. – Diese Geräte bieten mir auf ihren vergleichsweise kleinen Geräten einen schnellen Überblick über die gesamte Website. Ein „Doppeltipp“ auf eine Spalte vergrößert diese bildschirmfüllend und alle Elemente sind an den Stellen, an denen ich sie vom großen Computer her gewöhnt bin: Suche oben rechts, Navigation links usw. Der Überblick ist besonders hilfreich auf Webseiten, die sich nicht an solche Konventionen halten.
Herkömmlich gestaltete Seiten sind also durchaus auf mobilen Geräten nutzbar und ich bin nicht der einzige, der diese Darstellung bevorzugt. Deswegen sollte es auf Seiten, die sich auf kleinen Displays automatisch anders verhalten, wenigstens ein Link zur „normalen Version“ vorhanden sein. Aber so ein Link wird weder umgesetzt, noch wird auf diese ganze Diskussion überhaupt eingegangen.
Vielmehr wird der von der Autorin bevorzugte Weg hier und an anderer Stelle als beste oder gar einzige Methode dargestellt – was sicher gut gemeint war, kostet hier die Lernenden unter Umständen unnötig Zeit.
So wird responsives Design als die beste Methode genannt, um Bildschirme mit unterschiedlicher Breite zu berücksichtigen. Unterschiedliche Wünsche von Nutzern, wie oben beschrieben werden nicht behandelt.
Außerdem werden einige gerätespezifische Dinge hinzugefügt. Diese sind zwar sinnvoll, aber meiner Meinung nach nicht komplett. Ich vermisse hier Hinweise auf fertige Sets, wie die HTML5boilerplate.com – die Zeiten sind längst vorbei, in denen jeder Entwickler für sich einen Satz von Formaten schreiben musste, die der Harmonisierung von Browserunterschieden dienen. Auch hier wird wieder fahrlässig mit der Zeit der Käufer umgegangen.

Zudem wird mir nicht klar, für wen das Buch sein soll. Für Anfänger ist das Buch aufgrund der einseitigen Sichtweise nicht empfehlenswert. Für Fortgeschrittene sind Beispiele und Erläuterungen zu banal.

Fazit:
Die eigene, subjektive Meinung der Autorin, wird häufig als „die beste“ dargestellt. Gerade der Anfänger kann die Vorteile und Nachteile der aufgezeigten Lösungen nicht bewerten und erhält an vielen Stellen auch keine Entscheidungshilfe. Beispiele, wie man es nicht machen sollte (Breitenangaben in Pixeln, absolute Positionierung), führen den Leser in eine falsche Richtung. Formulierungen wie „am einfachsten ist…“ verführen dazu schlechtere Lösungen zu bevorzugen.
Außerdem bleibt das Buch oft hinter den Möglichkeiten der aktuellen Browser zurück. Was als Vorteil verkauft wird (funktioniert auch in alten Browsern), betrifft gerade Leute, die erst mit CSS3 beginnen kaum noch. Schon mit dem IE8 ist mehr möglich, als die Autorin zeigt (z. B. einfach umzusetzende Spalten-Layouts mit CSS-Tabellen).
Die Beispiele sind oft veraltet, statt aktueller HTML-Elemente werden divs benutzt, denen dann nicht einmal ein role-Attribut mitgegeben wird. Das ist richtig schlecht. Mit den semantisch korrekten Elementen (nav, article, aside usw) würden auch die für z. B. blinde Nutzer so wichtigen WAI-ARIA-Landmarks mitgeliefert – ohne im Detail erklären zu müssen, was die machen, ohne dass der Anfänger das überhaupt wissen muss (in ein HTML5-Buch würde das natürlich rein gehören).

Hinweis:
Diese Rezension beruht lediglich auf dem Überfliegen der auf Amazon.de bereitgestellten Vorschau. Es ist durchaus möglich, dass andere Kapitel sinnvollere Beispiele, bessere Erläuterungen oder aber auch noch mehr Ungenauigkeiten/Probleme/Fehler enthalten.

 

Wer sich selber ein Bild machen möchte, findet das Buch bei amazon beispielsweise.

Firefox in Version 11 mit 3D-Ansicht

FF kann in der jetzt aktuellen Version 11 die Elemente von Webseiten in einer 3D-Ansicht so visualisieren, dass auf einen Blick klar wird, wie diese Elemente ineinander verschachtelt sind.

Das soll Entwicklern die Analyse einer Seite einfacher machen. Etwas ähnliches in einer simpleren Darstellung bietet die Web Developer Toolbar unter „Information“ als topografische Information.

Einfach mal ausprobieren!

Wie man die Funktion aufruft, (Button im „Element untersuchen“-Bereich) zeigt das folgende Video von Vladimir Simovic.

Wie findet Ihr diese Funktion? Ist das eine echte Hilfe oder ein sinnloses Gimmick? Was bevorzugt ihr! Das neue FF-Feature oder die Web Developer- Topographie?