Manuel-Bieh.de – Web-Development & Consulting

Deutsch English

Archiv:

Latest photoblog

photoblog

Blog

Weblogverzeichnisse aktualisiert

Meine Liste vom 13.Oktober 2004 mit deutschen und internationalen Weblogverzeichnissen habe ich auf Grund des Kommentares von Testi um ein Verzeichnis erweitern können. FeedArea.de wirkt auf mich noch etwas unübersichtlich, mag aber daran liegen das bisher kaum Weblogs verzeichnet sind. Scheint also ein ziemlich neuer Dienst zu sein!

www.feedarea.de

CSS Signaturen

Eine selten genutzte Möglichkeit bieten aktuelle Browser in der Form vom Einbinden von User Stylesheets, welche man mit dem hinzufügen einer eigenen CSS-Signatur entgegenkommen kann.

Dem HTML-Element wird dabei eine Identifikationsbezeichnung zugewiesen, welche optimalerweise die Form
<html id="domain-tld"> haben sollte. Der User kann so mittels eines speziell angelegten Stylesheets für entsprechende Seiten Umformatierungen vornehmen, um so, beispielsweise bei einer Sehschwäche, Schriftgrade, Zeilenhöhe oder Kontraste zu erhöhen, Bilder auszublenden, oder einfach kleinere Modifikationen nach persönlichem Geschmack vorzunehmen.

Wie man eigene Style-Deklarationen in den gängigen Browsern einbindet, möchte ich versuchen euch mit diesem Artikel näher zu bringen, und gleichzeitig dazu aufrufen in Zukunft ebenfalls eine solche Signatur mitzuliefern. Denn dazu bedarf es gerade mal der Modifikation einer einzigen Zeile im HTML-Dokument, es steigert den Wert einer Seite in meinen Augen jedoch ungemein.

Nehmen wir als Beispiel diesen meinen Weblog welcher die Signatur „manuelbieh-de“ mitgeliefert bekommt. Hier könnte man nun, sollte man regelmäßig meinen Weblog lesen, jedoch immer schon der Meinung gewesen sein, dass mein Farbsinn unzumutbar ist, durch

#manuelbieh-de a {color: #006600 !important;}
 die Farbe aller sich auf der Seite befindlichen Links in einen dunklen Grünton ändern. Die Kennzeichnung „!important“ hinter der Style-Angabe spielt dabei eine entscheidende Rolle, da aufgrund der Kaskadenregeln des w3c, durch !important gekennzeichnete Regeln die höchste Priorität besitzen, und daher schwerer durch das seitenspezifische Stylesheet überschrieben werden können.

Hat man nun für Seiten, die entsprechende Signaturen anbieten, eigene Style-Angaben gemacht, muss man diese noch in seinem entsprechenden Browser verfügbar machen. Dies erreicht man wie folgt:

Mozilla / Firefox

Die Deklarationen für ALLE gewünschten Seiten müssen in eine Datei geschrieben werden. Diese wird als userContent.css gespeichert und im Profilordner des Browsers, und dort im Cache Unterverzeichnis abgelegt. Dieses findet sich (unter Win2000 & XP) in der Regel unter:
C:/Dokumente und Einstellungen/Benutzername/»
Anwendungsdaten/Mozilla/Firefox/Profiles/xxx.default/chrome

Dort hinein gespeichert ist das Stylesheet nach dem Neustart des Browsers für die angegebenen Seiten verfügbar. Dabei ist darauf zu achten das im laufenden Betrieb keine Änderungen gemacht werden können. Nach einer Änderung muss der Mozilla-Browser stets neugestartet werden um die Änderungen verfügbar zu machen.

Internet Explorer (Windows)

Auch hier müssen alle gewünschten Angaben in eine einzelne CSS-Datei gepackt werden. Um im Internet Explorer das eigene Stylesheets einzubinden ist dann folgendes zu tun:

