Sprung zum Inhalt [/] Tastaturkürzel / Accesskeys [0]
webdesign weisshart Startseite

Webdesign nach Maß von webdesign weisshart

Mein Blog

RSS Feed AbonnementRSS 2.0 Feed

zur Liste der Kategorien | zum Archiv

Suchformular - Browser setzen De-Facto-Standard

Donnerstag, 3. April 2014

Das Suchformular in Browsern hat keinen Submit-Button. Suchanfragen werden mit Enter abgeschickt.

Die Browserhersteller haben damit einen De-Facto-Standard gesetzt, dem ich mich gerne anschließe.

Mein Suchfeld sieht zukünftig so aus:
Das Suchfeld ohne Submit-Button
Im Einzelnen:

  1. Ein Lupensymbol sowie die Vorbelegung mit "Suchbegriff" o. ä. kennzeichnet das Feld als Suchfeld.
  2. Das Label wird unsichtbar gemacht durch Verschieben aus dem Viewport, d. h. für Screen Reader bleibt es weiterhin sichtbar.
  3. Es gibt keinen Submit-Button. Seit 10 Jahren oder länger senden Browser das Formular auch ohne Submit-Button ab, wenn Enter gedrückt wird.

Ich bitte um Kommentare zu

  1. Kann ich das Label ebenfalls weglassen? Sind Screen Reader Nutzer mit einer sinnvollen Vorbelegung des Suchfelds zufrieden?
  2. Gibt es möglicherweise doch noch einen Client, der ohne Submit-Button das Formular nicht abschicken kann?

Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Webworking: Full Service versus Spezialisierung

Montag, 18. November 2013

Als Einzelkämpfer ist das für mich keine Frage: Alles rund um den Webauftritt aus einer Hand. Aus meiner Hand eben.

Ich werde versuchen, kurz zu skizzieren, was ich mir darunter vorstelle:

  • Alleinstellungsmerkmal des Angebots herausarbeiten und klar definieren
  • Erstellung des Pflichtenhefts in enger Zusammenarbeit mit dem Kunden
  • Vorab-Festlegungen zur SEO: Domain-Name, Keywords u. s. w.
  • Design-Vorgaben bzw. -Vorlieben. Corporate Design vorhanden?

Darauf aufbauend entwickle ich direkt in HTML und CSS einen Design-Dummy. Also ohne Umweg über Photoshop o. Ä. Diese Vorgehensweise mag aufwändig erscheinen, führt aber im Ergebnis zu einfachen Dateistrukturen, und vermeidet „CSS-Klimmzüge“, die bei der Umsetzung einer Photoshop-Vorlage häufig nötig sind.

Texte so zu schreiben, dass sie den Webseitenbesucher ansprechen, und gleichzeitig SEO-Erfordernisse erfüllen, sollte in der Regel auch ohne Textprofis machbar sein.

Fotos und Videos in einer fürs Web passenden Qualität lassen sich in vielen Fällen auch mit relativ einfacher Ausrüstung erstellen, also auch „aus meiner Hand“. Nur bei sehr hohen Ansprüchen und speziellen Anforderungen muss man auf die Ausrüstung und das Know-how des Spezialisten zurück greifen.

Interaktive Bereiche, Formulare, vom Kunden zu editierende Bereiche u. s. w. werden fallweise in JavaScript und/oder PHP erstellt. Eigene Programmierung erlaubt es, exakt auf spezifische Kundenbedürfnisse einzugehen.

Die beschriebene Vorgehensweise halte ich für sinnvoll für kleine und mittelgroße Webauftritte, für meine typischen Kunden eben. Und für den Kunden bedeutet diese schlanke Arbeitsweise: Eine absolut individuelle Lösung zum bestmöglichen Preis.

Größere Webauftritte erfordern dann aber die Arbeit einer Agentur mit mehr man power. Die Arbeitsweise der beauftragten Agentur sollte dann aber „Smart-Interactive“ sein. Also wenn schon nicht aus einer Hand, dann wenigstens alles unter einem Dach; um Schnittstellenverluste möglichst zu minimieren.

Von einer strikten Arbeitsteilung - Design vom Grafiker - Texte vom Texter - HTML vom Front-End-Entwickler - Serverseitiges Scripting vom Back-End-Programmierer - SEO vom Suchmaschinenoptimierer - würde ich nach Möglichkeit absehen. Die erforderliche Koordination verschlingt einfach zu viele Ressourcen, die besser dem Projekt selbst zugute kommen sollten.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Internet Explorer 11

Freitag, 15. November 2013

Der Internet Explorer wird seit heute als wichtiges Update verteilt.
Wie kann ich dieses Update vermeiden?
Und warum will ich das Update vermeiden?
Ganz einfach: Ich verwende den IE ausschließlich zu Testzwecken. Und zu Testzwecken brauche ich – auch – einen IE 8. Weil dieser Dinosaurier immer noch auf ca. 30 % aller Windows Systeme läuft. Und dieser Prozentsatz wird vermutlich nicht so schnell weniger. Weil unter Win XP keine neuere Version des IE möglich ist.

Wie also das Update verhindern?
Von Microsoft selbst gibt es dazu ein Tool: Das IE 11 Blocker Toolkit.
Ich werde aber vermutlich darauf vertrauen, dass ich beim monatlichen Microsoft-Patchday immer daran denke, den IE-Update manuell zu deaktivieren. Ein Zurück gibt es ja bekanntlich nicht.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Animierte GIFs

Mittwoch, 20. März 2013

Ja, ich weiß, das Gezappel ist penetrant, unausstehlich, nervig, geisttötend, und was weiß ich was noch. Animated GIFs. Bäh!
Und dennoch: Kinder jeden Alters können nicht genug davon haben. Vor allem im Chat. (Ich weiß, wovon ich rede: Mein Chat)
Ich kenne Menschen, die diese Dinger sammeln. Aber inzwischen geht es viel bequemer: Die Google Bildersuche bietet neuerdings eine Option zur gezielten Suche von animierten Bildern:

Screenshot
Google > Bilder > Suchoptionen > Alle Typen > Animiert

Zigtausende von zappelnden Bildern warten nur darauf, im Chat eingesetzt zu werden. GRRRRR


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Internet Explorer

Samstag, 5. Januar 2013

Meldungen über Sicherheitsprobleme, die es schon immer mit dem Internet Explorer gab, tauchen in letzter Zeit gehäuft auf. Betroffen sind der IE 8 und ältere Versionen.
Obwohl IE 8 und älter in der Statistik meiner Seitenbesucher nur noch eine untergeordnete Rolle spielen - IE 8: 4%, ältere Versionen vernachlässigbar - habe ich speziell für Benutzer dieser »Oldies« eine Warnung in meine Seiten eingebaut. Mit der Empfehlung, einen modernen Browser zu installieren, und gleich auch noch den Link zu einer Auswahlseite.

Screenshot Warnhinweis
Der Warnhinweis für den IE 8
Lieber Besucher,
Sie verwenden einen unsicheren Browser. Den Internet Explorer Version 8.
Fast täglich gibt es neue Meldungen über Sicherheitsprobleme beim Surfen mit diesem Browser.
Tun Sie sich selbst einen Gefallen, und installieren Sie einen der vielen kostenlosen
modernen Browser.

Etwas drastischer ist der Hinweis für Besucher mit IE 7 und älter:

Screenshot Warnhinweis
Der Warnhinweis für den IE 7
Lieber Besucher,
Sie verwenden einen total veralteten, unsicheren Browser. Den Internet Explorer Version 7 (oder noch älter!).
Fast täglich gibt es neue Meldungen über Sicherheitsprobleme beim Surfen mit diesem Browser.
Nicht alle Details auf diesen Seiten werden mit diesem Browser funktionieren.
Tun Sie sich selbst einen Gefallen, und installieren Sie einen der vielen kostenlosen
modernen Browser.

Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Hyphenation - Silbentrennung

Montag, 19. November 2012

Seit CSS 3 gibt es Hyphenation, die automatische Silbentrennung. Unterstützt wird das von Firefox seit Version 6.0, vom Safari auf OS X und iOS, und vom IE 10.

Die Syntax:
body{ -webkit-hyphens:auto; -moz-hyphens:auto; -ms-hyphens:auto; hyphens:auto;}

Meines Wissens funktioniert das in allen o.a. Browsern bisher nur mit dem Vendor-Prefix.

Fließtest sieht damit auf jeden Fall besser aus, selbst wenn noch die eine oder andere »merkwürdige« Trennung passiert. Überschriften mit Silbentrennung gefallen mir jedoch gar nicht. Deshalb schließe ich automatische Silbentrennung für Überschriften aus, durch

h1, h2, h3, h4{-webkit-hyphens:manual; -moz-hyphens:manual; -ms-hyphens:manual; hyphens:manual;}

Fallweise ist damit immer noch die manuelle bedingte Trennung durch ­ möglich.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Meine sozialen Knöpfe - oder: ich respektiere die Privatsphäre meiner Besucher

Samstag, 16. Juni 2012

Irgendwie gehören sie auf jede Webseite, unter jeden Artikel. Die Like-, Plus- und Sonstwas-Social-Media-Buttons. Obwohl inzwischen jeder weiß, dass Facebook & Co. mit Hilfe dieser Buttons das Besucherverhalten ausspionieren und archivieren, und die Verwendung in Deutschland rechtlich zumindest bedenklich ist. Hinzu kommt, dass diese Buttons auch noch die Ladezeit der Seite erheblich ausbremsen.

Seit längerem gibt es auf meiner Site daher nur statische Buttons. Diese Buttons sind mit einem statischen Link hinterlegt, der erst beim Anklicken eine Verbindung zu Facebook & Co. aufbaut.

Das Ergebnis:

  • Der Besucher wird nicht ungefragt bereits durch Betreten der Seite ausspioniert, sondern er entscheidet selbst, ob er mit dem jeweiligen externen Dienst verbunden werden will, um die Seite bei einem Social Media Dienst zu kommentieren.
  • Keine merkliche Verzögerung beim Laden der Seite.
  • Einziger »Nachteil«: Die erfolgten »Likes« und »Pluses« werden nicht angezeigt. Worauf ich gerne verzichte.

Die Anregung erhielt ich durch einen Artikel auf perun.net. Dort gibt es auch eine ausführliche Beschreibung, wie man statische Buttons in Wordpress einbauen kann.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Google Webmaster-Tools - Website-Leistung wird eingestellt.

Samstag, 12. Mai 2012

Seit Jahren gibt es bei den Google Webmaster-Tools einen Bereich Google-Labs. Wie der Name vermuten lässt, ein Bereich mit experimentellen Inhalten. Darunter auch die sogenannte “Website-Leistung". Eine Grafik, die die Ladezeit von Seiten anzeigen soll. Die Grafik war für mich immer wieder eine Quelle der Erheiterung. Ohne jegliche strukturelle Änderung auf meiner Site änderte sich die Ladezeit mit schöner Regelmäßigkeit angeblich zwischen o,8 und 3,5 Sekunden. Die Zeitspanne zwischen zwei Maxima bzw. zwei Minima lag dabei recht konstant bei 3 Wochen. Ob Google dazu wirklich die Ladezeit meiner Site gemessen hat?
Nicht schade darum, wenn der Dienst demnächst laut Ankündigung eingestellt wird. Ob Google damit wohl auch von seinem Vorhaben Abstand nimmt, die Ladezeit für das Ranking heranzuziehen? Wäre aus meiner Sicht irgendwie schade. Ich mag einfach keine Seiten, die ohne Rücksicht auf Dateigröße zusammengeschustert werden. 1 MB sind inzwischen nicht mehr die Ausnahme, sondern eher die Untergrenze für die Startseite der meisten Portale. Warum zum Kuckuck begnüge ich mich immer noch mit weniger als 100 kB?

Hier zur Erinnerung der wohl letzte Zustand meiner Site aus Sicht von Googles Wesite-Leistung:

Im Durchschnitt benötigen Seiten auf Ihrer Website 1,5 Sekunden zum Laden (aktualisiert am 02.05.2012). Dies ist schneller als 79 % der Websites. Diese Schätzungen sind von geringer Genauigkeit (weniger als 100 Datenpunkte). Das folgende Diagramm zeigt an, wie sich die durchschnittliche Ladezeit Ihrer Website in den letzten Monaten verändert hat. Zu Ihrer Information wird auch der 20%-Quantil aller Websites angezeigt, wobei die langsamen und schnellen Ladezeiten voneinander getrennt dargestellt werden.

Screenshot
Die Grafik zeigt auf einer Zeitachse von Dezember bis Ende April einen gezackten Kurvenverlauf, der im Zeitraum von jeweils 3 Wochen zwischen einem Maximum von 2 bis 3.5, und einem Minimum von etwa 0,8 oszilliert.

Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

SMS ist auch in Zeiten von Twitter & Co. noch gut für interessante Sachen

Donnerstag, 26. April 2012

Mein Service sms2web war ursprünglich dazu gedacht, z. B. von Sportveranstaltungen per Handy einen Ticker zu füttern. Den TuS Koblenz hat mein Ticker 2006 beim Aufstieg in die 2. Bundesliga begleitet.

Nun gibt es wieder neue, spannende Anwendungen für sms2web:

Zum Beispiel www.fisch-vom-kutter.de:

Das dynamische Informationssystem “Fisch vom Kutter”

Vor Antritt einer Fangreise kann kein Fischer vorhersagen, wie erfolgreich er heimkehren wird. Wie viel Dorsch, Butt, Hering oder Lachs sich im Netz verfängt, lässt sich erst nach dem Hol sagen. Kunden kommen oft extra aus der Stadt zum Hafen gefahren, um frischen Fisch vom Kutter zu kaufen. Sie sind verwöhnt von der ständigen Verfügbarkeit der Waren in Supermärkten. Deshalb sind sie nicht selten enttäuscht, wenn der angebotene Fang nicht reicht oder die gewünschte Fischart nicht gefangen wurde.

Mittels sms2web »simseln« nun die Fischer rechtzeitig vor dem Anlanden ihren Fang direkt auf die Website. Kunden können sich dort vorab informieren, was sie im jeweiligen Hafen zu erwarten haben.

Auch eine Art von CMS.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Ein QR Code für jede Webseite

Dienstag, 20. März 2012

QR Code von http://webdesign.weisshart.de

Was ist das?

Einfach das unten stehende Codesnippet in den Quelltext einer beliebige Seite einfügen, und schon wird der QR Code mit der Seitenadresse erzeugt. Smartphone-Nutzer können so die Adresse ohne Tippen erfassen. Für das iPhone gibt es zum Beispiel semacode

<img src="http://lilqr.com/qr” />

Danke http://lilqr.com/

Nachtrag 23.05.2012

Wie mit externen Diensten so üblich: Sie sind irgendwann kaputt. Also eine nette Spielerei, aber nicht produktiv nutzbar. So auch lilqr.com.
Ab sofort wird daher die Erreichbarkeit von lilqr.com vorab abgefragt, und wenn der Service nicht erreichbar ist, wird kein hässlicher Platzhalter im Footer der Seiten angezeigt.

