Beiträge mit dem Stichwort: ‘HTML̵
Web Fonts für Halunken – Ladezeit und Einbindung
Wie Milchschrift Kunst ist, so kann auch die passend gewählte Schriftart einer Webseite Kunst sein, oder das auswählen des Entsprechenden Formates. In diesem Beitrag besprechen wir welche Typen (auch Arten genannt) es von Web Fonts gibt (es gibt noch mehr, die hier genannten sind aber die geläufigsten), wie Schriften vom Browser geladen werden und wie Schriften im CSS eingebunden und benutzt werden.
WeiterlesenRey’s CSS Haxx: Wie man eine Ordered List stylt
Viele Leute fragen mich: „Rey, wie kann man eine Ordered List stylen?“. Und ich freue mich dann immer und antworte voller Inbrunst und mit meiner besten Boromir-Imitation: „Man stylt nicht einfach eine Ordered List!“. – „Aber Rey, warum sehen deine Ordered Lists immer so top durchgestylt aus?“ – „Nun liebe Kinder, gebt fein Acht, denn hier kommt die Antwort…“ Zunächst muss man allerdings in aller Ernsthaftigkeit sagen, man kann die Zahlen einer Ordered List wirklich nicht stylen. Allerdings gibt es einen kleinen, aber cleveren Trick, wie es doch irgendwie geht.
WeiterlesenRey’s CSS Haxx: CSS-Grid
Aller guten Dinge sind drei. Das gilt auch für CSS. Denn CSS 3 bringt eine weitere Errungenschaft der Webentwicklung mit sich: das CSS-Grid.
Warum dies eine so revolutionäre Technologie ist, sehen wir, wenn wir uns vor Augen halten, wie Websiten bisher designed wurden. Um den immer komplexeren Designs unserer Webdesigner-Kollegen gerecht zu werden, ist es oftmals nötig, um verschiedene Elemente und Inhalte Container zu packen. Das ist aber leider nicht nur semantisch doof, es generiert auch unnötig viel Code. Der aber leider wiederum nötig ist, um die verschiedenen Elemente korrekt auf der Seite zu platzieren.
WeiterlesenWie HTML5-Validierung funktioniert
Formulare zu validieren war bisher eine aufreibende und anstrengende Angelegenheit für Entwickler. Die Möglichkeit, reines HTML für die Formular-Validierung zu nutzen, war bis vor kurzem noch undenkbar. Sicher es gab alle möglichen Arten an Plug-Ins über die Jahre hinweg, mit deren Hilfe dass erreicht werden konnte, aber es gab nie einen einheitlichen Standard, auf den man hinarbeiten konnte.
WeiterlesenMit jQuery herausfinden, ob eine Checkbox angewählt ist (oder nicht)
Ich musste einen Weg finden mit jQuery zu überprüfen, ob eine Checkbox ausgewählt wurde. In jQuery ist es möglich zunächst zu überprüfen ob eine Checkbox angewählt wurde, um anschließend je nach Ergebnis eine Aktion auszuführen. So könnte man zum Beispiel ein Formularfeld anzeigen oder verstecken, sobald eine Checkbox ausgewählt wurde.
WeiterlesenAnimationen auf Webseiten
Bewegungen und Animationen gehören zu den Anforderungen an moderne Landinpages und Webseiten. Um dabei schnell und einfach zum Ziel zu kommen gibt es JavaScript Libraries wie scrollreveal.js.
WeiterlesenEinen reinen CSS-Tooltip ohne JavaScript erstellen
Tooltips (Kurzinfos/Quickinfos) sind Boxen mit zusätzlichen Informationen, welche erscheinen, wenn der Mauszeiger über einem bestimmten Element einer Webseite ist. Sie sind ein großartiger Weg, einem User zu helfen, durch eine unvertraute Oberfläche zu navigieren, ohne ihn mit zu viel Information zu überhäufen. Heute bauen wir uns selbst einen HTML und CSS Tooltip.
WeiterlesenWebentwicklung – Ein Überblick
Um eine hybride App Entwickeln zu können werden verschiedene Sprachen eingesetzt. Grundlegend handelt es sich dabei um Sprachen, welche auch in der Erstellung von Webseiten zur Anwendung kommen. Es sollte also jeder Webentwickler bereits mit diesen Sprachen in Berührung gekommen sein. Konkreter gesagt handelt es sich dabei um die Auszeichnungssprache HTML5, die Formatierungssprache CSS3, die Scriptsprachen Javascript und jQuery, sowie die Serverseitige Scriptesprache PHP. Um im nächsten Teil der Reihe definieren zu können mit welchen Sprachen und welchem FrameWork eine hybride App umgesetzt werden kann, soll zunächst einmal ein grundlegendes Verständnis der eingesetzten Sprachen geschaffen werden.
WeiterlesenBehandlung von broken image(s)
Ein oder mehrere broken Images können eine eigentlich gute Website schnell nicht nur unattraktiv, sondern auch uninformativ machen. Daher ist es am besten zu überprüfen, ob auch alle Bilder geladen wurden und im Fall eines broken Image eine Fallback- oder Default Lösung zu haben.
WeiterlesenRey’s CSS Haxx: Wie man einen Upload Button stylt
Kennen Sie das auch? Man programmiert ein schönes Formular, in dem es auch die Möglichkeit für einen Dateiupload gibt. Doch der doofe Upload Button sträubt sich gestylt zu werden? Sämtliche CSS Eigenschaften prallen einfach an ihm ab? Das muss nicht sein…
Weiterlesen