CSS 3: Google bietet 18 kostenlose Web-Fonts an

CSS 3 buhlt mit seinen neuen Eigenschaften um die Gunst der Web-Entwickler. Da gibt es nicht nur Boxen mit runden Ecken sondern auch Schatten und Transparenzen. Auch herunterladbare Schriften, Webfonts genannt, gehören zu den neuen Features, die uns CSS 3 bringt. Diese Schriften liegen auf dem Server, so dass sie auch bei Besuchern angezeigt werden, auf deren Computer sie nicht installiert sind. Damit wird man endlich unabhängig von den wenigen Schriften wie Arial und Verdana, die die Browser von Haus aus mitbringen, ohne auf grafiklastige Lösungen mit ihren bekannten Nachteilen ausweichen zu müssen. Noch gibt es verschiedene Schriftformate für unterschiedliche Browser und zusätzlich diverse rechtliche Einschränkungen, die den Einsatz von Standardschriften als Webfonts erschweren. Da kommt das Angebot von Google gerade recht. Der Internet-Gigant bietet 18 verschiedene Schriften zum Einsatz als Webfonts auf seiner Website (google.com/webfonts) an. Einbinden können Sie diese Schriften recht einfach. Man wählt eine der Schriften und klickt sie an. Jetzt wird angezeigt, wie die gewählte Schrift in unterschiedlichen Größen aussieht. Die Option "Character Set" zeigt, welche Zeichen in dieser Schrift zur Verfügung stehen, so dass man vorher nachsehen kann, ob auch Umlaute und andere benötigte Sonderzeichen unterstützt werden. Die Option "Get the code" zeigt die Codezeilen zum Einbinden der Web-Schrift. [...]

2010-07-24T20:49:36+02:00Juli 26th, 2010|Allgemein|Kommentare deaktiviert für CSS 3: Google bietet 18 kostenlose Web-Fonts an

NoSQL – Nicht nur SQL

Der Begriff NoSQL wird meist falsch interpretiert. NoSQL steht nicht für "kein SQL" (no SQL), sondern für "nicht nur SQL" (not only SQL). Damit soll das Ziel dieser neuen Techniken verdeutlicht werden: Es geht darum, die Schwächen der SQL-Systeme  mit ihrem riesigen Overhead durch differenzierte Vorgehensweisen zu überwinden. Die Diskussion läuft erst seit 2009, bis dato galten SQL-Systeme als der unbestrittene Standard bei Webanwendungen. Die ersten NoSQL-Systeme kamen von großen Internetdiensten wie zum Beispiel Google mit BigTable, das bei Google Maps, Google Earth, YouTube und Blogger eingesetzt wird und als HBase frei verfügbar ist. Das Netzwerk Facebook entwickelte dafür Cassandra, das ebenfalls frei verfügbar ist. Auch Twitter will jetzt auf Cassandra umstellen, um mehr Tweats pro Zeiteinheit ausliefern zu können. Dazu kommen noch Open Source Projekte wie Couch DB, Hypertable oder MongoDB. Die meisten NoSQL-Datenbanken haben eine HTTP-basierende Schnittstelle nach dem REST-Konzept (Representational State Transfer) zum Zugriff auf ihre Inhalte realisiert. Statt der üblichen Befehle in der Datenbankabfragesprache SQL werden die Befehle Get, Put, Post und Delete benutzt.

2010-07-20T09:04:57+02:00Juli 22nd, 2010|Allgemein|Kommentare deaktiviert für NoSQL – Nicht nur SQL

HTML 5: Web-Video ohne Plugins

HTML 5 bringt natürlich mehr als nur semantische Tags. Eines der neuen Features ist das <video> - Tag. Damit können endlich Audio- und Videoclips auf Webseiten angeboten werden, die der Besucher ohne irgendein Plugin abspielen kann. Web-Video mit HTML 5 ist wirklich sehr einfach einsetzbar. Mit <video src=“meinvideo.mp4“ controls> ist der bewegte Inhalt schon abrufbar. Mit einem Startbild, das man gene benutzt, wenn der Inhalt von einem anderen Server kommt, sieht es dann so aus: <video width = “640“ height = “480“ src = http://www.meinserver.de/pfad/meinvideo.mp4“ autobuffer controls poster = meinstartbild.png”> Das Microsoft mit HTML 5 am weitesten zurück liegt, verwundert eigentlich niemanden. Selbst der aktuelle Browser Internet Explorer 8 kann HTML 5 – Elemente nativ nicht unterstützen. Aber es gibt Möglichkeiten, auch dem Microsoft-Browser das neue HTML beizubringen. Damit Sie wissen, bei welchen Plattformen man beim Einsatz von Webvideos mit HTML 5 eventuell nacharbeiten muss, haben wir hier eine kurze Übersicht der wichtigsten Browser bezüglich ihrer Fähigkeit, mit dem <video> - Tag umgehen zu können: + Google Chrome + Firefox 3.5 + Safari 3 + Opera 10.5 - Internet Explorer 7 - Internet Explorer 8

