HTML, HTML5, xHTML
13.09.12
Internet Explorer: CSS Transparenz und Text
Der Internet Explorer von Version 6 bis Version 8 hat die unangenehme Angewohnheit transparenten Text auf eigentlich schon fast groteske Art darzustellen. Genau genommen betrifft das Problem nicht nur transparenten Text, sondern jeden Text, auf den das CSS filter-Attribut angewandt wird. Die erste Lösung, die einem in den Sinn kommt ist es den Text durch ein Bild zu ersetzen. Nun erhöht man damit den Wartungsaufwand, je nach Anwendungsfall, teils enorm. In manchen Szenarien ist dies gar nicht…
Tags: css, microsoft, tipp, Web, xhtml
05.08.12
Browserkompatibilität auf mobilen Geräten
Mit der Verbreitung von Smartphones und Tablets müssen natürlich auch Webseiten gegen die Browser dieser Systeme getestet werden. Bei Desktop-Browsern ist dies kein großes Problem: Wenn man mit einem Browser testen will, lädt man diesen herunter, installiert ihn und testet bzw. installiert eine virtuelle Maschine, installiert den Browser in einer virtuellen Maschine und testet damit. Bei mobilen Geräten ist dies nicht so einfach, denn nicht jeder Entwickler hat Zugang zu Geräten von allen…
Tags: apple, css, iPhone, tipp, Web
28.07.12
Public Domain Fotos und Icons
Ein Bild sagt mehr als tausend Worte, doch ist es nicht immer leicht gute Bilder zu finden. Man hat nicht immer die Möglichkeit bzw. die Ressourcen seine Bilder bei Foto-Plattformen zu kaufen oder gar einen Fotografen zu engagieren. Es finden sich jedoch im Internet viele Bilder, die unter verschiedenen Lizenzen der Allgemeinheit zugänglich gemacht werden. Besonders praktisch sind dabei Bilder, die in die Public Domain gestellt wurden (gemeinfrei sind). Diese können ohne Namensnennung oder a…
Tags: css, tipp, Web, xhtml
07.06.12
Favicon einbinden
Jeder kennt sie und fast jeder will sie: Favicons. Sie einzubinden ist dabei auch relativ einfach: man benötigt nur ein geeignetes Icon und muss 2 Zeilen in den head-Bereich der Website einfügen. Zunächst benötigt man das Bild, das man als Favicon verwenden möchte in Form eines Windows Icons (.ico) mit einer Auflösung von 16x16px oder 32x32px und einer Farbtiefe bis maximal 32bit.
Ein kostenloses Programm um Bilder in Favicons zu konvertieren bzw. generell Windows Icons zu erstellen u…
Tags: Web, xhtml
07.06.12
Website mit Touchicon ausstatten
Um einer Website ein Icon für den Homescreen von mobilen Geräten zu verpassen (iOS und Android) muss man folgendes tun: Man braucht zunächst ein Icon im PNG Format ohne Transparenz mit einer Mindestauflösung von 57 x 57px. Man hat jedoch auch die Möglichkeit verschiedene Größen für verschiedene Geräte zu hinterlegen: iPhone / iPod Touch: 57 x 57px.
iPhone / iPod Touch high res.: 114 x 114 px.
iPad: 72 x 72px.
iPad high res.: 144 x 144px. Nun muss man die Icons noch im head referenziere…
Tags: apple, iPhone, Web
07.04.12
Benutzerfreundliche HTML Tabellen – Ja, es geht.
Große Datenmengen sinnvoll darzustellen ist ein überraschend schwieriges Unterfangen. Meist wird man diese Daten in einer Tabelle auflisten, jedoch stößt man hier relativ bald an die Grenzen der Benutzbarkeit. Bei mehr als 500 Einträgen ist der Komfort nur mehr Bedingt gegeben. Natürlich kann man nun die Tabelle um ein Paging, eine Sortierfunktion und eine Suche erweitern, dies Kostet jedoch Zeit (und die ist bei den meisten Projekten rar) und wenn die Funktionen serverseitig implementi…
Tags: css, javascript, tipp, xhtml
04.04.12
Flash einbinden – Wenn, dann aber richtig
Immer wieder kommt es vor, dass man leider Flash-Dateien in eine Seite einbinden muss. Über die Jahre kamen und gingen verschiedene, mehr oder weniger standardkonforme, Varianten um Flash-Content einzubinden. Die vermutlich bekannteste Variante ist es einen embed-Tag in einem object-Tag zu verschachteln. Zwar funktioniert diese Variante mit den meisten Browsern hat jedoch mehrere Nachteile: Sie ist nicht standardkonform. Ein embed-Tag darf eigentlich nicht in einem object-Tag verschachtelt w…
Tags: flash, javascript, tipp, Web, xhtml
20.02.12
Mit CSS farbig unterstreichen – bunter geht’s immer
Oft wurde an mich der Wunsch herangetragen Text bunt durchzustreichen bzw. zu unterstreichen. Nach einiger Suche bin ich nun endlich auf eine Lösung gestoßen. Der Trick ist es, mehrere span-Tags (oder andere) verschachtelt einzusetzen. Weiterlesen →
Tags: css, tipp, Web, xhtml
09.02.12
Machen wir’s bunt: SVG und JavaScript
SVG ist an sich schon eine sehr schöne Sache. Der grundlegende Nutzen liegt klar auf der Hand – Beliebig skalierbare Grafiken. Aber man kann mit SVG noch weit mehr machen: Da das Format auf XML basiert, kann man SVG Bilder sehr einfach am Server on the fly, auch ohne Grafikbibliothek erzeugen. Oder, durch die Skalierbarkeit, kann man sie sehr einfach an die Displaygröße anpassen.
Richtig interessant wird es jedoch, wenn man SVG-Grafiken mit JavaScript kombiniert: Damit kann man angef…
Tags: javascript, svg, tipp, Web
27.11.11
Die Sache mit den Zeilenumbrüchen
Sehr häufig kommt es vor, dass man Text in gekürzter Form darstellen muss – z.B. User generated Contend in Ergebnislisten. Problematisch wird das ganze, sobald die Fläche für den Text fest definiert ist. Normalerweise schneidet man den Text bei einer festen Länge ab z.B. nach 500 Zeichen. Damit kann es aber vorkommen, dass der Text manchmal aufgrund der verwendeten Worte zu lang ist z.B. wenn viele “lange” Wörter verwendet werden. Ein Beispiel: Nun hat man einerseits die…
Tags: css, tipp, Web
Suche
Spannende Themen
Bleibe auf dem Laufenden