Browser starten, und in der Menüleiste wählen: „Extras -> Internetoptionen -> Allgemein“. Nun sollte man unten rechts unten einen Button „Eingabehilfen“ sehen. Diesen klickt man, und aktiviert im aufklappenden Fenster den Punkt „Benutzerstylesheet – Dokumente mit dem eigenen Stylesheet formatieren“. Nun muss nur noch das entsprechende Stylesheet ausgewählt werden, [welches wir vorher idealerweise im Mozilla-Profilordner abgelegt haben sollten um in beiden Browsern die gleichen Änderungen zu erhalten], und OK geklickt werden. Nun ist das eigene Stylesheet auch im Internet Explorer verfügbar!

Internet Explorer (Mac)

Hier findet man den entsprechenden Punkt nicht wie beim Windows-Pendant bei den Internetoptionen, sondern unter:
Explorer -> Einstellungen -> Webinhalt -> Lokales Stylesheet

Dort wie gehabt beim entsprechenden Punkt die Datei auswählen, und bestätigen.

Opera

Im Opera sieht die Sache ein wenig anders aus. Hier kann das gewünschte Stylesheet ähnlich wie im Internet Explorer frei gewählt werden, es gibt jedoch auch eine Möglichkeit um das User-Stylesheet in mehrere CSS-Files [beispielsweise für jede Seite ein spezielles] zu teilen. Die einfache Version funktioniert wie folgt:
„Datei -> Einstellungen -> Seitendarstellung“ – unter „Eigenes Stylesheet“ die CSS-Datei auswählen, anschließend unter „Moduskonfiguration…“ den Haken bei „Mein Stylesheet verwenden“ setzen.

Wer neugierig auf die zweite von mir angesprochene Methode geworden ist, liest am besten Selbst nach.
Eine genaue Anleitung zum Thema hat Thomas Scholz im XHTMLForum verfasst:
http://www.xhtmlforum.de/viewtopic.php?p=12196#12198
Vielen Dank dafür!

Safari

Natürlich gibt es auch im Safari auf dem Mac die Möglichkeit ein eigenes Stylesheet einzubinden. Die Möglichkeit dazu findet sich hier unter:
Safari -> Einstellungen -> Erweitert -> Style Sheet -> Auswählen

Gerade – wie am Anfang des Artikels bereits angesprochen – für behinderte Menschen kann dies eine große Hilfe sein, da diese sich Seiten notfalls ihren Bedürfnissen anpassen können. Aufgrund dessen das es lediglich eine Arbeit von Sekunden ist, sollte man in Erwägung ziehen ob man dies nicht nachträglich in aktuellen bzw. zumindest in zukünftigen Projekten beherzigen möchte. Es gibt Leute die darüber durchaus dankbar sein können. Der Wert einer Seite lässt sich so wie gesagt mit nur wenig Aufwand steigern …

Für den Firefox gibt es eine Extension welche Internetseiten automatisch um eine ID in der Form <body id="www-domain-tld"> ergänzen soll. Funktioniert hat dies bei mir im Testlauf jedoch leider nicht fehlerfrei: URIID
http://extensionroom.mozdev.org/more-info/uriid

Links zum Thema:
http://www.mozilla.org/unix/customizing.html#userContent
http://www.xhtmlforum.de/viewtopic.php?p=12196#12198
http://www.squarefree.com/userstyles/user-style-sheets.html
http://extensionroom.mozdev.org/more-info/uriid
http://edition-w3c.de/TR/1998/REC-CSS2-19980512/kap06.html
http://www.w3.org/TR/CSS21/cascade.html

PDF Mag Pornofitti

Habe gerade ein PDF Mag gefunden welches ich bisher noch nicht kannte. In „Pornofitti“ liegt der Fokus klar [wie man am Namen schon erkennen kann] auf Graffiti. Teilweise sehr abgedrehte Arbeiten, die mir aber sehr gut gefallen haben.

Der Download befindet sich etwas versteckt unter http://ekosystem.org/

Habe die Liste der PDF-Mags die ich mal zusammengestellt hatte auch dementsprechend aktualisiert.

Anti rel=“nofollow“-Buttons

Ich glaube in keinem Weblog der sich irgendwann mal über Commentspam befasst hat [und noch in vielen anderen], ging es vorgestern nur um das rel=“nofollow“-Attribut der großen Suchmaschinendienste wie Google, MSN oder Yahoo. Ziel dieses Attributes ist, das die Suchmaschinen derartige Links nicht mehr verfolgen, Kommentarspam also im Prinzip sinnlos wird, da auch der Pagerank nicht erhöht wird.