2010-07-18T10:01:17+02:00Juli 19th, 2010|Allgemein|1 Kommentar

Häufige Sicherheitslücken bei Webanwendungen

In einer vor Kurzem veröffentlichten Analyse des Open Web Application Security Projekts, kurz OWASP, wurden die häufigsten zehn Fehler in Webprogrammen und auch die dadurch erzeugten Schwachstellen dargelegt. Im Jahr 2010 wurden als größtes Problem die Injection-Angriffe identifiziert.  Als nächstes folgen in der Liste das Cross Site Scripting und fehlerhaftes Anmeldungs- und Session-Management. Hier die gesamte Fehlerliste der OWASP geordnet in der Reihenfolge der Häufigkeit ihres Auftretens: Injection Cross Site Scripting Broken Authentication and Session-Management Insecure Direct Object References Cross Site Request Forgery (CSRF) Security Misconfiguration Insecure Cryptografic Storage Failure to Restrict URL Access Insufficient Transport Layer Protection Unvalidated Transport Layer Protection Der Report will auf diese Sicherheitsrisiken bei der Webprogrammierung hinweisen und vor allem die Entwickler von Webanwendungen für die typischen Fehler dieser Art bei der Programmierung sensibilisieren.

2010-07-14T21:39:10+02:00Juli 15th, 2010|Allgemein|Kommentare deaktiviert für Häufige Sicherheitslücken bei Webanwendungen

HTML 5 zum Zweiten

In allen moderneren Webbrowsern außer dem Internet Explorer 8 laufen HTML 5 – Seiten mit CSS 3 problemlos. Da aber viele Surfer noch steinzeitliche Browser benutzen, gibt es Möglichkeiten, diese zur Zusammenarbeit mit der Kombination HTML 5 / CSS 3 zu bringen. Da der Internet Explorer 8 CSS-Deklarationen für HTML-Elemente, die er nicht kennt, einfach ignoriert, hilft ein Workaround, der die Elemente zur Laufzeit mittels Javascript erzeugt: <script> document.create.element('header‘); document.create.element('nav‘); document.create.element('section‘); document.create.element('article‘); document.create.element('aside‘); document.create.element('footer‘); </script> Zum Testen der per Javascript erzeugten DOM-Elemente können Sie eine einfache HTML 5-Seite benutzen: <!doctype html> <html> <head> <title> HTML 5 wird getestet…</title> <style type=“text/css“>css3.css</style> </head> <body> <header>Der Test beginnt mit einer Überschrift</header> <nav> <ul> <li>Home</li> <li>Impressum</li> <li>Kontakt</li> </nav> <section> <h1> Erster Bereich</h1> <article> Dies ist der erste Artikel…</article> </section> <footer> <p>Hier steht der Inhalt der Fußzeile</p> </footer> </body> </html> Ein weiteres Hilfsmittel, mit dem man die alten Microsoft-Browser Internet Explorer 6, 7 und 8 auf HTML 5-Kompatibilität bringen kann, ist das Plugin Google Chrome Frame. Das Plugin ist kostenlos, aber es ist aus der Erfahrung nicht einfach, seine Besucher davon zu überzeugen, dies Plugin zu installieren. Mit diesem Plugin brauchen Sie die oben beschriebene Erzeugung der fehlenden DOM-Elemente per Javascript nicht mehr durchführen.

2010-07-12T08:18:16+02:00Juli 12th, 2010|Allgemein|1 Kommentar

HTML 5 zum Ersten

