2013年現在にHTML5でサイトを作るときに気をつけたいポイント

新しい自作ブログテンプレートを作ることを決めて、「HTML5 + CSS3」というモダンな枠組みを選ぶことにした。当然Webで調べながら作業ということになるんだけど、そこには事前に予想していなかったトラブルが潜んでいた。一通り作業が終わってHTMLをチェックしていたら、後から手直しが必要だと必要とわかった場所が結構出てきてしまっていたのだった。 原因は参考にした記事の内容が(ブログでなくても)古くてアップデートさ...

IE9の「Tableタグ+hover+scroll」で縦幅が広がるバグで大いにはまる

横幅を決めたdivタグにTableタグを流し込み、CSSの「overflow:auto」で動かせる表のようなHTMLを作っていたら、IE9だけなぜか異常な動きをする。具体的にはTableの中のリンクにマウスカーソルを合わせると、下部の要素がどんどん下に移動してしまう。文字で書いても恐らくよくわからないと思うので、下のサンプルページにIE9でアクセスして確かめてほしい。 IE Tableバグ テストページ Tableタグの中の「Link」や「Link2...

FirefoxでGoogleアドセンスが表示されない状態になった

恐らく何かのアップデートがかかったタイミングだと思うのだが、FirefoxでGoogleアドセンスが正常に表示されなくなってしまった。正確には本来広告が表紙されるべき場所が、同じサイズの空白になってしまう。これは自分のブログだけではなく、アドセンスを掲載している多くの個人ブログ・サイトでも同じ状態になっている。(当然だがAdBlockやその類似アドオンが原因ではない。) このブログのスクリーンショット。若干わかりに...

FC2ブログは「X-UA-Compatible」を条件付きコメントで囲ってはいけない

記事タイトルですべて言い切ってしまった気がするが、意図的にIE7モードを設定してない限りそうした方がいいですよ、という話。理由は意図せずIE10(恐らく以降も含む)がIE7互換モードで動くようになってしまうから。 これに気がついたのはアクセス解析をチェックしていて以下のようなUAを見つけ「なんだこりゃ」と思ったことからだった。 Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 6.2; Trident/6.0) Windows 8(...