DreamweaverのCodeHintsをシンプルに。
windowプロパティの誤入力を防ぐCodeHints.xml
「Dreamweaverのコードヒント機能はスパスパスパッと素早い速度でコードを書くときにはとても便利で重宝するけれど、widthプロパティを入力しようと思い、「wi」あたりまで打ってエンターキーを押すと、腹ただしいことにwindowプロパティなる普段まったく使わないプロパティの入力がなされてしまい、これってはっきしいってウザいよねえ」とかいう話になりました。要は単にアルファベット順に並んでいるに過ぎないからいけないのです。
あー分かる分かる。
ということで、バックアップとりつつ、
CodeHints.xmlをカラクリエイトさんの仕様に入れ替えちゃいましたー。
（カラクリエイトさんがわずらわしいと思ってるところは、きっと私もわずらわしいはず、なんて思い込み。）
探していたのは、これじゃなかったんだけど・・・。
Dreamweaverって、divにoverflow:scroll;などの指定をすると、
デザインビューで、内側にあるテーブルが、なんか固まって編集できなくなっちゃうんですよ。
わずらわしいなぁなんて思って色々探してたら、こっちにたどり着いちゃって。
相変わらず、効率化をはかるあまり、
作業が脱線しまくりのotogawaでした＿|￣|○
Dreamweaverのテンプレートタグ TemplateBeginEditableとInstanceBeginEditable
Dreamweaverのテンプレートタグ
<!-- TemplateBeginEditable name="" --> <!-- TemplateEndIf --><!-- InstanceBeginEditable name="" -->
<!-- InstanceEndEditable -->
コーダーには、見慣れたタグですが、、、
あるリニューアル作業をしていて、
恐ろしい落とし穴にハマりました。
2回もハマったので、悔しすぎて、二度とハマるまじと、書置きします(；´｀)=3
Firefoxでwindow.close()が効くように戻ってる？？
以前に、
Firefoxでwindow.close()が無効になるケース
ていう話をしたかと思うのですが、
あれ？いつのまにか、戻ってない？
私が、Firefox3.5にアップグレードしたからですか？
Firefox一度全部アンインストールして（プロファイルも削除して）一からインストールし直したからですか？
みなさんの環境では、
出てきたポップアップウィンドウ、window.close()で閉じますか？
クレーム来たこと無いけどさ。
特定のカテゴリーの記事のみエクスポート
<$MTEntryBody$>
複数のブログを、一気に全部再構築したいとき
MTサイトを構築中に、複数のブログがあって、一気に全部再構築したいとき、
再構築用のタブを一度に開いておきたいなぁ、
なんて、ワガママを考えたりします。
ブログが分かれていると、共通テンプレモジュールを変更した時とか、いちいちプルダウンで、ブログ選びなおしては再構築ウィンドウをポップアップさせて・・・って、作業がまどろっこしいったらないんです（・ε・｀）
1.ブックマークに、↓各ブログの再構築画面のURLを登録しておく
http://xxxxxxx/mt.cgi?__mode=rebuild_confirm&blog_id=X
2.右クリックで、「タブですべて開く」
3.再構築タブ全開で、作業スムーズ＾＾
キャプチャでは、分割アドオン入れてみたので、こんな感じです。
これで全部開いけちゃうので、プルダウンで選ばなくても、ぱっぱっぱっと、全ブログ再構築できちゃいます。
※但し、あまり高速に再構築ボタンを押しまくると、
サーバに負荷とかかかるので、途中でエラーとか出易いかもです。
gifアニメーションがjavascriptで止まる IE6限定の話
クリックしたら何かが起こる系の、javascriptを、機嫌よく書いていたときのこと。
こういう感じで↓
<a href="javascript:xxxxx();"><img src="img/xxx.gif" /></a>
↑こじゃれてボタンをgifアニメーションとかにしたりなんかして・・・
そのとき、事は起こりました・・・。
IE6だけ、javascript実行時にgifアニメーションが止まる！！
つまり、何かクリックすると、ページ内のgifアニが停止するという嫌がらせ的なバグがあるのです。
そんなことあるんですか(ﾟ口ﾟ;
↓こうやって「onclick」と「return false」を使って書いていれば、大丈夫だそうです。
ulとliとpで組むことが多いですという、他愛のないアピール
見出し
内容テキスト内容テキスト内容テキスト----------
見出し
内容テキスト内容テキスト内容テキスト----------
見出し
内容テキスト内容テキスト内容テキスト----------
こういったパターンがあって、
■ulリストを使ってみると
<ul>
<li><h2>見出し
<p>内容テキスト内容テキスト内容テキスト----------
<li><h2>見出し
<p>内容テキスト内容テキスト内容テキスト----------
<li><h2>見出し
<p>内容テキスト内容テキスト内容テキスト----------
■dl定義リストを使ってみると
<dl>
<dt>見出し
<dd>内容テキスト内容テキスト内容テキスト----------
<dt>見出し
<dd>内容テキスト内容テキスト内容テキスト----------
<dt>見出し
<dd>内容テキスト内容テキスト内容テキスト----------
どちらも間違ってないと思うのですが、
後から見出し部分が要らなくなったりとか、 先頭は見出しにあたるものがなくなったりとか、
想定外の修正が来たときに、
前者なら、ただh2タグを削除すればいいんだけど、
後者だと、dtありきのddだから、ちょっと間抜けなんですよね。dtないの？みたいな。
dtないなら何故dl使ったの？とかつっこまれそうで。
別にhtml的に間違いじゃないんだけど、
同業者が見たら・・・と思うと、
結局タグごと修正しちゃうんですよね＾＾
なので、後から何が起こるかわからないなってことで、
私はulとliとpとかではじめから組んで凌いでることが多いです。
スペース(空白文字)
WEBに携わっている人なら、日常よく出くわすタグのひとつに、
「 」があると思います。
- ＝「non-breaking space」の略です。知ってました？そう考えるとスペル覚えやすいですよね。
- 意図的に半角スペースを連続して挿入することができます
- いくつ連続して記述しても空白は1文字分しか空きません
他にも や や があるって知ってました？
■ソース
実体参照には 様々な空白文字が 定義されています。
 実体参照には 様々な空白文字が 定義されています。
 実体参照には 様々な空白文字が 定義されています。
 実体参照には 様々な空白文字が 定義されています。
■サンプル
実体参照には 様々な空白文字が 定義されています。
実体参照には 様々な空白文字が 定義されています。
実体参照には 様々な空白文字が 定義されています。
実体参照には 様々な空白文字が 定義されています。
分かりますかね？
ドラッグしてみたら、その違いがよく分かりますよ↓
■サンプルイメージ
「 」は通常の空白と同じサイズ。
「   」はそれより少し広めの空白。
「   」はさらに広め（＝&enspの2倍）の空白。
「   」は細めの空白です。
0.5文字分も要らないよ！ていうときに、
極細スペース は使えそうです。
※「 」以外は、等幅フォントで表示させるとすべて同じ空白量になります。
参照元：http://allabout.co.jp/internet/hpcreate/closeup/CU20060922A/
便利なはずのreset.cssやdefault.cssを使うことによる弊害
reset.cssやdefault.cssなどで
以下のように要素をリセットしておくと、コーディングするとき便利なんですが、
弊害もいろいろあるから困りもの。
div,p, pre, ul, ol, dl, dt, dd, hr,
address, form, blockquote, noscript {
line-height: 1.5em;
text-align: left;
display: block;
margin: 0;
padding: 0;
font-style: normal;
font-weight: normal;
border: none;
}
em, strong, q, dfn, code, samp,
kbd, var, cite, abbr, acronym {
margin: 0px;
padding: 0px;
font-style: normal;
font-weight: normal;
}
h1, h2, h3, h4, h5, h6 {
font-size: 100%;
font-weight: bold;
line-height: 1.0;
margin: 0px;
padding: 0px;
}
table {
font-size: 1em;
margin : 0px;
padding: 0px;
empty-cells: show;
border-collapse: collapse;
border-spacing: 0px;
border: none;
text-align:center;
}
caption,th {
text-align:left;
}
fieldset,img {
border: none;
}
img { -ms-interpolation-mode: bicubic; }ul, li , ol, dl, dt, dd {
list-style-type: none;
}
ul img,
dl img,
ol img,
object, embed {
vertical-align: bottom;
}
hr {
height: 0px;
border: none;
margin: 0.5em auto 0.5em auto;
-moz-float-edge: margin-box;
-moz-box-sizing: border-box;
clear: both;
display: none;
}
困りものその１
Movable TypeやSerene BachといったCMSに落とし込んだとき、
本文入力欄のタグ挿入支援ツールを使い、
右寄せや中央揃えボタンを押した際に、
入力欄やプレビューでは反映されるのに、
実際生成されたhtmlには、左寄せのままで、指定が反映されない（・ε・｀）といった現象。
例えば、
挿入ボタンで挿入されるタグが
<p align="right"></p>
だった場合、
pのmarginが、resetやdefaultでmargin-leftもmargin-rightも0に指定されちゃってたりするから、寂しいかなrightは無効になっちゃうっていう罠なんですね。
なので、pに対してmarginは指定しなくて、もはや良かったのでは？
のような。
margin0で、ぴたっとくっついて欲しい#box pとか.box pとかって、そこで個別にmargin0に指定すると思うし。
デフォルトで0にしちゃったがために融通が利かないことがよくあります。
メリットは大してなく、デメリットだけ出てきちゃうなら、むやみに0にするのって、効率悪いんですよね。
コーディング覚え立ては、誰かのcssを参考にしたり、完パクするのも大切ですが、
１サイト任せられて、サイトまるごと構築できるくらいになったら、自分流のcssやデフォルトを持つことになると思います。
でないと、自分の理論上は成立するはずなのに、現実その通りにならない、なんてことが出てきやすいですね。
自分で一から作ったものなら、もう少し柔軟に進められそうです。
もちろん、会社内や、制作チーム内で、ある程度のガイドライン、制作上のルールは、統一化しないとっていう課題もあるんですが・・・
難しい問題です。
バランスが大切ですよね。
htmlやタグをある程度分かっているお客様が、せっかく得た知識を活用してタグを使ったり、ブログ記事でタグボタン使ったりしたとき、
<p align="right"></p>
が効かないサイトなんて、悲しいじゃないですか。
いちいちブログのタグ挿入ボタンから生成されるタグを
<p style="text-align:right"margin:auto;></p>
にカスタマイズする覚悟はあるんですか？て話。
なんて、ちょっと語ってみました。
P.S.困りものその２は・・・？
＞ないです。
Movable type カテゴリの選択順が基準カテゴリに反映される
Movable type カテゴリの選択順が基準カテゴリに反映される
そうなんですよね・・・。
この記事の通りなんですよね。
なので、
例えば、個別記事ページで、パンくずリストを出すときなど
記事によってまちまちになるんですよ。（ほんとに？）
HOME＞親カテゴリ＞子カテゴリ＞記事タイトル
HOME＞子カテゴリ＞親カテゴリ＞記事タイトル
とかになっちゃったり・・・
うまく表現しづらいんですが、
選択する順序が混在してしまうと、あとあと表示の制御が面倒だったりするんだなぁ、と、気付きました。