Keine Frage – HTML 5 ist im Anmarsch. Es gibt zwar noch keine finale Version der neuen Markup-Sprache fürs Web, aber im Grunde ist der neue Standard einsatzbereit. Ein guter Anlass, sich das jetzt nicht nur anzuschauen, sondern auch aktiv zu werden und die erste eigene Seite mit HTML 5 und CSS 3 zu entwickeln. HTML 5 bringt viele neue Funktionen und Möglichkeiten. Aber nichts ist so anders wie die neuen semantischen Tags. Dadurch wird es für Suchmaschinen, aber auch für Ihren Browser überhaupt erst möglich, sich ein Bild von den Inhalten der Website zu machen, den immer häufiger zum Surfen benutzten Smartphones wird die Navigation durch die Site erleichtert oder gar erst möglich gemacht, und last not least werden auch Sie als Webdesigner mit HTML 5 letztlich einfacher durchs Leben kommen. Wer schon einmal einen Satz Designs für ein CMS erstellt hat, der weiß, wie unnötig komplex der Aufbau eines Dokumentes mit den bisherigen nichtssagenden Tags gerät. Der korrekte Einsatz von HTML 5 eliminiert diese Probleme und wird Ihr Leben als Webdesigner auch dahingehend verändern, dass Sie sich mehr aufs Design konzentriern können und weniger um dessen Mechanik kümmern müssen! Über die neue Dokument-Typdeklaration und die neuen sprechenden Auszeichner von <header> über <nav> und <section> [...]

2010-07-08T14:04:17+02:00Juli 8th, 2010|Allgemein|Kommentare deaktiviert für HTML 5 zum Ersten

Zufällige Werbe-Banner mit PHP

Werbebanner sind immer noch sehr gefragt, und auch wenn Sie mehrere Banner abwechselnd an einer Stelle anzeigen möchten, ist das mit PHP kein großes Problem. Das soll an einem Beispiel mit zwei zufällig wechselnden Bannern für verschiedene Kunden, Bannergrafiken, Titel- und Alt-Tags gezeigt werden. Zunächst sollten die Daten der Werbebanner sinnvollerweise in ein Array gepackt werden. Das könnte so aussehen: <? $werbung = array( 1 => array('ziel‘ =>'adresse1.de‘, 'grafik‘ => 'banner1.gif‘, 'titel‘ => 'Werbung1‘, 'alt‘ => '1. Banner‘), 2 => array( 'ziel‘ => 'adresse2.de‘,  'grafik‘ => 'banner2.gif‘, 'titel‘ => 'Werbung2‘, 'alt‘ => '2. Banner‘)); ?> Die Ausgabe des mit der Funktion array_rand() zufällig ausgewählten Werbebanners mit Bild, Link, Titeltext und Alt-Text kann mit folgender Routine erzeugt werden: <? $sb = array_rand($werbung); echo ‘ <div> <a href = http://’.$werbung[$sb][‘url’].’/ title = “’.$werbung[$sb][‘titel’].’”> <img src = “.$werbung[$sb][‘grafik’].’” Alt = “’.$werbung[$sb]['alt‘].‘“ /> </a> </div>‘; ?> Dabei müssen die Grafiken im selben Verzeichnis liegen, in dem auch die Programmdatei ist.

2010-07-05T07:17:43+02:00Juli 5th, 2010|Allgemein|Kommentare deaktiviert für Zufällige Werbe-Banner mit PHP

Datenbanksicherung mit phpMyAdmin

Statische Internetseiten lassen sich ja recht einfach sichern. Man kann zum Beispiel alle Dateien vom Rootverzeichnis abwärts per FTP auf seinen PC übertragen und hat eine Sicherungskopie der gesamten Präsenz. Und da statische Seiten sich selten ändern, braucht man den Vorgang auch nicht häufig wiederholen und hat trotzdem immer eine Sicherung des aktuellen Standes. Das gleiche Verfahren eignet sich auch für dynamische Internetseiten, die einen Teil ihrer Inhalte aus einer Datenbank beziehen. Die statischen Anteile sichert man auf die schon für statische Seiten beschriebene Art und Weise. Allerdings braucht man auch ein Verfahren, um die Datenbank so zu sichern, dass man sie jederzeit wieder neu aus dem Nichts aufbauen kann. Da hilft das Tool phpMyAdmin, das fast jeder Hoster seinen Rootserver- oder VServer-Kunden zur Verfügung stellt. Man kann  phpMyAdmin aber auch selbst mit wenig Aufwand nachinstallieren, das Programm kostet nichts. Um eine Sicherungskopie der Datenbank zu erzeugen, wählen Sie den Menüpunkt „Exportieren“. Hier werden verschiedene Formate für den Export angeboten, neben SQL auch CSV und XML und weitere. SQL ist am besten geeignet, denn dabei werden alle informationen der Datenban und ihrer Tabellen mit gesichert, so dass man aus der SQL-Sicherung die komplette Datenbank wieder neu erzeugen kann. Wenn irgendwann einmal die Rücksicherung der Datenbank nötig [...]

