角丸CSS IE6対策 div空を使わない方法

今更ながら、角丸CSSのやり方の備忘録。

結論:widthを指定する

HTML5からは、角丸が画像を使わずCSSだけでできるみたいだし、javascriptやtable小技でやったりもあるが、IE6を考えてまだ画像でやるのが一般的。

divタグで空にしてheight指定で背景に角丸画像背景を入れるのだとIE6でも問題なしだがソース的に、空はちょっとマズイだろということで、top middle bottomなど3つで上下を挟むやり方でtopとbottomにpaddingを高さ指定してやる。

すると、何だかtopの下に妙な空きがIE6だとできてしまうが、widthを指定すると解消される。

ちなみに、背景画像bottomなんかを超縦長にしておけば、divがtop bottomと2つですむ。PNGでも以外に超縦長の画像は、容量が増えないので縦可変の激しくないある程度の高さですむ場合は、ソースが軽くなる背景超縦長バージョンがいいかと。

あと、

縦並びul li aもIE6だと変な上下の幅ができるがこれもwidthを指定すると解消される。
これも忘れてたので、備忘録。

Adobe CS5目玉のPackager for iPhone利用不可能に

どうやら、以前にもちょっと書いたがFlashとiPhoneが喧嘩しちゃってしょうがない。

CS5で新しく登場したと思ったPackager for iPhoneというソフトがどうやらお釈迦になるらしい。

Packager for iPhoneは、iPhoneがFlash受け付けないならFlash制作環境で制作したものをFlashとして書き出すのではなく、iPhoneアプリとして書き出してFlashを擬似的にiPhoneに対応させようという趣旨のソフトで、これなら有料アプリ作れるかも?などと期待していたのだが、どうやらこの記事によるとそれができなくなるらしい。iPhone OS SDKの利用規約を変更とのことで。

Intel MacになってWindowsも積極的に使えるようにしていって盛り上がってきた間のあるMacだが、iPhoneはどうやらAdobeからの見られ方は【クローズド】ということになりそう。

FlashはGoogle Androidとはうまくやっていくようなことが明らかになっているようです。

いやはや、ますます多様化されても困るし。。。
消費者金融じゃないけど、一本化・おまとめの方向でお願いします。。。

参考

■Adobe CEO「Appleはクローズドを選択した」
iPhone向けFlashアプリ変換ツールへの投資中止
http://www.itmedia.co.jp/news/articles/1004/22/news059.html

■Adobe、iPhone向けFlashを断念 Androidにシフトへ
http://www.itmedia.co.jp/news/articles/1004/22/news027.html

Dreamweaver CS5でWordPressテーマ編集

長らく、MTからなかなかWordPressにとっつけない理由として、DreamweaverでデザインCSSの編集がやりずらい、というより結構無理という問題があった。

ローカル環境で、Macで主にやるのでMAMPなんかでローカルMySQLを動かしておけば、DW CS5上でそのままCSSをカスタマイズできると最新のWEB Designingに書いてあった。これができるとかなりHTMLライクで編集できるのではないかと思う。ライブビューも何だかCS4は見るだけなので困ってたがやっとWordPressでまともサイトが作れることになりそう。

新しい関連ファイルビュー機能は、ローカルでそれらのリンク間をローカル環境でたどれるという動的サポートのようで、ここまでくると通常WEB閲覧をしながら直したいところだけサクッと編集みたいな直感に近づいていくのかもしれない。ん〜速くいじってみたい、5月まで待てない。

DW CS4は、DW8がmacromediaをAdobe買収して、ただバージョンアップというより名前が変わっただけであったが、DW CS5はしっかりとしたバージョンアップになっているようだ。

Dreamweaver CS5

http://www.adobe.com/jp/products/dreamweaver/

404.php WordPressで404ページを任意にリダイレクト

404ページを設けるか否か。どうすっか?
これは、議論が不毛でありどっちでもいいと考えるのが普通かもしれないが、
WordPressでは通常、404.phpというテーマで既に用意されているファイルがある。

大体のテーマは、

404 – Not Found
該当する投稿は見つかりませんでした。

