Eine kleine Serie zu Bildern und Illustrationen. Machen Sie Ihre Website zur Augenweide. Dank den Tipps & Tricks von Dr. Code.
Technisch ist es möglich, eine fremde Website mit Bildern zu illustrieren, welche auf Ihrer Website liegen. Statt eines Bildes auf dem eigenen Server, verweist man im Quelltext einfach auf einen entfernten Ort. Das nennt man «Hotlinking» – es ist eine Form von Diebstahl: Erstens wird ein Bild (meist) unrechtmässig verwendet, zweitens geht dem Bestohlenen Bandbreite verloren. Doch Sie haben eine Möglichkeit, Hotlinking auf Ihren Server zu verhindern.
Die Blog-Übersichten im Divi-Theme bieten schon einige Möglichkeiten zum Styling. Doch richtig cool wird die Bildwelt, wenn Sie mit ein paar CSS-Tricke noch ein wenig nachhelfen. Zwei Möglichkeiten möchten wir Ihnen heute vorstellen.
Drei Bilder nebeneinander stellen? Das kann jede und jeder. Hübsch wäre ein stylisher Staffelungslook, bei welchem etwa Bild 1 und 3 auf einer Linie erscheinen und Bild 2 leicht versetzt ist. Das lösen Sie mit diesem Trick im Nu.
Mit dem Bildmodul des Divi-Themes lässt sich auch eine hübsche Bilderreihe erstellen. Eine Mini-Galerie quasi. Ein wenig Handarbeit braucht's allerdings noch. Schwierig wird's indes nicht.
Bilder-Special – Trick #5: Coole 3D-Flip-Cards ganz einfach in HTML erstellen – komplett ohne Plugin
Heute bauen wir einen echten Hingucker: So genannte Flip-Cards, die sich umdrehen, sobald der Mauszeiger darüber bewegt wird. Das gibt ein ebenso cooles wie professionelles Look & Feel für Ihre Website.
Eine interessante Möglichkeit für hübsche Darstellungen: Lassen Sie - etwa auf einer Übersichtsseite - Bilder über einen Hintergrund hinausragen. Das ist einfacher zu machen, als man meint.
Zwei oder mehr Bild-Module im Divi-Theme überlappen lassen? Kein Problem. Ein wenig CSS und gut ist. Wir zeigen Ihnen wie's geht.
Gerade in mehrspaltigen Designs möchte man vielleicht ein Bildmodul in exakt derselben Höhe wie der nebenan liegende Text darstellen. Das schaffen wir mit ein wenig CSS-Code.
Zwei Binsenwahrheiten: 1. Bilder machen eine Website hübsch; 2. Bilder machen eine Website langsam. Um die Ladezeit der Website zu verbessern, hat WordPress seit der Version 5.5 ein «lazy loading» eingebaut. Dieses bewirkt, dass der Aufbau der Website Step by Step vor sich geht. Aber es kann Situationen geben, wo einem Lazy Loading in die Quere kommt. Immerhin lässt es sich einfach abschalten.
keine Beiträge gefunden.
Werbung
Ein paar Unarten des Webdesigns der 90er-Jahre sind glücklicherweise längst verschwunden. Aus Spass lässt sie Dr. Code hier noch einmal aufleben.
Mit Ankern lassen sich Benutzerinnen und Benutzer einer Website gerne zu den zentralen Inhalten lenken. Die Sprungmarken (oder eben Anker) sind darum ein beliebtes Tool auf Websites. Dr. Code hat eine kleine Beitragsreihe zum Thema geschrieben.
Im Frühjahr 2022 hat Dr. Code zur Putzaktion aufgerufen. Das Ziel: Weg mit unübersichtlichen Codes und Menüs. Entstanden ist ein zweiteiliger Aufräum-Special.
Icons sind beliebt bei der Gestaltung von Websites. Die Piktogramme helfen, rasch den Überblick zu gewinnen. Viele denken gleich an Font Awesome. Doch es gibt weitere Anbieter. Dr. Code stellt sie vor und sagt, wie die Icons eingesetzt werden.
Keine Inhalte gefunden.
Werbung
