Categories: MacWordPress

【2019年】WordPressサイト作成で僕が使用している、Google機能拡張これは欠かせない。

ぼくが普段サイト作りや、ブログを書くときに使用頻度の
高いツールやアプリ紹介します。

2019年使用頻度の高いgoogle機能拡張紹介します。

ブラウザは下記の3つのブラウザを使い分けています。

SafariはMacユーザならインストールされています。

使用ブラウザは、基本google chromeです。理由はgoogle chromeの機能拡張が、サイト作りに欠かせないぐらい
便利だからです。

ブログ制作でHTMLを使用したり google chromeが遅く、サイトの表示やダウンロードが出来ない場合Firefoxブラウザを使います。

多分多くの人の使用頻度が少ないせいか、すぐ表示できたり、ダウンロードもスムースに出来ます。

基本はgoogle chromeを多く使います。

 

google chromeの機能拡張の便利さ

機能拡張が画面に表示されていて、すぐ使える便利さはブログ作成やサイト作りには欠かせません。

 

Google chromeのインストール

使用してない人はGoogle chromeを検索しインストールを探して下さい。下記のような画面になります。

Google chromeダウンロードする。

 

ダウンロードページの赤の四角のところをクリックします。

 

同意してインストールボタンをクリックします。その後登録して機能拡張やメール、カレンダー機能等、使えるようにしましょう。

 

 

 

Google chrome機能拡張インストール

機能拡張はアプリ画面のストアをクリックします。

このような画面になり、下の機能拡張をクリックし検索窓より検索してインストールします。

 

Googleドライブ

この機能も気に入っています。

googleが提供する5GBまで無料のオンラインストレージです。有料で容量を増やすことも出来、僕は無料を使用しています。

 

googleドライブはブラウザ上で文章・表計算・プレゼンテーションなどの
ファイル作成や編集、共有することも出来ます。

 

 

またネットに接続できる環境であればいつでもどこでも閲覧でき、windowsでもMacでも見られます。インストール後アプリ画面を開き Googleドライブをクリックします。

ダウンロードgoogleドライブ

 

このような画面なりファイルや表計算管理などプラスして使用します。

商品管理やアフリエイトブログ、を多く持って いたりするには、ここに書き込んでおくと
ここから作成したブログに行くことも出来、以前はパスワード管理などもここでしていました。

今はパスワード管理専門のアプリに変えましたが、見やすさや管理のしやすさは
申し分ない気がします。
商品管理も、もちろん便利に使えます。

機能拡張をするとGoogleでサイトを開くと右上に表示され便利に使えます。
ここからいつでも使用することが出来ます。

Awesome ScreenShot キャプチャーと注釈

様々なスクリーンショットを撮ることができます。注釈やコメント、矢印なども入れることができる優秀な拡張機能です。個人的に嬉しいのは「ページ全体の(縦長の)スクリーンショット」が撮れることです。隠れている部分まで含めてスクショできるのです。

Awesome ScreenShot

コメントや図形を入れるのは・・・Skitchを使っています。

 

 

google+ハングアウト

ハングアウトもGoogle機能拡張です。
インストール後 googleのブラウザの右上に表示され、いつでもすぐに開始することが出来ます。

google+ハングアウト

 

写真や絵文字を送ったり、友達がハングアウト中かどうかを確認したり、相手が
接続していない時でもメッセージを送ったりできます。

右上のこのマークをクリックするとgoogleブラウザが開いてある
状態でしたらいつでも出来ます。

クリックするとハングアウト窓が開き登録されている誰とでも
ビデオハングアウト通話ができます。

 

また仲間10人までビデオ ハングアウト通話ができ、Skypeよりこちらを使う
ことが多くなりました。

サイト作成で分からない事ができた場合、詳しい人とお話できたり使い方色々です。

 

どこでも翻訳 Translate Anywhere

