どんな話？
アプリの中の内蔵ブラウザで example.com を開き、Import で画用紙に取りこんで、見出しを1か所打ちかえて .pen で保存した回です。約6秒で「div」という名前の枠が入り、見出しは文字のまま選べて、Context 欄に「h1」と出ました。取りこみのあいだ、AIのペンは動いていません。ただしページの動き（JavaScript）は残らず、取りこめることと使ってよいことは別です。
この記事でわかること
- 取りこみの入口は5つ。この回の主役は、デスクトップアプリだけの機能の内蔵ブラウザ
- 取りこんだ枠の名前は「div」、見出しの Context 欄は「h1」。元のページの作りの名残をつけたまま入る
- Pen の規約に取りこみを名指しで禁じた条文は無いが、他人の権利を侵す使い方は禁止。取りこんでも、そのページの権利は持ち主に残る
- Figma からコピーして貼ると、画像の要素は入らない。ファイルを丸ごと取りこむか、画像を自分で入れる（ドキュメント）
- Chrome の拡張機能「pen.dev web import」は、ドキュメントに使い方が無く、すべてのサイトのデータにさわれる権限を求める
こんな人に
- 自分のサイトやブログの直し案を、コードを開かずに画用紙の上で試したい人（元のサイトは変わりません）
- デザインの道具を開くたびに、白紙から画面を組み直している人
- 「ウェブページを丸ごと取りこめる」と聞いて、他人のサイトでもいいのか気になった人
この話のTIPS
- 注意Pen でログインしたままのページ（マイページや管理画面）を取りこむと、名前や注文などがそのまま画用紙に入ります。練習は、ログインの要らない example.com か自分のページで。
- コツPen に入れた画像は .pen の中に入らず、外の別のファイルとして指されます。.pen だけを移したり人に送ったりすると画像が欠けるので、画像のファイルと同じ並びのまま動かしましょう。