技術情報の最近のブログ記事

今からHTML５に思いをはせてるyu-kiです。いいなあ書き方がスマートになるって素敵じゃないか。ある程度段落構成しててくれるなんて素敵じゃないか。早くメジャー化してくれ死ぬ気で覚えるよ！

今日は久しぶりに制作で、「うっはやられたというかやっちまった」な事があったのでメモメモ。

こういうのって解決すると当然じゃん自分。と思うんですが、ハマってる時はまさに迷宮を目隠しして照明がないまま逆走行し続ける動く歩道を延々走り回っている気分になりますね。

今回ハマったのはDW4。

制作過程でこれのテンプレート機能に大変お世話になっているんですが、当然WEBに公開する際にはテンプレートマークアップを削除してリリースしないといけません。

お客様からの要望でこのテンプレート部分に修正が入ったのでゴスゴス修正してローカルで表示確認し、よしOK！マークアップ削除してはいリリーｓ　　って、直ってないじゃないくわっ。

直しを入れたテンプレートファイル、そして該当のテンプレートを使っているページはしっかりガッツリ直っている。のにもかかわらず、マークアップ削除を削除して書き出しすると、あら不思議時間が元にもどるわ★という便利でもなんでもない魔法がかかるわけです。

最終手段は手動でリリース用ページにコピペですができればやりたくありません。

同じことが起きた時に困るので、なんとか解決方法はないかと検索しまくるも特にそれらしき記事もなく…。

ふと、別のサイトではどうなってただろうと思い返して、見つけました。

連続した全角スペースは、書き出されないよ！

例えばテンプレートに、

「あいうえお

　　　　　　かきくけこ」

↑この部分に、全角スペースを使ったとします。

テンプレートマークアップが乗った状態なら修正されてるように見えるんですが、

「マークアップを省略して書き出し」した瞬間に全角スペースが見事に消えました。

オプションで「連続するスペースも入力可能にする」ってなってたのでてっきり大丈夫かと思ってましたが、いやはや、ちっとも大丈夫じゃなかったというオチです。

何年も使っているソフトなのに、ちょっと斜め上から攻撃されるとおどおどしてしまうものですね。

過信は禁物。今日これ特にそう思いました。

タイトルだけ見るとなんの型番かと思いますな。こんにちはyu-kiです。

メモ系しばらくやってなかったんで、今日はちょっとしたメモネタでいきます。

タイトルはちなみにDreamWeaver CS4メモの事です。

----------------気のせい？コードビューでのタグのコピペが使いにくい気がする。

例えば既にテンプレートの存在するサイトに、新しいページを追加する際。

SEO的に重要部分とされるキーワードやディスクリプションなんかを、仮に他のページからコピーしてペーストしようとしてもなんかうまくいかないきがします。

範囲選択して、Ctrl+Cって押したとたんに選択範囲消えちゃうし、（もちろんクリップボードには記憶されてナス）

消えないでうまくコピーできでも該当箇所にペーストしようとしたら、選択した覚えのない前後のタグも一緒にくっついてきたりとか。

そういう時は冷静にエクスプローラーから該当のファイルをテキストエディタで開いてコピーってしたほうが早いのでそうしているのですけども、急いでいる時などにコレが発生するとイラ★とすることこの上ない現象かなと思います。

できればアッチこっち色んなアプリつかわず一つで事済ませたいものですし。

散々これ「またかあああ」とやっていたのですが、先日ひょっとしたら？というのをみっけたのでメモメモペッたん。

コピー元にしたいファイルは、開いてすぐコードビュー触らずに、一度デザインビューの方クリックしてからやるといいようです。

あと、これはHEAD内での発生頻度が高いような気がします。

ただ↑の解決策は一時しのぎでしかなく、コピペしたい場所が２～３箇所あると、一度コピペ終わるたびにデザインビューさわりなおして…ってしないといけないくさいので、コピー箇所が多い場合にはテキストエディタ開いてしまうことをオススメします。

…急がば回れともいいますしね。

私の場合は近道探すとたどり着けない駅とかがものすごく痛い教訓かなと。

ぺぺちぃ～です。

先日、弊社のWebデザイナーさんに、「プログラムってどうやって勉強したらよい？」

と、聞かれました。

聞いたら、初心者向けの書物を買って勉強してみようと試みたけど
本を読んでもよく分からなかったとのこと。

