Linktipps String-Funktionen & Emailadressen vernebeln

tempa wrote this 21:47:

 
Linktipps:

  1. Eine schöne, praktische und verständliche
    Stringfunktionen-Übersicht auf HTML bis PHP: String-Funktionen.
  2. Die besten E-Mail-Vernebelungstechniken: Best Method for Email Obfuscation?

Zu 2.: Mein Favorit ist die ROT13-Javascript-Version. Aber, ohje, reines Javascript ist böse. Wir wollen also das <noscript> nicht vergessen, wenn auch das String Reverse mit CSS kaum als Barrierearm gelten kann, aber wenigsten wer Javascriptfrei surft, bekommt eine E-Mail-Adresse zu lesen.

Aus manfred.mustermann@wegwerf-emails.de wird via ROT13 encoder znaserq.zhfgreznaa@jrtjres-rznvyf.qr. Javascript decodiert den Buchstabensalat wieder:

  1. <script>
  2. document.write("<n uers=\"znvygb:znaserq.zhfgreznaa@jrtjres-rznvyf.qr\" ery=\"absbyybj\">Fraq n zrffntr</n>".replace(/[a-zA-Z]/g,
  3. function(c){return String.fromCharCode((c<="Z"?90:122)>=(c=c.charCodeAt(0)+13)?c:c-26);}));
  4. </script>

Mit der PHP Funktion strrev

  1. <?= strrev('manfred.mustermann@wegwerf-emails.de'); ?>

kehrt man die E-Mailadresse für den <noscript>-Tag um:
ed.sliame-frewgew@nnamretsum.derfnam
und die umgekehrte E-Mailadresse wird über CSS

  1. .obfuscate {unicode-bidi: bidi-override; direction: rtl;}

wieder zu: ed.sliame-frewgew@nnamretsum.derfnam. Nur mit dem Copy&Paste der E-Mailadress im <noscript> ... </noscript> wird’s nix mehr.

Link-Tipp: PHP – Regular Expression

tempa wrote this 13:41:

Yessss! Endlich habe ich eine Seite gefunden mit einem guten Cheatsheet für regular Expression. Hier zwei Links die einem wirklich weiterhelfen mit diesen Ungetümen, wobei der erste Link mir einen Tick mehr zusagt als der Zweite:

  1. php-regex: Regular Expressions Tutorial
  2. weblogtoolscollection: Regular Expressions Tutorial
     

Hier ist noch ein nützlicher Link: Powerfull onliner – PHP leere Zeilen entfernen (RegEX in der Praxis)

Aufräumen mit Tabs und Javascript

tempa wrote this 13:54:

Manchmal will man auf der Seite aufräumen, z.B. wenn man per iFrame sich bereits sehr komplexe zwei Seiten gegenüberstellt, wie google-Transation und ein Formular das in diversen Sprachen ausgefüllt werden soll. In meinem Fall waren das dann 22 iFrames jeweils 11 Mal gegenübergestellt. Also habe ich nach Tab-Navigation im Netz gesucht. Rausgekommen ist:

Nachdem unter den Treffern schon 25 Treffer über eine Tabnavigation-Sammlung in einem Blog ist und unter den Suchtreffern auch noch andere die Liste wiederholen, konnte ich schon nach der ersten Ergebnisseite aufhören zu suchen.

Zwei aus der Liste mit den 25 Varianten gibt es zwei die mich besonders beeindruckt haben. Zum Einsatz ziehe ich für meinen Fall aber nur eines in Betracht.

Nodetraveller hat unter Module Tabs eine beeindruckende Funktionalität der Tabs aber ohne Javascript zickte die Seite bei mir und war so gar nicht unobtrusive.

Einfach, übersichtlich, valide, funktional und vor allem unobtrusive erwies sich DOMTab – Navigation tabs with CSS and DOMscripting auf Onlinetools.org

Das hier noch aufgeführte Tab-Menu YETTII fehlt in der Liste der 25, wurd in Smashing Magazin unter 75 really useful Javascript techniques gefeatured, weil es von der Funktionalität ebenfall durchaus beeindruckt, aber wie auch schon die Tabnavigation von Nodetraveller nicht wirklich auf sein Javascript verzichten kann und fällt damit bei meinen strengen Vorgaben durch.

Ebenfalls beeindruckend, um seine Navigation rassig und nützlich (weil informativ) aufzumotzen fand ich übrigens das Beispiel von Dynamic Drive unter DD Tab Menu (5 styles) Das zublenden von Linkerläuterungen ohne die Informationen in die Linkliste reinzupressen macht es für die meisten CMS-Tools leicht integrierbar.

Nachtrag: Seufz – nehmen wir noch die Liste mit den 37+ Great Ajax, CSS Tab-Based Interfaces hier auf … auch wenn sich der eine oder andere Link natürlich wiederholt und dann lass ich es aber besser gut sein und implementiere die DOMTABs in mein 11-sprachiges SPRD-Design-Publikations-Monstrum.

