もう勝負ついてるから。

~次世代系無職マガジン~

ブログでAAをズレずに表示したい人が読むべきテクニック

f:id:hyo-ta:20170705063150p:plain

こんばんは、最近会社で便利屋さん扱いになってる氷太です。

ブログをせっせこっせこ書いてる人は共感して貰えると思うんだけどさ。

「あーここ、文章じゃなくって絵で感じを出せたらな~」って思った事ない?

絵描ける人は描けばいい話だけど、オレみたいに絵心なくって描けない人も多いと思う。

 

そこで「AA使おう!」と思い付いた人も恐らく居るだろう。

アスキーアート、略してAA。

こういう奴ね。

f:id:hyo-ta:20170705063302p:plain

 

絵の描けない人間にとってAAは救世主のような存在だ。

使い所は本当に多い。

使えば使う程、その偉大さが分かる。

 

例えば・・・そうだな・・・。

最近ハンターハンターの最新刊が発売されたろ?

 

その時の喜びを、文章のみとAAを用いて表現した時の印象を比べてみよう。

比較し易いように、文章自体はそんじょそこらのアイドルにも劣る内容にしておく。

ああ、特に面白い文章が思いつかなかっただけだ。

ではまず文章のみの場合から。

 

 

「うおおおおお!!富樫ありがとおおおおおっ!!」 

 

 

 

次にAAを用いた表現の場合

 

 

「うおおおおお!!富樫ありがとおおおおおっ!!」 

f:id:hyo-ta:20170705063311p:plain

 

 

お分かり頂けただろうか?

文章のみの方は読んでいて「あ・・・はい。」くらいの印象しか抱かなかっただろう。

だがAAを用いた方はどうだっただろうか?

「そこまでなのか・・・!?」と奥歯がガタガタ言うくらいの熱量を感じたのではないだろうか?

 

「いや、どっちも同じだけど?」って思った奴は帰れ。

坊やは家に帰ってママのミルクでも吸ってな!オレも後から合流する!!

 

だが問題が発生する。

AAをそのまま貼り付けようとするとズレちゃうんだよね。

AAをズレずに表示させる為には?

ズレる理由

AAは記号を組み合わせて、絵のような表現力を持たせているものだ。

1つ1つの線は勿論文字と一緒。

  • PCではズレていなくてもモバイルでズレる
  • モバイルではズレていなくてもPCではズレる 

といった現象が起きてしまう。

それどころかどちらでもズレるという事だってある。

 

原因はブラウザによって、フォントの大きさ・種類によって文字の比率が変わってくるからだ。

なのでもっと突っ込んで言わせて貰うと

自分から見るとズレていないのに、他の人が見るとズレている

って事だって在り得るわけだ。

 

ズレずに表示させる為には?

置換したり、CSSで直すというやり方もあるのだが・・・。

誰もがズレずに見れる簡単な方法として、AAを画像で張り付けるという方法がオススメ。

 

超お手軽なツールがある。

AAMZ Viewer

このサイトだ。

f:id:hyo-ta:20170705063322p:plain

やる夫・やらない夫といったメジャーなものから、普段見かけないニッチなAAも網羅している。

 

使い方は簡単だ。

f:id:hyo-ta:20170705063329p:plain

右側に表示されているサムネからコピーして、貼りたい所に貼り付けるだけ。

誰でも出来る手順しかない。

ただこのサイトを通して1番大変なのは

「使いたいAAがどこにあるのか分かりづらい」という事。

 

やる夫PCや、やる夫アクションなど、ジャンルはフォルダ毎にきちんと分けられている。

だが悲しいかな、ラインナップが豊富過ぎて探すのが少し大変。

使いたいAAが明確な場合、検索して画像をコピペした方が早い時もある。

 

手順自体は簡単だが、慣れるまでには少し時間がかかるかもしれない。

ただブログの表現力の幅が広がる事は間違いないので、使えるようにしておくと便利。 

 

AAを使いこなすには?

どんなAAがあるかを知っておこう

最も大事なのは「どんなAAがあるのか把握しておく事」。

AAは既に作られた完成品を使用する事になる為、絵と比べると自由度が劣る。

その為、自分の表現したい内容に適したAAを選ぶという事がとても重要になってくる。

 

たまにでいいので眺めておくと

「へー、こんなAAあるのか。こういう時に使えるな」

とレパートリーも広がる。

