2019年4月9日の内容、文章を整え、画像を入れる

4月9日のブログ勉強会は、前回の復習で、長い文章をわかりやすく段落分けし、Canvaで作った画像を入れました。

文章の整形

↓こちらのように見づらい文章を

こちらのように設定していきます

パソコンやスマホでは、ぎっしりと詰まった文章はとても見づらいです。

本番画面の表示で3行前後で空行を入れるようにしましょう。

見出しはテキストモードで

<h2>見出しにする文字<h2>

＜h2＞で囲うと表示されます

ビジュアルモードでは段落▼ の部分をクリックすると選べます。

見出しを使う時の注意

見出しは、あくまで文章の構造を表すものです。１、２、３と番号順にぶら下がっていくように使用しなければなりません。

文字の大きさや色を変える目的のために使ってはいけないことになっていますので注意が必要です。

Unsplash(アンスプラッシュ)というフリー（無料）の画像サイトで今回は見出しにする画像をダウンロードしました。

動画

【初心者講座】Unsplashで画像をダウンロードする方法

Canva（キャンバ）という画像編集サイトで、文字入れをしました。

動画

【初心者講座】Canvaを使ってブログの見出し画像を作る

『スーツケースとは』という文字に、ウィキペディアのリンクを入れ、別タブで開く設定をしました。

リンクは、テキストモードの場合

LINK（リンク）ボタンを押して

URL：リンク先のアドレス
リンク文字列：表示させる文字
リンクを新しいタブで開く：新しいタブで開く場合は☑を入れる

スマホでの見た目をパソコンで確認するには、キーボードの

『Ctrl』と『Shift』と『 i 』を同時に押してください。（F12キーでも良いです）

右上に出てくる □が二つ重なったようなアイコン（スマホとタブレットを表しています）をクリックします。

するとスマホの表示が確認できるようになります。

今回は、改行のない文章を読みやすく改行し、
Unsplashで画像をダウンロード
Canvade文字をのせて
投稿に見出し画像を設定しました。

リンクを作る復習をし、
h2で見出し文を作る方法を学びました

次回の開催は4月23日。

今回の文章整形の復習と、続きの作業を行います。
コードの記事内への埋め込みも行います。