• Wie finde ich den Datenbanknamen und die Zugangsdaten für die MySQL-Datenbank eines CMS?

1. Mit FTP-Client anmelden
2. Werte aus einer der Dateien auslesen, entsprechende Variablennamen (Datenbanknamen, Benutzername, Passwort) sind aufgelistet
   
   • Wordpress: Datei "/wp-config.php"
     • DB_NAME, DB_USER, DB_PASSWORD
   • Joomla: "xxx"
     • xxx
   • TYPO3: Datei "/typo3conf/LocalConfiguration.php"
     • dbname, user, password

• xxx

• xxxq

Datei wird heruntergeladen, wenn auf den Link geklickt wird (anstatt zur Datei zu navigieren).

• Nützlich z.B. für CSS-Dateien

Attribut "download" ohne Wert

• Die Datei wird unter dem Namen der Originaldatei heruntergeladen, z.B. "custom.css".
  

  <a href="/css/custom.css" download>custom.css</a>

Attribut "download" mit dem Wert "style"

• Der neue Name der heruntergeladenen Datei lautet "style.css" statt "custom.css".
  (Die heruntergeladene Datei wird umbenannt)
  

  <a href="/css/custom.css" download="style">custom.css</a>

• https://www.w3schools.com/tags/att_a_download.asp
• https://wiki.selfhtml.org/wiki/HTML/Attribute/download

• Wie erstelle ich eine responsive HTML-Tabelle?

Bei dieser Lösung wird eine horizontale Bildlaufleiste angezeigt, wenn der Bildschirm zu klein ist, um den gesamten Inhalt der Tabelle anzuzeigen.

Einfügen eines <div> Containerelements mit der Eigenschaft overflow-x:auto um <table>.

<div style="overflow-x:auto;"><table> ... </table></div>

PHP v8.1.22 Bludit PRO v3.15.0 TinyMCE v5.10.5

Beispiel: Responsive Tabelle

Durch Verändern der Breite des Browserfensters wird der Effekt sichtbar.

• https://www.w3schools.com/howto/howto_css_table_responsive.asp

• xxxq Wie verhindere ich Zeilenumbrüche in einer responsiven HTML-Tabelle?

Mit white-space: nowrap; lässt sich ein HTML Zeilenumbruch via CSS verhindern.

Beispiel: Responsive Tabelle mit Zeilenumbruch

table {
    white-space: normal;
}

Durch Verändern der Breite des Browserfensters wird der Effekt sichtbar.

Beispiel: Responsive Tabelle ohne Zeilenumbruch

table {
    white-space: nowrap;
}

Durch Verändern der Breite des Browserfensters wird der Effekt sichtbar.

• https://www.designerinaction.de/tipps-tricks/web-development/html-zeilenumbruch/

• xxxq

HTML

• Geschütztes Leerzeichen:  
• Zeilenumbruch erzwingen: <br>
• Textabsatz: <p>....</p>
• Link <a> mit Attribut: download
• Text hochstellen: <sup>....</sup>
• Text tiefstellen: <sub>....</sub>
• Zitat: <blockquote>....</blockquote>
• xxx: <cite>
• Trennlinie: <hr>

• Tutorial Republic: HTML5 Elemente/Tags English
• selfhtml: HTML Elemente/Tags Deutsch

CSS

• overflow-wrap (word-wrap) CSS3
  Quelle: MDN Web Docs: overflow-wrap English
  • overflow-wrap: break-word; erlaubt Umbrüche innerhalb eines Wortes TIPP
    Responsive Lösung für lange URLs, die die Gerätebreite überschreiten
  • overflow-wrap: normal; bricht Wörter nur an erlaubten Breakpoints um defaultnormal
• font-weight
  Quelle: https://www.udacity.com/blog/2021/01/html-css-font-weight.html
  • 100 = thin
  • 200 = extra light (ultra light)
  • 300 = light
  • 400 = normal
  • 500 = medium
  • 600 = semi bold (demi bold)
  • 700 = bold
  • 800 = extra bold (ultra bold)
  • 900 = black (heavy)
• xxx
• xxx

Random Notes

<a> Anker

<h3 id="Ankername">Überschrift</h3>

<a href="#Ankername">Link</a>

<a href="/dokument.html#Ankername">Link</a>

• https://www.heise.de/tipps-tricks/Wie-setzt-man-in-HTML-einen-Anker-3908051.html
• https://www.heise.de/tipps-tricks/Verweis-auf-einen-Anker-in-HTML-so-geht-s-3908083.html

<a> E-Mail

<a href="mailto:">Send email to nowhere</a>

<a> Telefon / Mobile

<a href="tel:+41989397959">+41 98 939 79 59</a>

<a> Download

<a href="/" download="my_painting.png">Download my painting</a>

• Wie komprimiere ich Bilder/Grafiken für die Website vor dem Hochladen?

• WebP
  • xxx
• PNG
  • https://www.iloveimg.com/compress-image [kleinste Dateigrösse]
• JPG
  • xxx
• SVG
  • https://vecta.io/nano [kleine Dateigrösse, deckungsgleich]

• Wie finde ich alle fehlerhaften Links auf der gesamten Website?

• Online
  • https://www.drlinkcheck.com/
    Überprüft alle Links, die auf der gesamten Website vorhanden sind
• Google Chrome
  • Erweiterung "Free Link Checker by LRT"
    1. Erweiterung "Free Link Checker by LRT" > "Hinzufügen"
       https://chromewebstore.google.com/detail/free-link-checker-by-lrt/nifeadedgedikheglfngocdgfidiiimi
    2. xxx
  • Erweiterung "Link Redirect Trace"
    1. Erweiterung "Link Redirect Trace" > xxx
       https://chromewebstore.google.com/detail/link-redirect-trace/nnpljppamoaalgkieeciijbcccohlpoh
    2. xxx
• Microsoft Edge
  • Erweiterung "xxx"
    1. Erweiterung "xxx" > xxx
       xxx
    2. xxx
• Mozilla Firefox
  • Erweiterung "Link Analyzer"
    1. Erweiterung "Link Analyzer" > "Zu Firefox Hinzufügen" > "Hinzufügen" > "OK"
       https://addons.mozilla.org/de/firefox/addon/link-analyzer/
    2. Gewünschte Seite einer Website in Firefox öffnen
    3. Rechter Mausklick auf gewünschte Seite > "Analyze all links"
       • link mintgrün = "linkFine" (code 200)
       • link dunkelgelb = "linkInvalid" (code 0)
       • link mitteldunkeles rot = "linkBroken" (code 403)
       • link mittelgrau = "linkSkipped" (code undefined)
  • Erweiterung "Link Redirect Trace"
    1. Erweiterung "Link Redirect Trace" > "Zu Firefox Hinzufügen" > xxx
       https://addons.mozilla.org/de/firefox/addon/link-redirect-trace-addon/
    2. xxx

• Windows 11 24H2 Firefox 140.0.2