Wiki

A universe of ideas

User Tools

Site Tools

You are here: A universe of ideas » Computer » web
Trace:
computer:web

This is an old revision of the document!

Table of Contents

Modern Web

Pre*

Doc Type Example Comment
1 DNS Record <link rel="dns-prefetch" href="//example.com">
1 TCP Connection <link rel="preconnect" href="//example.com">
1 Resource <link rel="prefetch" href="//example.com/resource.png"> Nidrigere Prio als preload →
Nur für Resourcen auf der “nächsten” Seite
1 Resource <link rel="preload" href="//example.com/resource.png" as="image"> Höhere Prio als prefetch →
Auch für Resourcen auf der aktuellen Seite
1 Site <link rel="prerender" href="//example.com/site/">

Metadata

  • Google ersetzt bei den Breadcrums das erste Element durch die base URL der Seite (nicht der des ersten Elements) und lässt das letzte weg.
  • Firefox, Vivaldi und Chromium hängen ihren Namen mit “-” an <title> im Fenstertitel → Am besten die Elemente im Title auch mit “-” Trennen.

Open Graph

  • Doku by ogp.me, Facebook (und mixi.jp)
  • <html prefix=“og: http://ogp.me/ns#”> nicht vergessen
  • Die Höhe/Breite eines Bildes dient dazu damit es beim ersten Aufruf schon richtig dargestellt wird.
  • og:url ist die Kanonische URL

Twitter

  • Alle Tags
  • Twitter verwendet das Open Graph Metadatum, wenn das korrespondierende Twitter Datum fehlt.
  • Keine namespace definition in <html> (im gegensatz zu Open Graph)

Analyse

  • Das Analysescript: metana.py
  • Wenn eine Description vorhanden war, war es immer die selbe. 
### https://www.youtube.com/user/RSFinternet
<title>                      1) Reporters sans frontières - YouTube
meta - title                 1) Reporters sans frontières
meta - og:tite               1) Reporters sans frontières
meta - twitter:title         1) Reporters sans frontières
<h1>                         1) Reporters sans frontières

### https://www.youtube.com/watch?v=5OOslRIRZ2k
<title>                      1) Press conference - 2016 World Press Freedom Index - Washington - YouTube
meta - title                 1) Press conference - 2016 World Press Freedom Index - Washington
meta - og:tite               1) Press conference - 2016 World Press Freedom Index - Washington
meta - twitter:title         1) Press conference - 2016 World Press Freedom Index - Washington
<h1>                         1) Press conference - 2016 World Press Freedom Index - Washington

### https://de.wikipedia.org/wiki/Reporter_ohne_Grenzen
  <title>                    1) Reporter ohne Grenzen – Wikipedia
  <h1>                       1) Reporter ohne Grenzen

### https://ebay.us/wWgf3M
  <title>                    1) Fotos für die Pressefreiheit 2018 Reporter ohne Grenzen e V 9783937683713  | eBay
  meta - og:tite             1) Fotos für die Pressefreiheit 2018 Reporter ohne Grenzen e V 9783937683713  | eBay
  meta - twitter:title       1) Fotos für die Pressefreiheit 2018 Reporter ohne Grenzen e V 9783937683713
  <h1>                       1) <span class="g-hdn">Details zu</span> Fotos für die Pressefreiheit 2018 Reporter ohne Grenzen e V 9783937683713

### https://stackoverflow.com/q/1740341
  <title>                    1) semantic web - What is the difference between RDF and OWL? - Stack Overflow
  meta - og:tite             1) What is the difference between RDF and OWL?
  meta - twitter:title       1) What is the difference between RDF and OWL?
  <h1>                       1) What is the difference between RDF and OWL?

### https://www.amazon.com/dp/1539836835
  <title>                    1) SAFETY GUIDE FOR JOURNALISTS A handbook for reporters in high-risk environments: United Nations Educational Scientific and Cultural Organization, Reporters Without Borders: 9781539836834: Amazon.com: Books
  meta - title               1) SAFETY GUIDE FOR JOURNALISTS A handbook for reporters in high-risk environments: United Nations Educational Scientific and Cultural Organization, Reporters Without Borders: 9781539836834: Amazon.com: Books

### https://www.imdb.com/title/tt1323594
  <title>                    1) Despicable Me (2010) - IMDb
  meta - title               1) Despicable Me (2010) - IMDb
  meta - og:tite             1) Despicable Me (2010)
  <h1>                       1) Despicable Me <span id="titleYear">(2010)</span>

