サイト作りやSNS、ブログなどの投稿で空白を入れたいとき、うまくいかずに悩んでいませんか？ 単なる“スペース”ではなく「空白文字」を利用すると、スムーズに設定することが可能です。
空白文字とは、行の頭や文字間などに空白の文字を打ち込み、スペースを作るための文字のこと。しかし、使い過ぎるとユーザーが文章を読む際に邪魔になったり、検索エンジンが文脈を適切に把握できなくなったりする場合があります。今回はコピペで使える「空白文字」を紹介しつつ、SNSやブログでの使い方の注意点をご紹介します。
コピペで使える「空白文字」一覧
空白文字を使うことで、文章の見た目を整えたり、サイト作りで強調したい部分を目立たせることができます。代表的なものには、「ハングルフィラー（HANGUL FILLER）」と呼ばれる文字があります。
なお、説明不要でいますぐ空白文字を使いたい場合は、以下をコピーして使ってください。
1個「ㅤ」
2個「ㅤㅤ」
3個「ㅤㅤㅤ」
4個「ㅤㅤㅤㅤ」
5個「ㅤㅤㅤㅤㅤ」
Instagramハイライトの名前を空白にする方法
上記で紹介したコピペ用の空白文字を使ってみましょう。まずInstagramハイライトの名前を空白にする方法を解説します。
先述した空白文字をコピーしてから、Instagramのプロフィール画面を開きましょう。
今回使用した空白文字はこちら。「ㅤㅤㅤㅤ 」
【1】①編集したいハイライトを長押しして、「ハイライトを編集」をタップ。【2】②「×」ボタンで文字を消す
【3】③コピーしておいた空白文字をペーストし、④「完了」をタップ。【4】⑤プロフィール画面でタイトルが空白なのが確認可能
その他SNSやブログで使える空白文字
なお、空白文字を使用したいSNSやブログがHTMLタグの入力に対応している場合、下記のタグを入力することで空白を表示することも可能。
・  
・
・  
・  
これらは「文字実体参照」と呼ばれるもの。詳しくは後述します。
空白文字のその他のやり方
コピペ以外に空白文字を使う方法として、以下をご紹介します。
・文字実体参照を使用
・CSSのinline-block要素で空白を表現
・全角スペースを使用
「 」など文字実体参照で空白指定
文字実体参照は、キーボードでは入力できない文字など、特殊な文字をHTMLで表現する方法。空白文字もHTMLで定義されているため、文字実体参照で指定することで、空白を直接入力できます。
以下の文字列をHTMLファイルやWordPressのテキストエディタに入力すると、空白を指定できます。
|   | 細いスペース |
| | 改行禁止スペース |
|   | nの文字幅のスペース |
|   | mの文字幅のスペース |
これらの空白文字を「 」のように繰り返し入力すると、その分の空白が挿入されます。 たとえば細いスペースと改行禁止のスペースを組み合わせるなど、複数の空白文字を組み合わせることで、自分のイメージに合った幅の空白文字を入力することも可能。
CSSで空白を表現する
CSSのinline-block要素で空白を表示できます。
実際に使うCSSとHTMLの例は以下の通り。
| 備考 | ||
| CSS | .blank_space{ display:inline-block; width:10px; } |
「width:10px」は空白文字の幅を表わしています。数字を変更することで幅を変えることが可能。 |
| HTML | いろはに<span class=”blank_space”></span>ほへと |
空白として全角スペースを使う
空白文字を表現するためには、「いろはに ほへと」のように全角スペースを打ち込む方法があります。ただし、これは文章や段落を区切る場合以外ではあまりおすすめできません。なぜなら、「いろはに ほへと」は「いろはにほへと」という一つの単語ではなく、「いろは」と「ほへ」という二つの単語だと解釈されてしまうからです。これではGoogle検索やSNS内の検索で見つけられなくなってしまいます。
空白文字をSNSやブログで利用する際の注意点 | SEO対策には不向き
Instagramのハイライトの名前に空白文字を使うと、見た目がおしゃれになりますね。しかし、ウェブサイトやブログで空白文字を使うと、SEOに悪影響があります。
その理由は空白文字は文中に不要なスペースを作ることで、検索エンジンが単語をきちんと認識できない可能性があるから。だからこそ、ウェブサイトやブログで空白を表現したい場合は、CSSで調整することがおすすめです。
まとめ
SNSのサブアカウントの名前を考えるときに便利な空白文字。しかし、サイトやブログに使うと、SEOに悪影響があるので注意が必要。CSSでの表現方法も覚えておきましょう。
