XHTML

ホムペのデザインをプチ修正  2014年03月23日
元ダンスアカデミーのサイト  2014年03月21日
Zen-Coding  2012年06月22日
一定期間New/Upマークを表示する  2012年02月11日
ウェブから画像の取り込み  2011年11月09日
HTMLをエスケープする  2011年05月23日
テスト  2011年01月24日
フラッシュが表示されない  2010年12月08日
IEで由美かおるさんの動画が  2010年07月22日
flvファイルの埋め込み  2010年07月19日
HTMLにflvファイルを埋め込む  2010年07月19日
YouTubeタグをXHTML validにする  2010年07月18日
HTML のミスが SEO の大問題になる5つの事例  2010年04月06日
ニコニコマークの出し方  2010年01月21日
livedoorのロゴがダブルで  2009年12月22日
ロールオーバー  2009年08月28日
Shift_JISをEUCに変換2  2009年08月19日
Enough is enough! No more IE6! 2  2009年08月13日
Enough is enough! No more IE6!  2009年08月06日
画像の表示をOFFにしたら  2009年08月05日
FinePix F200 EXR  2009年06月23日
動画再生のタグ  2009年06月21日
サイトで文字の大きさを変える  2009年06月19日
ファビコンをサイト全体に  2009年04月27日
ゴースト退治  2008年08月29日
画像のロールオーバー  2008年05月11日
IE-7の問題を解決  2008年05月11日
IE-7でひと苦労  2008年05月10日
親boxの高さがでない  2008年05月07日
movファイルをobjectで  2008年04月21日

2014年03月23日

ホムペのデザインをプチ修正

昨日のことですが、
久しぶりにHTMLとCSSを使ってデザインを修正しました。
動機は元大分ダンスアカデミーのトップページの画像がモバイルで崩れることに気づいたこと。
PCで見るぶんには全く支障がなかったがモバイルでは大変なことに。
それはとりあえず修正できたようだけど、ついでにというわけで。
ドクター江部の著作本の紹介欄に件数を増やした。
当然スクロールバーが表示されるわけだが、、、
すぐ下にある更新履歴にバーがあるからそれを流用。
サイズの数値を修正してうまくいきました。
ついでにプロフの100の質問の答えを修正しました。
HTMLはともかくCSSをいじるのは楽しいです。

biomasa at 09:45コメント(0) この記事をクリップ!

2014年03月21日

元ダンスアカデミーのサイト

元ダンスアカデミーのサイトはリキッドレイアウトにしているが、
今日初めてスマホやiPadでトップページを見たら画像がゆがんでいる。
自分はPCしか検証できないので確かではないがとりあえず修正した。
HTMLファイルのimgはwidthとheightをそれぞれ100%にしていたが、それを削除。
CSSファイルで#bsoita img { width: 100%; height: auto;}に変更した。
#dance imgも同様。
これでPCの画面は正常に表示されている。
W3C VALIDATOR でチェックしたらOKだった。
W3C CSS でチェックしたらケアレスミスが2箇所あったので修正した。
まりさんにメールして明日チェックしてもらおう。

biomasa at 19:38コメント(0) この記事をクリップ!

2012年06月22日

Zen-Coding

HTMLのコーディングのスピードアップにこれがいいという記事があった。
例えばこのように入力して…
div#header>ul#nav>li*4>a
展開させると…
<div id="header">
  <ul id="nav">
    <li><a href=""></a></li>
    <li><a href=""></a></li>
    <li><a href=""></a></li>
    <li><a href=""></a></li>
  </ul>
</div>
一気にコーディングできちゃいます。便利ですね!
とあるけど、
div#header>ul#nav>li*4>a
と入れるには、HTMLのコーディングが頭に浮かんでいないと不可能。
自分なら愛用の「ez-HTML」で直接書いてしまうしそのほうが早い!
今はこのソフトも入力支援がしっかりしているから
一語一語タグを打つ必要もないし。
「Zen-Coding」は秀丸のマクロで展開できるようで、
一応取り込んでみたけど、そこまででその先には進んでいない。

2012年02月11日

一定期間New/Upマークを表示する

new.js
// JavaScript Document
// 一定期間New/Upマークを表示する
function newUp(y, m, d, c) {
  delDay = 30; // 何日後に削除するか
  oldDay = new Date(y + "/" + m + "/" +d);
  newDay = new Date();
  d =(newDay - oldDay) / (1000 * 24 * 3600);
  if(d <= delDay) {
    // Newマーク
    if(c == "new") document.write("<img src='../img/new.gif'>");
    // Upマーク
    if(c == "up") document.write("<img src='../img/up.gif'>");
  }
}
//
<!-- 作成・更新した日とNew/Upを記入 -->
<a href="#">サンプル</a><script type="text/javascript">newUp(2012,2,11,"new")</script>

2011年11月09日

ウェブから画像の取り込み

ニュースサイトとかで画像のギャラリーがあります。
これ欲しいなと思い、画像の上で右クリックしても反応がないことが多い。
そんな時はソースを見ます。
一般的にはその中でaタグで画像を表示しています。
絶対パスなら簡単、相対パスならディレクトリをたどって絶対パスを見つける。
表示された画像は簡単に取り込めます。
今日は面白いのを発見。
なんと背景画像で表示していた。
表は1ピクセルのgif画像 (笑)
urlの後にあるパスをコピペして新規の窓で表示させればOKでした。

2011年05月23日

HTMLをエスケープする

ここのブログにある投稿時の設定で「HTMLをエスケープする」というのがある。
あまり深く考えることもなく何年も過ぎたが、ふと気づいた。
要するにタグを働かせないということだ、たぶん。
ということでこの前の記事でテストをし、ソースを貼ってみた。
予想通りタグが働いていない。
しかしソース部分を引用文にしたかったが、
タグが働かないのでそれは不可能。
それをするには、引用文のタグを打って、
中身のHTMLの「<」を「&lt;」に、「>」を「&gt;」にすればいい。
一括して置換すればとても簡単 (^_^.)

2011年01月24日

テスト

あああああ
いいいいい
あいうえお
<blockquote class="none"><h1>テスト</h1>
あああああ
いいいいい
あいうえお</blockquote>

テスト


あああああ
いいいいい
あいうえお


2010年12月08日

フラッシュが表示されない

まめちゃんのお誕生日でフラッシュ画像を表示しようとしたが、
このブログだけ表示されなかった。
別の画像専用サーバに表示させてリンクを貼ったけど。
コードの中のフラッシュファイルへの絶対パスが読み込めないようだ。
他の手があるだろうけど、今は思いつかない (;^_^A

2010年07月22日

IEで由美かおるさんの動画が

二直さんが、うちでは由美かおるさんの動画が見られませんと言う。
Firefox と Google Chrome で確認しただけだったので (;^_^A
IE8で確認したけど何にも表示されなかった。
ez-HTMLのビューで確認したような気がしてるけど、
多分、確認はしてなかったのだろう。
p.s.
ネットで調べたら、
type属性でMIMEタイプを指定するといいようです。 とあったので、
type="application/x-shockwave-flash" を追加したらOKでした。

2010年07月19日

flvファイルの埋め込み

先の記事にflvファイルの埋め込みタグを記録したが、一応成功した。
先日見つけた由美かおるさんの合気道の演舞の動画をYouTubeからダウンロードし、
それを自分のサーバにアップして表示させることに成功した。
出来るまでは結構やり直しを繰り返した。
2回目の稽古で桂さんが昨日の感じで飛ばしたが、まあまあかな。
こまさんもふっちゃんも来なかったから試験台はパパさんだけ。
こまさんは旦那の命日だから墓参りに行ったようだ。

HTMLにflvファイルを埋め込む

player.swfファイルをゲットしてから。
<object id="flvplayer" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="320" height="260">
  <param name="movie" value="player.swf?file=video.flv&image=example.jpg&fullscreen=true" />
  <param name="wmode" value="transparent" />
  <embed name="sample" src="player.swf?file=video.flv&image=example.jpg&fullscreen=true" width="320" height="260" wmode="opaque" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>

embedタグはjavascriptにする。
// example.js
document.write('<embed src="player.swf" width="320" height="260" bgcolor="ffffff" allowscriptaccess="always" allowfullscreen="true" flashvars="author=編集者名&file=video.flv&image=example.jpg&title=sample-mov&fullscreen=true" />');
embedタグのところに以下を挿入。
<script type="text/javascript" src="example.js"></script>

尚、player.swf及びflvファイルは別のディレクトリからの相対パスでもよい。
絶対パスもOKという情報もあった。


2010年07月18日

YouTubeタグをXHTML validにする

私が使っていたのよりも洗練されています。

<object data="URL" type="application/x-shockwave-flash" width="500" height="300">
  <param name="movie" value="URL" />
  <param name="wmode" value="transparent" />
</object>


2010年04月06日

HTML のミスが SEO の大問題になる5つの事例

シニアネット大分のMLに流した全文です。
シニアネット大分にこれが分かる人が何人いるかですが (;^_^A
japan.internet.com

HTML のミスが SEO の大問題になる5つの事例


「HTML のミスは SEO にマイナスにはならない」というのは、SEO でよく語られることである。

一般的な Web ページでは、いくつかの HTML のミスは当然あるだろう。意図的に HTML 文法から逸脱しなくては、多くの環境で同じ表示にすることができない場合もある。そのため、誤った HTML により検索エンジンが評価を下げることは、検索結果でユーザーにとっての価値をランク付けする上でも有益ではないだろう。

同様に、正しい HTML を記述したとしても、それだけで検索エンジンが評価することはない。HTML Lint などの HTML 文法評価ツールでの得点を上げたとしても、検索エンジンからの評価が上がることは基本的にないだろう。

ただ、それにはいくつかの例外があり、HTML のミスが SEO に致命的な問題となっている事例は多く存在する。本稿では、特に大きな問題に繋がりがちな HTML のミスを紹介しよう。

●意図しない隠しテキスト・隠しリンク
HTML のミスにより、表示するつもりのテキストが表示されない場合がある。本来は表示するつもりが、意図せずに背景色と文字色を同じにしてしまう場合や、認識できない文字サイズになってしまう場合、画像を変更したにも関わらず alt 属性など代替要素を変更し忘れた場合には、検索エンジンを騙す意図がなくても隠しテキストや隠しリンクとして検索エンジンスパムと判断される可能性がある。

特に、h1要素においては複雑な CSS を設定する場合が多く、このようなミスが発生しやすい。ページのテーマであり対策キーワードも含まれやすいh1要素を結果的に隠してしまうことは、問題となる可能性が高いため、注意したい。

●特定タグのミス
タグの使い方について、若干のミスであればブラウザでの表示が崩れることはないだろう。しかし、ブラウザは解釈できても、一部検索エンジンは認識できない場合がある。

たとえば、タグや引用符「"」の閉じ忘れなどがあったとしても、最近のブラウザでは表示が崩れることはないが、検索エンジンの認識としては、閉じ忘れの後方の一部テキストを認識できなくなる場合がある。

また、aタグの閉じ忘れにおいては、SEO 観点で重要なリンクを検索エンジンが効果的に認識できない状況となりえるだろう。さらに、画像に対する代替要素として、alt 属性ではなく title 属性のみを使用することで、検索エンジンがその内容を認識しない場合などが見受けられる。

●検索エンジン向けのタグのミス
ブラウザでは一切表示されずに、検索エンジンだけが評価するタグがいくつか存在する。そのようなタグは、少し間違えただけで致命的な問題が発生する場合がある。たとえば、canonical の設定においては、ブラウザでは一切表示されずに SEO 観点だけで問題となるため、大きなミスをしていても気付かずにトラブルとなってしまう場合があるだろう。

また、内容確認のためにアップした際の noindex の指定が、本アップでも外されていないことで検索エンジンに認識されないなどのトラブルも多く存在する。

●論理タグのミス
h要素など、論理的な意味があるタグの使用について、CSS で制御をしておけば、h1要素とh2要素を逆にマークアップしていても、ユーザー観点ではほぼ問題がない。

しかし、Web ページの論理構造を認識しようとする検索エンジンにとっては、非常に大きな問題となってしまう場合がある。ブラウザでの表示だけではなく、CSS を切った状態で情報が正しく伝わるようになっているかの確認が必要だろう。

●文字コードの認識トラブル
検索エンジンが、Web ページの文字コードをうまく認識できないことにより、検索エンジンからの評価が大きく落ちる場合がある。

数年前のブラウザとは異なり、現在一般的に使われているブラウザでは、文字コードを誤認識することは少なくなってきた。ただ、一部の検索エンジンは一般的なブラウザよりも文字コードの自動認識が弱い場合がある。文字コード宣言を誤った場合や、文字コード宣言が正しくとも一部の Web ページで、ブラウザでは表示されても検索エンジンが認識できない場合がある。そうした場合、記述したテキストもすべて検索エンジンは無視することになるだろう。

ブラウザでは閲覧できるものの検索エンジンが文字コードを誤認識することはあまり多く起こることではない。ただし、発生した場合は、そのページを検索エンジンが認識しない状態にまでなってしまう。制作した Web ページの文字コードが認識されづらい状態になっていないか、さまざまな環境で確認をするべきだろう。

■SEO と HTML
HTML のミスが SEO のマイナスに働く事例を5つ紹介してきた。本来、HTML を正確に記述したとしても、SEO のプラスとなることはほとんどないだろう。ただ、やはり問題のない HTML が望ましいことは確かである。

文法上問題がある HTML では、通常の環境で問題なく表示されたとしても、音声読み上げブラウザやテキストブラウザなど、特殊な環境では問題が発生する場合が多い。そもそも SEO 観点での HTML コーディングを行う場合「ブラウザだけではなく、検索エンジンにも理解しやすい HTML を記述する」ことが基本である。

「検索エンジンにも理解されやすい HTML」とは、どのような環境でも閲覧できるアクセシビリティ上の問題がない HTML でもある。

検索エンジンは基本的に正しい HTML を前提として内容の分析をしているだろう。誤った HTML をマイナス評価しないために配慮しているとしても、HTML のミスは、想定しないような検索エンジンの認識を招く場合がある。可能な限り、すべての環境で問題なく閲覧できる HTML を記述することをお勧めしたい。

(執筆:株式会社アイレップ SEM 総合研究所 辻 正浩)


2010年01月21日

ニコニコマークの出し方

16進の文字コードです。
こういうのを記事にして表示するってちょっと工夫が必要です
たつをの ChangeLog

ニコニコマークの出し方


ニコニコマーク(またはスマイルマーク)は数値文字参照で出すのがいいよ。
半角で「&#x263A;」と書けばOK!

&#x263A; →

あと、黒いスマイルは「&#x263B;」で!

&#x263B; →

むっとした顔のマークは「&#x2639;」で!

&#x2639; →

はーい、みんな並んでー!
☺ ☻ ☹

p.s.
16進文字コードを普通に表記したら
その文字コードが表す表記になる。
文字コードを文字コードとして表記させるには、
半角英数字の文字コードの一部を変えないといけない。
「&#x263A;」なら「&」を「&amp;」にすれば半角の「&」になる。
原稿は「&amp;#x263A;」と書いているわけだ。
そうすれば
「&amp;#x263A;」はとならずに「&#x263A;」となる。
わかるかな (笑)

2009年12月22日

livedoorのロゴがダブルで

有料が終わってからだけど、ブログの先頭のlivedoorのロゴがダブルで表示。
このままだと横スクロールバーが出現してしまう。
サイドのお気に入りを表示させなければ消えるのだがね。
今まではその状態でも横スクロールバーは出ないようにしていた。
ソースを見たら、JavaScriptでheadを強制的に表示させている。
しょうがないから元々のhtmlタグにあるheader部分を消してみた。
JavaScriptの部分だけになった。
どうもすっきりしない。
なんらかの方法を見つけ出したいものだ。
p.s.
livedoor header blog でググったらありました。
livedoor Blogの「共通ヘッダー」がリニューアルします
ああ、これですっきりした (^_^.)

2009年08月28日

ロールオーバー


<p id="ban1"><a href="#"><img src="画像" width="88" height="31" alt="banner" /></a></p>

p#ban1 {
  width: 88px;
  height: 31px;
  background-image: url(背景画像pass);
  background-repeat: no-repeat;
}
p#ban1 a {
  display: block;
  width: 88px;
  height: 31px;
}
p a:hover {
  background-color: transparent;
}
p a:hover img {
  visibility: hidden;
}


2009年08月19日

Shift_JISをEUCに変換2

私のホームページ「お薦め海外ミステリー」「西野流呼吸法とダンス」
画像ページの「しぇんしぇいの写真集」のHTMLとCSSとJavaScriptファイルの
文字コードをEUC、改行コードをLFに変換しアップロードを完了した。
作業をしているときに気づいたが、
画像ページのHTMLファイルはhtml4.01で作成したものが多い。
XHTML+CSSに変えたいけど、数が多いので引いてしまう。
初期のはビルダーで作成したものを整形したもの、
その次はDreamweaverで作成したものですね。
XHTML+CSSのファイルはez-HTMLをゲットしてからです。
見え方はほとんど同じなんですが (笑)

2009年08月13日

Enough is enough! No more IE6! 2

IE6 No More「西野流呼吸法とダンス」と「お薦め海外ミステリ」のトップ(index.htm)に、
IE6 No More No More IE6! のHTMLコードを埋め込んだ。
IE6でアクセスしたら見事にブラウザのアップグレードを促すメッセージが表示された。
p.s.
8月15日にコードが修正されて
表示される画像が変わりました。

2009年08月06日

Enough is enough! No more IE6!

IT media News

「IE6はもういらない」――Web企業が撲滅キャンペーン


 Internet Explorer(IE)6を撲滅せよ――Web企業が反IE6キャンペーン「IE6 No More」を立ち上げた。

 このキャンペーンを立ち上げたのは、WebサイトホスティングサービスのWeebly。同社は撲滅運動に乗り出した理由について、同ブラウザへの対応がWeb企業にとって負担になっているためと説明している。

 IE6は2001年にリリースされ、Microsoftから後継バージョンのIE7、IE8がリリースされているにもかかわらず、今なおかなりのシェアを占めている。NetApplicationsの調査によると、7月のIE6のシェアは27%に上った。

 このためWeb企業はIE6に対応せざるを得ないが、「IE6対応は難しく、いら立たしい作業で、過度に時間を取られる。さらにIE6は最近のWeb標準をサポートしていないため、開発者ができることに制約がある」状況に苦労しているという。

  IE6 No Moreは、IE6ユーザーにブラウザのアップグレードを呼び掛けることで、できるだけ早急にIE6ユーザーをなくすことを目指している。そのための手段として、Webサイトに埋め込むHTMLコードを配布している。このコードをサイトに埋め込むと、IE6ユーザーがサイトにアクセスしたときに、ブラウザのアップグレードを促すメッセージが表示される。

埋め込みコードは以下の通り(14日に修正されたものです)

<!--[if lt IE 7]>
<div style='border: 1px solid #000000; background: #FFFFFF; text-align: center; clear: both; height: 108px; position: relative;'>
  <div style='position: absolute; right: 3px; top: 3px; font-family: courier new; font-weight: bold;'>
    <a href='#' onclick='javascript:this.parentNode.parentNode.style.display="none"; return false;'><img src='http://www.bizzymicbizness.com/ie6nomore/files/theme/ie6nomore-cornerx.jpg' style='border: none;' alt='Close this notice'/></a></div>
  <div style='width: 923px; margin: 0 auto; text-align: left; padding: 0; overflow: hidden; color: black;'>
    <div style='width: 108px; float: left;'><img src='http://www.bizzymicbizness.com/ie6nomore/files/theme/warning_ie6.jpg' alt='Warning!'/></div>
    <div style='width: 275px; float: left; font-family: Arial, sans-serif;'>    <div style='font-size: 14px; font-weight: bold; margin-top: 12px;'>あなたは旧式のブラウザをご利用中です</div>
    <div style='font-size: 12px; margin-top: 6px; line-height: 12px;'>このウェブサイトを快適に閲覧なさる場合には、最新のブラウザにアップグレードしてください。</div>
  </div>
  <div style='width: 108px; float: left;'><a href='http://www.firefox.com' target='_blank'><img src='http://www.bizzymicbizness.com/ie6nomore/files/theme/firefox.jpg' style='border: none;' alt='Get Firefox 3.5'/></a></div>
  <div style='width: 108px; float: left;'><a href='http://www.microsoft.com/windows/internet-explorer/default.aspx' target='_blank'><img src='http://www.bizzymicbizness.com/ie6nomore/files/theme/ie.jpg' style='border: none;' alt='Get Internet Explorer 8'/></a></div>
  <div style='width: 108px; float: left;'><a href='http://www.apple.com/safari/download/' target='_blank'><img src='http://www.bizzymicbizness.com/ie6nomore/files/theme/safari.jpg' style='border: none;' alt='Get Safari 4'/></a></div>
  <div style='width: 108px; float: left;'><a href='http://www.google.com/chrome' target='_blank'><img src='http://www.bizzymicbizness.com/ie6nomore/files/theme/google_chrome.jpg' style='border: none;' alt='Get Google Chrome'/></a></div>
  <div style='float: left;'><a href='http://www.opera.com/' target='_blank'><img src='http://www.bizzymicbizness.com/ie6nomore/files/theme/opera.jpg' style='border: none;' alt='Get Opera'/></a></div>
  </div>
</div><![endif]-->


2009年08月05日

画像の表示をOFFにしたら

ちょっと前まではインターネットは電話線だった。
だからデータのやりとりに時間がかかった。
Webのページはできるだけテキスト表示を心がけた。
観る方はブラウザで画像表示をOFFにすることもあった。
今はブロードバンドが普及し、
光ケーブルの時代だからデータの大きさは気にしなくなった。
とはいえ画像をOFFにすることもある。
CSSでテキストを飛ばして背景画像を表示することが流行った。
これだと画像をOFFにしたら何も表示されない。
それにリンクが貼ってあったら悲惨なことになる。
だからテキスト飛ばしはしないで画像は表示する。
画像のaltとリンクのtitleで画像OFF時のテキストの代替とする。
オンマウス(a:hover)時は上の画像を非表示にすると、
背景画像が表示される。

<p class="back"><a href="#" title="hogehoge"><img
src="hoge.png" width="88" height="31" alt="hogehoge" /></a></p>

p.back {
  background-image: url(./hoge2.png);
  background-repeat: no-repeat;
}
p.back a {
  display: block;
  width: 88px;
  height: 31px;
}
p.back a:hover {
  background-color: transparent;
}
p.back a:hover img {
  visibility: hidden;
}


2009年06月23日

FinePix F200 EXR

このデジカメはいいですね。値段が下がってきました。
新品での最安値は:\22,800という情報があります。
製品名FinePix F200 EXR
撮像素子1/1.6型 有効1200万画素 スーパーCCDハニカムEXR
レンズ光学5倍(35ミリ換算 28〜140ミリ)
手ブレ補正機能CCDシフト式
背面液晶3型 約23万画素
記録メディアxDピクチャーカード/SDメモリーカード(SDHC対応)
動画最大640×480ピクセル .AVI MotionJPEG
撮影可能枚数約230枚(CIPA規格)
サイズ97.7(幅)×58.9(高さ)×23.4(奥行き)ミリ、約175グラム(本体のみ)
これは tableタグの挿入実験です。
改行を反映するのチェックを外すのがポイント。
その代わりtableタグの外はbrタグが必要。
FinePix
p.s.
価格.comの口コミの評価がいまいちだったので、
欲しいリストから外します。

2009年06月21日

動画再生のタグ

SNO中央支部のサイトの動画を再生するタグを打ち替えた。
IEでもFirefoxでもきれいに表示できてValidでもOKとなると、
Javascriptを使うのが一番という情報があった。
メタファイルで動画を読み込み、
Javascriptでメタファイルを読み込んで、
objectタグとembedタグを書き込む。
HTMLファイルでJavascriptを読み込めばOK、ということでやってみた。
画像の表示枠のサイズの調整に時間がかかったがなんとかOK!
亡くなった古賀さんの動画が大きなサイズで見られるようになった。
古賀さんの動画はこちら

2009年06月19日

サイトで文字の大きさを変える

SNO中央支部のサイトで文字の大きさを変更するスクリプトを挿入してみた。
黒バックの上に表示されているから目立たない。
何とかしたいけど――、今のところ分からない。
しかし、文字の大きさは変えることができた。
必要かどうかは分からないけど。
p.s.
講座のページは記事の部分に表示させた。
これは上手いこといきました。

2009年04月27日

ファビコンをサイト全体に

IEでは上手くいきました。
Firefoxではダメです。
1st-need SNS

ファビコンをサイト全体に反映させる方法


htaccess.txt
に、以下の記述を加えてください。

AddType image/xicon .ico
<Files favicon.ico>
ErrorDocument 404 (ファビコンまでのパス)
</Files>

(例)
AddType image/xicon .ico
<Files favicon.ico>
ErrorDocument 404 http://biomasa22.sakura.ne.jp/favicon.ico
</Files>
上記の(例)は、絶対パス指定(URL)していますが、
パスは、相対パスでも大丈夫です。

あとは、
htaccess.txt
を、サイトの上位階層にアップして、
ファイル名を、.htaccess に変更したら終了です。

設置がうまくいかない場合は、
サーバー側で、.htaccess の動作が許可されているかどうか確認してください。

p.s.
Firefoxはキャッシュを削除したらOKでした。

2008年08月29日

ゴースト退治

お薦め海外ミステリの本の説明のページの画像をクリックしたらゴーストが。
原因を見つけるのに時間がかかったが、結局はPタグだった。
<p><a><img…… /></a></p>
これのPタグをはずしたらゴーストは消えた。
ちょっと気取って余計なことをしたから。
「Devas」があったから一気に変換できて助かった。
わかれば当たり前のことだが、
わかるまでが一苦労だった。
Pタグのなかの画像をフロートさせていたが、
Pタグそのものをフロートさせればよかったのだ。
しかしそれだと修正が面倒なのでPタグをはずす方を選択した。

2008年05月11日

画像のロールオーバー

テキスト飛ばしをしない画像のロールオーバーの方法。

<li id="gazo"><a href="#" title=""><img src="./gazo01.jpg" width="300" height="150" alt="" /></a></li>

li#gazo {
    width: 300px;
    background-image: url(./gazo02.jpg);
    background-repeat: no-repeat;
}
li#gazo a {
    display: block;
    width: 300px;
    height: 150px;
}
li#gazo a:hover {
    background-color: transparent;
}
li#gazo a:hover img {
    visibility: hidden;
}