「やる夫」「やらない夫」の基本フォルダだけは最低限覗いておこう。

 

自分なりのパターンを作っておく

AAは単一でも効果は発揮するけれど、その真価はAAのコンビネーションにある。

コンビネーションは自分のブログの作風に合わせて、自分で編み出すしかない。

イメージしやすいように、活用しやすい具体例を紹介しよう。

 

あ~、今日も仕事疲れたな~・・・。
ちょっくらご褒美に婦女暴行でもしてきますか!

f:id:hyo-ta:20170705063339p:plain

 

 どんな教育されて来たんだこの豚ァ!!

f:id:hyo-ta:20170705063348p:plain

 

とりあえずボケて、やる夫を殴れ。

 

ただ知的な雰囲気のあるブログで、このパターンを使用するのはオススメできないかな。 

多分、読者ドン引きすると思うから。

「ドン引きされても構わねぇ!オレが書きたいものを書くんだ!」

って方が運営してるなら、反対する要素はないんだけどさ。

そういうスタンスは嫌いじゃない。

だけど頑張る所を間違えてないかな?とは思う。

 

他にも控え目なやらない夫のAAがあるから、そういうの選んだ方が無難。

それともう1つ、導入しやすい例をご紹介しよう。 

自虐コンビネーションだ。

 

 

よ~し、記事できたお!
題して「俺が軽はずみに想像妊娠したせいで、幼馴染の人生が狂ってしまった。

f:id:hyo-ta:20170705063359p:plain

 

こんな記事書けるなんてさすがオレだお!
これはバズるニオイしかしねーお!!

f:id:hyo-ta:20170705063409p:plain

 

f:id:hyo-ta:20170705063418p:plain

 

自虐ネタを得意とする人には、非常に相性の良いコンビネーションだろう。

2番目と3番目の2つだけでも充分かもしれない。

ボケて、持ち上げて、落とす場合は、この3つを使うと良いだろう。

 

AAは基本的に1~3つで構成されるべきだとオレは考えている。

ブログでAAの使うという事は、完成された絵に対して文章を付け足す行為だ。

一連の流れが長くなればなる程、文章の動きにAAが追いつかなくなっていく。

どんどんと違和感が増していってしまうので、非常に難易度が上がってくる。

 

だが1つのAAに対し、文章を書き込み過ぎると間延びしてしまいテンポが悪くなる。

ここらへんの調整がAAを導入する際の難しい所かなあ。

実際に自分で4コマ漫画をAAで作成してみると良い。

どれだけ寒いかが分かってくるから。

オレのこのAAのコンビネーションだって、めちゃめちゃ寒いだろう?

これでも分かり易いように、頭捻って作ったんだぜ!? 

 

AAを導入する際は、明瞭簡潔に最低限。

ここを意識して利用していこう。

 

もう1つの便利なツール を使おう!

中には文章入力に工夫が必要なAAがある、

例えばこれだ。

f:id:hyo-ta:20170705063429p:plain

 

これはやらない夫の一言に対し、やる夫が沈んでいる・・・。

そんな情景を表したAA。

ここにただ普通に文字を打っていくとおかしな事になる。

 

30代にもなってプリキュア見てんじゃねえよ。

f:id:hyo-ta:20170705063429p:plain

 すいません・・・・。

 

どっちがどのセリフを言ってるのか、分かりにくい。

なのでこの場合、ペイントでテキストを入力してもいいんだけどこのツールを使おう。

AA(アスキーアート)の画像化Webツール! – Webツール

 

まず1番初めに紹介したツールから、ソースをコピペする。

f:id:hyo-ta:20170705063446p:plain

 

次に画像化ツールにコピペして、文章を入力し『AA画像化』をボタンを押す。

f:id:hyo-ta:20170705063458p:plain

 

あとは貼り付けるだけ。

こんな感じになる。

f:id:hyo-ta:20170705063508p:plain

 

まとめ

うわ~・・・。

改めて見るとオレの紹介したAAって、受け狙いが見え見えで凄く寒いなぁ・・・。

とりあえず感じだけでも掴んで頂ければ幸い。

今回紹介したツールは、もしかしたら貴方のブログの行く末をいつか左右するかもしれない。

今のところ、オレのブログでは右往左往させられているけども。

AAって本当に素晴らしい力を秘めているから!

f:id:hyo-ta:20170616111031p:plain