Be donkey, be wise

recommendation

Bingウェブマスターツールへの登録方法【はてなブログ】

f:id:amazon_roba:20201013010827j:plain

この記事は "Bingウェブマスターツールへの登録方法"についてお話していきます.

Bingから記事に検索流入があったけど。。。

毎日エゴサーチしているようにアクセス解析を見ているロバちゃん。すると。。。

 

[f:id:画像URL:Bingウェブマスターツール]

 

『Bingから検索流入がある!!』

『11%の人、見てくれてありがとう』

『それよりBingって使ったことないよ』

『そういえばgoogle consoleとかあるし、Bingもなんかあるんじゃ。。。』

  

とりあえずロバちゃんは、はてなブログ内を探すことに。。。 

 

すると、

 

ダッシュボード→設定→詳細設定を下スクロールにありました!

 

2. Bingウェブマスターツールへの登録方法!

ステップ.1 Bing - Web マスター ツールをクリック

 

すると、サインインするアカウントを選べるので、選択します。

 

ステップ.2 自分のサイトをBingに追加する方法を選ぶ。

[f:id:画像URL:Bingウェブマスターツール]

 

今回はGoogle Search Consoleを使っていない人もいると思われるので、手動追加を選びます。

 

URLを実際に入力すると、サイトを追加して確認と表示されるので確認方法を3つのうちから選びます。

[f:id:画像URL:Bingウェブマスターツール はてなブログ]

 

ステップ.3 ”HTMLメタ タグ”を選ぶ。

 

すると

<meta name="XXXXXXXXXXX" content="XXXXXXXX"/>

というような感じでコードが出てくるので、Content内の”XXXXXXXX”をコピー。

まだこのタブは消さないでください!!

 

ステップ.4 先ほどコピーをはてなブログのBingウェブマスターツールに張り付け。

[f:id:画像URL:Bingウェブマスターツール はてなブログ]

コピー後、設定を保存します。

 

ステップ.5 Bingウェブマスターツールに戻り確認をクリック

 

[f:id:画像URL:Bingウェブマスターツール はてなブログ]

と出れば完了です!!

 

  

これで、Bingウェブマスターツールに登録できました。次は、google consoleについて書いていこうかなと思います。

最後まで読んでいただき本当にありがとうございます。 Prrrffff(ロバの鳴き声)

 

ビューポートが設定されていませんの対処法【はてなブログ】

f:id:amazon_roba:20201013010827j:plain

この記事は "ビューポートが設定されていませんの対処法"についてお話していきます.

Google consoleのモバイルユーザビリティでエラー!?

記事を数枚書き上げ、googleにインデックス登録をした直後、

 

f:id:amazon_roba:20201016012542p:plain

 

Google consoleのモバイルユーザービリティでエラー!!!!』

『エラーが3つも出ている!!!!』

『モバイル?でもレスポンシブルデザインにしたよ。。。なんで。。。』

『訳が分からないよ。。。』

 

HTML初心者で、コピペばかりしていた自分には何言っているのかさっぱりわかりません。

 

レスポンシブルデザインなのになぜでしょうか。。 

 

とりあえずひとつずつ、解決していこうと思いました。

 

2. ビューポートが設定されていませんの対処法

ステップ.1 ダッシュボードの設定を開き詳細設定のタブをクリック

f:id:amazon_roba:20201016014921p:plain

真ん中のタブです

 

ステップ.2 下までスクロールし”headに要素を追加”にビューポートを追加

f:id:amazon_roba:20201016015858p:plain

この部分に下記のコードを入れていきます。

<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0">

 

ここに入れる最適なコードを自分なりに調べた際、Takumi Kimura様の記事を参考にさせていただきました。本当にありがとうございます。

qiita.com

  

結果ビューポートのエラーはなくなりました!最後まで読んでいただき本当にありがとうございます。 Prrrffff(ロバの鳴き声)

 

今更聞けない「カスタムURL」について【はてなブログ】

f:id:amazon_roba:20201013010827j:plain

この記事は "はてなブログのカスタムURL機能"についてお話していきます.

あれ、ブログのURLが数字になってる!?

有名ブロガーの夢を持ってはてなブログをはじめて間もない頃、

 

『URLが数字になってる!!!!』

 

よくよく見ると、ブログ掲載日時を並べた数字になっていました。これは、かっこ悪い。。。。

 

調べてみると、簡単に変えられる方法がありました。

 

2. カスタムURLを使おう!

ステップ.1  右端にある”編集オプション”をクリック. 

f:id:amazon_roba:20201013005731p:plain

右端にある3つのアイコンの一番下(工場のマークみたいなやつ)です