Nachtrag 16.10.2012

Wie mit externen Diensten so üblich: Sie sind irgendwann kaputt. Bei lilqr.com ist es so weit.
Ich habe daher ein Script zur Erzeugung des QR-Codes selbst gehostet.

Nachtrag 08.01.2013

Auch terragon ist nicht mehr erreichbar. Hier die Autorenseite.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

CSS für Smartphones - Vorschau

Sonntag, 5. Februar 2012

Screenshot des Layouts für handhelds
Seit langem biete ich für Smartphones ein angepasstes CSS. Eine Vorschaufunktion für dieses spezielle Layout habe ich jetzt in meinem Styleswitcher eingebaut. Unter dem Namen »Mobil«


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

CSS Hacks für diverse IE-Versionen

Samstag, 19. März 2011

Seit vielen Jahren hat sich die Erkenntnis durchgesetzt, dass grafische Effekte auf Webseiten besser mit CSS als mit Grafiken dargestellt werden können. Stichworte: Barrierefreiheit und Ladezeit/Traffic.
Als Beispiel möge dieser plastisch wirkende Submit-Button dienen, den ich gerne verwende:
Screenshot


Das CSS für diesen Button umfasst nur wenige Zeilen:

#button {
-moz-border-radius:2em;
-webkit-border-radius:2em;
border-radius:2em;
background: #999;
background: -webkit-gradient(linear, left top, left bottom, from(#ccc), to(#444));
background: -moz-linear-gradient(top, #ccc, #444);
background: -o-linear-gradient(top, #ccc, #444); /* Opera ab V. 11.10 */
}

Damit werden alle großen Browser bedient, mit Ausnahme (wie auch anders!?) des Internet-Explorer.
Der IE 6 kann weder border-radius, noch gradient. Aber der IE 6 ist ja ohnehin kein Thema mehr.
IE 7 und 8 können kein border-radius, aber mit einem Hack via filter bzw. -ms-filter wenigstens einen Verlauf darstellen.
Zu sehen ist das mit detaillierten Beschreibungen bei maddesigns.
Nun kommt der mit vielen Vorschusslorbeeren bedachte IE 9, und der macht die von maddesigns beschriebene Lösung kaputt. Der Verlauf läuft über den Radius hinaus und füllt ein Rechteck.
Screenshot


maddesigns hat flugs auch hierfür eine Lösung parat. Ich sag’ mal höflich danke dafür.
Aber ich werde diesen Unfug nicht mehr mitmachen. Vendor-Prefixe (-moz-border-radius anstelle von border-radius) sind nicht schön. Aber was ist eine Zeile zusätzlicher CSS-Code für eine Browser-Engine gegen die CSS-Hack-Ungetüme, die jede neue IE-Version erfordert.
Mein Fazit: Der IE in allen Versionen wird so behandelt, wie er es verdient: Wenn er eine CSS-Deklaration nicht versteht, kriegt er das Fallback. Im vorliegenden Fall eben einen einfarbigen Background ohne Verlauf mit background: #999;
Screenshot IE


Und ich werde zukünftig keinerlei IE-spezifische CSS-Hacks verwenden. Ich habe schlicht keine Lust mehr, mich über jede neue IE Version zu ärgern, und x CSS Dateien nacharbeiten.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Content-Klau aka Plagiat

Samstag, 19. Februar 2011

Nicht nur Dissertationen werden mit geklautem Inhalt erstellt. Auch meine Kollegen sind nicht davor gefeit, ganze Absätze zu kopieren. Soll ich mich jetzt darüber freuen, dass ich anscheinend eine griffige Formulierung gefunden habe:
Screenshot Startseite FERRATO Webdesign mit Plagiat
Der Buchstabe für Buchstabe geklaute Text:

Ihr Internet Auftritt muß zu Ihrem Geschäft / Betrieb passen. Deshalb mache ich kein Webdesign von der Stange, sondern gestalte jeden Auftritt individuell, passend zu Ihrem Betrieb oder Geschäft - eben nach Maß.

Nachtrag 19.04.2011:

Herr Ferrato hat mich informiert, dass er seine Website inzwischen gelöscht hat. Und dass Webdesign ja nur sein Hobby sei.

Nachtrag 08.05.2011:

Herr Ferrato hat es sich inzwischen anscheinend anders überlegt. Seine Website ist wieder online. Den von mir ursprünglich kopierten Text hat er umgeschrieben. Andere, in diversen Kommentaren aufgezeigte Plagiate zu entfernen oder wenigstens zu ändern, war ihm wohl zu viel Arbeit. Webdesign ist ja nach eigener Aussage nur sein Hobby.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

CMS - Kunde möchte seine Seiten selbst pflegen

Dienstag, 1. Februar 2011

Fast alle Anfragen, vor allem aber die “Rundschreiben", beinhalten den Wunsch: “Wir wollen die Website natürlich selbst pflegen …". Klar. Ist ja heutzutage kein Problem mehr. Wofür wurden schließlich Content Management Systeme (CMS) erfunden?
Die Realität sieht dann meist so aus (zwei Monate später):
Kunde: “Wie ging das gleich, mit dem Ändern von Text xy auf der Seite yz?”
Ich: “Bitte lesen Sie noch einmal …”
Kunde: “Ach, das ist so lange her, und es ist ja auch nur eine Kleinigkeit. Könnten Sie nicht ausnahmsweise schnell mal …”

Das soll kein Plädoyer gegen CMS sein. CMS machen sicher Sinn, wenn ein Redaktionsteam zur Pflege des Webauftritts bereitsteht, und die Redakteure entsprechend geschult wurden.

Aber der Webauftritt des Handwerksmeisters Müller braucht sicher kein CMS. Für Meister Müller macht es sicherlich mehr Sinn, einen kleinen Aktuell-Bereich vorzusehen, den er mit einfachen Mitteln selbst pflegen kann. Ein Beispiel: Der Kasten “Aktuelles” unter der Navigation von www.zimmer-chiemsee.de
Die Pflege ist realisiert mit CKEditor (früher FCKEditor). Im Editor werden die Möglichkeiten des Kunden auf das wirklich Notwendige - oder besser: auf das Sinnvolle - beschränkt. Damit kann, nach gutem Zureden und einiger Übung, auch Meister Müller umgehen.

Einen gänzlich anderen, und recht erfolgreichen Ansatz, verfolge ich mit deine-erste-homepage.com.
Der Gedanke dahinter: Mit dem gleichen Aufwand, der erforderlich ist, um ein CMS als Redakteur ordentlich zu füttern, kann man auch grundlegendes HTML lernen. deine-erste-homepage.com ist entstanden aus der Zusammenarbeit mit einer taubblinden Frau, die HTML lernen wollte. Und inzwischen gibt es auf Basis dieses Tutorials einige Sites im Web:

Alle diese Seiten werden inhaltlich von blinden bzw. taubblinden Menschen betreut, die sich nicht zu schade waren, HTML zu lernen.
Das Design, das CSS, wurde von mir erstellt. Dazu fallweise noch ein PHP-Gerüst. Das heißt, der XHTML-Vorspann und ähnliche, auf allen Seiten wiederkehrende “HTML-Sachen” werden per php include eingebunden. Dann noch ein wenig JavaScript progressive enhancement, und fertig ist das barrierefreie CMS für kleine Webauftritte.
Dass blinde Webmaster hin und wieder sehende Hilfe in Anspruch nehmen (müssen), z. B. bei der Auswahl und fallweise erforderlichen Bearbeitung von Fotos, sollte kein Problem sein.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

JavaScript und der Platzmangel auf kleinen Smartphone-Displays

Montag, 4. Oktober 2010

Mit dem iPhone kann man sehr gut im Web surfen. (Welch banale Aussage!) Was liegt also näher, als meine eigene Site auch ein wenig ans iPhone (und natürlich andere Smartphones) anzupassen. Mit CSS und einer Abfrage des User Agent ist das ja schließlich kein Problem. Bleibt das Problem der Bildschirmgröße. Im Falle von webdesign.weisshart.de ist auf jeder Seite erst einmal nur das relativ umfangreiche Navigationsmenü zu sehen, und erst Scrollen (oder Antippen des Skiplinks) zeigt den Inhalt der Seite. Nicht sehr elegant.
Screenshot mit Menü

Aber Abhilfe ist nicht fern.
Vor einem Jahr habe ich eine Technik vorgestellt, Bereiche auf Webseiten per JavaScript ein- und auszublenden. Nichts spricht dagegen, zu dieser Technik zu greifen; auch und vor allem, weil das Script die Technik der “Graceful Degradation” einsetzt. Falls JavaScript nicht verfügbar ist, werden die ausgeblendeten Bereiche immer angezeigt. Es geht also keine Information verloren. Im Falle einer Seitennavigation ist dies natürlich absolut unverzichtbar.
Die Technik funktioniert ohne jegliche Anpassung sofort auf einem Touchscreen. Eine Lösung mit CSS-hover könnte dies nicht ohne weiteres. Auf Touchscreens gibt es keine Maus, und ohne Maus gibt es kein hover.
Screenshot mit zugeklapptem Menü

Das sieht doch gleich viel aufgeräumter aus.

Keine Überraschung war, dass VoiceOver (der Screen Reader des iPhone) mit der Technik anstandslos klar kommt. Ebenso wie auch Screen Reader unter Windows.

Soundbeispiel 1: VoiceOver liest die Startseite mit “zugeklappter Navigation", also im default-Zustand nach Aufruf der Seite. Bitte das “Plus” bei ca. 0:10 Min. beachten.

Die Startseite mit noch eingeklappter Navigation


Audio Download des Hörbeispiels (mp3 - 237 kB)

Nun wird das Pluszeichen angetippt. VoiceOver liest weiter, und “sieht” jetzt auch das Navigationsmenü. (Das Minus zu Beginn der Aufnahme würde beim Antippen das Navigationsmenü natürlich wieder schließen.)

Die Startseite mit noch eingeklappter Navigation


Audio Download des Hörbeispiels (mp3 - 171 kB)

Schön, wenn barrierefreie Seiten ohne großen Aufwand auch auf Geräten funktionieren, die es zur Zeit der Entstehung der Site noch gar nicht gab.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Eine CSS3 Spielerei

Dienstag, 14. September 2010

Ich hab’ mal mit dem Schriftstil der Überschriften experimentiert. Wer einen Browser benutzt, sieht das Ergebnis.
Für Benutzer des IE: So sollte es aussehen

So sah es aus:
Screenshot

Das CSS dazu:

h1, h2 {
-webkit-text-stroke: 1px #242;
letter-spacing: 4px;
color: #c7c7a8 !important;
text-shadow:
3px 3px 0 #242,
-1px -1px 0 #242,
1px -1px 0 #242,
-1px 1px 0 #242,
1px 1px 0 #242;
}

h1, h2 {
color: #454\9 !important;
letter-spacing: 1px\9;
}

Danke an css-tricks.com dafür.
Ach ja: Was bedeutet eigentlich die letzte CSS-Deklaration? Insbesondere das \9?
Da der IE das CSS3 nicht versteht, würde er die Überschriften in der Farbe #c7c7a8 darstellen; also viel zu blass, um lesbar zu sein. Mit color: #454\9 wird die Farbe für den IE auf #454 eingestellt.
Das “\9″ ist ein CSS-Hack für alle IE einschließlich IE 8. Danke an David Bloom dafür.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

(M)ein barrierefreier Webchat - eine spezielle Konfiguration für hörsehbehinderte Menschen

Donnerstag, 9. September 2010

Mein Chat ist speziell auf Barrierefreiheit optimiert (obwohl 95% der Benutzer davon wohl nichts bemerken).
Die Konfigurationsmöglichkeiten sind fast unendlich. Und für manch einen wohl fast zu viel. Ich habe daher mal eine beispielhafte Konfiguration für hörsehbehinderte Menschen online gestellt.
Viele hörsehbehinderte Menschen nutzen ihre Hör- und Sehreste so weit es irgendwie geht. Einmal durch maximale Vergrößerung der Bildschirmanzeige (z. B. mittels Strg und Plus-Taste), zum anderen durch parallel laufende Sprachausgabe mittels eines Screen Readers. Für diesen “multimedialen” Ansatz ist die Konfiguration optimiert. Dennoch können auch nichtbehinderte Menschen den Chat “normal” nutzen, etwa durch Umschalten auf einen der vielen mitgelieferten Skins.
Die Konfigurationsdatei ist im Download-Paket enthalten. Einfach die Datei tbl_config_inc.php umbenennen in personal_config_inc.php.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

CSS für iPhone 4 (und iPad?)

Montag, 14. Juni 2010

Seit langem statte ich meine Seiten mit einem fürs mobile Surfen optimierten CSS aus. Weil mobil Surfen, so ist jedenfalls mein Eindruck, erst wirklich Spaß macht, seit es das iPhone gibt, habe ich mir auch angewöhnt, die Anzeige gleich auf die verfügbare Breite des Geräts (in der Hochformat-Ansicht) einzustellen.
Dazu dient folgender Meta-Tag:

<meta name="viewport" content="width=320" />
Weil das Display des iPhone eben 320 px in der Breite auflöst.

Aber jetzt kommt das iPhone 4 mit 640 px. Und obiger Meta-Tag wird dazu führen, dass die Anzeige die doppelte Breite des Displays einnimmt, also zu horizontalem Scrollen zwingt. Eine Horrorvorstellung. Was tun?

<meta name="viewport" content="width=640" />
führt auf iPhones < 4 dazu, dass eine Webseite nur noch in Briefmarkengröße dargestellt wird.

Aber Safari stellt eine wesentlich elegantere Methode zur Verfügung:

<meta name="viewport" content="width=device-width, user-scalable=yes" />

Der Wert device-width liest die auf dem Gerät verfügbare Breite aus, anstelle einer festen Angabe in Pixel.
Und user-scalable=yes ermöglicht das Zoomen. Ohne diese Angabe lässt das Meta-Tag Zoomen nicht zu. Ganz Böse! Man wäre auf horizontales Scrollen angewiesen, um die Seite zu lesen.

Screenshot iPhone
Demoseite
Die Demo macht natürlich nur mit dem iPhone Sinn, oder einem User Agent Switcher, z. B. diesem Firefox Add-on



Referenz

Anmerkung: Was das iPad mit diesen Angaben wohl macht? Vielleicht könnte mal ein “iPadler” einen Blick darauf werfen.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Ein Suchformular mit CSS3 gestaltet

Samstag, 5. Juni 2010

Ich habe das Suchfeld auf dieser Seite mal ein wenig “aufgehübscht". Ohne ein einziges Bild, ausschließlich mit CSS. Und weil inzwischen alle modernen Browser CSS3 unterstützen, habe ich ausgiebig Gebrauch gemacht von den CSS3-Eigenschaften radius, gradient und box-shadow.
Im Browser sieht das Suchfeld so aus:
Screenshot
Demo mit CSS im Quelltext


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Wie schnell sollen Webseiten sein?

Mittwoch, 2. Juni 2010

Die Antwort ist einfach: Es kann gar nicht schnell genug sein.
Um zu testen, wie schnell die eigene Webseite ist, bietet Google im Rahmen der Webmastertools jetzt folgenden Test:

Im Durchschnitt benötigen Seiten auf Ihrer Website 0,9 Sekunden zum Laden (aktualisiert am 31.05.2010). Dies ist schneller als 93 % der Websites. Diese Schätzungen sind von mittlerer Genauigkeit (zwischen 100 und 1000 Datenpunkten). Das folgende Diagramm zeigt an, wie sich die durchschnittliche Ladezeit Ihrer Website in den letzten Monaten verändert hat. Zu Ihrer Information wird auch der 20%-Quantil aller Websites angezeigt, wobei die langsamen und schnellen Ladezeiten voneinander getrennt dargestellt werden.

Grafik zeitlicher Verlauf der Ladezeit


Wie aus der Grafik zu erkennen ist, hat sich die Geschwindkeit meiner Seiten in letzter Zeit weiter verbessert. Dies ist kein Zufall, sondern das Ergebnis von intensiver Detailarbeit. Wichtigstes Hilfsmittel dabei: Das Firefox/Firebug Add-on Page Speed.
Page Speed misst nicht nur, sondern gibt auch gezielte Hinweise auf Schwächen und Verbesserungsmöglichkeiten.
Wenn Sie selbst einen Test mit Page Speed machen wollen, ohne selbst Firefox, Firebug und Page Speed zu installieren, dann schauen Sie doch mal bei gtmetrix.com vorbei.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Google Analytics: Kürzung der IP-Adressen

Mittwoch, 26. Mai 2010

Seit kurzem kann der Code von Google Analytics so abgeändert werden, dass die IP des Besuchers, und somit seine Identität, nicht mehr erkennbar ist. Details zum Code: http://code.google.com
Auf webdesign weisshart wird diese Änderung verwendet.
Damit spricht auch aus Sicht des Datenschutzes nichts mehr gegen den Einsatz von Google Analytics auf den Seiten von webdesign weisshart.
Ein entsprechender Hinweis wurde in die Hinweise zum Datenschutz aufgenommen.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Formulareingaben vor dem Absenden prüfen

Samstag, 8. Mai 2010

Formular-Eingaben, z. B. Kommentare hier im Blog, müssen selbstverständlich überprüft werden, bevor die Eingaben in die Datenbank auf dem Server geschrieben werden.
Heute geht es aber um die Überprüfung der Eingaben vor dem Absenden. Genauer: die Prüfung, ob alle Pflichtfelder ausgefüllt wurden. Noch genauer: Um die Behandlung von Fehleingaben.
Dies muss auf dem Server erfolgen. Weil eine clientseitige Überprüfung, z. b. mittels JavaScript, nicht greift, wenn der Besucher JavaScript deaktiviert hat.

Aber um die Usability zu verbessern, kann man eine Prüfung per JavaScript vorschalten.
Der Benutzer erhält so beim Drücken des Absende-Buttons sofort eine - möglichst aussagefähige - JavaScript-Meldung, wenn ein Pflichtfeld nicht ausgefüllt wurde, und nach Quittieren dieser Meldung wird er unmittelbar auf das fehlerhafte Eingabefeld geschickt.
Hier eine gute Anleitung.

Danke an Eva Papst für das Einfordern dieses Usability-Features.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Google macht jede Website mobil

Dienstag, 23. März 2010

Der Zugriff auf das Internet mit mobilen Geräten wird immer selbstverständlicher. Aber leider ist die Mehrzahl der Seiten für die Anzeige auf Handys und Handhelds nicht optimiert, um nicht zu sagen ungeeignet. Das Design ist in der Regel für die Minidisplays von mobilen Geräten ungeeignet, und die üppigen Dateigrößen heutiger Webseiten machen mobiles Surfen nicht gerade zu einer flotten Angelegenheit, von den Kosten ganz zu schweigen.
Google hat ein Mittel gegen beides. Zumindest, wenn man mit dem iPhone unterwegs ist. Für andere Geräte konnte ich das bisher leider nicht nachvollziehen.
Wie sieht das aus?
Eine Google-Suche mit dem Safari-Browser des iPhones zeigt neben der URL der Treffer ein kleines Dropdown-Menü namens Optionen, mit den 3 Optionen: Im Cache - Ähnlich - Für Mobilgeräte.

Screenshot der Google-Ergebnisse auf dem iPhone

Bei der Auswahl “Für Mobilgeräte” wird eine von Google bearbeitete Version der Seite angezeigt. Zu erkennen am Ende der Seite durch die Bemerkung: “Von Google zur Anzeige auf Mobilfunkgeräten formatiert”

Screenshot der von Google bearbeiteten Seite

Diese “mobile Version” ist auf dem iPhone gut lesbar, weil linearisiert, und häufig wesentlich kleiner als die
Originalseite. Manche Seiten sind erst mit diesem Trick vernünftig auf dem iPhone lesbar. Dennoch sind natürlich nach wie vor speziell für das mobile Web vorbereitete Seiten im Vorteil.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Der virtuelle Pranger

Donnerstag, 25. Februar 2010

Der Internetauftritt der Bahnhofsmission hat mich einige Tage beschäftigt. Anlass war die Klage meiner taubblinden Bekannten Marina Pompe, die wegen gravierender Mängel der Website der Bahnhofsmission nicht an dringend benötigte Informationen kam. Siehe M. Pompes Artikel dazu auf www.tbl-welt.de. Die Leitung der Bahnhofsmission stellte sich leider taub für die begründeten Anliegen ihrer eigenen Klientel. Eine ganze Reihe von E-Mails blieb unbeantwortet und unbearbeitet. Sogar eine Mängelanzeige des AbI-Projekts wurde schlicht ignoriert.
Mit so viel Ignoranz konnte und wollte ich mich nicht zufrieden geben. Ich wollte meiner taubblinden Bekannten bei Ihrem Bemühen helfen, sich ein klein wenig Selbständigkeit zurück zu erobern.

Offener Brief

Ich griff zu einer Maßnahme, die mir nicht leicht fiel: Ein offener Brief an die Leitung der Bahnhofsmission (den ich in Kopie natürlich auch per E-Mail an die Adressaten schickte).
Und siehe da: plötzlich klappte es mit der Kommunikation. Herr B., einer der Angeschriebenen, antwortete. Und beklagte sich zuerst einmal über die Tatsache, dass

… Organisationen, die nicht oder (wie in unserem Fall) nicht umgehend reagieren, in Foren, Blogs etc. sehr schnell an den virtuellen Pranger gestellt [werden]

“Nicht umgehend"? Die nicht beantwortete Mängelanzeige des AbI-Projekts datiert vor dem November 2009. Auf M. Pompes und meine Mails kam über zwei Wochen keinerlei Reaktion, nicht einmal eine Eingangsbestätigung.
Nein, Herr B. Sie haben keinen Grund, sich zu beklagen. Mit Ihrer Methode, auf Anfragen und wohlmeinende Hinweise per E-Mail schlichtweg nicht zu reagieren, rechtfertigen Sie nachträglich das, was Sie selbst virtuellen Pranger nennen. Es scheint leider die einzige Möglichkeit zu sein, Bitten oder Vorschläge an Sie heranzutragen.

Flurschaden

Herr B. schrieb weiter:

… führt aber u.U. zu einem dauerhaften Flurschaden, wenn einschlägige Beiträge nicht wieder entfernt werden.

Nein, Herr B., Sie verwechseln da etwas. Der Flurschaden besteht bereits. Auf Ihrem Internetauftritt. Und die “einschlägigen Beiträge” wurden in der Absicht erstellt, diesen Flurschaden zu begrenzen.

Ein Lichtblick

Zwei von drei der konkret angesprochenen Mängel wurden inzwischen behoben. Der Aufwand für diese Nachbesserung betrug mit Sicherheit nur einen Bruchteil des Aufwands, den ich in meine Bemühungen investiert habe, mit der Bahnhofsmission in Dialog zu treten.
Bei dieser Gelegenheit gilt mein besonderer Dank Eva Papst, die mein Vorhaben mit einem eigenen Blogbeitrag und mehreren E-Mails an die Bahnhofsmission unterstützt hat.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Machen Sie Ihre Website mobil

Samstag, 6. Februar 2010

mit diesem Slogan versucht http://ads-content.de/ für 15 bzw. 35 Euro ein Programm zu verkaufen. Damit sollen “normale” Webseiten in “mobile” Webseiten verwandelt werden.
Unfug sowas!
Zu diesem Zweck gibt es CSS. CSS löst genau diese Aufgabe, und zwar perfekt und maßgeschneidert.
Vor allem löst CSS diese Aufgabe, ohne eine zweite Version der gleichen Seite zu erstellen, und damit ohne Notwendigkeit, zwei Versionen zu pflegen. Eine wichtige Fehlerquelle weniger.

Erforderlich ist eine Browserweiche, sowie ein CSS für handhelds. Dieses CSS besteht im wesentlichen aus display:none für Alles, was auf handhelds nicht gezeigt werden soll, und einigen wenigen weiteren Anweisungen, wie z. B. in diesem CSS file

Damit sieht webdesign.weisshart.de auf dem iPhone oder anderen Smartphones so aus:

Screenshot webdesign weisshart auf dem iPhone


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

SUPER von eRightSoft mit Trojaner?

Sonntag, 10. Januar 2010

In meinem Artikel zum Video-Player JW Player habe ich das Video Konvertierungstool SUPER von eRightSoft empfohlen.
Nach einem kürzlichen Update auf die aktuelle Version von SUPER kann ich diese Empfehlung leider nicht mehr aufrechterhalten.
Das Tool brachte anscheinend einen Trojaner mit.
win32.TrojanDropper.Delf meldete mein Ad Aware.
Auch eine Suche im Web brachte einige einschlägige Artikel zum Thema.
Ohne nun die Herstellerfirma eRightSoft zu beschuldigen - SUPER wurde von Ad Aware blockiert und gelöscht, und kommt mir auch nicht mehr auf den Rechner.
Ich arbeite jetzt mit dem Xilisoft Video Converter.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

The Twitter Times - Twitter selektiv

Sonntag, 8. November 2009

Die Rosinen aus dem ganzen, oft geistlosen Gezwitscher herauspicken. Nicht einfach. Selektives Vorgehen bei der Auswahl der “Verfolgten” ist der erste Schritt. Gegebenenfalls auch einmal “defollowen". Weiter eingrenzen lässt sich die Flut durch das Anlegen von Listen.

Ein pfiffiger Ansatz ist The Twitter Times

The Twitter Times is a real-time personalized newspaper generated from your Twitter account

Twitter Times generiert eine Art Zeitung aus den Tweets der von mir “Verfolgten", und verwendet teilweise auch Tweets von “friends of friends”, quasi “Verfolgten zweiter Ordnung".
Wie von Zauberhand verschwinden dabei alle Tweets ala: “habe gut gefrühstückt …".
Das Ergebnis, nicht immer ganz frei von false results, wird so weit möglich mit referenzierten multimedialen Inhalten ausgeschmückt, und ist recht komfortabel zu lesen. Und irgendwie halt ein Spiegel meiner eigenen Auswahl. Nicht unamüsant.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Warum ich twittere

Freitag, 6. November 2009

Vor gut 2 Wochen fragte ich mich, warum ich nicht twittere.
Jetzt, 2 Wochen später, ein Versuch, die Frage zu beantworten: “Warum twittere ich?”

Mein Einstieg war ausschließlich durch mein Interesse an der Technik begründet. Ich war einfach neugierig, welche Möglichkeiten dieses für mich neue Medium bietet. Schnell entdeckte ich z. B. die Möglichkeit, mein Twitter mit RSS Feeds zu füttern. Twitterfeed ermöglicht, dass innerhalb einer Stunde nach Veröffentlichung dieses Blogbeitrags ein Hinweis auf eben diesen Beitrag getwittert wird. Ohne mein Zutun.
Noch herausfordernder fand ich die Aufgabe, meine letzten Tweets auf der Startseite meiner Homepage anzuzeigen. Klar, hierfür gibt es fertige Lösungen, wie z. B. twitter_badge. Aber ein paar Zeilen eigener PHP Code tun es auch, und ich habe volle Kontrolle über Funktion und Aussehen. Ich werde den Code demnächst veröffentlichen.

Gut. Nun bin ich also drin, in Twitter. Und kann mir selbst ein Bild machen über den Sinn oder Unsinn von Mitteilungen, die maximal 140 Zeichen umfassen dürfen. Um es kurz zu machen: Ich selbst entscheide, welche Informationen mich interessieren. Nicht anders als am Zeitschriftenstand, oder beim Fernsehprogramm. Niemand zwingt mich, jeden Blödsinn zu lesen, zu hören oder anzuschauen. Im Fall von Twitter können Werkzeuge wie Gruppen (in fast allen Twitter Clients verfügbar) oder auch das neue Listenfeature von Twitter selbst beim Vorsortieren helfen.
Und dann kann es tatsächlich passieren, dass sich unter dem ganzen Gezwitscher interessante Hinweise finden, die zum Weiterlesen animieren. Und die Aktualität ist fast nicht mehr zu überbieten.

Und wie halte ich es selbst mit Zwitschern? Muss ich jetzt auch der Welt mitteilen, was es heute zum Frühstück gab?
Bestimmt nicht. Davon hält mich hoffentlich die Anzeige meiner aktuellsten Tweets auf meiner Homepage ab.

To be continued. Bestimmt.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Warum nur twittere ich nicht?

Mittwoch, 21. Oktober 2009

Verd… - ich bin doch ansonsten auch nicht ängstlich beim Umgang mit neuen Techniken. Aber bei Twitter geht es nicht um eine neue Technik. Es geht um eine neue Kommunikationsform. Und alle meine bisherigen Versuche, dieser Art von Kommunikation etwas abzugewinnen, scheiterten im Ansatz. Ich kann einfach keinen Sinn darin sehen, wenn Schulkinder in maximal 140 Zeichen aller Welt mitteilen, was sie gerade tun.

Vor knapp einer Woche war ich beim A-TAG ‘09 - Fachkonferenz “Barrierefreies Internet”; als Vortragender. Und rund um diese Veranstaltung wurde getwittert, was das Zeug hielt. Steckt hinter dem Gezwitscher möglicherweise doch mehr als Kinderkram?

Also gut: ich startete einen neuen Versuch. Tatsächlich: die schnellsten Links zu Berichten und Kommentaren (in Blogs) und Fotos von der Veranstaltung (Flickr) fand ich bei Twitter. Muss ich meine Haltung revidieren?

Ich wage mal eine vorsichtige Annäherung:
Auf der Seite Mein Vortrag beim A-Tag habe ich ein Widget eingebaut, um das laufende Gezwitscher zum A-Tag anzuzeigen.
Ja, ich weiß. Meine Art, mit Twitter zu flirten ist alles andere als gewöhnlich. Aber es bringt einen Hauch von Web 2.0 auf meine Seiten.

Nachtrag 23. Oktober:

Follow me on Twitter

LOL


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Noch ein Feed

Dienstag, 13. Oktober 2009

Der RSS Feed meines Blogs hat einige treue Leser. Der eine oder andere Abonnent hat sich sogar schon geoutet. Schön zu wissen, dass man nicht in den Wind schreibt. Ich sag’ an dieser Stelle einfach mal danke für das Interesse, auch an die Adresse der Nur-Leser / Nicht-Kommentierer.

Inzwischen bin ich dazu übergegangen, bestimmte Themen aus dem - kurzlebigen - Blog auszulagern, und habe hierfür eine eigene Rubrik Artikel eingerichtet. Dort stelle ich Artikel ein, die für einen Blogeintrag zu umfangreich sind, und von denen ich hoffe, dass sie auch nach einiger Zeit noch lesenswert sind.
Für Nutzer von RSS Feeds gibt es auch diese Artikel als Feed:
http://webdesign.weisshart.de/artikel_feed.xml


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

RSS Feed mit Bildern

Samstag, 10. Oktober 2009

Große Portale schmücken häufig ihre RSS Feeds mit Bildern. Das wollte ich für meinen Artikel Feed auch. Nur wie macht man das?

Das xml file für den Feed schreibe ich, wie alles, von Hand. Aufbau einer RSS Datei

Nun das Bild. Ganz einfach – wenn man weiß wie.
Ein ganz normaler Hyperlink zum Bild in HTML Syntax an den Anfang der <description>.
Also:

<description>
<img width="120″ height="102″ src="http://webdesign.weisshart.de/images/fenster_120.jpg” alt="Foto: Geraniengeschmücktes Fenster” />
Die Geister scheiden sich daran, …

Nein, das geht nicht! Das xml file wird invalide, und das Bild nicht angezeigt.
Der HTML Teil muss als CDATA ausgezeichnet werden:

<description>
<![CDATA[
<img width="120″ height="102″ src="http://webdesign.weisshart.de/images/fenster_120.jpg” alt="Foto: Geraniengeschmücktes Fenster” />
]]>
Die Geister scheiden sich daran, …

Schon klappt das.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Links zu fremden Seiten in neuem Fenster öffnen?

Samstag, 19. September 2009

Fenster mit Geranien Die Geister scheiden sich daran, wie denn nun ein Link am besten geöffnet werden soll. Die einen schätzen ein neues Fenster, um die alte Ansicht nicht zu verlieren. Andere hassen das Fenstergewirr.

Eine Lösung für dieses Dilemma habe ich bereits 2006 hier beschrieben.

Nun habe ich mich entschieden, dieses Feature durchgängig auf allen Seiten anzubieten. Auf Kommentare hierzu freue ich mich.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Tastaturkürzel - Accesskeys

Freitag, 18. September 2009

Accesskeys sind ein — umstrittenes — Mittel, um Seiten zugänglicher zu machen für Benutzer, die keine Maus bedienen können — aus welchen Gründen auch immer.
Umstritten, weil damit Webseiten Tastenkombinationen belegen, die eventuell vom System des Besuchers vorbelegt sind. Paradebeispiel ist die Tastenkombination Alt + D. Damit wird in vielen Browsern das Dateimenü aufgerufen. Sollte nun ein Webworker genau diese Tastenkombination für einen Accesskey verwenden, dann können Tastaturnutzer das Dateimenü ihres Browsers nicht mehr erreichen. Accessibility pervertiert.
Eine gute Abhandlung zu diesem Thema gibt es bei Jens Meiert über Accesskeys
Auf meinen Seiten gibt es seit langem Accesskeys — Tastaturkürzel bei webdesign weisshart — obwohl ich immer wieder darüber nachdenke, sie ganz zu entfernen. Aus den oben zitierten Gründen.
Wie dem auch sei: Ich habe die Keys geändert, und an den britischen Accesskey-Standard angepasst. Wichtigstes Detail: Der Sprung zum Inhalt, der Skiplink, hat jetzt den Accesskey [S]. "S" für Skiplink oder Sprunglink.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Welche Flash Version habe ich installiert

Sonntag, 17. Mai 2009

“Wie kann ich feststellen, welche Flash Version bei mir installiert ist?”
Das fragte mich neulich eine Bekannte.
Klar kann man das auf den Seiten von Adobe feststellen. Aber bis ich mich dort zur richtigen Seite durchgeklickt habe, das dauert jedesmal.
Deshalb habe ich schnell ein kleines Script geschrieben und online gestellt.

Bei einem Klick auf diesen Link “werden Sie geholfen".


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Noch ein Player

Samstag, 16. Mai 2009

Mein mp3 Player hat eigentlich alles, was ein barrierefreier online Musik Player braucht.
Warum also noch einen Player?
Weil mit diesem Player das Hinzufügen und Austauschen von Titeln eine Sache von Sekunden ist: einfach die Musikdatei im .swf Format auf den Server - fertig.
Aber vielleicht kann mir auch jemand ein weiteres Argument hier als Kommentar posten.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Deine erste Homepage - ein barrierefreies Tutorial

Donnerstag, 19. Februar 2009

“Dreimal klicken - und Sie haben eine eigene Homepage, ohne programmieren zu müssen.”

So oder so ähnlich lauten die Anpreisungen vieler Webhosting-Anbieter.
Mag ja sein, dass es tatsächlich möglich ist, dieses Versprechen einzuhalten.
Aber das Ergebnis kann nur Spielerei sein, und ist nicht ausbaufähig.
Viele angehende Webmaster haben dies früher oder später festgestellt.

Die Kunst, eine Homepage zu erstellen

Die übliche Auszeichnungssprache für eine Homepage ist HTML (Hypertext Markup Language). Wenn du also ernsthaft an die Sache heran gehen willst, dann bleibt dir nichts anderes übrig, als diese Sprache zu lernen. Das klingt nach viel Arbeit - und ist es auch!

Wenn du dir diese Mühe machen willst, dann gibt es hier ein Tutorial, das dich in wenigen Schritten, und ohne theoretischen Ballast, zu deiner ersten mit HTML erstellten Seite führt. Du erwirbst Grundkenntnisse in den wichtigsten Techniken. Grundkenntnisse, auf die du nach Abschluss des Tutorials systematisch aufbauen kannst.

Hier geht es zum Tutorial


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Content-Klau die Dritte

Sonntag, 21. September 2008

Sind meine Kollegen “Webdesigner” zu faul, oder gar zu dumm? ein paar Zeilen eigenen Text zu schreiben?
Oder sind meine Texte zu gut?

Gerade gefunden bei meinem “Kollegen” www.infografik-lange.de/webdesign.htm:

Webdesign

Ihr Internet Auftritt muß zu Ihrem Geschäft / Betrieb/Verein oder Ihrer Institution passen.
Deshalb mache ich keine Seiten von der Stange, sondern gestalte jeden Auftritt individuell - eben nach Maß.

Ihre Homepage muß stets auf dem aktuellen Stand sein, und diese Aktualität sollte auch ersichtlich sein.
…nichts ist schlimmer, als die “Informationen von 2003″!
Damit das nicht passiert, gestalte ich Ihre Homepage “pflegeleicht".
Ob erforderliche Änderungen dann von Ihnen selbst (mit einer einfachen Zusatzsoftware), oder von mir durchgeführt werden, entscheiden Sie.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Kommentarspam - meine Lösung

Samstag, 16. August 2008

Nach vierwöchiger Testphase kann ich sagen: meine Lösung reicht - für meine Zwecke.

Ich prüfe einfach, wie lange es dauert, bis ein Formular - in diesem Fall der Kommentar hier im Blog - abgeschickt wird. Und alles unter 10 Sekunden ist böse.

Die Technik, obwohl nicht neu, habe ich, zusammen mit anderen bekannten Techniken, noch einmal beschrieben: Techniken zur Abwehr von Kommentarspam
Ich muss gestehen, dass tatsächlich während Testphase ein einziger Spambot 15 Sekunden bis zum Abschicken wartete, und damit den Schutz aushebelte.
Ich kann damit leben. Ich muss diesen Spam-Kommentar eben manuell löschen. Zusammen mit - viel häufigeren - manuellen Spam-Einträgen folgender Art:

… bin zufällig auf diese Seite gestoßen und bin sehr überrascht was es hier alles für interessante Themen gibt. Werde jetzt öfters mal vorbeischauen.

Sollte in Zukunft maschinell produzierter Spam doch häufiger vorkommen, dann ist meine Wahl: zusätzlich Methode 2: ein verstecktes Feld, das nicht ausgefüllt werden darf.

In jedem Fall habe ich für mich eine Lösung gefunden, die niemanden belästigt, vor allem niemanden aussperrt, und dennoch die bösen Bots mit ausreichender Zuverlässigkeit aussperrt.

Gegen die plumpen Versuche, sich mittels manueller Kommentare der oben zitierten Art Backlinks zu erschleichen, hilft manuelles Löschen (zumindest der Links in den Kommentaren).
Da ich die Kommentare in meinem Blog ohnehin lese, kein größeres Problem.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Spamschutz - ohne Rechenaufgabe

Samstag, 19. Juli 2008

Seit langem setzte ich als Schutz gegen Kommentarspam eine Rechenaufgabe ein. Mit vollem Erfolg. Kein einziger böser Bot machte sich die Mühe, 5 plus 3 auszurechnen.
Seit heute gibt es - versuchsweise - eine neue Art des Spamschutzes. Nein, kein CAPTCHA! Menschliche Besucher werden von meiner Technik nicht belästigt oder gar ausgesperrt; sie merken gar nichts von einem Spamschutz. Das Ausfüllen eines zusätzlichen Feldes ist nicht mehr erforderlich.
Ob der Schutz wirksam ist, wird sich zeigen. Aus diesem Grund werde ich die Technik auch erst nach einer maximal mehrwöchigen Testphase veröffentlichen.
Vorab sei nur so viel verraten: Ganze 6 Zeilen PHP sind hierfür erforderlich!


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Firefox 3.0 RC2 installiert

Donnerstag, 5. Juni 2008

Nachdem die neue Firefox Version 3.0 als Release Candidate RC2 vorliegt, hab’ ich es getan.

Meine ersten Eindrücke vorab:
Da ich das von vielen bemängelte Problem mit dem übermäßigen Speicherbedarf nie hatte, kann ich diesbezüglich wenig aussagen.
Auffallend ist allerdings, daß Javascript mit geradezu atemberaubender Geschwindigkeit ausgeführt wird.

Klar, daß ich die Version 3.0 parallel zu meinem Arbeitspferd 2.0 installiert habe. Also bei der Installation einen eigenen Ordner angegeben. Und dann ein eigenes Profil angelegt. Das geht am einfachsten, indem man Firefox mit angehängtem Parameter -P aufruft, und dann im Profilmanager ein neues Profil erstellt. Die - beabsichtigte - Folge: Die 3.0 startet erst einmal jungfräulich, in der default-Einstellung. Alle gewohnten Einstellungen zum Aussehen müssen manuell durchgeführt werden. Und vor allem: Alle Add-ons / Extensions müssen neu installiert werden.

Und jetzt die Nagelprobe: Welche meiner Tools / Add-ons / Extensions laufen mit der 3.0?

Fast alle! (Meine Testwerkzeuge)
Schmerzhafte Ausnahme: Die Accessibility Extension
Für Firebug gibt es eine kompatible Beta 1.1.0b12 auf http://getfirebug.com/
Ebenso für Marc’s HTML VALIDATOR (based on Tidy and OpenSP)

Nachtrag:
Auch die Accessibility Extension läuft jetzt.
Mit einem Trick kann man die automatische Prüfung auf Kompatibilität umgehen, und auf eigene Gefahr auch alte Add-ons installieren. Im Falle der Accessibility Extension hab’ ichs mal riskiert - bisher ohne Probleme.
Der Trick:
Zuerst die Nightly Tester Tools installieren. Und dann die Accessibility Extension. Nightly Tester Tools gibt bei der Installation eine Warnung aus, lässt aber die Installation nach dieser Sicherheitsabfrage zu. Wie gesagt: auf eigene Gefahr. Anschließend kann man die Nightly Tester Tools wieder deaktivieren.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Webdesign nach Maß schamlos kopiert

Donnerstag, 24. April 2008

Man sollte es nicht für möglich halten, wie einfallslos manche meiner “Berufskollegen” sind. Nicht einmal ein paar selbst formulierte Zeilen Text bringt der eine oder andere zustande. Statt dessen komplette Absätze von meiner Startseite kopiert, und fertig ist die eigene Firmenpräsentation.

Hier ein paar besonders dreiste Beispiele:

Ihre Homepage muß stets auf dem aktuellen Stand sein, und diese Aktualität sollte auch ersichtlich sein. ...nichts ist schlimmer, als die "Preisliste 2005"!
www.server-hp.de/Webdesign/webdesign.htm

Ihr Internetauftritt muss zu Ihrem Geschäft passen. Deshalb mache ich keine Seiten von der Stange, sondern gestalte jeden Auftritt individuell, passend zu Ihrem Betrieb oder Geschäft - eben nach Maß.
www.neue-seite.de/verbessern.htm

Ihr Internetauftritt muss zu Ihrem Geschäft passen. Deshalb mache ich keine Seiten von der Stange, sondern gestalte jeden Auftritt individuell, passend zu Ihrem Betrieb oder Geschäft - eben nach Maß.
www.a-schuff.de/intro.html

Ihr Internet Auftritt muß zu Ihrem Geschäft / Betrieb passen. Deshalb machen wir keine Seiten von der Stange, sondern gestalten jeden Auftritt individuell, passend zu Ihrem Betrieb oder Geschäft - eben nach Maß.
www.mth-soft.de

Meine lieben “Kollegen": Ich kann euch gerne einen Profitexter empfehlen, wenn ihr selbst nicht in der Lage seid, ein paar eigene Zeilen in deutscher Sprache zu verfassen.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Testwerkzeuge und Validatoren

Dienstag, 22. April 2008

Sauberen, korrekten (X)HTML- und CSS-Code schreiben - ob von Hand, oder mit einem CMS-System, mit einer Blog- oder Forensoftware, ist eine Sache. Aber auch hierbei gilt: Kontrolle ist besser. Um Webseiten nach allen denkbaren Kriterien zu testen, gibt es eine Fülle von Werkzeugen, viele davon online.

Ich habe mal in meine Werkzeugkiste gegriffen, und stelle hier meine wichtigsten Tools vor.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Der nackte Tag

Mittwoch, 9. April 2008

eine unbekleidete Frau steht vor einem Spiegel Hoppla! Was ist denn mit dem Design passiert? Ganz einfach, webdesign weisshart beteiligt sich jedes Jahr wieder am »CSS Naked Day«. Die Idee dahinter ist recht simpel: ist die Website noch benutzbar, wenn man sämtliche Formatierungen abschaltet? Verwendet die Website semantisches Markup, oder gehen ohne das Design wesentliche Informationen verloren?

Entstanden ist die Idee im Weblog von Dustin Diaz, der den »First Annual Naked Day: April 05« ausgerufen hat. Auf dieser Seite findet man auch eine lange Liste von Websites, die ebenfalls an der Aktion teilnehmen.

… wenn dir diese Ansicht nicht gefällt, dann wähle einfach aus meinem Styleswitcher einen Style aus; dann ist der Spuk vorbei, zumindest so lange, bis Du Deinen Browser neu startest. ;-)


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Der nackte Tag 2008

Dienstag, 8. April 2008

Am 9. April ist es wieder so weit:
Meine Seiten werden einen Tag lang nackt, ohne jegliches Styling dargestellt.
Die Idee von Dustin Diaz ist jetzt schon im vierten Jahr.
Damit soll gezeigt werden, dass ordentlich strukturierte Seiten auch ohne Styling, ohne CSS, ordentlich lesbar und benutzbar bleiben. Der erste und wichtigste Schritt zur Barrierefreiheit.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Noch ein Validator

Mittwoch, 13. Februar 2008

Der »Qualidator«
Was er zu meiner Seite meint:

Gratulation!
Ihre Website schneidet in der Gesamtanalyse exzellent ab und spielt in der “Premium League"!
Die Zugänglichkeitsrichtlinien (Accessibility) wurden auf höchstem Niveau vorbildlich umgesetzt.
Hinsichtlich der Usability Grundsätze wurde die Website vorzüglich realisiert.
Der Suchmaschinenoptimierung wurde bestmögliche Beachtung geschenkt.

Quality monitored by qualidator.com

Und ausser dieser Bauchpinselei gibt’s dafür auch noch ein Pickerl.


Solche Automaten sollte man aber auch nicht zu ernst nehmen. Die mit Abstand erfolgreichste Website der Welt wird vom Qualidator folgendermaßen bewertet:

Die getestete Website ist qualitativ überdurchschnittlich realisiert, verfügt aber in einigen Punkten über Verbesserungspotential.
Es bestehen bezüglich der Zugänglichkeit (Accessibility) viele Barrieren für (behinderte) Besucher, die optimiert werden sollten.
Die Usability Grundsätze wurden bei der Realisation der Website gut beachtet. Es besteht jedoch ein Verbesserungspotential.
In vielen Bereichen verfügt die Website über eine suchmaschinenoptimierte Umsetzung.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Sanftes Scrollen - wieder aktiviert

Mittwoch, 6. Februar 2008

Edit 06.02.2008: Ein neuer Anlauf. Das Bildschirmflackern sollte behoben sein (siehe Kommentar). Und auch der Zurück-button funktioniert.
Über Rückmeldungen und Kommentare würde ich mich freuen.

Edit 3.2.2006: wegen eventueller Probleme mit der accessibilty (Flackern) und der usability (die Zurück - Funktionalität des Browsers geht nicht mehr) hab ich das sanfte Scrollen - schweren Herzens - vorläufig? wieder deaktiviert.
Den Beitrag hier lasse ich stehen: das tool ist einfach zu interessant.
weiterlesen…


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Ist die Position 1 bei Google wirklich so wichtig?

Freitag, 18. Januar 2008

Die Antwort ist ein klares Jein.

Ich habe mal mehrere hundert Seitenbesuche, die von Google auf meine Seiten kamen, analysiert.
Das Ergebnis kann natürlich nicht repräsentativ sein.
Aber ich finde es immerhin interessant.

Vorab noch ein paar Bemerkungen:

  • Meine SERPs (Search engine result positions - Position in den Suchmaschinen-Ergebnislisten) sind sicher nicht gleichmäßig verteilt, d.h. ich bin vermutlich nicht mit der gleichen Anzahl Suchbegriffen auf Position 1, 2, 3 usw. gelistet.
  • Es wurde weder berücksichtigt, ob die Suchbegriffe relevant waren, d.h. auch zu Seiten geführt haben, die von den Besuchern als sinnnvolle Treffer gewertet wurden, noch ob die Suchbegriffe überhaupt sinnvoll waren. Ja, es waren auch ganz verrückte Suchanfragen dabei.
  • Meine Seiten werden überwiegend mit Mehr-Wort-Suchanfragen gefunden. Dies kann am Thema der Seite liegen, und ist möglicherweise auf Seiten mit anderen Themen anders. Ich denke nur an Suchbegriffe wie “Routenplaner", “Versicherungsvergleich” o.ä.

Doch jetzt zum Ergebnis meiner kleinen Untersuchung:

  • 30% der Besucher kamen von SERP 1
    ( nicht 30% aller Besucher, sondern 30% der Besucher, die von Google auf meine Seiten kamen.)
  • 38% der Besucher kamen von SERP 2 bis 5, also durchschnittlich 10% pro Position, wobei kein signifikanter Unterschied zwischen 2 und 5 festzustellen ist.
  • 25% der Besucher kamen von SERP 6 bis 13, also durchschnittlich 4% pro Position, wobei kein signifikanter Unterschied zwischen 6 und 13 festzustellen ist.
  • 7% der Besucher kamen von höheren SERPs. Darunter waren auch Treffer von SERPS > 100, die aufgrund der Suchbegriffe anscheinend das Ergebnis intensiver Recherche waren.

Mein Fazit:

Die Position 1 ist schön und gut, keine Frage. Aber auch bis 13 (oder 15? warum die Klicks nach 13 abrupt abbrechen, weiss ich nicht. Zufall?) ist gut und erstrebenswert. Treffer mit SERPs ab 15 sind entweder Zufallstreffer, oder das Ergebnis intensiver Recherche. Insofern können auch scheinbar schwache Positionierungen durchaus noch nützlich sein.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Sind Legastheniker im Web überrepräsentiert?

Sonntag, 13. Januar 2008

Der Bundesverband Legasthenie und Dyskalkulie geht davon aus, dass in Deutschland 4% der Schüler von einer Legasthenie betroffen sind.

Im Web scheint der Anteil weit höher zu sein. Wie sonst sollte ich mir erklären, dass dieser Hinweis auf meiner Kontaktseite offensichtlich so häufig nicht verstanden wird:

Support auschließlich im Forum! Supportanfragen per E-Mail oder Kontaktformular werden nicht beantwortet.

Oder sollte es daran liegen, dass der Hinweis in roter Fettschrift gesetzt ist?


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Ein Fleckerlteppich (bayrisch für Flickenteppich)

Dienstag, 25. Dezember 2007

… kann durch das Highlighting, das farbliche Hervorheben der Suchbegriffe auf meinen Seiten entstehen, wenn du von Google oder einer anderen Suchmaschine kommst, und dort mehrere Suchbegriffe eingegeben hast.
Zum Beispiel bei Google an erster Stelle

Das sieht dann so aus:

meine Seite mit vielen farblichen HervorhebungenDieses Highlighting ist zwar recht hilfreich, um schnell zu entscheiden, ob der Suchtreffer relevant ist, aber wenn die Seite dadurch zum "Fleckerlteppich" wird, wie in diesem Beispiel, kann die die Lesbarkeit doch beeinträchtigt sein.


Dagegen gibt es jetzt ein Mittel:
“Treffermarkierung entfernen [X]” erledigt genau das, was es sagt.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Support Forum

Montag, 5. November 2007

webdesign weisshart hat jetzt ein Support Forum
Das Forum ist “Beta", also in der Testphase, aus drei Gründen:

  1. Brauche ich überhaupt ein Forum? Wird es genutzt?
  2. Die Forensoftware selbst ist im Beta Stadium my little forum
  3. Meine eigenen Anpassungen der Forensoftware müssen sich natürlich auch noch in der Praxis bewähren.
    Diese Anpassungen dienen hauptsächlich der Zugänglichkeit, also der Barrierefreiheit. Erste Kurztests haben gezeigt, dass die Forensoftware hierfür beste Voraussetzungen mitbringt. Dafür nehme ich gerne in Kauf, dass sich mein Forum möglicherweise in ungewöhnlicher Form präsentiert, und anders aussieht, als die Masse der Boards, die das Web bevölkern.

Über jeden Test des Forums freue ich mich. Und mehr noch über Rückmeldungen, entweder im Forum selbst, oder hier, oder in sonstiger Form.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Safari für Windows

Sonntag, 8. Juli 2007

Gerade entdeckt:
Safari Browser für Windows
Erster Eindruck: problemlos zu installieren, und funktioniert tadellos.
Für Webworker, die zugängliche Seiten schreiben wollen, aber sich dafür nicht extra einen Mac kaufen können/wollen, eine tolle Sache - vorausgesetzt, der Safari verhält sich unter Windows genau so wie auf dem Mac.
Ich werde über meine weiteren Erfahrungen hier berichten.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Moblog

Sonntag, 8. April 2007

Wikipedia:

Ein Moblog ist ein Weblog, das von einem mobilen Telekommunikationsgerät, normalerweise einem Mobiltelefon oder PDA mit Inhalten gefüllt wird. Das Kofferwort setzt sich aus den Wörtern “mobile” (englisch: “mobil", “mobilfunktelefon") und “Weblog” zusammen.

Ein Moblog besteht normalerweise vor allem aus Bildern, die mit einem Kamera-Handy aufgenommen und über die Handy-Tastatur mit einem kurzen Text-Kommentar versehen worden sind. Bild und Text werden per MMS oder E-Mail an das Weblog gesandt

Zur Anzeige des Moblogs auf der Homepage wird ein Programm benötigt, das die MMS oder E-Mail empfängt, und in eine für die Homepage geeignete Form umsetzt.

Ich biete solche Programme in zwei Versionen an:

1. als mms2web Diese Version speichert die Fotos und Texte auf meinem Server, und erfordert zur Installation nur die Einbindung einer Codezeile in die Homepage.

2. als PHP Script zur Installation auf deinem Server. Damit hast du alle Freiheiten in der Gestaltung, und volle Kontrolle über deine Daten.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Foto Chat

Donnerstag, 8. März 2007

AugenMein Chat bietet die Möglichkeit, anderen Teilnehmern am Chat auf die Schnelle ein beliebiges Foto zu zeigen.
“Ein (Bild) Foto sagt mehr als 1000 Worte.”
Also warum immer nur smileys? Ein Foto kann viel lustiger sein.

Ob es so etwas noch einmal gibt? Ich weiss es nicht. Ich hab’ jedenfalls noch nie einen Foto-Chat gesehen. Damit ist kein Avatar gemeint, sondern das Einbinden beliebiger Fotos im Text.
Einzige Voraussetzung: das Foto muss bereits im Web erreichbar sein. (Es ist also kein direkter upload möglich - und der Grund dafür: Fotos uploaden dauert viel zu lange, um innerhalb eines Chat sinnvoll eingesetzt zu werden)
Nachtrag 17.04.07: Ich hab’ einen Weg gefunden, während eines Uploads weiterzuchatten. Damit können jetzt auch Bilder vom eigenen Rechner im Chat verwendet werden.

Und noch ein wichtiger Hinweis:
Die Verwendung eines Fotos im Chat setzt voraus, dass du die Rechte am Foto hast, bzw. keine Rechte anderer verletzt. Wenn du dir darüber nicht sicher bist, lass es besser bleiben.

Foto: aboutpixel.de@raya_331


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Webdisign

Samstag, 10. Februar 2007

Hoppla, wieso Webdisign? Heisst das nicht Webdesign? Oder etwa doch web design?

Webdisign ist auf jeden Fall falsch, und kann bestenfalls als Tippfehler durchgehen.

Webdesign ist auch falsch. Dieses englisch scheinende Wort gibt es in der englischen Sprache nicht. Im Englischen heisst es richtig: web design. Aber irgendwie hat Webdesign sich in die deutsche Sprache eingeschlichen, wie so vieles Andere auch.

Warum ich das hier veröffentliche?
Ich will einfach mal testen, wie schnell ich mit dem Suchwort “Webdisign” bei Google auf Platz eins bin ;-)


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Barrierefreies Javascript?

Freitag, 12. Januar 2007

Ich bezeichne meinen Chat als barrierefrei.
Nein, mein Chat ist nicht barrierefrei.
Und zwar, weil WAI und BITV unter anderem verlangen, dass barrierefreie Webseiten auch ohne Javascript zugänglich sein müssen.

In letzter Zeit wird viel über barrierefreies pdf und barrierefreies flash diskutiert.
Wer keinen pdf reader oder kein flash installiert hat, wird auch zu barrierefreien pdfs und barrierefreiem flash keinen Zugang erhalten.

Ist die Analogie erkennbar?
Ich behaupte einfach, dass mein Chat “barrierefreies Javascript” verwendet.
Die Seite, die der Browser darstellt, beinhaltet nämlich gar kein Javascript mehr.
Vielmehr wird durch Javascript - genauer: AJAX - eine (fast) normale (X)HTML Seite erzeugt. (Dass die Quelltext-Anzeige des Internet Explorer dies nicht zeigt, ändert nichts an der Tatsache.) Und damit der Browser dieses Kunststück vollbringen kann, muss natürlich Javascript erlaubt sein.

Noch ein Vergleich gefällig?
Ein hochgradig Hörbehinderter, der sein Hörgerät nicht einschaltet, kann nicht Radio hören.
Wer Javascript deaktiviert hat, kann den Chat nicht benutzen.
Sturheit und Starrsinn sind keine Barrieren.

Weitere Aspekte und denkbare Kritikpunkte:

  • HTML und CSS validieren, das Javascript erzeugt keine Fehler und Warnungen.
  • Der Chat verwendet weder Frames noch Layout-Tabellen.
  • Die Seite ist semantisch korrekt gegliedert, und mit (zum Teil unsichtbaren) Überschriften strukturiert. Listen und Formularelemente sind mit (unsichtbaren) Hinweisen versehen.
  • Die Schriftgröße kann (fast) beliebig skaliert werden.
  • Kontraste: da jeder Benutzer des Chat die Möglichkeit hat, sowohl die Hintergrundfarbe (verschiedene Skins) als auch die eigene Nick- und Textfarbe zu wählen, kann eine unglückliche Kombination zu schlechten Kontrasten führen. Dieses Manko ist durch wenige, einfache Anpassungen am Script bei Bedarf leicht zu beheben. Durch Wahl der Anzeigeoption “Farben aus” kann der User dies abstellen. In der Demoinstallation auf meiner Seite nehme ich dieses Manko zugunsten des Geschmacks der Mehrheit der typischen Chatter in Kauf.
  • Es werden animated gifs für verschiedene Smileys verwendet. Der Admin kann entsprechende Smileys löschen.
  • Uralt Browser wie IE 5.0 und Netscape Navigator 4, und natürlich auch alle Textbrowser, wie z.B. Lynx, die kein AJAX verstehen, bleiben leider aussen vor. (IE ab Version 5.5 kann AJAX.)
    Kann man die Verwendung eines Browsers aus dem vorigen Jahrtausend auch schon als Sturheit bezeichnen? ;-)
  • Last but not least: Der Chat ist mit einer Vielzahl von Screenreadern auch von Blinden benutzbar. Und dieses Argument zählt meines Erachtens letztlich mehr, als buchstabengetreues Einhalten von Vorschriften und Normen
  • Muss ich eigentlich noch erwähnen, dass auch Blinde selbstverständlich meine Smileys “sehen"?

Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Seitensuche im Browser aufrufen

