html作成覚書 width属性と階層構造

with コメントはまだありません

html作成は作り方次第では
非常に時間がかかるものです。

ユーザーには見えない部分なので、
なるべく効率的に作業したいものです。
かといって手を抜くと閲覧や使い勝手に
支障が顕著に表れる部分です。

効率的に作成するようにするために
いろいろな施策をしていますが、
簡単に始められるポイントは

・imgにはwidth,height属性を設定しない
・htmlファイルとimgフォルダ階層構造にしない

の2点です。

widthとheightは特に設定しなくても
問題なく表示されます。(古いブラウザはわかりませんが)
htmlは後で変更や修正が入ることを
ある程度想定して作成すること念頭に
置いておく必要があります。

なので、画像の大きさが変わった場合、
いちいち、htmlのimgサイズを変更するのは
面倒ですし、ミスのもとになります。

経験上トラブルになったことはないので、
思い切って外してしまいましょう。

html、imgファイルを階層構造にしないという
のは、すべて一か所にまとめるということです。

これは賛否両論あると思いますが、
僕は断然こちらの方がいいと思います。

通常、html構造は、
indexがあってその他のページは
company/index.html
access/index.html
などというように階層で分けます。
imgファイルも各フォルダ内に
company/img/**.gifといったように
各ページだけ使用している画像だけを分けておきます。

ヘッダーやフッター、ロゴなどのサイト全体で
使用する画像はルートにcommonなどという
フォルダを作成し管理などをします。

一見、整理されているように見えますが、
僕は非常にナンセンスだと思います。

僕だったら、
htmlファイルはすべて
index.html
company.html
access.html
のようにルートに並べ、
imgファイルはimgというフォルダをひとつ
作成し、すべてその中に放り込みます。

一体何の問題があるのでしょうか。
もしこの構造がやりづらいというのあれば
それはただの慣れです。

だったら、階層化するのもなれじゃないか!
と思うかもしれません。
それでは、階層化のデメリットをいくつか。

まず、手間の問題です。
最初に言ったように、htmlは
変更や修正を前提に考える必要があります。
もし担当者が変わった場合やかなり
久しぶりに編集する場合、何をどのフォルダで
管理しているかの伝達が必要になります。

また、万が一ディレクトリや階層が変更に
なった場合フォルダの階層も一緒に
変更しなければなりません。
その場合、画像のパスミスなども
非常に発生しやすいです。

といった具合に考えるだけでも
うんざりするような無駄な作業と
リスクが考えられます。

一方、
すべて一か所のimgフォルダで
管理すれば、そんな心配は必要ありません。
何度担当者が代わろうが、
どんだけ時間がかかろうが、
imgフォルダは一か所です。
パスもどんな場合でも/img/***.gifです。

htmlの場合も同様で、
リンクのパスミスはかなり減ります。
ファイル名を変えるだけでいいのですから。

ただ、この話をすると突っ込まれそうなのが、
ファイルの命名ルールです。

たしかに階層構造をしない分、
ファイル名は長くなります。

しかし、長くなって何か問題があるのでしょうか。
僕はファイル名はほとんど連番にしています。

よく、ファイル名はそのファイル名を見たときに
何の画像かわかるようにしろと
言われましたが、本当にファイル名をみただけで、
どこの何の画像かわかるようになるのでしょうか。
それは、相当レギュレーションを把握した人間のみでしょう。

どうせ、命名ルールをレギュレーションなどで
確認してルールを調べてから名前を付けるくらいなら、
上から順に連番をつけて管理した方が
よっぽど管理がしやすいと思います。

何の画像かは画像を見ればだいたいわかりますし。
どの道調べるはめになるのなら、
番号で管理する方が楽です。

以上長くなりましたが、
こんなところです。

僕は上記の2点を実行することで
htmlの作成をだいぶ効率化することができました。

ほかにもまだまだありますので、
また書きたいと思います。

Leave a Reply