Von der semantischen Korrektheit dieser Methode mal ganz abgesehen, halte ich es schlicht für schade, hirnrissig und doof. Es ist immerhin nett das Google und Co mit der Thematik auseinandersetzen und versuchen Lösungen zu finden. Aber meiner Meinung nach ist das auf jeden Fall ein Schritt in die falsche Richtung. Wie ich bereits in einigen Weblogs als Kommentar geschrieben habe, finde ich das Kommentare in fremden Weblogs, solange sie hilfreich und zum Thema passend sind, ruhig dadurch belohnt werden das Suchmaschinen den Link auf der Seite zur Kenntnis nehmen, und ggf. den PR erhöhen.

Es wurde zwar bereits über Möglichkeiten diskutiert das es sich einrichten ließe, dass registrierte Benutzer Links ohne rel=“nofollow“ posten können, wodurch sich auch eine kleine Community im Weblog bilden würde, aber bei wievielen Seiten soll ich mich dann bitte noch anmelden? Also wirklich nicht. Auch wenn die Idee was Gutes hat. Ist aber wie ich finde eher Wunschdenken das sowas gut funktioniert.

der WWWorker hat eine ähnliche Meinung vom rel=“nofollow“ Attribut, und zeigt dieses jetzt auch mit seinen
NoFollow Button-Buttons.

Wer also ebenfalls dieser Meinung ist, kann sich der Initiative mal anschließen. ;)
http://www.itst.org/nonofollow/

Kleinere Änderungen auf der Seite und im Blog

Ich habe mir in letzter Zeit einige Gedanken gemacht wie es mit meinem Blog weitergehen soll, da ich mir bisher nie wirklich sicher war in welche Richtung ich mit meiner Seite und meinem Weblog hin möchte. Einerseits ist es meine eigene kleine private Seite, auf der ich mich und mein Leben im Netz breittreten möchte. Andererseits möchte ich auch einen Nutzen bieten das Ihr, meine Besucher, die Seite besucht, und auch gerne mal wiederkommt.

Daher habe ich mich entschlossen in Zukunft eine Richtung ähnlich wie Alp einzuschlagen:

Zuerst einmal wird jetzt nur noch ein Artikel auf der Weblogstartseite angezeigt. Das führt (hoffentlich) dazu, dass ich nicht mehr soviel Micro/Mini-Content präsentiere, sondern ein Thema ausführlicher behandele.

Ähnlich soll es bei mir auch sein. Von daher habe ich Anzahl der auf der Startseite gezeigten Einträge von 15 auf 5 verringert, und ich werde mich bemühen in Zukunft vielleicht nicht so oft, dafür aber ausführlicher und tiefsinniger über Themen zu schreiben. Den Anfang habe ich ja bereits mit den ersten Einträgen dieser Woche getan, denke ich.

Auch für die Zukunft habe ich mir bereits einige Themen – hauptsächlich Webentwicklung betreffend – überlegt über die ich schreiben werde. Angedacht sind [sobald es die Zeit zulässt, welche im Moment bei mir leider wirklich sehr rar ist] hauptsächlich fortgeschrittene Tutorials zum Thema CSS. Zusammenfassungen schon bekannter Artikel, aber auch eigene Erklärungen mit welchen Techniken oder Tricks ich mir den Arbeitsalltag teilweise sehr erleichtere.

Ihr könnt mich also syndizieren, oder einfach öfters mal vorbeischauen, sicher ist bisher nämlich nur das diese Texte (die teilweise schon halbfertig auf meinem Rechner liegen) definitiv kommen, wann dies sein wird ist aus den genannten Gründen allerdings noch unklar.

Diese dämliche Musikindustrie!

Wie ich gerade erfahren habe möchte eine mir bis dato unbekannte GVL (Gesellschaft zur Verwertung von Leistungsschutzrechten) die Gebühren die zum betreiben eines Internetradios gezahlt werden müssen, um bis zu 1000% erhöhen. Dies würde den allermeisten Webradios das Genick brechen, was ich sehr schade finde, da ich mittlerweile ausschließlich Livestreams höre. Von daher wurde die Seite www.gvl-protest.de ins Leben gerufen. Eine Seite die wie der Name schon sagt, gegen diese Erhöhung protestiert. Bleibt nur zu hoffen das diese Aktion etwas bewirkt.