Donnerstag, 28. Dezember 2006

Das Search-plugin für Firefox und IE 7Moderne Browser wie Firefox oder der IE 7 bieten einen direkten Zugriff auf Suchmaschinen in Form eines Suchformulars im Kopf des Browserfensters.
Meine Suchfunktion ist eine Suchmaschine.
Und diese “Suchmaschine” kann ganz einfach zu den im Browser integrierten Suchmaschinen hinzugefügt werden. Damit ist eine Suche auf den Seiten von webdesign.weisshart.de auch dann möglich, wenn die Seite gar nicht angezeigt wird. Gleichermaßen cool wie unnütz :-)
Wenn Sie sich das antun wollen, einfach den folgenden Link klicken:

Suchen auf webdesign.weisshart.de hinzufügen

Keine Angst. Die Sache kann ganz einfach wieder entfernt werden.
Im Firefox: Dropdown-Menü neben dem Suchfeld - Suchmaschinen verwalten - entfernen.
Auch im IE über das Dropdown-Menü.

Die Technik zum Erstellen dieses plugins wird beschrieben bei
http://developer.mozilla.org/


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Wie bringe ich meine Seite bei Google ganz nach oben?

Mittwoch, 27. Dezember 2006

Bei dieser Fragestellung sollte man vielleicht unterscheiden:

