webデザインを勉強するにあたり、実際のサイトのトレースをするのも大変勉強になります。今回はトレースするのに便利なGoogle拡張機能をご紹介します。
Go Full page

ページのスクリーンショットを取りたいけど、普通のスクショだと表示されているページしか撮影することができないんだけど…
そんな方に是非ページお勧めしたいのがGo Full Page。


表示ページをまるまるスクリーンショットすることができるツールです。
パックマン見たいでかわいいですよね。
ポイントはフェードインなどがあるページについては先に一度画像を全て表示されてから行わないと、画像が切れた状態になってしまうので注意。
png形式で保存できます。サイトトレースの時は真横に並べてトレースしたり、透明度を低めにして下に敷いて行ったりします。
ダウンロードはこちらから
What Font



使っているフォントの種類が知りたいんだけど何を使ってるのかわからない・・・
そんな人におススメの拡張ツールがWhat Font。


文字の上にマウスカーソルをあわせると使用されているフォントが表示されます。
サイトトレースのみならず、模写の時にも活用することができます。
ダウンロードはこちらから
Image Downloader



サイトトレースをしたいけど、画像はどうやったらいいの??いちいち右クリックで保存は大変…
そんな時とっても便利なのが。ImageDownloader。そのページに表示されている画像を一度に取り出すことができます。


これは模写の時にも便利なツールになります。
※著作権の問題の兼ね合いもあるので、あくまで練習に使うだけにとどめましょう
Fire Shot
こちらもGo Full page 同様ページ全体のスクリーンショットを取ることができる拡張機能です。


ページ全体のみならず、表示部分のみ、選択範囲のみ、などダウンロードの範囲の選択もすることができます。
Webデザインを勉強している人におススメの記事
コメント