Also, hinsurfen und in die Protestliste eintragen. Das ist jetzt ein offizieller Befehl von oberster Stelle, nämlich von mir! ;)
www.gvl-protest.de !

Skype Gespräche Mitschneiden

Einer der häufigsten Suchbegriffe durch die man über google auf meine Seite kommt, lautet „Skype Gespräche mitschneiden“. Da es jedoch hier, und auch anderswo im Netz keine wirkliche Anleitungen dafür gibt wie man bei Skype Gespräche mitschneidet, möchte ich hier und jetzt eine Möglichkeit zeigen, wie man dies tun kann.

Zuallererst benötigt man ein Programm, welches alle von der Soundkarte gesendeten Töne (System Mixer) gleichzeitig aufzeichnen kann, da Skype an sich keine derartige Funktion bietet.

Ein solches Programm für Windows ist in der Programmsammlung „Rosoft Audio Tools“ enthalten, und nennt sich „Rosoft Audio Recorder“ -> http://www.rosoft.nu/index.php?download_free_programs=1
Aufgrund mangelnder Testmöglichkeiten kann ich leider kein Programm für Linux oder Mac nennen, welches diesen Funktionsumfang ebenfalls bietet. (Vielleicht weiß meine Leserschaft weiter?)

Nach der Installation ruft man im Startmenü den Recorder auf. Danach gibt man in den „General Options“ den Speicherort für die aufgezeichneten Gespräche an, unter „Devices“ wählt man die Soundquellen aus. Dort sind in der Regel der „Microsoft Soundmapper“ und die eigene Soundkarte gelistet. Mit dieser Einstellung sollte man ein wenig selbst experimentieren, bei meinen Tests brachte der Soundmapper von Microsoft die besten Ergebnisse.

Damit wäre auch schon das Grundlegenste erledigt. In Zukunft kann nun per Klick auf den roten Recordbutton im Programm Hauptfenster jedes Geräusch das die Soundkarte verlässt bzw. erreicht aufgezeichnet werden. Also eben auch Skype. Wem dann das aufgezeichnete Gespräch zu leise vorkommt, der sollte in der Windows Lautstärkeregelung die Regler höher stellen, oder im programmeigenen Optionspanel mit dem Punkt „Volume“ herumspielen. In meinem Fall musste ich diesen Wert auf 200% setzen um eine angenehme Lautstärke zu erreichen.

Das Programm speichert die Mitschnitte automatisch als 44khz WAVE-File ab. Um die Gespräche nun in das platzsparendere .MP3-Format zu bringen, muss man lediglich in der Menüleiste „MP3 -> Convert Files to MP3“ (STRG+M) klicken. Dann wird man, falls diese nicht vorhanden sind, aufgefordert die Dateien lame.exe sowie die lame_enc.dll zu installieren. Der Downloadlink sowie eine Installationsanleitung wird jedoch im aufpoppenden Fenster gleich mit angezeigt.

Ich hoffe diese Anleitung hat euch ein wenig geholfen wie man Skype Gespräche mitschneiden kann. Sollten jedoch noch Fragen geben, die Erklärte Methode nicht richtig funktionieren, oder ich irgendwo Fehler in den Text gehauen haben, macht es wie die Spammer und nutzt rege die Kommentarfunktion. Dafür das das Programm aussieht als wäre es unter Windows 3.11 entwickelt worden kann ich allerdings auch nichts, ich hatte die Wahl zwischen einem schönen, jedoch kostenpflichtigem Programm, und einem Programm das hässlich wie die Nacht, aber dafür immerhin kostenlos ist. Ich habe mich dann aber da nicht jeder bereit ist 19$ für ein Programm auszugeben welches es auch kostenlos gibt, für die zweite Variante entschieden!

Viel Erfolg beim Ausprobieren! ;)

Neue Fenster in WordPress Einträgen

