So untersuchen Sie ein Element auf einem Chromebook

Wenn Sie gerne mit Website-Code herumspielen oder ein lästiges Layoutproblem beheben möchten, ist das Tool „Element untersuchen“ in Chrome nahezu unverzichtbar. Es zeigt Ihnen die Rohdaten von HTML, CSS und JavaScript, aus denen eine Webseite besteht, was Ihnen die Augen öffnen kann. Außerdem können Sie Dinge vorübergehend optimieren, um zu sehen, wie sie aussehen, ohne etwas zu beschädigen – praktisch, als würden Sie mit dem Code Doktor spielen. Auf Chromebooks ist dies unkompliziert, aber manchmal hängt die Methode, die Sie letztendlich verwenden, davon ab, wie Sie am liebsten darauf zugreifen oder welche Tastenkombinationen Sie bevorzugen.

So überprüfen Sie ein Element auf einem Chromebook

Da es sich bei Chromebooks lediglich um ChromeOS-Laptops handelt, sind die Entwicklertools des Chrome-Browsers bereits integriert. Sie können mit einem Rechtsklick auskommen, Menüs oder Tastaturkürzel nutzen – je nachdem, was Ihnen schneller und komfortabler erscheint. Beachten Sie jedoch, dass sich die Chrome-Menüoptionen je nach Update manchmal hinter anderen Pfaden verbergen, der allgemeine Ablauf aber derselbe bleibt.

Verwenden des Rechtsklickmenüs zum Überprüfen

Dies ist wahrscheinlich der einfachste Weg, da Sie lediglich Ihre Maus oder Ihr Touchpad benötigen. Nichts Besonderes, aber effektiv. Wenn Sie keine Lust haben, sich durch Menüs oder Einstellungen zu wühlen:

• Öffnen Sie Ihren Chrome-Browser und rufen Sie die Webseite auf, die Sie sich ansehen möchten.
• Klicken Sie mit der rechten Maustaste irgendwo auf die Seite – ja, mit der normalen rechten Maustaste, die Sie für alles andere verwenden würden.
• Wählen Sie in diesem Kontextmenü „Untersuchen“ aus. Boom – die Entwicklertools werden geöffnet und Sie können HTML und CSS sehen.

Es ist schon etwas merkwürdig, dass das Rechtsklick-Menü je nach Website oder Chrome-Version manchmal eine andere Reihenfolge oder andere Optionen hat, aber „Inspect“ ist normalerweise vorhanden. In manchen Setups heißt es vielleicht __Inspect Element__ oder einfach __Inspect__.

Verwenden des Chrome-Menüs (Option „Entwicklertools“)

Wenn Sie eher ein Menümensch sind oder eine Möglichkeit ohne Rechtsklick suchen, ist das Chrome-Menü die Lösung. Diese Methode eignet sich gut, wenn Sie lieber durch die Menüs stöbern, um auf weitere Entwicklerfunktionen zuzugreifen:

• Klicken Sie auf das Symbol mit den drei Punkten in der oberen rechten Ecke von Chrome.
• Bewegen Sie den Mauszeiger im Dropdown-Menü über „Weitere Tools“.
• Wählen Sie im Untermenü „Entwicklertools“ aus.

Dadurch wird an der Seite oder am unteren Rand des Fensters ein Fenster mit dem Quellcode der Webseite geöffnet. Diese Methode ist manchmal etwas langsamer, aber sauberer, wenn Sie vermeiden möchten, dass versehentliche Rechtsklicks andere Optionen auslösen.

Verwenden einer Tastenkombination für schnellen Zugriff

Okay, das ist der schnellste Weg – wenn Sie sich an die Tastenkombination erinnern. Auf einem Chromebook ist es nur eine Ctrl + Shift + IKombination, und schon erscheinen die Entwicklertools. Sie müssen sich nicht mit Menüs oder Rechtsklicks herumschlagen.

Diese Tastenkombination funktioniert oft sofort und ist nach einer Weile auch meine Standardeinstellung, da sie schneller ist als die Suche in Menüs. Beachten Sie jedoch, dass die Tastenkombinationen bei einigen neueren Setups oder bei der Neubelegung von Tasten leicht abweichen können. Im Allgemeinen ist diese jedoch Standard.

Zusammenfassung

Auf einem Chromebook fühlt sich die Überprüfung von Elementen wahrscheinlich ganz natürlich an, sobald man sich an diese Methoden gewöhnt hat. Egal, ob Sie schnell debuggen, den Aufbau einer Website verstehen oder einfach nur mit Seitenstilen herumspielen möchten, die Entwicklertools von Chrome sind Ihr Freund. Die Rechtsklick-Methode ist günstig und einfach, der Menü-Ansatz ist etwas formeller und die Tastenkombination ist der Geschwindigkeitsdämon.

---

---