ステップ.2 上から二番目にあるカスタムURLの箇所に自分の好きな文字列を入力

 

f:id:amazon_roba:20201013010034p:plain


今回はこの記事のURLをこのように入力しました。

(カスタムURLで日本語の記事だからjp)

 

これで完了です!最後まで読んでいただき本当にありがとうございます。 Prrrffff(ロバの鳴き声)

 

調子に乗って過去の記事のURLを変更した結果....

 

あれ、検索結果に出てこなくってる。。。本当にやばいことしたかも。。。

画像からグラフを読み取る方法(初心者向け)

この記事は "画像データからグラフを読み取る方法"についてお話していきます.

 

1. WebPlotDigitizerを使う(ダウンロード不要)

 

ステップ.1 WebPlotDigitizer - Extract data from plots, images, and mapsにアクセス. 

f:id:amazon_roba:20201009142521p:plain

ステップ.2 言語を選んで(英語でOK), "Launch Now!"をクリックする(緑色のボタン).

 

2. WebPlotDigitizerの使い方

具体例) "赤い折れ線グラフ"の数値を読み取る. 

f:id:amazon_roba:20201009142800p:plain



ステップ.1 "File"をクリックして, "Load image(s)"(左上)を押す. そこから画像データの入力ができる(形式はPNGでもJPGは確認済みです).

 

f:id:amazon_roba:20201009143703p:plain

 

ステップ.2 XY軸の位置を指定し、それぞれの最大値・最小値を入力し”OK”をクリック. これでグラフのの見込みは完了です(両対数・片対数グラフも指定もできます)。

 

f:id:amazon_roba:20201009145629p:plain

 

ステップ.3  "automatic extraction"のところにある色が塗られているBOXをクリック.

 

f:id:amazon_roba:20201010005831p:plain

 

STEP.4 "Color Picker"をクリックし読み取りたいグラフの好きなところをクリックし”DONE”.(具体例の場合赤のグラフの好きなところをクリックするとできます)

f:id:amazon_roba:20201009151251p:plain

 

ステップ.5 ”RUN”をクリック。すると自動的に赤のグラフ上にプロットされます。もしプロット間隔を調整したいのであれば、ΔX、Y の数字を変更すればできます。

 

f:id:amazon_roba:20201009151931p:plain

 

最後に "View Data"をクリックすればデータを抽出できます. 

f:id:amazon_roba:20201009152122p:plain

 

クリックしたらこのような画面が出てくるので、欲しいデータが出たら書かれている数字をコピーする。CSVファイル(エクセルで開ける)でもダウンロード可能です。

f:id:amazon_roba:20201009152242p:plain

 

新聞や論文で読み取りたいデータがあったとき、本当に重宝しました!最後まで読んでいただき本当にありがとうございます。 Prrrffff(ロバの鳴き声)

How to quantify values in a graph from the image data?(Easiest!)

This article explains "how to quantify the graph in an image data".

 

(日本語のページはhttps://amazon-roba.hatenablog.com/entry/webplotdigitizerjp)

 

 

1. Which tool?

 

STEP.1 Just access WebPlotDigitizer - Extract data from plots, images, and maps

f:id:amazon_roba:20201009142521p:plain

STEP.2 Choose your language, and click "Launch Now!"(Green one).
(You don't need to download, just launch)

 

2. How to use "WebPlotDigitizer?

Example) I would like you to quantify "the water amplitude of red-soild line". 

f:id:amazon_roba:20201009142800p:plain



STEP.1 Click the "File", and open "Load image(s)"(Top-left side). we can upload the image and define the scale of the graph. 

f:id:amazon_roba:20201009143703p:plain

 

STEP.2 Determine the points of lower and upper values(X and Y axises), and input these lower and upper values of X and Y axises. Click "OK", then finally the information of the graph were inputed completely.

(You can also use for a graph with log-scales.)

f:id:amazon_roba:20201009145629p:plain

 

STEP.3  Find "automatic extraction", and click the box filled some color.

 

f:id:amazon_roba:20201010005831p:plain

 

STEP.4 Open "Color Picker" and click the red-solid line. Then, click "Done".

f:id:amazon_roba:20201009151251p:plain

 

STEP.5 Find "Run" on the right side, and click it. Then, you can see some plots on the red-solid line.

 

f:id:amazon_roba:20201009151931p:plain

 

LAST On the lift side, you can find and open the box"View Data". 

f:id:amazon_roba:20201009152122p:plain

 

Finally, you get all plot data(you can download as CSV file!)

f:id:amazon_roba:20201009152242p:plain

 

I hope that it would help your work!!! See ya!! Prrrffff