2010-05-20T18:48:32+02:00Juli 3rd, 2010|Allgemein|Kommentare deaktiviert für Datenbanksicherung mit phpMyAdmin

Halbautomatik für Datenbankabfragen

Je mehr Felder eine Tabelle hat, umso umständlicher wird die Auswertung der Abfrage nach der üblichen Methode. Die sieht normalerweise so aus: <? $result = mysql_query("SELECT * FROM meinetabelle“); While ($row = mysql_fetch_array($result)) { // Hier beginnt die Wertzuweisung $field1 = $row[“field1”]; $field2 = $row[“field2”]; $field3 = $row[“field3”]; $field4 = $row[“field4”]; $field5 = $row[“field5”]; // Hier beginnt die Ausgabe echo $field1.”, ”. $field2.”, ”. $field3.”, ”. $field4.”, ”. $field5.” <br />“; } ?> Die Wertzuweisung aus dem Abfrageergebnis lässt sich aber auch automatisieren. Das Script sieht dann so aus: <? $result = mysql_query("SELECT * FROM meinetabelle“); While ($row = mysql_fetch_array($result)) { // Hier beginnt die Wertzuweisung $j = mysql_num_fields ($result); for ($i=0; $i < $j; $i++) { $k = mysql_field_name ($result, $i); $$k = $row[$k]; } // Hier beginnt die Ausgabe echo $field1.”, ”. $field2.”, ”. $field3.”, ”. $field4.”, ”. $field5.” <br />“; } ?> In $k steht dabei jeweils der Feldname. Mit dem Konstrukt $$k = mysql_field_name($result, $i); wird nicht der Variable selbst, sondern ihrem Inhalt, also dem jeweiligen Feldnamen der Wert zugeordnet. Schon bei diesem Beispiel mit 5 Feldern in der Datenbank sieht man, dass mit der Automatik eine Zeile weniger zu schreiben ist als mit der Standardmethode. Für jedes weitere Datenfeld in der [...]

2010-05-20T18:44:01+02:00Juni 30th, 2010|Allgemein|Kommentare deaktiviert für Halbautomatik für Datenbankabfragen

PHP Data Objects

Seit der Version PHP 5.1 gibt es in PHP zusätzlich zu den Standardfunktionen von MySQL auch die PHP Data Objects (PDO). Das ist eine PHP-Erweiterung, mit der man sehr schnell in einheitlicher Weise auf verschiedene Datenquellen zugreifen kann. Ähnlich wie beim bekannten und weit verbreiteten Repository PEAR werden dabei die spezifischen Zugriffe auf die verwendete Datenbank durch PDO gekapselt und sind damit transparent. PDO ist aber im Gegensatz zu PEAR eine rein binäre Erweiterung und deshalb auch deutlich schneller. PDO unterstützt zurzeit die Datenbanken MySQL, SQLite, PostgreSQL, MS SQL Server, Oracle, DB2, Firebird und auch ODBC. Dabei braucht allerdings jeder Datenbanktyp seinen spezifischen Treiber, sonst funktioniert es nicht. Eine Datenbankverbindung kann man über PDO mit folgendem Code öffnen, die Daten auslesen und listen und dann wieder schließen: $db = new PDO('mysql:host=localhost;dbname=meinedatenbank‘, 'user‘, 'passwort‘); $sql = $db->prepare("SELECT * FROM meinetabelle“); $sql->execute(); while ($row = $sql->fetch()) { echo $row[id].” “.$row[name].“ <br /> “; } $sql 0 NULL; $db = NULL; Das kurze Beispiel-Script öffnet eine Verbindung zur MySQL-Datenbank meinedatenbank, liest alle Daten aus der Tabelle meinetabelle aus und listet dann die Datenfelder id und name aus jedem Datensatz auf. Danach wird die Datenbankverbindung sauber geschlossen. Die Erweiterung PDO gestattet auch die Arbeit mit Prepared Statements, also vorkompilierten SQL-Kommandos. [...]

2010-05-20T18:39:36+02:00Juni 27th, 2010|Allgemein|Kommentare deaktiviert für PHP Data Objects
Nach oben