みたいなページを表示することになったり、404.phpというファイルがなくても
何か英語の記述で 404 – Not Foundと出るようになっている。

リンクをたどって巡回するロボットクローラーに、できれば行き止まりより
スムーズに流れて欲しいものです。404コードをロボットに返すとか301を返すとか
よくわかりませんが、まとめたブログとしてはホームページか何かにリダイレクト
しちゃった方がいいのかなぁと。

携帯サイト何かの登場で今やリダイレクトは日常茶飯事ですし、
たどった先を解析できないのは検索エンジンの能力の責任…みたいなことにも
なってると思うので。

そこで、

WordPressでは、どうやったら404をトップページなんかにリダイレクトするかと
言うと、前述のように404.phpというファイルがテーマフォルダにあります。
これを削除すると、英語になるだけの404ページになります。

.htaccessに

ErrorDocument 404 /

としてもナゼかWordPressの404ページが表示されます。
ということで、404.phpをいじってアップロードします。

404.phpを全部削除して下記を記述(※ダブルクオーテーションを小文字に)

<?php
header(“location: http://404をリダイレクトしたいページ.jp/”);
exit;
?>

トップページにジャンプ(※ダブルクオーテーションを小文字に)

<?php
header(“location: /”);
exit;
?>

こうすることで、WordPressでも404エラーを404Not Foundでない
ページにリダイレクトすることができます。

index.htmlとindex.php優先順位.htaccess

エックスサーバーが、index.htmlよりindex.phpが優位になった。というより元々だったかもしれないが、記憶上.htmlの方が最初の頃は優位だった気がする。

.htaccessで優先順位を意図的に変えることができる。
index.htmlとindex.phpが 同一階層にある場合、階層○○○/では
どちらを使うかという優先順位をサーバーのデフォルトと変更できる。

index.html 優位の場合

DirectoryIndex index.html index.php

index.php 優位の場合

DirectoryIndex index.php index.html

index.cgiなどいろいろあれば、スペース後にどんどん優先順位順に繋げて
記述すれば、その順番でディレクトリ頭の優先ページを指定できる。

MTPages, MTPageFolder ウェブページ備忘録

MTのウェブページまわりMTPagesが、どうもしっくりきてやっと理解してきたので備忘録。

  • エントリー対カテゴリー、ウェブページ対フォルダ
  • 同一フォルダ内はMTPageFolderブロックダグでMTPagesブロックダグ囲む
  • MTPageFolderは、root(フォルダなし)は一覧しない
  • ウェブページは個別記事なので、フォルダアーカイブ再構築はないのでカテゴリとは違って過去の同一MTPages, MTPageFolderは紐付けされて再構築はされない?MTFolders使っても無理か?
  • ベースネーム個別→過去ページそのまま。ベースネームindex→過去ページそのまま。
  • MTPagePermalinkのアーカイブマッピング
  • %-c/%-fだとファイル名にindexでfolder/にリンク
  • %-c/%-b.htmlだとファイル名にindexでfolder/index.htmlにリンク(こっちはエントリー画面で.phpと出ていても.htmlすることができる)

.htaccess膨大の理由から、.html(PC).php(携帯)が望ましい、全部○○/index.xxでもできるがページ数だけ.htaccessの行が増えちゃう。じゃ公開設定拡張子を.htmlにして、携帯のアーカイブマッピングを.phpにするとページ分割だけ.htmlになってしまう、が、.html php埋め込みができれば一応問題ない(負荷と相談)結構迷う。

Yahoo!検索結果にtitleタグじゃなくてh4見出しが!

日本のYSTは、Bingとどうなっていくのか、まだよくわかりませんがビックリする機能というか、Yahoo!らしからぬというか、サープ検索結果のtitleタグにあたる部分、要は検索結果からリンクしている超重要なクリックされる部分(文言)が、検索キーワードによって、titleタグではなく本文中の見出をピックアップして表示していたことです。

検索結果のリンク表示はtitleタグが大原則みたいな感じがありましたが、YSTはやっぱり内部要因重視している感が出てますね。URLも同じなのに、検索ワードでSERP(サープ検索結果のページ)のタイトルが違っているのは、ちょっと最初は驚きでした。バグ?かどうかわかりませんが、YSTも何かユーザーの利便性を重視して高度になってきた模様です。

逆に考えると、見出しのテキストが非常に重要ということ。勝手にキーワードによって検索結果にピックアップされてしまう訳ですから。見出タグ、h1, h2, h3, h4…当方が確認できたのは、検索ワードがバッチリ入った、h4の見出しの文言が検索結果のリンクになって表示されていました。

これが当たり前になえれば、titleタグが最重要なのはわかりますが、見出しタグもかなり重要というか、意識するというか、インテンションを満たすというか、見出しタグも検索結果に表示されてもいい文字数にするとか、そういうことになってくるかと思いますね。

ハッスルサーバーのデザインが刷新

低価格で、マルチドメイン対応の良い感じのレンタルサーバー

ハッスルサーバーが、デザインをリニューアルして、容量が1.5GBと増量しています。

可愛いライオン?から、可愛いシロクマ?にキャラクターチェンジしています。
MySQLが4から全部5になり、1つ持てる状態になるということです。

MTPageFolderで同一フォルダ内のウェブページ表示

MTのウェブページはあまり使うことがないのだが、フォルダ機能しかり、ウェブページ機能しかり、よくできていてページ物を作るときにはやっぱりテンプレートを追加しちゃうより使いやすかったりもする。

MTPageFolder

MTPageFolderタグを使うと、該当のページが属する同一フォルダのウェブページが扱える。参考にしたMovable TypeのMTPageFolderで順番をソートする(入れ替える)方法だが、「sort_by=”created_on”(作成日)」が効いているというより、効いていない感じで、created_onを付けようがつけまいが、sort_order=”ascend“昇順 (新しいものが下)にしようが、変化はない。タグリファレンスにもsortの情報はない。デフォルトで作成日順になっているのではないだろうか。試したところページの最終更新順ではないようなので作成日順かと思われる。

<div class=”folder-list widget”>
<h3 class=”widget-header-link”>
<a href=”./” title=”<$mt:FolderLabel$> TOPへ”><$mt:FolderLabel$></a>
</h3>
<div class=”widget-content”>
<mt:PageFolder sort_by=”created_on”>
<ul>
<mt:Pages>
<mt:PageIfTagged tag=”@index”><mt:Else>
<li><a href=”<$mt:PagePermalink$>”><$mt:PageTitle$></a></li>
</mt:PageIfTagged>
</mt:Pages>
</ul>
</mt:PageFolder>
</div>
</div>

ちなみに、ウェブページのベースネームをindexにすると、【フォルダ名/index.○○】ではなく、しっかりと【フォルダ名/】にリンクして表示してくれるところがありがたい。

Flashの今後、HTML5とのアレ

Flashがどうにも最近叩かれてるというか、いらないんじゃないのみたいな論調が囁かれてますね。HTML5になれば、Flashはいらないみたい感じの。Flash自体もプレーヤーに依存するんじゃなくて、ブラウジングだけで何とかなるような技術ならいいんだけどね。GoogleはFlash内もスキャンしちゃう訳ですけど、WEB標準の記述とは比べものにならない訳で。最もスティーブ・ジョブズ氏がFlashはいらん!みたいなことを言ったとかで話題になってってことでしょうけど。

  • CPUを使いすぎる
  • セキリュティーホールが何とか
  • iPhone、iPadでノーサポート

こんな感じのデメリットがありますね。今からFlashのためだけに、アクションスクリプト覚えよう!何てのはちょっと先行き不安な舵取りかもしれないですね。昔は、All Flashサイト作ったりしたもんだ〜。でもまだまだクリエイティブに見せたり、特設サイトとかでは使われる技術なので、Flashがなくなることはないでしょうが。

HTML5で動画再生機能があるからFlashは必要ないとか…HTML5ってどこまですごいんでしょうか。XHTML+CSSの時はすごい苦労した記憶があるけど、HTML5は簡単でまとまってて欲しいですね。