Webデザイナーさんのそんなお気持ちも分からないでもないです。
実は私も元々英語は「文字」ではなく「模様」・「おしゃれな形」
としてしか認識できなかった所があり、プログラマー業を3年ほどこなして
（DSえいご漬けで英語を勉強して）やっとこソースコードが
文章として認識できるようになった人間です。

でも勉強意欲があるなんてすばらしい。
と言うわけで、ぱっと思いつく限りの勉強の仕方を考えてみました。
 

ますくについて触れたとたんに近所の薬局がガッツリ入荷していました。

こんにちは、慢性万年鼻炎のioriです。

本日は書きたい事あったのですが、まだちゃんとまとまってないので備忘録いきます。

AS（ActionScript）3.0について。

いまお仕事でごにょごにょやっているのですが、コンポーネントを画面そこいら中においています。

キーボードのタブキーでフォーカスを移動させると、黄色い枠がでるんですが、こいつは

 ●●.focusRect = false;

で消すことができます。…ってかいてあったのでそのとーりにやってみました。

タブキーぽちぽち。……まあ素敵な黄色い枠。まるで花粉を固めたかのようだわきえてないじゃんっ。

教えてグーグル先生！であっちこっち探してみたのですが「消えない」なんてことはないらしく、

じゃあ私の見ている画面は夢かマボロシか！そうであってほしいな！と思いながら半分ヤケで色んな

コードを消しまくっていたところ、いました。犯人が。

コードの先頭でインクルードファイルを呼び出してたんですが、こやつが悪さをしていた様子。

ただこの子達は大事なことをしてる子なのでむやみに消せません。

ひょっとして。…（社長は いんくるーど文を 全部 一番下に 移動させた！）

黄色い枠線を粉砕した！（LVがあがった！）

おめでとうおめでとう！（半べそ）

そんなわけで、本日の備忘録。

インクルード文はとりあえず一番下においといたほうがいいかもしれない！です。

ただ呼び出すモノによっては先頭でないとダメな可能性もあるので、そこは臨機応変でお願いします。

ぺぺちぃ～です。

知らなかったんですが、最近10インチ以下ぐらいの画面サイズの小さいノートパソコンを

「ネットブック」って言うんですって？

主にメールとかチャット、インターネットをちょいちょい、と出来ればいいような感覚の

代物だそうなのですが、注目度はだいぶ高いようで。

先日行った家電量販店でも大勢のお客と案内人でごった返してました。

ざっと見た感想をば。

◎画面サイズが10インチだと、大体B5の紙ぐらいがマシンの大きさになる。

◎Windows XPが主流。有名メーカーはVista対応。

◎搭載CPUは1.6GHzが主流。メモリは1～2GBぐらい。

◎重さは1kgを超えるか超えないかぐらい。

◎使いたいバッテリー寿命は少なければ少ないほど軽そう。

◎軽いからと油断しているとACアダプタが実は大きくて重かったりする。

◎外部モニター接続用の端子は付いている機種も付いていない機種もある。

◎価格帯はちょうどモデルチェンジ間際の時期だったので現在4万前後が主流。

◎デザイナーズブランドもあるけどやっぱりちょっと値段が上がる。かわいいのに。

結構、どれも同じようで一長一短なので、使い勝手にあわせて

選ぶ必要はありそうです。あと画面自体小さいので、実物見て判断するのが一番よさそうです。

っていうか、画面サイズを除けば常駐先のマシンと同じか上なのに愕然としたのですよ。

何でそれがその価格で買えちゃうの？！

一昔前に買った自宅マシンがその内容易に負けそうです。

尊敬する人は？と聞かれて、杉下右京とキッパリ言い切る面接の夢を見ました、ioriです。

私的には有りですが社会的にはナシかなと朝から軽く悩みました。

■zoomとはなんぞや

さて先日言っていたzoomについて、軽く調べてみました。

簡単に言うと、zoomは名前の通り、「拡大縮小」を指定する為のプロパティです。

指定する値は具体的な数値か%のどちらか。

1、または100%で拡縮なしの原寸表示になります。

「この画像は拡大して見せたいんだ！」なんて時に利用するのが本来の使い方のようです。

しかし、このプロパティを使って画像を拡大すると、画像自体の大きさは変わらず指定値まで画像を引き伸ばして表示する為、あまり綺麗とはいえない画像になってしまうので注意が必要。