Nachtrag 2: Manche nachteile zeigen sich erst, wenn man die Demo im echten Leben umsetzen will, so verschluckt das DOMtab nested DIVs. DAs ist natürlich ein böses nogo. Aktuell arbeite ich wenig erfolgreich daran, das „getElmenetByID(DIV)“ mit der Funktion getElementByClassName(el,class) (Fundstelle: Your Favourite getElementsByClassName) im Script zu ersetzen. um nur noch DIVs auszublenden, die eine entsprechende Klasse mitführen. Das Ergebnis stelle ich dann hier vor. Natürlich könnte man auch im Netz eine fertige Lösung suchen, aber hey … ein Skript überarbeiten schult ungemein. Da will ich mich ein wenig mit Javascript quälen, zwischen all den anderen Aufgaben, die meine Zeitplanung aktuell bestimmen. 😀

Nachtrag 3: Planänderung: nachdem ich mich erst wieder in objektorientiertes Javascript einarbeiten müsste und das Netz nicht selten irgendwo, Probleme längst gelöst hat, habe ich mich dann doch noch einmal umgesehen und wurde fündig. Unbtrusive und eine Klasse bestimmt was zum Inhalt der Registerkarte zählt. Auch wenn ich noch nicht den Test gemacht habe. Der erste Eindruck ist jedenfalls beeindruckend und einen Linktipp wert:
  … and the winner is …

 
Standalone Unobtrusive Tabs Script: SimpleTabs By Komrade.
 

öps … öh … dieser Winner muss auch überarbeitet werden. Siehe Kritik im nachfolgenden Artikel „Unobtrusive JavaScript Rules“. Jajajaja …. 😀

PHP-Shorthand – ein Überblick (Linktipp)

tempa wrote this 15:32:

Nicht alles was ich da sah, erkannte ich als Shorthand, denn ich dachte, das sei die ganz normale Syntax, aber immerhin hier ist für den Anfänger ein kleiner Einblick der wichtigsten Shorthand-Syntax-Beispiele: PHP Shorthand Syntax

Nachtrag: Das sollte ich hier wohl auch noch dazu packen, obwohl ich es dann noch weniger als Shorthand erkannte und auch als relative Unvollständig empfinde. Schließlich wurde auf „.=“ nicht eingegangen: PHP Shorthand Reference (link lost) ersatzweise: PHP – Shorthand If…Else Statements

jajaja … alle vergessen die Hälfte und unter PHP Shortcuts findet sich noch dieser Links: These Things I Know, PHP Tips

Gute Linktipps zum Thema Shorthand, Shortcuts zur Ergänzung der Linktipps hier werden gerne in den Kommentaren entgegengenommen.

CSS-Liste wie ein Buchindex

tempa wrote this 05:23:

Liste im Buchindex-Layout (Illustration)

Eine Liste, die wie das Inhaltsverzeichnis in einem Buch aussieht, kann man immer gebrauchen. Das ist schon einen Linktipp wert.

CSS: Menu List Design,
ein tutorial von Webdesignerwall.com

Have, fun.

Linktipps: KW12 2008

tempa wrote this 10:16:

Und eine neue Woche eine neue Liste. Wie es scheint komme ich nur noch zum lesen und Linklisten posten .. tststs!

  1. Das Geheimnis des Grunge-Designs(Es ist einer von Smashingdesigns Monster-Einträgen, wenn der Rechner/Browser ohnehin schon am Limit läuft, besser nicht ansurfen.)
  2. Die Populärsten CSS-Tricks
  3. Linkbait-Titel Kurzzeit- und Langzeit-Strategien
  4. Semantifiy the WEb

Anmerkung am Rande und offtopic: Mit leichter Verspätung. Ich war etwas eingespannt in Bezug auf etwas, von dem ich glaubte es in einer 1/2 Stunde erledigt zu haben und dann beschäftigte es mich über Gebühr und wird mich wohl noch die nächsten Monate mit meiner Zeiteinteilung hadern lassen. Das mit den Prioritäten ist so eine Sache. Manchmal muss man einfach eine Idee beim Schopf packen und hat man sie beim Schopf gepackt, dann nimmt sie einen hier und da einfach mit. Dazu später mehr …

Linktipps: KW11 2008

tempa wrote this 10:00:

Und auch am Ende dieser Woche gibt es, was ich so in meinem Feedreader an guten Beiträgen vorfand oder bei Recherchen im Netz. Da ich noch am Aufarbeiten bin von sehr vielen Beiträgen, heißt das nicht, dass diese Tipps brandaktuell sind. Doch was bedeutet schon brandaktuell, wenn die Botschaft zeitungebunden ist, was eben bei technischen Tipps und Tricks häufig der Fall ist — zumindest relativ … 😉

  1. Gleiche Zwischenabstände mit CSS
  2. Kleine Linkliste zu Websites-Karusells
  3. Font-Viewer (Ein Helfer wie man ihn nicht missen möchte)
    Keine umständliche Installation, einfach ein Doppelklick auf die Exe. Ordner mit Schriften wählen, durchblättern und temporär für die Arbeit verfügbar machen. Kein Installieren, Programm Neustarten, Arbeiten, Programm deinstallieren. Absolut Cool und herrlich unkompliziert nützlich.
  4. Tabellen gestalten, Spalten hervorheben

