ホームページ制作 京都 / WordPress DTP

Kyoto Web Design 8acrewood blog

8acrewoodのブログです。ブログサンプルも兼ねております。

HTML5のimgタグには、widthやheight属性はいらない?

ホームページを作るときに、画像は欠かせません。
画像はもちろん、imgタグや、cssのbackground-imageなどを使用します。

従来imgタグには、alt、height、widthなど様々な属性を必ず入れなくてはならなかったのですが、
最近ではheight、widthなどはエラーになるようです。

ホームページを制作する際に必須のチェッカー
W3C Markup Validation Service
でチェックすると、

Bad value 200px for attribute height on element img: Expected a digit but saw

というようなエラーが出ます。
以前は見ることのなかったエラーなので、HTML5の規定がまた変わったのかもしれません。

W3CのWeb制作概念から考えると、レイアウトなどはすべてcssで行う。
というのが基本なので、当然の変化なのかもしれません。

何より、imgタグには属性が渋滞しがちなので、ソースがすっきりしてよい変化だと思います。

まだまだ確証はないので不安な方は必ずバリデーションサービスを使用しましょう!

意外と知らないjqueryをダウンロードする方法

一昔前は、いろんなページに「こちらからダウンロード」
というようなボタンがあって、簡単にダウンロードできていたような気がするのですが、
最近ではそんなボタンを見かけなくなりました。

人によっては最新版がダウンロードできなくて大変だ!
と思っている人がいるかもしれません。
もちろんいないかも知れません。

なぜボタンを見かけなくなったのか。
その答えは簡単。

jqueryのホームページからとても簡単に最新版がダウンロードできることをみんなが知ったからなのです。(たぶん)

まずはjqueryのホームページに行きます。

http://jquery.com/

01

こんなかんじです。

リストにdownloadとあるので、おもむろにクリックしてダウンロードページへ

02

英語ばっかりでとてもややこしいですね。

ここでそっとページを閉じてしまう人もいるかもしれません。

ですが、もう一頑張りです。
とりあえず最新版がほしいので、赤文字の上のほうが欲しいという目星は尽きます。

Download the compressed, production jQuery 1.11.1
Download the uncompressed, development jQuery 1.11.1
Download the map file for jQuery 1.11.1
jQuery 1.11.1 release notes

文字の意味は分かりません。
ですが、ここで必要なのは、「production」や「development」のところだけなのです。

ダウンロードと書いてあるので、とりあえずクリックしてみます。

03

さっきページを閉じなかった人もここで閉じたくなるとは思いますが、ここはぐっと我慢して「戻る」ボタンを押しましょう。

このプログラムの羅列は、jqueryのプログラムを快適に読み込ませるためにマッシュアップしたものです。
リスト下の「development」の方には、マッシュアップされていないものが記載されてあります。

jacascriptをいじりたい!という人は後者を選ぶと良いです。
通常は「production」のほうがよく使用されます。

さてダウンロードの方法ですが、クリックしてもダウンロードすることはできません。

ではどうしたらよいのか?

04

右クリックをして「名前を付けてリンク先を保存」を選択するだけです。

あとは任意の場所にダウンロードします。

そうすると 「jquery-1.11.1.min.js(数字はバージョン)」など、のファイルがダウンロードされます。

これでばっちりですね!

Windows7で、ファイルの拡張子を表示する設定の方法

htmlやcssで画像ファイルを読み込むときに、
拡張子が表示されていないと不便です。

例えば画像ファイルでよく使用される拡張子は、
.jpg(ジェイペグ).png(ピングー).gif(ジフ)などがありますが、
これを読み込むときは、<img src=”ooo.jpg”>のようにファイル名と拡張子を記載する必要があるからです。

Windows7の場合は、たまに設定が「拡張子を表示しない」ようになっている場合があります。
なので、設定の方法を書いておきます。

まずは読み込みたいファイルがあるフォルダを開きます。
そして、開いたウィンドウの上の方にある、「整理」ボタンをクリックします。

rrr

そうすると出てくる、「フォルダーと検索のオプション」をクリックします。
「フォルダオプション」が開くので、「表示」というタブを開きます。

sss

ちょっとややこしいですが、拡張子が表示されない場合は、
詳細設定の中にある、「登録している拡張子は表示しない」にチェックが入っているので、
このチェックを外して、右下の「適用」ボタンを押せば設定完了です。

Google サイトマップとは 作り方、アップの仕方

サイト管理者にとってSEO対策は日々ドキドキしながら見守らなければならないものです。
その対策の一つとして、Google ウェブマスターツールに登録したりします。

Google ウェブマスターツールを見ていくと「サイトマップ」うんぬんという言葉が出てきます。

サイトマップというのは、自分の地図。
自分のサイトのリンクを地図のように説明したものを作ることによって、
Googleの検索ロボットが巡回しやすいようにするものです。

当然SEOに有利だと考えられています。

Google ウェブマスターツールのサイトマップはXML方式で、
Webやプログラムに不慣れな人にはさっぱり訳が分かりません。
なので、今回は簡単に作成し、アップする方法を紹介します。

まずは、
http://seo.fc2.com/sitemap/
を開きます。

1
開いたら、サイトマップを作成したいサイトのURLを入力して、
「サイトマップ作成」ボタンを押します。

このときに、サイトのトップページと、同じページを意味するindexファイルがある場合は、
重要性が分散されてしまうので、統一しておきましょう。

2

更新度や、重要度を選択し、「サイトマップ保存」ボタンを押します。
すると「sitemap.xml」ファイルが作成されます。
これでサイトマップは完成です。

あとはこれをアップしてGoogle ウェブマスターツールに登録します。
アップ方法は簡単です、サイトの直下ディレクトリ、つまりindex.htmlファイルとディレクトリにFTPソフトなどでアップします。

ファイルをアップしたらGoogle ウェブマスターツールに移動します。
左側の「クロール」タブから、「サイトマップ」へ移動します。

3

アップしたら、サイトマップのURLを記載して、「サイトマップを送信」ボタンを押します。

 

4これでGoogleウェブマスターツールに登録できました、

「インデックスに登録済み」という項目に「保留」と記載してありますが、
これは時間がたってGoogleボットが巡回してくれれば変更されますので気にせずに。

SEO対策、相互リンクページの禁止らしいです

最近まで、SEO対策といえば、
なんだかんだ言って相互リンクページに登録しまくってリンクをもらうことが近道でした。

しかし最近Googleから「相互リンク専門サイトからのリンクはスパムとみなす!」
とのお達しがありました。

こっちからのリンクは
<rel=”nofollow”>
で効果をなくすことが出来ますが、
すでにもらっているリンクはどうなるんでしょう?

メールでお願いしてもなかなか協力的ではない管理者さんもいますので大変です。

Googleの将来的な観測では、限りなく人間に近い巡回ロボットを作るつもりのようですが、
制作側は、いつも振り回されてばっかりですね。