Haben Sie eine “Meine Oma, mein Hund, und mein Gartenzwerg mit der rosanen Mütze” Homepage, dann kann ich Ihnen garantieren, daß ich Ihre Homepage auf die erste Seite bei Google bringe.
Ob Sie sich diesen Service leisten wollen, steht auf einem anderen Blatt.

Sollten Sie jedoch beabsichtigen, Ihr Gewerbe mit dem Suchbegriff “Versicherungsvergleich” auf Top-Positionen in die Suchmaschinen zu bringen, dann sollten Sie erstens viel Geld bereitlegen, und zweitens niemandem glauben, der Ihnen das garantiert.

Zwischen diesen beiden Extremen gibt es jedoch ein weites Feld (kommerzieller) Seiten, die durch technische Mängel ihres Internetauftritts mögliche gute Plazierungen in Suchmaschinen verschenken, und damit potenzielle Kunden nicht erreichen. Eine Analyse der fraglichen Seiten zeigt meist recht schnell Fehler, die zu einer schlechten Plazierung führen, und Verbesserung ist in vielen Fällen mit relativ einfachen Maßnahmen möglich.

Aber bitte erwarten Sie kein Rezept a la “man nehme ….”


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Wer hat die schönste Homepage?

Samstag, 16. Dezember 2006