Ostern naht: freie Headergrafiken für das WP-Theme dKret3

tempa wrote this 07:11:

Es gibt noch einmal einen Satz Headergrafiken für das WP-Theme dKret3:

Osterbanner für WP-Theme dKret3
Osterheader
Osterbanner für WP-Theme dKret3
Osterbanner für WP-Theme dKret3
Osterbanner für WP-Theme dKret3
Osterbanner für WP-Theme dKret3

Achtung, an dieser Stelle sind die Banner verkleinert, die Originale gibt es auch dieses Mal im Weblog auf PG4ME. Die Banner sind mit dem Beitrag zu den Headergrafiken verlinkt. Dort steht, wie man diese Herunterladen kann. Wo es passt, kann diese Osterdekoration natürlich auch eingebunden werden, wenn es sich dabei nicht um das WP-Theme dKret3 handelt

KükenIch versichere, dass ich diese Banner gestaltet habe und ich stelle diese unter der Lizenz Creative Commons 2.0 by nc, wobei ich die Verwendung für den Eigenbedarf auf kommerziellen Seiten ausdrücklich gestatte. Ungemütlich werde ich, wenn diese Banner ungefragt in Sammlungen auftauchen oder gar verkauft werden. In Bezug auf anderen Sammlugnen: Fragen kostet nichts, es gibt einige Projekte, die meine Zustimmung bekämen. 🙂

Und wer wissen möchte, wie man ein Cartoon mit Papier, Bleistift einem schwarzen Stift , einem Scanner und Photoshop zeichnet, für den gibt es in der Spielwiese zum Banner auch noch ein Tutorial.

Hasen-Tutorial

Es ist etwas früh für Ostern aber dann … die Seiten müssen ja schließlich dekoriert werden.

Linktipps: KW10 2008

tempa wrote this 12:30:
  1. Photoshop-Tutorials:
  2. Einige nützliche Links auf Perishable Press:

Linktipps: PHP

tempa wrote this 04:28:

Quellen, Listen, Snippets und gute Ratschläge aus dem Netz:

So und damit ist mit der Reihe 1001 Linktipp-Overload für heute erst mal Schluss 🙂

Einen hab ich noch, einen hab ich noch: 5 Coole Sachen machen mit Windows und PHP

Recent Comments:

  • Silke schümann { Du warst auf dieser Seite: Step1 zur Archiv-Thumbgalerie via Custom fields Marke Eigenbau http://templaterie.de/blog/931/step1-zur-archiv-thumbgalerie-via-custom-fields-marke-eigenbau/ Hier war ich noch am Basteln. Ich fürchte meine PHP-Kenntnisse sind... } – Aug 26, 9:29 AM
  • Andreas { Hey, ich habe den Code wie oben benutzt und auch $dgal = get_posts('category=1′); on der richtigen Zeile eingesetzt nur bei mir läufts immernoch nicht. Kann... } – Aug 26, 3:20 AM
  • Fred { "wer Smarty lernt, kann tatsächlich gleich auch PHP mitmachen, ich hatte es eine zeitlang auch eingesetzt, aber jetzt mach ich es wieder auf meine art... } – Jan 06, 7:14 PM
  • Silke Schümann { Das klingt nach einem Syntaxfehler in der ersten Zeile. Anführungszeichen korrekt? Und das Plugin funktioniert nur innerhalb von Editland. Die index.php ausserhalb von Editland aufzurufen... } – Jun 18, 3:40 PM
  • Jörg { Hallo, ich habe die index.php im ersten Abschitt Nr. 3 beschrieben, angelegt. Beim Aufruf der Seite wird folgende Fehlermeldung angezeigt: Parse error: parse error, unexpected... } – Jun 18, 3:14 PM
  • Michael { Gern geschehen 😉 } – Mai 29, 2:31 PM
  • Silke Schümann { Jepp. Das war's: ES tut! Lösung ist nun in einem eigenen Beitrag: Step1 zur Archiv-Thumbgalerie via Custom fields Marke Eigenbau Fertig und betriebstüchtig! 🙂 } – Mai 29, 1:25 PM
  • Michael { Wie wäre es, wenn Du die Zeile $dgal = get_posts('category=1'); auslagerst und den Rest in eine Funktion packts, der Du $dgal übergibst. Das wäre auch... } – Mai 29, 12:45 PM
  • Silke Schümann { Ich ziehe diees Variante ebenfalls vor, dovh wenn ich Code übernehmen, dann ändere ich hierfür nicht extra. Es dürfte gehzpft wei gesprungen sein, welche man... } – Mai 29, 2:00 AM
  • Ulf { ich würde bei der Syntax für Schleifen konsequent die C-ähnliche Variante mit geschweiften klammern nehmen, nicht die alternative mit Doppelpunkt und "endwhile" bzw. "endforeach". } – Mai 29, 12:00 AM
  • Silke Schümann { Ich habe ich http://franchie.de die Thumbs in der Sidebar erfolgreich ausgelesen. Ansonsten ist die Test-Umgebung unter 1a-test dot de / blog Ich will diese Adresse... } – Mai 28, 11:37 PM