HTMLで画像を表示する

-
　画像を表示するには、<img>タグを使います。今回も、SEOを絡めて説明しましょう。

写真やイラストなどの画像を表示する時に<img>タグが使われます。この<img>タグにはいくつかの属性が指定できます。属性はたくさんありますが、今回は主に利用するタグだけを説明します。なので詳しくはコチラを参照ください。

属性 用途
src属性 画像ファイルをURLで指定
height属性 画像表示の高さをピクセル値で指定
width属性 画像表示の幅をピクセル値で指定
alt属性 画像の替わりに表示される文字列

src属性は画像ファイルをURLで示しますので、他のサイトでリンク可能な画像を指定することができます。以下の例は、Wikipediaのイメージをリンクとして利用した場合です。
例：
<img src="https://upload.wikimedia.org/wikipedia/commons/3/3d/Html-source-code3.png"/>
このHTMLのコードがブラウザにより下記のように表示されます。


Wikipedia HTMLのページより

注意！リンク先がリンクを認めていない場合、無断リンクは行わないでください！
また、前回記事でも書きましたが、ファイル名もキーワードとして扱われるため、具体性がわかるようなファイル名に変更する事をオススメします。

hright属性とwidth属性は元画像が大きな画像の場合に縮小して表示させたい時に表示したい大きさを指定します。

alt属性は画像を表示しない、或いはできない場合に替わりにalt属性で指定した文字列を表示できますが、実はこの文字列も検索キーワードとして扱われ、画像検索時のインデックスとして利用されます。ただし、alt属性も多くの情報を詰め込むとスパム扱いされます。
　これは、alt属性の文字列が視覚障害者への読み上げテキストにも利用されるため厳しく判断しているようです。

スパム扱いされそうな例：
この画像表示を下記のように記述すると。。。スパム扱いされるかも。。。
 
<img src="かわいい子猫.png" alt="子猫 猫の赤ちゃん 小さな子猫 メインクーン スコティッシュフォールド アメショ ノルウェージャンフォレストキャット シャム シンガプーラ キャット フード キャットフード 激安 子猫の餌"/>

　src属性とalt属性でキーワードを設定できますが、ページ全体と調和するようなキーワードになるよう意識して設定してください。お客様が検索を行う時、より関連性の高い検索結果として上位に表示されるようになります。

船橋の頭脳
Lightning Brains


コメント

コメントを投稿

このブログの人気の投稿

Linuxシステムコール、メッセージキューの使い方

-
UNIX / Linux システムコール・プログラミング プロセス間通信(IPC)、メッセージキュー メッセージキューとは？ いわゆるメッセージボックスのような動作を行う IPC です。 プロセス間で一意に識別できるメッセージキューに対してメッセージを書き込み、受け取りができます。 また、メッセージキューは SYSTEM V IPC です。 メッセージキューを使うためには、まずメッセージキューを作成してユニークなキューIDを作成する必要があります。msgget()というシステムコールでキューを作成します。 メッセージを送信するためには msgsnd()、メッセージを受信するためには msgrcv()、最後にメッセージキューを削除するために msgctl() を使います。 メッセージの受信側プロセスのサンプルコードを下記に示します。 #include <sys/types.h> #include <stdio.h> #include <sys/ipc.h> #include <sys/msg.h> #include <string.h> #include <unistd.h> #define MSGBUFSIZ 256 int main(int argc, char** argv) { int msqid; key_t msgkey; struct msgbuf{ long mtype; char mdata[MSGBUFSIZ]; }; struct msgbuf msgdata,*p; p = &msgdata; // Make Message queue key. msgkey = ftok("msgq.key",'X'); // Get Message queue ID. msqid = msgget(msgkey,IPC_CREAT|0666); // Message receive loop wile get "Quit" massage. while(1) { // Receive a Message. ...
続きを読む

Linuxシステムコール、共有メモリの使い方

-
UNIX / Linux システムコール・プログラミング プロセス間通信(IPC)、共有メモリ 共有メモリとは？ カーネルが管理するメモリ空間をユーザープロセスに ”見えるようにする” ことで、複数のプロセス間で同じメモリ空間を利用することができます。 プロセスからは通常のメモリと同様に見えるため、同じエリアに対しての同時書き込みなどについては、排他制御を行う、あるいはアトミックな操作とするなどの対応が必要になります。 共有メモリは SYSTEM V IPC です。 それでは、早速サンプルコードについて解説します。 今回のコードは2つのプログラムで構成されています。 shm_r.c 共有メモリは、shmget()システムコールにより共有メモリを取得します。このときの引数の指定で”ない場合は作成する”、パーミッションを与えるなどの指定を行います。生成された共有メモリにアクセスするため、shmat()システムコールでポインタを得るます。 以降、このプロセスはshmat()システムコールで得たポインタを通じ、自由に共有メモリにアクセスすることができます。 この、サンプルshm_r.cは、共有メモリを生成・アタッチすると１秒毎にメモリの更新をチェックし、更新された場合は内容を表示します。このときの更新内容が "Quit"であった場合、共有メモリをデタッチし、共有メモリを破棄します。 #include <stdio.h> #include <stdlib.h> #include <string.h> #include <sys/types.h> #include <sys/ipc.h> #include <sys/shm.h> #include <unistd.h> #define DATA_SIZE 2048 int main(void) { int id; char *shmData; char data[DATA_SIZE]; // Shared memory create a new with IPC_CREATE if((id = shmget(IPC_PRIVATE, DA...
続きを読む

Linuxシステムコール、セマフォの使い方

-
イメージ
UNIX / Linux システムコール・プログラミング プロセス間通信(IPC)、セマフォ セマフォとは？ セマフォ、聞き慣れない言葉ですが大昔の鉄道の信号機のことです。 単線区間で列車同士が衝突しないようにするため、信号機が使われました。 意味合い的には同様で、コンピューター内のある資源（メモリなど）に別々のプロセスが同時にアクセスしないようにするために利用します。 セマフォはSYSTEM V IPC です。 この、セマフォを利用することで複数のプロセスが同期して処理を進めることができます。 Linuxのセマフォは、セマフォ集合として生成して利用します。 このため、1つのセマフォ集合に複数のセマフォを含めることができ、Linuxのセマフォはカウンティングセマフォであるため、複数の許可を与えることも可能です。 ただし、この記事のサンプルコードは1つの集合に1つだけのセマフォ、許可数は1つだけとなっています。 まず、セマフォ生成のサンプルコードを示します。 seminit.c #include <sys/types.h> #include <sys/ipc.h> #include <sys/sem.h> #include <stdio.h> #include <stdlib.h> union semun { int val; struct semid_ds *buf; unsigned short *array; }; int main() { key_t key; int semid; union semun arg; if ((key = ftok("sem.dat", 'S')) == -1) { perror("ftok"); exit(1); } /* create a semaphore set with 1 semaphore: */ if ((semid = semget(key, 1, 0666 | IPC_CREAT)) == -1) { p...
続きを読む