Na ich ;-)
zumindest meint das Google
Und Google muß es ja wissen.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Update auf Firefox 2.0

Donnerstag, 26. Oktober 2006

Ein Firefox update ist eigentlich nichts, was besonders erwähnenswert wäre. Man updated, und gut ist’s.
Aber der Vergleich mit dem kürzlich erfolgten Update des IE drängt sich einfach auf. Und der fiel erwartungsgemäß aus: In 3 Minuten war die Sache beim Fux erledigt, einschließlich des downloads von gerade mal gut 5MB. Alle bisherigen Einstellungen, extensions, bookmarks sind wieder da wo sie waren, und nicht einmal ein reboot war erforderlich.
Wie gesagt: eigentlich nicht der Rede wert. Es funktioniert einfach. Wie nicht anders zu erwarten.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Internet Explorer 7 installiert

Sonntag, 22. Oktober 2006

… was ist mir auch schon anderes übrig geblieben. Ich muß meine Seiten in allen gängigen Browserversionen testen - und dazu gehört eben auch der IE7.
Daß ich den IE7 nur zu Testzwecken benutze, spielt hierbei keine Rolle. Und unter Paranoia leide ich auch nicht.

Ganz kurz nur so viel: Die Installation lief reibungslos, wie nicht anders zu erwarten. Die heftigen Eingriffe ins Betriebssystem waren nur an den lang andauernden Laufwerksgeräuschen meiner Festplatte zu erkennen. Daß es auch anders geht, ist bekannt. Von MS war aber nichts anderes zu erwarten.

