概要
私事ではあるのですが、Qiitaなどで引用する際に、引用したドキュメント、記事などのサイトのtitleタグのエレメントが欲しくなります。そういった経緯も相まって、どのように行えば最速最短で引用したサイトのtitleタグのエレメントに辿り着けるのか私なりに考察致しました。
Jeffrey Zeldmanが”Taking Your Talent to the Web”で述べていたようなことと同様に、なるべくクリック数は少なくゴールにたどり着きたいものです。
それでは、私が思いつく限りの3つの簡単な方法を後述致します。
以下の方法は、ブラウザにChromeを使用しており、Chromeに依存した方法である可能性があります。また、OSにはMacを使用しておりMacで使用するショートカットだけを紹介している箇所が御座います。これらを留意してお読み下さい。
方法1(無難に検証)
まずは無難に目的のサイトを検証してtitleタグのエレメントを取得する方法を試したいと思います。
Command + Shift + C（WindowsではControl + Shift + C）を行いheadタグを開いてtitleタグに辿り着く方法です。
まぁ、無難にtitleタグには辿り着けますが、場合によって、ゴールまでの工程が多いですね。
つまり場合によってCommand + Fでtitleタグを検索して一番上のものを見つけなくてはいけないわけですからね。
結果:
到達までのコスト: 2アクション以上🤦
終了までのコスト: 1アクション✨
懸念点: 探す工程がシンプルに多くなる可能性がある🤦
方法2(Command + S)
続いてはCommand + Sを使用する方法です！
これは、本来titleタグのエレメントを取得する為では当然なく、表示されているHTMLファイルを保存する方法です。
しかし、このショートカットを行うと、ファイルを保存しようとウィンドウが表示されます。
すると、そのファイル名にはtitleタグのエレメント1が用いられています。
それをコピーして使用するという方法です。
以下のような工程になります。
これは方法1の検証と比べて、到達までのアクション数が圧倒的に減りましたね！
気分がいいです！
しかしCommand + S後のウィンドウ表示が少し遅くないですか？
これは少し気になるので懸念点ですね...
結果:
到達までのコスト: 1アクション✨
終了までのコスト: 1アクション✨
懸念点: ウィンドウ表示若干遅くない？🤷♂️
方法3(ブックマーク)
3つ目はブックマークを使用する方法です。
こちらも同様に、本来の用途と違った使用法になります。
私の場合は、ブラウザにChromeを使用してますが、上部のブックマーク追加ボタンをポチッと押すと”ブックマークを追加しました”と表示されますね。
その名前のところを見ると、なんとtitleタグのエレメントが表示されてるではないですか！
これをCommand + Cし、削除して完了です。
この方法は非常に早いです！
ただ、クリックで操作しないといけないのは懸念点でしょうか？
Ctrl + Shift + Dがブックマークのショートカットらしいですが、クリックで行う操作で出てくるウィンドウの表示結果と異なるものが表示される為、Ctrl + Shift + Dは適用できないようです。
また、追加された後に、しっかりブックマークの削除をしておかないで画面遷移をしてしまうと、ブックマーク登録されてしまいます。そうすると、回収コストが上がってしまいますね。
結果:
到達までのコスト: 1アクション✨
終了までのコスト: 1アクション✨
懸念点: クリックしないといけない & 削除してから画面遷移しないとブックマークされてしまう🤷♂️
まとめ
私の結論は、Command + Sの方法を使用するか、ブックマークの方法を使用するのが最強なのではと思いました。
先述させて頂いた方法以外にも良い方法が何かあるかもしれません。
探求に終わりはありません。
コメントで頂いた取得方法の追記
- 開発者ツールのConsoleでdocument.titleで表示させ取得。