WebDev Tools

Übersichten

• https://kinsta.com/de/blog/webentwicklung-tools/
• Nützliche Websites https://devdojo.com/astrodevil/25-must-visit-killer-websites-for-developers

Tools

• Chrome Dev Tools: https://developer.chrome.com/docs/devtools/
• Figma: Online-Design Tool, https://www.figma.com/de/, https://www.figma.com/team_invite/redeem/aroxSW6kbAVOQ8deJFux6H
• Farben: https://coolors.co/
• Farben: https://encycolorpedia.de/
• Code ausprobieren: https://codepen.io/
• Farb-Kontrast checken: https://webaim.org/resources/contrastchecker/

• https://fontjoy.com/# – Font pairings AI Tool
• https://www.modularscale.com/ – Font Scale Tool
• https://www.typewolf.com/ – Font Exploration
• https://discover.typography.com/ – Font Inspiration
• https://chromewebstore.google.com/detail/fonts-ninja/eljapbgkmlngdpckoiiibecpemleclhh – Identify Fonts on Websites
• https://practice.typekit.com/ – Typo Learning

unsplash.com ist eine Online-Bilddatenbank mit User-generiertem Content, lizenzfrei. Durch den Aufruf mit Parametern erhält man perfekte Platzhalterbilder für Webdesigns o.ä.

Stamm-URL:
https://source.unsplash.com/

Dahinter die Parameter
random: zufälliges Bild
123x123: Bild-Dimensionen
?keyword: Schlagwort Bildersuche

Beispiel:
https://source.unsplash.com/random/1536x450/?future-technology

Als registrierter User kann man bei unsplash.com eigene Collections anlegen, um die Auswahl der gezeigten Bilder zu steuern. So kann unsplash.com auch für Produktiv-geschaltete Projekte genutzt werden.

Syntax:
https://source.unsplash.com/collection/[collection_id]/[width]x[height

Eigene Collection:
https://unsplash.com/collections/4759555/phoenixseo-collection

Hieraus wird dieser Aufruf:
https://source.unsplash.com/collection/4759555/1536x300

Weitere Möglichkeit, Platzhalterbilder einfach per Parameterübergabe zu generieren. Anleitung direkt auf der Website:

• https://picsum.photos/

Backlinks zu dieser Seite: