スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
人気ブログランキングへ ブログランキング・にほんブログ村へ


htmlの共通部分の外部ファイル化

 第10日目 その3
 ページを増やすついでに共通部分の外部ファイル化もやってみた。
 ネットで検索してもズバリぴったりの物が見つからない。
 15分くらい探してようやく見つけた。

例)
・元のhtml
サンプルのhtmlです<br>
<img src="./sample.jpg" width="200" height="40" alt="" border="0">

 ↓

・変更後のhtml
<noscript></noscript>
<script language="JavaScript" type="text/javascript" src="./sample.js"></script>

・sample.js
var html = 'サンプルのhtmlです<br>';
html += '<img src="./sample.jpg" width="200" height="40" alt="" border="0">';
document.open();
document.write(html);
document.close();

・sample.jsはこうでもOK
document.open();
document.write('サンプルのhtmlです<br>');
document.write('<img src="./sample.jpg" width="200" height="40" alt="" border="0">');
document.close();


 これでsample.jsを変えれば、共通する場所を一度に変えられる。
 でもJavaScriptが使えない環境もあるので、重要な部分には使えない。

 作業時間 : 30分
人気ブログランキングへ ブログランキング・にほんブログ村へ


スポンサーサイト

テーマ : アフィリエイト初心者向けノウハウ
ジャンル : アフィリエイト

画像の枠線

画像の枠線をCSSで指定する場合、基本的に全部消して、一部だけ自分で指定したい場合が多いと思う。
そのやり方。

html側
<img src="xxx.jpg">
<img src="yyy.jpg" class="img_border">

CSS側
img { border: 0px; }
.img_border { border: 1px; } ← ×
.img_border { border: 1px solid; } ← ○

CSSでimgの枠線を指定する場合、必ず線の種類(solid等)を指定しないといけない。
指定無しだとデフォルトが選ばれると思い込んでいた。普通そう思うよね。
FireFox3.5, IE8で確認。
原因を調べるのに1時間もかかった。

 作業時間 : 1時間
人気ブログランキングへ ブログランキング・にほんブログ村へ


html文法

 久しぶりに、自分のウェブサイトの文法チェックをやってみた。

 Another HTML-lint gateway

 けっこうエラーが出た。100点満点で-188点。
 仕方ないのもあるし、気にし過ぎるのも良く無いけど、直せる所は直そう。
 けっこう、うっかりミスもあった。

 ついでに、CSSのチェックもやってみる

 CSS Validation Service

 text-shadow がエラーになったけど。これは良し。
人気ブログランキングへ ブログランキング・にほんブログ村へ


favicon.ico

favicon.icoとは、ブラウザのURL表示の左に出る小さいアイコンのこと。
お気に入り(ブックマーク)でサイト名の左にも出る。

作り方は
1. 16×16の画像を作る。形式はPNG等が良い。
 (32×32でも良いと説明してるところもあったけど、有名所は16×16で作ってる。 こんな感じ)
  次の2.で使う変換ソフトが対応している形式で保存すること
  私の場合はPNGで保存

2. icon形式に変換
  変換ソフトを使う。ネット上にフリーの物が色々ある。
  私が使ったのはこれ、@icon変換

3. 名前を favicon.ico にして、サーバーにアップする
  バイナリモードで転送

4. htmlの修正
  <head>~</head>内に次の二行を追加

<link rel="shortcut icon" href="favicon.icoの場所を指定" />
<link rel="icon" href="favicon.icoの場所を指定" type="image/x-icon" />

 ホームに置いて "favicon.ico" としても良いし、私の場合は
<link rel="shortcut icon" href="./images/favicon.ico" />
<link rel="icon" href="./images/favicon.ico" type="image/x-icon" />

 ここで問題発生。FireFoxだとアイコンが正しく表示されるのに、IE8だと表示されない。
 何度リロードしても解決しない。

 そこで、googleさんに聞いてみる
  favicon.ico 表示されない ie

 IEでは履歴を消して、IEを再起動しないとアイコンが反映されないらしい。
 その通りにして解決。
 解決に1時間もかかってしまった。

 今日の作業時間:2時間
  アイコンの作成と設置に1時間
  IEで表示されない問題解決に1時間

2009/09/16 22:45 追記
スペルが一部間違ってました。
正: favicon.ico, 誤: fabicon.ico
(favicon = favorite icon)
人気ブログランキングへ ブログランキング・にほんブログ村へ


googleで検索してみる

このブログを作成して2週間になるのでgoogleで検索してみた。
おじさんのためのアフィリエイト講座

19万件中のトップに出てくる。

今度は、単語を区切って検索してみる。
おじさん アフィリエイト

56万7千件中の11番目に出てくる。

これが噂のグーグル・ハネムーンというやつか
Googleハネムーン

googleでは新規サイトは最初の一ヶ月間、上位にランクされるというやつだ。
きっと来月にはがくっと順位が下がるんだろう。
人気ブログランキングへ ブログランキング・にほんブログ村へ


プロフィール

wombat

Author:wombat
名前の由来は家にある、このぬいぐるみからです

Sponsored Link
カルビー フルーツグラノーラ
カルビー フルーツグラノーラ

My Keepon マイキーポン
My Keepon マイキーポン

ホイップる
明治チョコレートセット

ホイップる 明治チョコレートセット
きのこの山、たけのこの里、アポロなどがアクセに





ウイルスバスター トレンドマイクロ・オンラインショップ







吉川友 YOU! ~the DVD~
吉川友 YOU! ~the DVD~

秋山莉奈 ザ・おしり3 [DVD]
石田紗英子 晴れのちドキドキ[DVD]

秋山莉奈 ザ・おしり3 [DVD]
秋山莉奈 ザ・おしり3 [DVD]

秋山莉奈 ザ・おしり2 [DVD]
秋山莉奈 ザ・おしり2 [DVD]

秋山莉奈 ザ・おしり[DVD]
秋山莉奈 ザ・おしり[DVD]

Cica写真集
Cica loves YOU!

Cica写真集 Cica loves YOU!

CicaファーストDVD
ハジメマシテ…Cicaデス

CicaファーストDVD ハジメマシテ…Cicaデス

1/32 小惑星探査機 はやぶさ 特別メッキ版 【Amazon.co.jp限定販売】
1/32 スペースクラフトシリーズ No.SP 小惑星探査機 はやぶさ 特別メッキ版 【Amazon.co.jp限定販売】

魔女の宅急便 [Blu-ray]
魔女の宅急便 [Blu-ray]

となりのトトロ [Blu-ray]
となりのトトロ [Blu-ray]

天空の城ラピュタ [Blu-ray]
天空の城ラピュタ [Blu-ray]

風の谷のナウシカ [Blu-ray]
風の谷のナウシカ [Blu-ray]


参考記事

Sponsored Link



ブログ内検索
最新記事

  全記事一覧
カテゴリ
月別アーカイブ
人気記事
   
アクセスランキング
   
最新コメント
最新トラックバック
リンク
RSSリンクの表示
QRコード
QRコード
Counter

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。