さらに、このプロパティはIEの独自拡張ゆえに、Firefoxなどのモダンブラウザには対応してません。

使いどころが、正攻法でいくとぶっちゃけあんまり無い感じのするプロパティです。

しかしこのzoomプロパティにはちょっと便利な機能が隠されています。
それは、hasLayoutの値をtrueに出来る事。

他のブラウザは大丈夫なのに、IEで見た場合だけfloatしたBOXがはみ出る。

などのIEだけに起こるバグは、大体このhasLayoutの値がfalseになっているという場合が多いようです。

hasLayoutの値をtrueにしてあげる事で様々なバグを回避できるので、このプロパティは結構便利です。

他にもhasLayoutをtrueに出来るプロパティには、widthとか（値を設定する）、height（値を設定する）とか
ありますが、要素によってはwidthやheightは設定できない場合も多々あるので、zoom:1が一番使い勝手はいいように思います。

過信はマズイですが、IEだけでどうーしても表示がうまくいかないって時にはzoom:1を試してみるのも一手かも？！

で、後半散々出てきたhasLayoutについての掘り下げは、また後日に。

自分の勉強も兼ねてさくっとまとめてメモぺったんしたいとおもいます。

今の時期、どしゃぶりの雨でせっかくのさくらが散ってしまう…。という寂しい思いより

花粉が流れ落ちてヤッホウ。という思いの方が強くなってしまいました、ioriです。

なんと恐ろしきかな花粉の威力。季節の情緒すらも奪い去ってしまうとは侮れません。

さて恒例？のCSSメモ。

今回はliの背景画像についてです。

■横並びリスト時にli背景画像を設定するならIE対策は必須。

WEBページを作っていると、リストの先頭に中黒点や黒丸（・や●）などがついたリストの制作なんてのに、わりと頻繁に出くわすと思います。

中黒点やら黒丸やらならリストタグがほぼデフォルトで持っているスタイルなのでCSSで味付けしなくても大丈夫ですが、例えばハートマークだったり、ヒゲッチ社長の顔アイコンだったりするとさすがにCSSを使わないわけにはいきません。

リストの先頭飾りを画像にするのに私はいつもliに対して背景画像を指定するやり方を取っています。「list-style:」よりこちらの方が文章に対しての位置を調節しやすいかなと思います。

で。

リストが縦並びならそれほど問題はないんですが、（IEに関しては、liに背景を指定したリストをフロートさせると、背景画像がふと消えたり出てきたりと勝手気ままな動きをする事があるのでこの点は要注意）

display: inline

↑を使ってリストを横並びにさせる時は、幅との相談が絶対不可欠です。

一行に収まりきる時は大丈夫、でも途中改行される時は必ずIE対策を取りましょう。

IE8は未検証ですが、IE６と７に関しては、横並びリストの背景に画像指定をしていて且つそれが途中改行されている場合、設定した背景画像が行方不明になります。

途中改行されてる部分だけいなくなります、他は大丈夫。

これを解決するためには、IE6と７にこのおまじないをかけてあげると解決するようです。

「zoom: 1;」

zoomについての説明は後日に改めて。

横並びリスト（背景画像・改行あり）でお悩みの場合は是非このおまじないを口ずさんでみてください。なんとなくニュース番組のタイトルっぽくてかっこいい気がしなくもないです。あ、もちろん言うだけじゃなくて記述もしてくださいね。

ぺぺちぃ～です。

皆さん普段どれだけショートカットキーを使っていますか？
いや、マウスで出来ることをなぜキーボードで表現しなくてはいけないのかと
疑問に思う人も結構いらっしゃるのかも分かりませんが、
この業界、特に私はがんがん使います。
ある程度文字打ちに慣れてしまうとキーボードから手を離すことがいやになるのです。
昔はそんなのありえないと思っていたのにこの有様。人間ずるいです。

MicrosoftのExcel使うときなど、
[Ctrl] + [ ; (セミコロン)] →そのときの西暦日付を自動で入力
[Ctrl] + [ : （コロン）] →そのときの時間を自動で入力
なんてショートカットが便利で大好きです。

