Abonnieren
Lisardo Multimedia GmbH
Herrenbachstr. 19
86161 Augsburg
Tel.: 0821-150565
Fax: 0821-150595
Schöne Formulare in XHTML+CSS
Ein barrierefreies Formular mit Accesskeys, mit einer leicht verständlichen, deutschsprachigen Anleitung. Interessant ist auch die Diskussion in den zahlreichen Kommentaren, die auf Besonderheiten in verschiedenen Browsern eingeht.
Kategorie: CSS und HTML | CSS-Formulare | Barrierefreiheit | Barrierefreie Techniken • Kommentare : 0
Prettier Accessible Forms
Nick Rigby erläutert bei »A LIST apart« eine weitere Methode, schöne und gleichzeitig barrierefreie Formulare zu erstellen. Das Besondere an seinem Ansatz ist die CSS-Anweisung display: inline-block;, mit dessen Hilfe er dem <label>-Attribut eine feste Breite zuweisen kann. Damit vermeidet er den Einsatz von floatenden Elementen. Vorteil: auch die IE unterstützen diese Technik. Nachteil: diesmal fallen die Mozilla-Browser raus (incl. Firefox). Um Firefox doch zu unterstützen setzt er den proprietären Tag -moz-inline-box ein, kombiniert mit einem doch recht aufwändigen JavaScript. Ich halte diesen Ansatz zwar für sehr interessant, aber auch für reichlich aufwändig.
Kategorie: CSS und HTML | CSS-Formulare | Barrierefreiheit | Barrierefreie Techniken • Kommentare : 0
Dropdown- und Flyoutmenüs mit CSS und JavaScript
Es gibt mittlerweile eine Reihe von Dropdown- und Flyout-Menüs, die mit mehr oder weniger JavaScript auskommen. Basis ist im wesentlichen das Pulldownmenü von Eric Meyer, das mit reinem CSS auskommt und kein JavaScript benötigt, allerdings auch nur in modernen Browsern funktioniert, die ausreichend CSS2 unterstützen – also nicht im Internet Explorer. Patrick Griffiths und Dan Web entwickelten in Ihrem Artikel »Sun of Suckerfish Dropdowns« diesen Ansatz weiter und ergänzten ihn um um ein kleines JavaScript, das die fehlende Funktionalität in den Internet Explorern ab Vs. 5 bereit stellt. Christian Heilmann baut diesen Ansatz noch einmal weiter aus und stellt mit »YADM – Yet another dynamic menu« kleines Framework für Pulldownmenüs zur Verfügung. Eine weitere Variante von Suckerfish ist bei solarDreamStudios zu finden.
Die umfangreichste Sammlung an Menüs (Dropdown oder Flyout) ist zweifellos bei Stu Nichols auf CSSplay zu finden. Er hat es mittlerweile geschafft, diese Menüs nur mit Hilfe von CSS auch im Internet Explorer 6 zum Laufen zu bringen (mit trickreichen Conditional Comments, die das Menü in Tabellen packen). Zusätzlich bietet er auch Varianten mit kurzen JavaScripts an, allerdings auf einer eigenen Seite.
Achtung: die Menüs von Stu Nichols sind nur für den nicht kommerziellen Einsatz frei; eine Verwendung in kommerziellen Projekten erfordert eine schriftliche Zustimmung und eine Spende.
(14.3.2008)
Kategorie: CSS und HTML | CSS-Menus | JavaScript | JS-Scripts-Tools
sIFR3: Dynamische Schriftersetzung auf Webseiten mit Flash
sIFR3 ist eine Bibliothek aus JavaScripts, mit deren Hilfe auf Webseiten Text in beliebigen Tags oder CSS-Containern durch Flashfilme ersetzt werden kann. Dadurch ist eine typografisch einwandfreie Darstellung von beliebigen Schriften möglich. Im Gegensatz zu anderen Schriftersetzungstechniken ist sIFR3 suchmaschinenfreundlich, auch in CMS-Systemen einfach zu implementieren, flexibel und sogar halbwegs barrierefrei. Die Technik hat allerdings auch einige Nachteile; eine genauere Diskussion finden Sie in diesem Artikel, ein Beispiel hier.
Kategorie: Webworking | Webtypografie | CSS und HTML | Text und Typo
Zen Garden
Mehr als 200 unterschiedlich gestaltete Varianten einer einzigen HTML-Seite. Die Herausforderung für alle Webdesigner: das HTML darf/kann nicht verändert werden, einzige Gestaltungsmöglichkeit sind eigene Cascading Style Sheets. Ein einzigartiges CSS-Archiv.
Kategorie: CSS und HTML | CSS-Beispielseiten
Typografie im Internet
Eine schön gestaltete Einführung in Typografie von Matthias Kammerer mit Schwerpunkt auf der Anwendung im Internet. Themen sind Schriftauszeichnungen, Anführungszeichen und typische Fehler bei der Anwendung.
Kategorie: Webworking | Webtypografie | CSS und HTML | Text und Typo
Typografie auf Webseiten
Michael Jendryscheck fasst ein seinem Artikel eine Vielzahl von Imformationen zum Thema Typografie im Web zusammen: korrekte Umsetzung von Leerzeichen, Abständen, Strichen, Anführungszeichen, Apostroph, Zahlen und Währungszeichen, mathematische Symbole und Formeln.
Kategorie: Webworking | Webtypografie | CSS und HTML | Text und Typo
CSS-Stile für Paginierungen
Eine Sammlung von 17 verschiedenen CSS-Stilen für Seitenzahlen bzw. Paginierung von Webseiten.
Kategorie: CSS und HTML | CSS-Templates
HTML Entity Character Lookup
Hier können Sie für Sonderzeichen sehr bequem die passenden Entities suchen: in das Suchfeld einfach das gewünschte Zeichen eingeben und sofort erscheinen (via AJAX) die passenden Entities. Sehr praktisch. Für Mac-Anwender bietet leftlogic auch ein Dashboard Widget zum Download. (via pixelgraphix - dort sind in den Kommentaren noch weitere Tools für Mac-Anwender zu finden. )
Kategorie: Webworking | Webtypografie | CSS und HTML | HTML und XHTML | Text und Typo
Mikroformate
Bei Einfach für Alle findet man eine kleine Linksammlung zum Thema Mikroformate. Unter anderem ein mehrteiliges Tutorial von Stefan Münz (dem Gründer von SelfHTML), einen Generator für vCard/hCard sowie eine Werkzeugsammlung, mit deren Hilfe man sich die Erstellung von Mikroformaten erleichtern kann. Eine kurze Einführung gibts meinem Artikel »Microformats schwer im Trend«.
Kategorie: CSS und HTML | Mikroformate | Sonstiges
Formularelemente mit CSS gestalten
Roger Johansson gibt einen umfassenden Überblick über die Gestaltung von einzelnen Formularelementen mit CSS – sehr wertvoll sind vor allem die zahllosen Screenshots, die acht Browser auf Mac und Windows direkt miteinander vergleichen (via F-LOG-GE)
Kategorie: CSS und HTML | CSS-Formulare
Drucken von Webseiten
Eine knappe Übersicht über gängige Methoden, den Ausdruck von Webseiten zu optimieren und für den Anwender bequemer zu gestalten von Björn Seibert auf markup. Auch die Kommentare zum Artikel sind interessant.
Kategorie: Webworking | Webdesign | CSS und HTML
Moderne Formulargestaltung
Im Dr. Weblog beschäftigt sich Vitaly Friedmann mit »Formulare und Umfragen: Moderne Lösungen« und präsentiert Formulare in modernem, schönen Gewand.
Kategorie: Webworking | Webdesign | CSS und HTML | CSS-Formulare
Wie verhalten sich Inline-Elemente mit einem Padding
Wer schon mal versucht hat, einem inline-Element ein padding zuzuweisen, wird wohl selbst schon festgestellt haben, dass sich inline-Elemente hier anders verhalten als Block-Elemente. Russ Weakley von maxdesign beschreibt dieses Verhalten anschaulich und leicht nachvollziehbar (Englisch).
Kategorie: CSS und HTML | CSS-Grundlagen | CSS-Listen
Alle Internet Explorer gleichzeitig auf einem Rechner
TredoSoft bietet einen Installer, der es erlaubt, alle IE Versionen auf einem Rechner zu installieren. Einfach neben dem IE 7 installieren und man hat alle Versionen ab der Vs. 3. (via Dr. Web).
Kategorie: CSS und HTML | Internet Explorer
Experimente mit Cascading Style Sheets
Die Homepage von Stu Nichols, in der er eine unglaubliche Fülle von raffinierten CSS-Tricks ausbreitet: Menüs, Layout-Techniken, Boxen mit runden Kanten, Photogalerien und vieles mehr. Unbedingt vorbeischauen ...
Kategorie: CSS und HTML | CSS-Grundlagen | CSS-Listen | CSS-Menus
CSS Optimizer im Test
Robert Basic testet einen CSS-Optimizer, den Icey CSS Compressor. CSS-Optimizer sind kleine Hilfsprogramme, die Style Sheets »eindampfen« können – also alles Überflüssige rauswerfen und die Schreibweise optimieren. Einen Vergleich von verschiedenen Optimizern gibts im Artikel »CSS Optimization: Make Your Sites Load Faster for Free«.
Kategorie: CSS und HTML | CSS+HTML-Tools
Runde Ecken mit CSS - ein Überblick
Eine umfangreiche Linksammlung, wie man runde Ecken mit CSS erstellen kann: mit und ohne Bilder, mit und ohne JavaScript.
Kategorie: CSS und HTML | CSS-Grundlagen
Runde Ecken mit JavaScript
Alessandro Fulciniti beschreibt in seinem Artikel »Nifty Corners Cube« die Erstellung von runden Ecken mit Hilfe von CSS und JavaScript, ganz ohne Bilder. CSS und JavaScript können heruntergeladen werden, die Beispiele sind sehr ausführlich, leider nur in Englisch.
Kategorie: CSS und HTML | CSS-Grundlagen
Runde Ecken ohne Bilder
Tomasz Lewandowski beschreibt in diesem Artikel eine Technik, wie mit Hilfe von CSS-Auszeichnungen (zugegeben ziemlich umfangreichen) runde Ecken gestaltet werden können, ohne dass man Bilder zu Hilfe nehmen muss. Er bezieht sich auf Arbeiten von Stu Nichols (»Krazy Korners«).
Kategorie: CSS und HTML | CSS-Grundlagen
Seite 1 von 5 Seite(n) 1 2 3 > Letzte »
Abonnieren