Und ein kurzer Test meiner Seiten ergab, daß der IE7 offenbar mit technisch sauberem Code umgehen kann :-)

Jetzt hoffe ich, daß dies mein erster und letzter Blogeintrag zu diesem Thema war.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

10.000 downloads

Samstag, 23. September 2006

Weil ich die Suche auf meiner Seite barrierefrei haben wollte, habe ich irgendwann kurzerhand meine eigene Suchmaschine geschrieben. Und nie dran gedacht, daß auch Andere dieses Tool nützlich finden könnten.
Wie man sich täuschen kann.
Heute wurde das Suchscript zum 10.000sten mal runtergeladen.
Und immer öfter krieg ich auch nette Mails von zufriedenen Benutzer.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Supportanfrage

Freitag, 18. August 2006

Anfrage:

habe Ihr Suchscript erstmal lokal auf meinem PC ausprobiert. Es wird offensichtlich im Quelltext gesucht …
Für meine Zwecke ist diese Suchmaschine leider unbrauchbar, da alles in php ist und offensichtlich der Quellcode durchsucht wird.

Tja, was soll man darauf antworten?
Ich “hätte” ja einen Link zur FAQ geben können. Aber ich hab’ mir die Antwort dann einfach verkniffen.

Nachtrag 29.08.06:
Der Blog eines Leidensgenossen
Lesenswert!


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Kostenloser Support

Anfrage:

Vielleicht können sie mir weiterhelfen. Ich finde nicht heraus, wie ich in in Ihrem Script xyz Folgendes ändern kann …
Der Grund: Ich programmiere gerade eine Erweiterung für das Script, und …
Leider bekomme ich es so nicht hin. Können sie mir da weiterhelfen? Wie lauten die richtigen Variablen?

Antwort:

Karl Valentin würde sagen:
“Können könnt’ ich schon, aber mögen mag ich nicht.”
Spaß beiseite:
Wenn ich auf jede noch so nette Anfrage zu einem kostenlosen! Script auch noch kostenlos Nachhilfe in PHP geben sollte, dann wäre dieses Script sicher das letzte, das ich bereit gestellt habe. Dann wär’ ich nämlich mit dem Support 24 h am Tag ausgelastet.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Ein eigener Titel für jede Seite - Suchmaschinen freuen sich drüber.

Donnerstag, 3. August 2006

Jede Seite im Web sollte einen eigenen, aussagekräftigen Titel haben. Nicht die auf der Seite selbst sichtbare Überschrift ist damit gemeint, sondern das sogenannte title-Tag. Das title-Tag wird z.B. in der Kopfleiste des Browsers angezeigt. Aber auch für die optimale Positionierung in Suchmaschinen ist das title-Tag ein wichtiges Kriterium - unter vielen anderen.
Bei statischen Webseiten ist das kein Problem. Weblogs jedoch generieren die angezeigten Seiten in der Regel aus Datenbanken. Und in diesem Fall ist etwas Programmierarbeit erforderlich, um individuelle Titel für die einzelnen Beiträge zu erzeugen.
Den Hinweis zu dieser Optimierung meiner Site verdanke ich Monika. Danke dafür.

Nachtrag 04.08.:
Unglaublich! 24 Stunden nachdem ich diese Änderung durchgeführt habe, sind viele Artikelüberschriften aus meinem Weblog bei Google auf Position eins!


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Endlich allein - mein eigener Server

Montag, 17. Juli 2006

Ich bin auf meinen eigenen Server umgezogen, und keiner hat’s gemerkt ;-)
Ein dickes “Danke schön” und ein riesiges Kompliment an meinen Hoster Host4Free


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Credit-Link verstecken - welche Methoden gibt es?

Freitag, 14. Juli 2006

ACHTUNG! Dieser Beitrag ist nicht ganz ernst gemeint. Aber vielleicht erkennst Du Dich ja wieder.

Ein Credit-Link ist ein Link, der zur Seite des Script-Autoren führt. Das ist der einzige Lohn, den der Ersteller eines kostenlosen Scripts für seine Arbeit erhält.
Warum auch immer: Es gibt Zeitgenossen, für die nichts wichtiger ist, als dem Autor diesen Lohn vorzuenthalten. Und die Bemühungen, den Credit-Link zu entfernen, treiben seltsame Blüten.

Vorab zum Schmunzeln ein rührendes Beispiel:

Screenshot: über dem Credit-Link eingefügt: 'Diesen Link nich benutzen'

Und hier die kriminelle Version:

Statt:
»script by © 2005 webdesign weisshart«
fand ich unter einem meiner Scripte:
»script by © 2005 … und hier der Name des Diebs«

Und zwischen diesen beiden Extremen gibt es noch:

  • weiße Farbe auf weißem Untergrund. Lila auf Lila macht sich auch gut.
  • zig-mal <br> vor dem Link. Und die Scrollbalken abschalten! Wer dann nicht mehr Deine ganze Seite sieht, soll sich halt einen größeren Bildschirm kaufen.
  • einen Frame oder iframe so klein machen, daß der Link nicht sichtbar ist. Und wieder ganz wichtig: keine Scrollbalken!
  • … usw.

Wem diese Möglichkeiten nicht genügen, der kann ja mal bei mir anfragen. Ich kenn’ noch mehr Tricks. Oder, noch einfacher, Deine Frage gleich hier als Kommentar.

Hey Leutz: investiert Euere Energie lieber in das Erlernen von Scriptsprachen, und schreibt Euch die Scripts selbst! Dann habt Ihr die Probleme mit dem Credit-Link nicht. ;-)

Nachtrag 18.09.:
Wenn ich einmal konkret nachfrage, warum denn der Credit-Link stört und unbedingt weg soll, dann kommt meist nur das große Schweigen als Antwort. Oder: “na, dann bleibt der Link eben drin". Bitte, Leute, denkt vorher nach, warum Ihr was wollt. Ich mußte ja auch nachdenken, um ein Script zu schreiben.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Counter - Besucherzähler - nein danke!

Freitag, 23. Juni 2006

Kaum ist die erste eigene Homepage online, kommt der Wunsch nach einem Besucherzähler. Die ganze Welt soll wissen, wie wichtig meine Homepage ist, und daß tausende von Besuchern bisher auf dieser Seite waren.
Da dieses Bedürfnis von Homepagebastlern anscheinend unwiderstehlich und universell ist, gibt es Zillionen von Besucherzählern im Web, die Aber-Zillionen von Seitenbesuchen zählen. Und für das Ego der stolzen Homepagebastler gibt es anscheinend nichts Schöneres, als wenn der Besucherzähler mal wieder um Eins nach oben klickt.
Bei “Mein Hund, meine Katze und meine Oma” - Seiten mag das ja angehen. Die werden ohnehin hauptsächlich vom Webmaster selbst besucht.

Aber auf professionellen oder kommerziellen Seiten?
Wer interessiert sich denn für den Stand des Besucherzählers?
Wird eine Seite interessanter, wenn dort ein Gebilde prangt, das aussieht wie ein Kilometerzähler im Auto, und irgendeine nicht nachvollziehbare, möglichst 7-stellige Zahl anzeigt?

Nein. Ein Besucherzähler ist das Allerletzte, was ich auf meinen Seiten zeigen würde.

Das schließt natürlich nicht aus, daß ich über eine detaillierte Statistik über die Aufrufe meiner Seiten verfüge. Natürlich weiß ich, mit welchen Suchbegriffen meine Seiten bei Google gefunden werden, welche Suchmaschinen welche meiner Seiten spidern, welche meiner Seiten wie oft aufgerufen werden, und vieles mehr. Um einen Webauftritt zu optimieren, ist dieses Wissen sicher hilfreich. Und, um ehrlich zu sein, freu ich mich auch, wenn Monat für Monat mehr Besucher auf meiner Seite sind.

Aber außer mir interessiert das absolut niemanden.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Ein barrierefreier Chat - ohne Java

Donnerstag, 15. Juni 2006

Ein Chat auf der eigenen Homepage: entweder von einem externen Dienstleister eingebunden, voll mit Werbung, und/oder mit Java realisiert.
Ich mag Java nicht.
Dass es auch anders geht, zeigt mein Chat
Nein, ich erwarte nicht, daß sich in meinem Chat viel tun wird. Um ehrlich zu sein, ich hab gar keine Verwendung für einen Chat. Aber die Technik, die dahintersteckt, fand ich einfach reizvoll. Stichwort: AJAX.

Support für das Script nur noch im Support Forum


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Mein Moblog

Montag, 5. Juni 2006

Wikipedia sagt:

Ein Moblog ist ein Weblog, das von einem mobilen Telekommunikationsgerät, normalerweise einem Mobiltelefon oder PDA mit Inhalten gefüllt wird. Das Wort setzt sich aus den Wörtern “mobile” (englisch: “mobil") und “Weblog” zusammen.

Ein Moblog besteht normalerweise vor allem aus Bildern, die mit einem Kamera-Handy aufgenommen und über die Handy-Tastatur mit einem kurzen Text-Kommentar versehen worden sind. Bild und Text werden per MMS oder E-Mail an das Weblog gesandt.

Nanu? so etwas hab’ ich doch auch!
mms2web heißt das bei mir. Und hat alles, was ein Moblog haben muß.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Über Plugins, Themes und Co.

Sonntag, 21. Mai 2006

Es ist schon merkwürdig:
Wenn ich mit einer Seite ein Problem habe, etwas ändern oder hinzufügen will, dann bemühe ich HTML, CSS, und evtl. PHP und/oder Javascript.
Und wenn was nicht so tut wie es soll, dann schaue ich in den Referenzen über HTML & Co. nach.

Wenn ich mich jedoch in Klein-Bloggersdorf rumtreibe, dann werden dort Plugins und Themes gesucht, um Änderungen an den Seiten durchzuführen. Und wenn etwas nicht so klappt, wie es soll, dann wird in Foren nachgefragt, wo man was an welchem Plugin einstellen kann, oder ob es vielleicht ein Plugin gibt, das die Probleme mit einem anderen Plugin löst. Und wenn es dann ein Update der Blog-Software gibt, dann geht die Fummelei mit den ganzen Plugins und Themes erst richtig los, und die Foren füllen sich mit Fragen und Empfehlungen, wie man das Ganze wieder so zum Laufen bringt, wie es vor dem Update war.

ein alter SchraubstockManchmal frage ich mich, warum ich diese Probleme nicht habe. Vielleicht liegt es ja an der Wahl der Werkzeuge?


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

… und gegen Trackback Spam?

Donnerstag, 18. Mai 2006

meine Rechenaufgabe scheint den Kommentarspammern tatsächlich zu schwierig zu sein ;-)
Blieb noch der Trackback Spam.
Nun, ich habe Trackbacks und Pings in Wordpress einfach deaktiviert. Kein Problem - ich lebe ja nicht in Klein-Bloggersdorf, und kann auf diese blogger-typischen features gut verzichten.

