こんにちは、皆さんは画像フォルダに画像をアップロードする時に名前をつける意味をご存知でしょうか?

アルバムのように画像名が掲載されることがない画像フォルダの写真に何故、名前をつける必要があるのか不思議を感じていらっしゃる方もいるかと思います。今日はサポートセンターに寄せられた質問の中からそんな疑問についてお答えいたします。

目的しては主に2つがあり、一つは画像の検索性を高めるためです。

画像フォルダ右上には検索ボックスがあり、こちらで過去にアップロードした画像を検索できます。画像にあらかじめ名前をつけておきますと後から過去の画像を使いたいと思った際にすぐ見つけられるため便利です。

そしてもう一つの役割は代替テキストとしての利用されることです。
実はホームページ上には直接表示されませんが画像名はalt属性(オルト属性)として構造情報(HTML)に記載されています。

alt属性は何らかの理由から画像が表示されない場合や画像を見ることができない場合に使われるもので主に目の不自由な方が使用する文字読み上げソフトなどで使われています。文字読み上げソフトは当然、画像の内容を読み上げることはできませんが画像名が入力されている場合には画像名が読み上げられることで、ホームページにどのような画像が掲載されているかを理解することに役立ちます。

また検索エンジン各社の情報収集を行う検索ロボット(クローラー)も画像を見ることはできませんがalt属性があれば画像の中身が理解出来、検索結果に正しく反映されることが期待できます。

以上が画像に名前を見ることがつける意味についてのお話です。
画像名が入力されていない場合にはファイル名が表示されますので必ず指定しなければ
ならないものではありませんがお時間があればぜひ、入力してみてください!

間違ったHTMLの話

2015年06月13日
世の中に溢れる言葉というものは刻々の変化を遂げています。
つい数年前まで誰もが使っていた言葉が今では死語と呼ばれ
使うことすら躊躇ってしまうものが多々あります。

さて、今回はそのような変化は現実の世界だけでなくインターネットの
世界でもよくあることであるというお話をさせていただきたいと思います。

ホームページというものはそのままの内容が映像のように送られるわけではなく
HTMLと呼ばれる設計書のようなものをやり取りすることで成立しています。
設計書の書き方にはルールがありいわば、コンピュータが話す言葉のようなものです。

誰かがアクセスをしてきた場合には設計書を送り、それをアクセスした方の
パソコンやスマートフォンが読んで、人間が見るホームページの状態に構成します。

Grupoではユーザーが入力されたものを元にコンピュータが理解できる
HTMLの形に自動的に変換をしておりますので通常作成の際にはHTMLの知識は一切必要ありません。
なのでそもそも「HTMLなんて知りない」という方が多いかと思います。

それであれば何も心配はいらないのですが最近、古い書籍や
ネットで得た知識なのか、昔ホームページの作成されていた方なのか
今では間違ったHTML構文を使っている方をポツポツとお見かけするようになりました。


間違っている例(HTML5)


[1] 改行したい時
× <br> → ○ <br />

[2] 文字色を指定したい時
× <font color="red"></font> → ○ <span style="color:red;"></span>

[3] 文字を中央に寄せたい時
× <center></center> → ○ <span style="text-align:center;"></span>

※本来、<>は小文字で表記しますが説明の都合上、大文字で掲載しています。



該当するものを使っている方はいらっしゃらないでしょうか?
これらは最近主要となっているHTML5では間違った書き方となりますが
少し前までは普通に使われてきた構文なのです。

また、厄介なことに多くの端末では間違った構文であっても
期待通りの表示をしてしまいます。そのため間違っていることに気づかない場合も多いです。
ただしこれらは構文としては完全に間違っており検索ロボットなどが
ページを正しく理解することを阻害する可能性も否定できません。

本来、ホームページをより良いものにしたいという思いから
使われているものと思いますのでこれは非常に悲しいことです。
もし心当たりがあるという方は一度確認されてみてください。

今日は、昨日追加されたトピックパスのお話を少しさせていただいきたいと思います。

トピッスパスは別名を「パンくずリスト」といいます。
これは童話のヘンゼルとグレーテルで、主人公が森で迷子にならないように
通り道にパンくずを置いていった、というエピソードに由来するらしいです。

世の中では「パンくずリスト」という名前の方が一般的なようですが
いまいち、ピンとこないのでGrupoでは基本的にトピッスパスと合わせて表記しています。

この機能は「正直、そんなに‥」と思う方も多いかもしれませんが
SEO(検索エンジン最適化)として意外と要望が多かったものだったりします。

SEOとは簡単に説明するとGoogleやYahooなど検索エンジンに対して
フレンドリーな作りにすることで検索結果の上位に載せてもらおうということです。

ちなみにここでのフレンドリーとは、あくまで
「検索エンジン(ロボット)さんに対してわかりやすくしようね!」

ということなのですが世間にはSEO対策など称して料金を取る業者もおり、
その中には検索エンジンを騙すような方法で上位表示を目指すものもあります。
そのようなサービスを利用すると検索結果に一切表示されなくなるなど
後から厳しいペナルティーを受ける可能性がありますので十分注意が必要です。

また一昔前のSEOの対策として知られているようなこと、例えば「必要のないキーワード等を
人間には見えにくい色で意図的に記載する行為」などは検索エンジンから不正の判定をされます。
冷静に考えれば巨大企業であり、高い技術力を持つGoogleが素人の小手先だけの対策を
見抜けないわけはないので検索エンジンを騙すような方法はやめたほうがよいでしょう。

さて、話を戻しましてトピックパス(パンくずリスト)がどうしてSEOをなるかと
いうとそれは迷子になることを減らせるという部分が大きいです。

検索ロボットは極めて賢いですが人間のようにページ内の
文章の意味を完全にわかっているわけではないので現在地を示す案内となる
トピックパスがあることで正確にページ構成を理解することが可能になります。
また、ページ構成や内容が正しく理解されれば検索した方にもっとも合う内容を
表示できるためページの内容を本当に求めている方のアクセスが期待できます。


今回は少し長くなってしまいました。検索ロボットが正しく理解できるようにする工夫は
他にもいくつもあるのですがそれはまたの機会にいたします。
トピックパス(パンくずリスト)はロボットにとっても人間にとっても
役立つ機能かと思いますのでぜひ、使ってみてください。