ところで私はローマ字変換で日本語を入力しているのですが、
中にはカナで直接入力されている方もいらっしゃいますよね。
実際、キータッチの速さを競う場面では断然そちらのほうが入力が速いそうなのですが、
私は学校でローマ字変換を習ったおかげで全く出来ません。
たまに何かの拍子で「A」が「ち」で入力されるとそれこそ文字通り「ちっ！」って気分になります。
うう。お行儀良くないわたくし。

そんな、なぜ日本語入力にローマ字で入力しなくちゃいけないのかと
常に疑問をお持ちのカナ文字入力派のNさん、見てますかー？
一通り私の記事を読んでいただけたってことは、
そこそこ飽きない文章だったってことで自信もっていいですかー？
いつもお世話になっております。もんじゃ焼きおいしかったです。火曜日からまたよろしくお願いいたします。

WBC連覇おめでとう侍ジャパン！

夜のニュースでも言っていましたが、景気の悪化で色んな事が暗い日本のニュースでしたが、

ここに来て久しぶりの嬉しく明るい日本のニュースになりましたね。

これを機に、今暗い事が少しでも明るい方へ好転してくれるといいなあと切に思います。

先日制作の際にちょっとハマったのでメモぺたんします。

■clear fixかけた要素に高さ指定は効かない。byWINIE6

FFとIE7は高さ指定するとその通りになるんですが、私の確認した限りIE6は「高さ？なにそれ美味しいの？」の状態でした。

そもそもclear fixかけてる要素に高さ指定する必要は無いと思うのですが、ちょっとしたCSSのコーディング計画ミスからこんな発見があったので、以降の自分メモも兼ねて付箋をば。

ちなみにOperaとSafariは未確認です。

ごらん、アレが花粉をMAXに搭載した真っ赤な杉山だよ。

まあ素敵。思わずつるっとさっぱりハゲ山にしてやりたくなるくらいに。

こんにちは、今朝は ↑ な夢を見ましたioriです。

もちろんこの後しっかりハゲ山にしてやりました。夢の中で。

そろそろFireworks CS4（以下FWｃｓ４）を本格的に使いたい、と思ったので、とりあえずしょっぱなにアップデートかけてみました。

アップデートダウンロード中の様子。

残り時間：1分以下。って、目的地周辺でナビやめちゃった一昔前のカーナビみたいだなあと思ったり。

アップデート終わったFWｃｓ４で作業をしていたら、困った事をみっけたのでいつぞや書いたCS４メモに追記を。

軽くググって調べてみたんですが、同じ質問してる方はみっけてもその回答はのってませんでした。

コレ困ってる方結構いらっしゃると思うんですが…。

それともFWｃｓ４ってそういう使い方あまりしないでしょうか。

あと、前回書いた文字カーニングの件で解決できたのでそちらも書き加えておきます。

■FWｃｓ４で画像のみを書き出しすると、イメージ書き出し用？のフォルダが勝手に生成される。

書き出し領域ツール、スライスツール、どちらを使って書き出しを行ってもそうなのですが、

ページのパーツ画像などを書き出すと、何故かフォルダが勝手に生成される様子。

勝手に生成されるフォルダの名前には大体「images」とつくので、イメージ用のフォルダよ！って事なのだなと、ある程度推測はできるのですが、そもそも書き出しの保存先がもうイメージ用のフォルダなわけです。

設定でいじれば自動生成オフにできるのかとおもってあちこちポチポチおしたり調べたりしたのですが、未だ解決に至っていません。しょうがないので手動で消してます。

うっかり消し忘れとか、うっかり必要なものまで消しちゃったとかなりかねないので、なるはやで解決したい事項ですね。

■カーニングについて（解決）

前回のCS4メモでこんな風に書いたとおもうんですが、なんとかできました。

できましたが、CS3とはやり方が異なっています。凄く使いづらいよ！

・CS3までのカーニングの仕方。

　文字間開けたいところにカーソル「｜」をもっていって、『ctrl+→、ctrl+←』で文字間調整。

★CS4でのカーニングの仕方。

　文字間開けたい所の手前の文字をドラッグしてから、『ctrl+→、ctrl+←』。

　ちなみに調整間隔が今までの約1/10みたいです…。

　つまり文字間を２空けたければ、数値は20ってしないと、今までと同じ間にはならない模様です。

　やじるしキーでポチポチする時、『ctrl+shift+→、ctrl+shift+←』でやると、CS3と同じような間隔で

　文字間あけられる感じでした。※厳密にCS3と一緒かどうかまでは検証してません。