Nachtrag 19.05.05:
Erstaunlich! das Deaktivieren von Trackbacks in Wordpress reichte nicht aus, um Spam zu verhindern. Es wurden weiterhin Trackbacks auf gelöschte Posts geschickt. Die sind zwar im Blog nicht zu sehen, aber die Datenbank wird damit zugemüllt, und die Kommentaradministration in Wordpress natürlich auch.
Nächster Versuch: Kylaloo


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Eine Rechenaufgabe gegen Kommentarspam

Mittwoch, 17. Mai 2006

Lange Zeit wurde ich nicht mit Kommentarspam belästigt. Aber heute ging’s massiv los.
Um mich dagegen zu wehren, stelle ich menschlichen Kommentatoren jetzt eine kleine Rechenaufgabe, von der ich hoffe, daß Spamrobots damit überfordert sind.
Die Anleitung dazu hab ich von Jeff Barr. Der Einbau dauerte kaum länger als das Verfassen dieses Beitrags. Danke Jeff.
Ob’s hilft? Schau mer mal …


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

alle Farben auf den Kopf gestellt

Sonntag, 14. Mai 2006

CSS machts möglich: einfach alle hexadezimalen Farbwerte durch die jeweilige Komplementärfarbe ersetzt, und schon ensteht eine Darstellung in invertierten Farben. Der Name dieses Stils ergibt sich daher wie von selbst: »invertiert«

Die Vorgehensweise ist ganz einfach:
color: #ef66cc wird zu #109933 nach folgendem Schema:

01234567
||||||||
fedcba98

Daß mit dieser mechanischen Vorgehensweise ein halbwegs ansehnlicher Stil entsteht, ist schon erstaunlich.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Aktionsbündnis für barrierefreie Informationstechnik

Dienstag, 2. Mai 2006

Das Unterstützer-Logo des Aktionsbündnis für barrierefreie Informationstechnik mit Link zum AbI webdesign.weisshart.de ist Unterstützer im Aktionsbündnis für barrierefreie Informationstechnik.

Information soll allen Menschen zugänglich gemacht werden. Natürlich auch im Internet. Menschen mit Behinderungen sind häufig von der Benutzung des Internets wegen völlig unnötiger Barrieren ausgeschlossen.

Daher haben sich Behindertenverbände und Experten im Aktionsbündnis für barrierefreie Informationstechnik (AbI) zusammengeschlossen.

AbI steht dabei für:
A - Aktionsbündnis für
b - barrierefreie
I - Informationstechnik

Gemeinsam unterstützen sie die Umsetzung von Barrierefreiheit in der Informationstechnik.

AbI hat sich die Umsetzung des bestehenden Ordnungsrahmens (mit SGB IX und dem Behindertengleichstellungsgesetz) zum Abbau dieser Barrieren zum Ziel gesetzt.

Bisher haben sich bereits eine ganze Reihe an Partnern und Unterstützern AbI angeschlossen. Weitere Initiativen sind eingeladen, sich an dem Aktionsbündnis aktiv zu beteiligen.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

RSS Feed für mein Weblog

Samstag, 22. April 2006

RSS feed Eigentlich ist mein Weblog nur ein Anhängsel meines Internetauftritts. Ich hab jetzt dennoch mal den RSS feed freigeschaltet. Mit dem Firefox und Opera geht das Verfolgen des feeds ganz einfach. Einfach in der Adresszeile ein Rechtsklick auf das RSS Symbol, und den feed als Live Bookmark abspeichern. Gelesen werden die Artikel dann auch im Browser.
Der Internet Explorer kann das natürlich mal wieder nicht.
Ob’s zusätzliche Besucher bringt? Wohl eher nicht. Über einen Kommentar des ersten RSS Nutzers würde ich mich dennoch freuen.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Bei Google an erster Stelle stehen

Sonntag, 16. April 2006

mit einem Augenzwinkern hab ich diese Seite verfaßt, auf der ich aufzeige, wie oft meine Seiten bei Google ganz vorne gelistet werden.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Schriftgröße individuell einstellen

Donnerstag, 13. April 2006

eine Brille, die auf einem Buch abgelegt ist Wer darauf angewiesen ist, weiß in der Regel, wie man die Schrift in seinem Browser vergrößern kann. Und das funktioniert auch, wenn der Ersteller der Website dies ermöglicht. Leider tun das viele Seitenschreiberlinge nicht, entweder aus Unwissenheit, oder, schlimmer, aus Borniertheit, nach dem Motto: »wie meine Seiten aussehen, bestimme ich.«
Klar, daß ich auf diesen Seiten die individuelle Einstellung der Schriftgröße zulasse.

Ich bin aber noch einen Schritt weiter gegangen, und biete jetzt für jedermann eine komfortable Möglichkeit an, die Schriftgröße in 15% Schritten zu vergrößern oder zu verkleinern.
Zu finden unter der Überschrift »Darstellung«
Die Einstellung wird per cookie 1 Jahr lang gespeichert, so daß Sie bei Ihrem nächsten Besuch auf diesen Seiten Ihre ganz persönliche Einstellung wieder vorfinden.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Bannerrotation

Donnerstag, 6. April 2006

Am »day after naked« gibt’s ein aufgepepptes Hintergrundbild für den Titel auf dieser Seite (natürlich nur im Style »Standard«): eine Bannerrotation. Die Rotation wird mit PHP realisiert, und das Script kommt - wieder einmal - von alistapart
Und die Fotos? überwiegend von photocase.com


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

webdesign weisshart am 5. April nackt

Dienstag, 4. April 2006

eine unbekleidete Frau steht vor einem Spiegel Hoppla! Was ist denn mit dem Design passiert? Ganz einfach, webdesign weisshart beteiligt sich am »CSS Naked Day«. Die Idee dahinter ist recht simpel: ist die Website noch benutzbar, wenn man sämtliche Formatierungen abschaltet? Verwendet die Website semantisches Markup, oder gehen ohne das Design wesentliche Informationen verloren?

Entstanden ist die Idee im Weblog von Dustin Diaz, der den »First Annual Naked Day: April 05« ausgerufen hat. Auf dieser Seite findet man auch eine lange Liste von Websites, die ebenfalls an der Aktion teilnehmen. Die Technik dahinter ist übrigens denkbar einfach – man muss dazu einfach nur sein /css/-Verzeichnis umbenennen.

Nachtrag: auch wenn heute erst der 4. April ist, auf der anderen Seite unseres Planeten ist bereits der 5. April. Daher dauert es auch 48 statt 24 Stunden, bis dieser Zustand vorbei ist.

… es sei denn, Du wählst aus meinem Styleswitcher einen Style aus; dann ist der Spuk vorbei, zumindest so lange, bis Du Deinen Browser neu startest. ;-)

Nachtrag 2: … und weil’s so schön war, hab ich die »Nacktversion« auch noch meinem Styleswitcher hinzugefügt.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Flash XHTML valide einbinden

Donnerstag, 30. März 2006

Ja, man kann Flash sehr wohl XHTML valide einbinden.
Dazu muß lediglich der Code, der in vielen Beispielen zu finden ist, gehörig entrümpelt werden.
Hier eine Demo, die auch noch Spaß macht.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Externe Links in neuem Fenster öffnen?

Mittwoch, 29. März 2006

Fenster mit Geranien Die Geister scheiden sich daran, wie denn nun ein Link am besten geöffnet werden soll. Die einen schätzen ein neues Fenster, um die alte Ansicht nicht zu verlieren. Andere hassen das Fenstergewirr.

Ich überlasse die Wahl meinem Besucher!

In der Standardeinstellung werden Links im gleichen Fenster geöffnet. Vorteil: die Zurücktaste funktioniert wie gewohnt.
Und wer Links in einem neuen Fenster öffnen will, kann das jederzeit. Zum Beispiel so: Klick mit der rechten Maustaste, und dann die entsprechende Auswahl treffen (z.B.: “Link in neuem Fenster öffnen"). Moderne Browser bieten zu diesem Zweck mehr Komfort.

Bei Dr. Web hab’ ich mir jetzt eine pfiffige Lösung abgeguckt.
Das sieht so aus (hier nur ein Muster ohne Funktion):

Fremde Seiten in neuem Fenster öffnen?

In Aktion zu sehen hier im Blog gleich nach der Überschrift, oder auf meiner Referenzseite Suchscript im Menü.

Das Ganze erfordert allerdings Javascript. Und wer Javascript nicht aktiviert hat? Nun, dem steht eben dieser zusätzliche Komfort nicht zur Verfügung. Aber die Funktionalität der Seite ist natürlich gewährleistet. Der Fachausdruck hierfür heißt “unobtrusive Javascript”. (Eine griffige deutsche Übersetzung für diesen Begriff hab’ ich noch nicht gefunden. Aber dafür eine hervorragende Abhandlung zum Thema Javascript bei SELFHTML)


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Die Suche im Weblog

Montag, 20. März 2006

Die Suchfunktion hier im Weblog sieht zwar auf den ersten Blick recht ähnlich aus wie meine Seitensuche.
Von der Technik her ist das aber ein gänzlich anderer Ansatz. Da das Weblog auf MySQL basiert, ist das hier eine Datenbanksuche, im Gegensatz zur Volltextsuche bei meinem Suchscript.
Als Suchergebnis gibt es hier auch keine Auflistung der Treffer, sondern die gefundenen Beiträge werden direkt angeprungen.
Das highlighting, die farbliche Markierung der Treffer, hab ich von der Seitensuche übernommen, und es funkioniert auch prinzipiell genauso. Mit einer Besonderheit: Wenn nur ein einziger Beitrag gefunden wird, dann funktioniert es nicht.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Webseiten ohne Maus bedienen

Dienstag, 14. März 2006

… in diese Verlegenheit bin ich kürzlich gekommen. Maus nicht zum Notebook eingepackt - und dann war da irgend ein Defekt am eingebauten Mauspad.
Jetzt galt es, Webseiten ausschließlich mit der Tastatur zu bedienen. Daß dabei die Tab-Taste die wichtigste Taste ist, war mir natürlich klar. Aber auf den meisten Seiten kam ich damit nicht weit.
Als Konsequenz aus dieser Erfahrung hab ich meine eigenen Seiten noch einmal nachgebessert. Wozu ich Tastaturkürzel eingebaut habe, und warum beim Durchtabben der jeweils aktive Link deutlich gekennzeichnet wird, ist mir jetzt erst richtig klar.
Wenn Sie wollen, probieren Sie’s einfach einmal aus, und legen Sie die Maus beiseite. Sie werden staunen.
Es gibt übrigens viele Menschen, die wegen motorischer Einschränkungen die Maus nicht bedienen können, und immer auf diese Weise surfen …


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Es gibt nicht nur Google

Montag, 6. März 2006

In den USA ist die Suchmaschine Alexa weit verbreitet.
Und dort steigt meine Seite ständig im Ranking. Von jenseits Platz 1,5 Mio auf jetzt ca. 30.000. Ob die Amis sich wohl meine tools runterladen? ;-)


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Wie schnell sind mobile Webseiten

Mittwoch, 8. Februar 2006

Laaaaaangsam!

Jedenfalls, solange Sie kein UMTS Gerät der neuesten Generation besitzen, oder sich außerhalb des (nur langsam wachsenden) UMTS Empfangsbereichs befinden.
In beiden Fällen müssen Sie die Internetseiten über GPRS laden.
GPRS überträgt maximal 53,6 kbit/s, ist also theoretisch nur etwas langsamer als die früher weit verbreiteten 56 kbit Modems.
Aber eben nur theoretisch. Weil Sie sich die Bandbreite mit Millionen von Handy Nutzern teilen, sinkt die effektiv verfügbare Datenrate in der Hauptverkehrszeit drastisch. Das können auch einmal nur 5 kbit/sec oder noch weniger sein. weiterlesen…


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Webdesign für PDA / handhelds

Dienstag, 7. Februar 2006

Unter dem Titel “Webdesign für alle Browser” hab ich hier kürzlich gezeigt, wie meine Seite auf einem PDA aussieht. Der Screenshot dort stammt von einem XDA mit Windows CE und dem Internet Pocket IE Browser.

Diese Seite auf einem Palm Jetzt hab ich endlich auch einen Screenshot von einem Palm. Danke Jonas alias Archer.
Schade ist nur, daß anscheinend der user den Palm erst in den sogenannten “optimierten Modus” zwingen muß.
weiterlesen…


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Suchscript für Firefox

Freitag, 3. Februar 2006

Firefox ist für mich der Browser:

  • Schnell
  • optimal auf meine Bedürfnisse einstellbar
    (es gibt hunderte von Erweiterungen, sogenannte extensions, um den Firefox auf seine persönlichen Bedürfnisse einzustellen)
  • und in Punkto Sicherheit ist der Firefox dem Internet Explorer weit überlegen.

Aber daß der Firefox anscheinend meine Wertschätzung honoriert, ist mir heute zufällig aufgefallen. ;-)
weiterlesen…


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Mein Suchscript gewinnt 2 mal beim BIENE Award 2005

Montag, 23. Januar 2006

Die Biene - ein Qualitätszeichen für barrierefrei SeitenDer BIENE-Preis wird an die besten barrierefreien Webseiten verliehen. Biene steht für “Barrierefreies Internet eröffnet neue Einsichten".
Mehr als 320 Webseiten wurden für den Wettbewerb 2005 eingereicht, 26 davon qualifizierten sich für das Finale. Insgesamt 16 Internet-Angebote haben die Aktion Mensch und die Stiftung Digitale Chancen im Wettbewerb für ein barrierefreies Internet ausgezeichnet. Der Auszeichnung vorausgegangen waren ein umfangreiches Testverfahren und die Entscheidung einer prominent besetzten Jury aus Medienmachern und Multiplikatoren.

Gleich zwei der prämierten Webauftritte verwenden mein Suchscript:
Das österreichische Jüdische Museum, BIENE in Bronze,
und Rechtsanwalt Dr. Oliver Tolmein, Sonderpreis.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Webdesign für alle Browser

Samstag, 21. Januar 2006

Ja, für alle! und damit meine ich nicht nur Firefox, Opera oder den IE, sondern z.B. auch Browser, die auf einem PDA oder sogar Handy laufen.
Das sieht am Beispiel dieser Seite dann so aus:

Diese Seite auf einem PDAWohlgemerkt:
Es handelt sich nicht um eine spezielle Version dieser Seite, sondern um exakt dieselbe Seite, mit allen Inhalten, und mit der vollen Funktionalität. Lediglich Designelemente, die zum Lesen des Inhalts nicht unbedingt erforderlich sind, werden für handhelds per CSS ausgeblendet. Dafür werden andere Elemente eingeblendet: auf dem Bild zu sehen: der Sprunglink zum Überspringen der Navigation, direkt zum Inhalt. Auf diesen Displays, gerade mal 240 × 320 Pixel klein, hat einfach nicht viel Platz. Und Ladezeit ist ein K.o.-Kriterium.
Wer Lust hat, sich meine Seiten mal in einem PDA anzuschauen, und mit anderen Webseiten zu vergleichen, ist herzlich eingeladen. Ich freu mich über jede Kritik.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Seiten noch schneller machen - CSS mit mod_gzip komprimieren

