Wie kann ich auf dem iPad den Quellcode einer Webseite sehen?

Programmieren, Suchmaschinen optimieren, egal warum. Wer den Quellcode einer Webseite sehen will, sieht auf dem iPad erstmal alt aus. Die Anzeige von Quellcode einer Internetseite ist keine Serienausstattung unter iOS. Trotzdem geht es recht einfach…

Hier stellen wir Ihnen zwei Möglichkeiten vor um die Quellcodeanzeige einfach auf Ihrem iPad nachzurüsten. Einmal mit Bordmitteln, einmal mit Zukauf einer App.

1. Einrichten eines Bookmarklets in Safari

Sie können sich einfach ein Bookmarklet im mobilen Safari-Browser einrichten.
Dieses zeigt dann bei Aufruf direkt den Quellcode der aktuell geöffneten Seite an.

1. Kopieren Sie sich den folgenden Javascript-Code:

   javascript:(function(){
   var w = window.open('about:blank'),
   s = w.document;
   s.write('');
   s.close();
   var pre = s.body.appendChild(s.createElement("pre"));
   pre.style.overflow = 'auto';
   pre.style.whiteSpace = 'pre-wrap';
   pre.appendChild(s.createTextNode(document.documentElement.innerHTML));
   })();

2. Speichern Sie z.B. diese Seite hier als Lesezeichen in Safari ab. Als Titel einfach „Quellcode anzeigen“ eingeben.
3. Danach die Lesezeichen-Liste im Browser öffnen und“Bearbeiten“ wählen. Auf das neu angelegte „Quellcode anzeigen“ drücken und die vorhandene URL löschen.
4. Anstatt der URL das eben kopierte Javascript hineinkopieren (einsetzen).

Ab sofort kann bei einer beliebigen Seite im Safari-Browser das Lesezeichen „Quellcode anzeigen“ aufgerufen werden. Das sorgt für die Anzeige des kompletten Quellcodes der aktuellen Seite.

2. Benutzen Sie einen alternativen Browser zur Anzeige des Quellcodes

Wir haben mit dem alternativen Browser iCabMobile bislang gute Erfahrungen gemacht. Ein kurzes Review zu iCab Mobile finden Sie hier.

Mit einem Druck auf das Symbol für Module (Puzzleteil) öffnet sich die Liste der vorhandenen Module. Hier einfach auf das Modul „Quelltext“ drücken. Danach wird direkt der Quelltext der aktuell aufgerufenen Internetseite angezeigt. Hier ist die Anzeige sogar noch schöner struktiert.

P.S.: Das hier beschriebene Vorgehen funktioniert natürlich auch auf einem iPhone.