### https://twitter.com/skruppy_/status/1091814026416398337
  <title>                    1) Skruppy on Twitter: "1) https://t.co/CVOCYgV57g hatte Git repo mit ihrem code und Passwörtern im web root 😯2) Bounty = Gemeinnützige Spende (50% von Devs, Dankbarkeit und so) https://t.co/XaNeTHPkcF"
  meta - og:tite             1) Skruppy on Twitter
  <h1>                       1) Skruppy

### https://twitter.com/skruppy_
  <title>                    1) Skruppy (@skruppy_) | Twitter
  <h1>                       1) Skruppy

### https://www.instagram.com/reporterohnegrenzen
  <title>                    1) Reporter ohne Grenzen (@reporterohnegrenzen) • Instagram photos and videos
  meta - og:tite             1) Reporter ohne Grenzen (@reporterohnegrenzen) • Instagram photos and videos

### https://www.instagram.com/p/BtV8o9fjkR8/
  <title>                    1) Reporter ohne Grenzen on Instagram: “Bundeswirtschaftsminister Peter #Altmaier reist am Wochenende nach #Ägypten. Er muss die #Freilassung aller wegen ihrer Arbeit inhaftierten…”
  meta - og:tite             1) Reporter ohne Grenzen on Instagram: “Bundeswirtschaftsminister Peter #Altmaier reist am Wochenende nach #Ägypten. Er muss die #Freilassung aller wegen ihrer Arbeit inhaftierten…”

### https://en.zalando.de/zalando-happy-birthday-gift-card-box-light-blue-zzgz000bs-k11.html
  <title>                    1) Zalando HAPPY BIRTHDAY - Gift card box - light blue - Zalando.de
  meta - og:tite             1) HAPPY BIRTHDAY - Gift card box - light blue @ Zalando.de 🛒
  meta - twitter:title       1) HAPPY BIRTHDAY - Gift card box - light blue - Zalando.de
  <h1>                       1) HAPPY BIRTHDAY - Gift card box

### https://www.etsy.com/listing/645132564/monty-python-collage-t-shirt
  <title>                    1) Monty Python Collage T Shirt | Etsy
  meta - og:tite             1) Monty Python Collage T Shirt
  <h1>                       1) Welcome to Etsy!
  <h1>                       2) Monty Python Collage T Shirt

### http://www.spiegel.de/kultur/gesellschaft/a-1244288.html
  <title>                    1) Reporter ohne Grenzen: Mindestens 80 Journalisten 2018 getötet - SPIEGEL ONLINE
  meta - og:tite             1) Reporter ohne Grenzen: Weltweit mindestens 80 Journalisten getötet - SPIEGEL ONLINE - Kultur
  <h1>                       1) Reporter ohne Grenzen: Mindestens 80 Journalisten 2018 getötet

### https://github.com/Skrupellos
  <title>                    1) Skrupellos (Skruppy) · GitHub
  meta - og:tite             1) Skrupellos - Overview
  <h1>                       1) Skruppy Skrupellos

### https://github.com/Skrupellos/sir
  <title>                    1) GitHub - Skrupellos/sir: Sir Tificate will help you to do automated TLS certificate rollovers, including TLSA updates.
  meta - og:tite             1) Skrupellos/sir
  <h1>                       1) Skrupellos / sir

Cache

Dieser Abschnitt ist noch hochgradig Falsch!

  • public proxy (shared cache) vs private browser cache
  • Neu Laden vs validieren
Cache-Control vom Server Für Funktion Typ
must-revalidate Private / Public Abgelaufen → validieren Re{validate,loading}
no-cache Immer → validieren Cachability
no-store Gar nie nicht speichern Other
no-transform Gecachten content nicht verändern (z.B. Optimieren) Other
public Cachability
private Public Cachability
proxy-revalidate Public Abgelaufen → validieren Re{validate,loading}
max-age=<seconds> Private / Public Relative Cache Zeit Expiration
s-maxage=<seconds> Public Relative Cache Zeit (vorrang vor Expires und s-maxage) Expiration
immutable Nicht abgelaufen → verwenden (auch bei F5, aber nicht bei Shift+F5) / Abgelaufen →Nicht verwenden 1 Re{validate,loading}
computer/web.1549385202.txt.gz · Last modified: (external edit)