Web業界に復帰しようと学び直していると、本当に便利になったと実感します。

　私がHTMLにかかわり始めた頃は、ブラウザといえば IE と Netscape がしのぎを削っていた時代で、今ではその両方とも姿を消しています。
　当時、他人のホームページの構造を調べる手段といえば、ブラウザの「ソースを表示」でHTMLを眺めるぐらいしかありませんでした（まだCSSが普及していなかったので、何とか読み解けていました）。

　しかし今のブラウザは驚くほど高機能ですね。検証ツールが標準装備され、ページの構造を視覚的に確認できるので、ウェブクリエイターにとっては夢のような環境です。

　もっとも、機能が増えても、所詮ツールはツール。使いこなせるかどうかは利用者の技量次第で、そこは昔と変わりません。ちょっとした工夫やひと手間を加えるだけで、活用の幅がさらに広がります。

　下の画像は、WordPressのテーマを少しカスタマイズした際、その構造を調べたときのスクリーンショットです。
　このコラム用に用意したものではなく、前後の要素との関係や、他のページへの影響の確認用に撮った時のものです。熟練者や記憶力に自信のある方には不要かもしれませんが、初めてのテーマカスタマイズでは非常に役立ちます。

　なお、Windowsの場合、標準アプリの「フォト」などは同じファイルを複数ウィンドウで開けるため、赤枠で囲った箇所を拡大表示して並べ、同時に参照することも可能です。
　このスクリーンショットと、ブラウザの検証ツールを使って比較検討すると、カスタマイズする際のセレクタを比較的楽に特定できたりします。
　ちょっとしたコツですが、参考まで。