Donnerstag, 12. Januar 2006

Tatsächlich, das geht: nicht nur html läßt sich mit mod_gzip komprimieren, wie ich das hier beschrieben habe, sondern auch CSS! weiterlesen…


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Seiten schnell machen

Ich hab mal wieder ein neues Tool gefunden, das mir hilft, meine Seiten schlank und schnell zu machen:
cdburnerxp.se komprimiert CSS Files.
Das wichtigste Tool ist und bleibt aber www.websiteoptimization.com


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Usability und Navigation

Montag, 2. Januar 2006

Eine wenig bekannte, aber nichts desto weniger berechtigte Forderung aus der Ecke usability lautet:
Die aktuelle Seite darf in der Navigation kein aktiver Link sein (sie sollte sogar für die Nutzer von screenreadern speziell ausgezeichnet sein, z.B. als “Standort").
Im Weblog gibt es diesbezüglich eine Besonderheit:
Sobald ich mir die Kommentare zu einem Beitrag anschaue, oder aus dem Archiv einen älteren Beitrag aufrufe, bin ich zwar immer noch im Weblog, aber eben nicht auf der Startseite des Blogs.
Wenn ich nun auf die Startseite des Blogs zurück wollte, dann war, aus oben genannten Gründen, der Link im Menü nicht aktiv.
Das war nicht gut.
Ich hab’s geändert.
Der Link im Menü ist jetzt immer aktiv, außer auf der Startseite des Weblogs.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Suchformular im Weblog

Samstag, 31. Dezember 2005

so, das dürfte die letzte Aktion des Jahres sein:
Ich hab das Suchformular für die Suche im Weblog an die gleiche Position im Menü gestellt, an der auch die allgemeine Seitensuche zu finden ist. Aus Gründen der usability schon lange notwendig.
(Daß die Blogsuche nur die Beiträge selbst, aber nicht die Kommentare durchsucht, ist eine andere Geschichte - aber vielleicht ist das ganz vernünftig so?)


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

mod_gzip

Samstag, 17. Dezember 2005

Weil ich Geschwindigkeitsfanatiker bin, liefere ich jetzt meine Seiten mit gzip komprimiert aus.
Texte werden dadurch auf etwa ein Drittel! komprimiert; mit entsprechenden Geschwindigkeitsvorteilen vor allem bei langsamer Internetanbindung.

Im einfachsten Fall sollte es genügen, an den Anfang der zu komprimierenden Datei folgendes zu setzen:

<?php
ob_start(’ob_gzhandler’);
?>

Genaueres dazu im PHP Manual
Grundsätzliches zu gzip


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Letzte Änderung dieser Seite

Samstag, 26. November 2005

fast jede mit PHP erstellte Seite schmückt sich irgendwo mit dieser Information. Und ich halte dies für wertvoll, sagt es mir doch, ob und wie aktuell der Inhalt der Seite ist.

Aber zumeist steht dann dort etwas wie:
Letzte Änderung dieser Seite: 18.05.05

Auf meinen Seiten heißt es jetzt stattdessen:
Letzte Änderung dieser Seite: heute, gestern, oder vor x  Tagen/Wochen/Monaten.

Ich finde das einfach schicker.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

IE5/mac

Dienstag, 1. November 2005

Weil das Design der Seiten unter IE5/mac zerschossen wurde, hatte ich diesem Browser bisher kein CSS geliefert.
Ich denke, daß ich den Fehler gefunden habe. IE5/mac erhält jetzt den gestylten Inhalt.
Da ich aber zum Testen leider keinen Mac zur Verfügung habe, sondern nur screeshots, bin ich auf entsprechende Rückmeldungen angewiesen.
Danke hierfür schon mal im Voraus.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

E-Mail Autoresponder

“Wir haben Ihre Nachricht erhalten, und werden schnellstens anworten”
So oder ähnlich lesen sich die von sogenannten Autorespondern erstellten automatischen Antwortmails.
Aussage: Der Absender kann ein E-Mail Postfach konfigurieren.
Wert: null komma null.
Resultat: zusätzlicher, sinnloser Spam, der mein E-Mail Postfach verstopft. Und das Schlimmste: ich kann mich kaum gegen diesen Unfug wehren. Ich kann diesen Spam auch nicht von meinem Spamfilter rausfiltern lassen. Schließlich erwarte ich von dieser Absenderadresse ja tatsächlich einen Antwort. Nur eben eine Antwort auf meine Frage, und nicht obigen Text.
Abhilfe: ?


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Konqueror

Sonntag, 2. Oktober 2005

webdesign weisshart im Konqueror BrowserNur publizieren, was auch getestet werden kann.
Nach diesem Motto habe ich bisher dem Konqueror Browser kein CSS geliefert.
Nachdem ich jetzt auch mit dem Konqueror 3.2.1 testen kann, kriegt auch dieser Browser das CSS, und damit alle Style-Angaben.
… obwohl noch einige Darstellungsfehler nachgebessert werden müssen. Am auffälligsten: dynatext, die dynamische Textersetzung, funktioniert nicht. Und damit ist der Style Leonardo unbrauchbar. Warum, weiß ich noch nicht.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Flash XHTML valid einbinden

Samstag, 27. August 2005

Die Flash Analoguhr, tausend mal im Netz, ist jetzt auch in meinem Menü zu bewundern.
Ja, ich weiß, Du hast selbst eine Uhr …
aber vielleicht wunderst Du Dich ja, wie lange Du auf meinen Seiten verweilst ;-)
Spaß beiseite:
Die Uhr dient nur dazu, zu zeigen, daß man Flash auch XHTML valide einbinden kann (der erste Schritt zur Barrierefreiheit). Der von Macromedia empfohlene Weg macht nämlich die Seiten invalide.
Wie es geht, kannst Du Dir ja im Quellcode meiner Seiten anschauen.
Beschrieben wird die Methode bei alistapart


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Fotos per MMS direkt vom handy auf die Homepage

Mittwoch, 10. August 2005

… wenn’s wirklich aktuell sein soll.
So was hatte ich schon länger im Sinn. Schnelle Texte vom handy auf die Website: das erledigt sms2web
Aber Fotos? knipsen - Fotos auf den PC laden - Bildbearbeitung anwerfen - in die Website einbauen - alles uploaden. Nein, das ist zu umständlich.
Aber jetzt geht’s ganz fix: MMS an mms2web - pronto! (oder gibt’s noch jemanden ohne Fotohandy?)
Ein wenig PHP war dazu schon erforderlich. ;-)


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Mehrsprachige Webseiten

Dienstag, 14. Juni 2005

Mehrsprachigkeit auf Webseiten wird meist mit einer Vorschaltseite realisiert.
Nicht sehr benutzerfreundlich:
Wer über eine Suchmaschine auf die Seite kommt, bleibt in der Sprachversion “hängen", in der er zufällig gelandet ist.
Wie man mehrsprachige Seiten flexibel gestaltet, kann man an diesem Beispiel sehen - und ausprobieren ;-)


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Ein Textmarker für Google & Co.

Samstag, 21. Mai 2005

Textmarker auf meiner SeiteWer über eine Suchmaschine auf meinen Seiten landet, findet jedes Vorkommen des bei Google & Co. eingegebenen Suchbegriffs auf meiner Seite automatisch farblich unterlegt (highlighting). Diese Aufgabe übernimmt ein kleines, aber feines Javascript, das sich leicht in HTML-Seiten einbauen lässt.
Das Script ist von Stuart Langridge. Danke Stuart.
Und ich hab’s mal ins Deutsche übersetzt.
Das Ganze funktioniert natürlich auch mit der seiteneigenen Suche

Support für das Script nur noch im Support Forum


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Breadcrumb-Navigation

Freitag, 6. Mai 2005

Eine Breadcrumb-Navigation - das ist die Zeile
“Sie sind hier: Startseite > Weblog
gleich nach dem Titel - bräuchte diese Seite eigentlich nicht; dazu ist sie zu klein.
Ich hab sie dennoch eingebaut - schließlich ist der Zweck dieser Seite ja in erster Linie, zu zeigen, was man wie macht.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Eingeschränktes Surfvergnügen

Freitag, 25. März 2005

Was ich alles beim Surfen im Internet verpasse:

  • Popups
  • die meisten Werbebanner
  • animated gifs
  • Laufschrift mit <marquee>
  • fremde Inhalte in der Statuszeile
  • Fenster, die sich selbständig auf Vollbild vergrößern
  • Java applets

hab’ ich was vergessen?
Ach ja: 35% meiner Besucher surfen mit dem gleichen Browser wie ich!


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Windows Version 1.0

Montag, 14. März 2005

hm? was soll denn das?
Ganz einfach: da fragt mich doch tatsächlich jemand, ob ich den Norton Commander kenne.

Meine Antwort:

1985 hatte ich den ersten PC in der unserer Firma.
Technische Daten:
Festplatte 20 MB, Hauptspeicher 512 kB, Grafik monochrom 640 x 480 px.
und MS DOS Version 5.
Damals war der Norton Commander hipp (das Wort gab’s damals vermutlich noch nicht)
Und Windows Version 1.0 gab’s auf einer 5 1/4 Zoll Floppy.
Dieses Win 1.0 bot folgende “features“:
Uhr, Notepad (ich nutz den übrigens heute noch zum Editieren), Paint, und Clipboard (kein Mensch konnte sich vorstellen, was man damit “zwischenablegen” sollte), alles schön verteilt auf 4 Fenster, die nicht in der Größe verändert werden konnten.
Ich könnt’ beim Gedanken daran direkt ins Schwärmen kommen.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Ein einfaches PHP Suchscript

Montag, 31. Januar 2005

Wenn Dir die Suchroutine auf diesen Seiten gefällt, überlaß ich Dir das Script gerne kostenlos.
Das Script durchsucht htm, html, php und txt Dateien, beliebig viele Verzeichnisse (aber keine Datenbanken), ist weitestgehend über Parameter konfigurierbar, und kann nahtlos in jedes Seitenlayout eingefügt werden.

Support bitte nur noch im Forum


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Popups

Sonntag, 23. Januar 2005

Vorschaubilder (sogenannte thumbnails), die bei Mausklick ein Fenster mit dem Bild in voller Größe öffnen.

unter diesem Titel habe ich auf meiner JS Seite ein Script vorgestellt.
Ich hab das Script jetzt gründlich überarbeitet:

  • Das popup ist jetzt valide.
  • ein Javascript Fehler, der bei verschiedenen Browsern auftrat, ist korrigiert.
  • <width> und <height> werden ins HTML des popups geschrieben; ein Vorteil für Modemnutzer: progressive .jpg werden schon während des Seitenaufbaus angezeigt.
  • <title> und <alt> Attribute werden ins HTML des popups geschrieben.

Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Suchformular

Sonntag, 19. Dezember 2004

Endlich gibt’s hier auch ein Suchformular..


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Dynamische Textersetzung

Donnerstag, 16. Dezember 2004

Die Seite im Stil LeonardoFür die Überschriften im Style “Leonardo” verwende ich eine Schriftart, die sicher nicht auf Ihrem PC installiert ist.
Wie so etwas geht, beschreibt Stewart Rosenberger in einem Artikel, der bei www.alistapart.com vorgestellt wurde.
Weil ich glaube, daß es gut auf meine Seite paßt, hab ich den Artikel ins Deutsche übersetzt.

Anregungen und Kritik sind diesmal ganz besonders willkommen.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Wie schnell ist diese Homepage

Mittwoch, 3. November 2004

Wenn sich eine Seite nicht in 8 Sekunden aufbaut, klicken 30% der Besucher wieder weg.

Um auch bei langsamer Internetanbindung Ladezeiten unter 8 Sekunden zu erreichen, darf eine Seite inclusive aller Bilder, Scripts, Stylesheets usw. nicht mehr als ca. 40 kB umfassen.

Wie schnell diese Seite ist, kann jeder selbst prüfen.

Mit ca. 28 kB für die Startseite hab ich mein selbst gestecktes Ziel von max. 8 Sekunden mit einem 56 kB Modem locker erreicht.

Nachtrag 01. Juni 2010:
Auch 6 Jahre nach Veröffentlichung dieses Blogbeitrags gilt unverändert: Webseiten müssen schnell laden.
Aber dass sich die Kriterien in der Zwischenzeit geändert haben, dürfte nicht verwundern.
Meine Startseite ist inzwischen keine 28 kB, sondern ca. 50 kB groß. Und wird in der Regel in maximal 2 Sekunden vollständig geladen. Weil 56 K Modems wohl nur noch im Museum zu finden sind.
Und der mobile Zugriff ist ebenfall blitzschnell. Weil für Handhelds ein spezielles CSS ausgeliefert wird.
Ich sollte wohl mal einen aktuellen Artikel zu diesem Thema schreiben.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Fraktur als Überschrift

Donnerstag, 21. Oktober 2004

Im Sylesheet Leonardo wird für die Überschriften der Schriftstil Fraktur verwendet.
So etwas geht normalerweise nicht. Es sei denn, Sie hätten zufällig auf Ihrem Rechner den passenden Font installiert. Aber das hat wohl niemand.
Eine Möglichkeit, fremde Fonts in eine Website einzubinden, gibt es für den Internet Explorer - aber NUR für den. Also wieder nichts!
Aber es geht doch! Und zwar so flexibel, daß ich es sogar in Verbindung mit meinem Styleswitcher einsetzen kann, also nur, wenn ein bestimmter Style gewählt wird. Und OHNE Änderungen am Quellcode!
Wie?
Das beschreibt Steward Rosenberger


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Meine Testbrowser

Dienstag, 19. Oktober 2004

Validen HTML Code und valides CSS schreiben ist eine Sache.
Die andere Sache ist, was verschiedene Browser daraus machen.
Da hilft nur Testen und nochmal Testen.
Dazu stehen mir folgende Testbrowser zur Verfügung, alle unter Windows:

  • Firefox 1.0
    (mein Favorit, nicht nur zum Surfen, sondern auch zum Entwickeln)
  • Opera 7.22
  • Internet Explorer 6.0
  • Internet Explorer 5.5 / Win95
  • Internet Explorer 5.0
    (ein Alptraum, was CSS Unterstützung betrifft)
  • Pocket IE 4.01
    (der kriegt per user agent Abfrage ein eigenes CSS zu sehen)
  • Netscape Navigator 4.77
    (ganz ohne CSS - aber die Seiten sind auch in diesem Dinosaurier voll funktionsfähig)
  • Lynx
    (DER Textbrowser)

Leider hab ich keinen Mac. Daher muß ich mich hier auf statische Screenshots verlassen. Die Funktionalität läßt sich damit natürlich nicht testen. Sollte irgendjemand sich mit einem Mac bis hierher verirrt haben, wäre ich über jeden feedback sehr dankbar.
Das gleiche gilt für PDAs mit Palm OS.


Blog / Artikel empfehlen: auf Twitter empfehlen auf Facebook teilen Google+

Ältere Beitäge:

Kategorien:

Tastaturkürzel

zum Seitenanfang