IE-7の問題を解決

一晩考えてひとつ思いついた。
で、朝一番にやってみた。
イメージを透明GIFにして背景をずらす方法にした。
ただIEで駄目だったのはリストタグに幅を指定していなかった。
それでほぼ解決した。
p.s.
もしかしたらと思い、以前の方法のリストタグに幅を指定した。
何のことはない、これでIE-7も解決した。

2008年05月10日

IE-7でひと苦労

clearfixのIE7対応版を見つけてそれを適用したが――。
それ自体はうまくフィットしたのだが、
トップページのダンスのロールオーバーがうまく作用しない。
呼吸法のロールオーバーとまったく同じことをしているのだが、
ダンスの方は動作がおかしい。

2008年05月07日

親boxの高さがでない

親boxの中に子boxを右左にfloatさせると親boxの底が押し下げられない。
clear-bothの改行でうまくいくときもあるけど――。
駄目な場合、親boxにclearfixの指定をする。
これは呼吸法のページのトップをこれで行っている。
今日はゲームのメニューページでつまずいた。
今回は親boxにfloatを指定したらうまく行った。

2008年04月21日

movファイルをobjectで


<p><object classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" codebase="http://www.apple.com/qtactivex/qtplugin.cab" width="320" height="256">
    <param name="src" value="file.mov" />
    <param name="controller" value="true" />
    <object class="qt" data="file.mov" type="video/3gpp2" width="320" height="256">
        <param name="controller" value="true" />
        OBJECT
    </object>
</object></p>
-------------------------------------------------------------------------------
* html object.qt {
  display: none;
}
* html object.qt/**/ {
  display: inline;
}
* html object.qt {
  display/**/: none;
}


Profile
しぇんしぇい
西野流呼吸法とソシアルダンスと海外ミステリをこよなく愛しているおいさんの Diaryです。
記事検索
過去記事
Recent Comments
訪問者数

    天気情報
    Google Sitemaps用XML自動生成ツール
    livedoor Readerに登録
    RSS
    livedoor Blog(ブログ)