英語ページ全体ではなく、一部分だけを日本語に翻訳できるツールです。翻訳したいテキストを選択し、右クリックで[文章を翻訳する]をクリックすれば、そのすぐ下に日本語訳が表示されます。

その他にもGoogle翻訳も機能拡張しています。

どこでも翻訳 Translate Anywhere

Category Tabs for Google Keep

Category Tabs for Google Keep

Chrome上でメモが取れる拡張機能です。Google Keepを使っていたのですが、こちらのほうが色分けなどアイコンが簡単にできます。数字やURLをメモするときに重宝しています。おすすめ。

Macには優秀なメモ機能がありますが・・・時によってはすぐ同期しない場合があります。しかしGoogleの機能拡張メモたらどこでも見ることができます。

 

Evernote Web Clipper

Evernote Web Clipper

Evernoteを使っている人でしたら、このクリップ機能で後から読み直したいウェブページがあるときに記事ごとさくっと保存ができます。

 

Web Maker

Web Maker

アイコンをクリックすると、新規タブを「コードエディター」にして、HTMLとCSS、Javascriptを書くことができます。結果はすぐ隣に表示されます。


オフラインでも使うことができ、ちょっとしたテストをしたいときや、解説用にコード例を書くときなんかにとても便利です。

WhatRuns

WhatRuns

表示中のページで使用されているツール、スクリプト、プラグインなどを1クリックでチェックできる拡張機能です。

「自分が気になるページは何で作られているんだろう」や「この表現は何のプラグインを使っている?」と気になったときに簡単に調べられます。

 

Page Ruler

サイトの中のサイズを知りたいときにとても役立つ機能です。

Page Rulerはサイトを作成する時、トップの写真の縦横サイズとか、
デザインを参考にしたいサイトで、本体やサイドカラムの要素が何pxのサイズに
設定されているか、簡単に計測できる機能です。

 

以前はMeasureItを使用していました、こちらでも十分なのですが
より正確性を求めるためにPage Rulerにしました。

A)測りたところにカーソルを合わせドラッグします。
●Aの小さなボックスで微調整が出来正確に測ることが出来ます。

B)に縦横のPXサイズが表示され知りたい情報が入手出来ました

C)は表示ボックスを下にしたい場合ここをクリックします。

D)ここをクリックすると消すことが出来ます。

ダウンロード Page Ruler

 

ColorZilla

自分のブログ・サイトをカスタマイズするときなど、気になる
Webページのカラー情報を素早く取得できます。

 

自分が参考にしたいサイトの色をGoogleの右上からスポイドマークを
選び『Pick Color Page』を選び、調べたいカラーの上でクリックします。

自動的に保存され『Color Picker』のところに保存されます。
一緒にカラーコードも出てきますので、すぐにコピー&ペーストすることも出来ます。

また 『Color Picker』のところをクリックするとこのような画面なり、
カラーコードはもちろん、カラーヒストリー(今まで調べたカラー)も
表示され、非常に使い勝手が良く出来ています。

サイト全体のベースカラーやアクセントカラーなど、カラー番号などで
表示しコピーしてくれます。
配色のバランスを知りたい時とか、スポイド形式で簡単に表示してくれ、
スゴク便利になりました。

今までColrs.appアプリとか使っていましたが、Color Pickerが
格段に便利です。

 

人のサイトの要素を知りたい時

製作者がよく使う要素の検証が有ります。
知りたい部分を反転させ右クリックで『要素の検証を』クリックします。

 

反転したところが右に表示されカラーフォントその他の情報がわかり
サイトのカスタマイズや、作成に役立ちます。

 

googleを使用時に、自分のサイトの部分的な場所の特定や、人のサイトの
フォントや要素を知りたい時、その箇所を反転させ右クリックし要素の検証を
クリックすると HTMLで要素は表示され内容がわかります。

まだまだ使いこなせていませんが、少しは、わかるようになりました。
サイト作成には要素の検証は欠かせません。

https://tomio23.com/archives/11745

 

 

tomio23