Wer beim Erstellen von WordPress-Einträgen der Einfachheit halber nicht auf die Quicktags verzichten will, es ihm aber zu nervig ist für jeden Link den von mir beschriebenen JavaScript Code per Hand rein zu editieren, der kann dies ganz einfach haben.

Und zwar:
quicktags.js im wp-admin-Ordner öffnen, und runterscrollen bis zu Zeile 355.

Dort einfach die Zeile entsprechend der beschriebenen Methode editieren, speichern und ins entsprechende Verzeichnis auf dem Server hochladen. Aber Achtung! Die Hochkommas im window.open Teil müssen mittels Backslash maskiert werden, da sonst garkeine Quicktags mehr angezeigt werden. (Da spricht jemand aus Erfahrung ;) )

Neues Fenster für Links unter XHTML 1.0 Strict und höher

Mal ganz davon ab ob es wirklich sinnvoll ist für Links ein neues Fenster zu öffnen, statt dem User selbst die Entscheidung zu überlassen, ich möchte schon das ein Besucher meiner Seite, selbige nicht verlässt und vergisst sobald er unbedarf einen Link geklickt hat. Bei einem XHTML Doctype ab Version 1.0 Strict ist die Angabe eines Target-Attributes bei Links jedoch nicht valide. Also muss eine andere Lösung her: JavaScript.

Jeder kennt die Popuplinks die über <a href=“#“ onclick=“window.open(‚…‘);“> aufgerufen werden. Dies erfüllt zwar seinen Sinn, ist aber nicht besonders elegant gelöst, da User mit ausgeschalteten JavaScript nämlich schlicht garnichts zu sehen bekommen. Gerade wer auf Accessibility setzt, und das tut man in der Regel wenn man sich nicht unbedarf für den XHTML Dokumententypen entschieden hat, sollte sich im klaren sein das viele (Seh)Behinderte JavaScript ausgeschaltet haben. Popup-Links wären für diese Gruppe von Usern also nicht sichtbar. Also muss eine andere Lösung her. Eine Lösung die bei Usern funktioniert die das Scripting im Browser ausgeschaltet haben, und bei Usern die dies nicht haben.

Und die Lösung ist einfacher als man vielleicht denkt. Es muss keine Funktion neu geschrieben werden, oder Links in Arrays geschrieben werden, oder oder oder…
Es reicht lediglich seinen Link in folgender Form aufzubauen

<a onclick=“window.open(this.href;’_blank‘); return false;“
href=“http://www.manuelbieh.de“>Linktext</a>

Dadurch wird dem Browser mit eingeschalteten JavaScript mitgeteilt, das er für den entsprechenden Link (this.href) ein neues Fenster (window.open) öffnen soll, mit dem Ziel ‚_blank‘. Danach wird alles weitere ignoriert, da ‚false‘ zurückgegeben wird.

Ist JS dagegen deaktiviert, wird lediglich der onclick-Teil des Links ignoriert (der Browser interpretiert eben kein JavaScript), und ganz normal der href-Link geöffnet.

So kann man der (wenn man so möchte) Usability wieder ein wenig entgegenwirken, ohne das die Zugänglichkeit oder die Validität eingeschränkt wird. Und wer möchte hat bei derartigen Links auch immernoch die Möglichkeit die Seite per Click mit der mittleren Maustaste im Tab zu öffnen.

//Update:
Da der Kommentar durch WordPress leider abgeschnitten wird, die Methode jedoch ebenfalls sehr einleuchtend ist, hier also nochmal die im Kommentar beschriebene Variante:
window.onload = function() {
  links = document.getElementsByTagName('a');
   for(i=0; i<links .length; i++) {
    if(links[i].className.match(/external/)) {
     links[i].target = '_blank';
    }
  }
}

Dem entsprechenden Link wird in diesem Beispiel eine Klasse (in diesem Fall ‚external‘) gegeben, woraufhin das Script weiß das es ein externer Link ist, der im neuen Fenster geöffnet wird. Funktionierte bei meinen Tests ebenfalls in allen gängigen Browsern.

Vielen Dank dafür nochmal an Herrn Heß! ;)

« Letzte Seite|Nächste Seite »