PHPに関するデザインとプログラムの分離、そして編集に関する質問です。


デザイン用ファイル(HTML)をヘッダーとフッターとメニューに分けて、includeして読み込み、テンプレートとして利用しているのですが、テンプレート化すると編集時にCSSが反映されずに、デザインの修正がしづらくなります。

OpenPNEなどのオープンソースシステムを見ると、共通する部分は別ファイルにしていますし、それがPHPとして正しい記述方法だと思うのですが、どうしてもデザイン編集の場合の事を考えると、そうするべきなのか否か迷う時があります。

そこで質問ですが、デザイン制作とプログラム構築を兼業されている方で、どのようなファイル構造をしているのかを教えていただけないでしょうか?

具体的なソース表示は結構なので、出来るだけわかりやすい形で「こうすればPHPに詳しくないWEBデザイナーでも編集しやすい」というのをご回答いただければと思います。よろしくお願いします。

回答の条件
  • 1人2回まで
  • 登録:2007/02/27 09:57:00
  • 終了:2007/03/06 00:33:27

回答(3件)

id:esecua No.1

esecua回答回数510ベストアンサー獲得回数102007/02/27 14:20:37

ポイント27pt

ん~素直にテンプレートエンジンのSmartyを使用してみてはいかがでしょうか?


もし仮にすべてのヘッダやフッタ、メニューなどを定期的に書き換えるのであれば、各部品のテンプレートを別々に作成します。


そして各別々のテンプレートからヘッダーやフッタ、メニューなどをincludeしてやればOKかと。

例えばこんな感じでしょうか。

{include file="hedaer.tpl"}

<h1>HTML領域</h1>
このページは{$hatena}です。

{include file="menu.tpl"}
{include file="footer.tpl"}

編集時にCSSが反映されないとありますが、そのCSSは別ファイルでしょうか?それともheader内に記述されているのでしょうか?


CSSはヘッダーから別のCSSを読み込んでやればいいのです。ですのでデザイン変更の際はcssファイルの変更でOKです。

http://smarty.php.net/

もしほしい回答とずれていたらごめんなさい。

id:kt26

Smartyも利用した事はありますが、基本的にテンプレートファイル内にSmartyのコードが入るので、あまり違いは無いと思っています。

それに「ヘッダーからCSSを読み込んでやればいい」とありますが、それはheader.tplファイルの内部にcssをリンクしているだけで、テキストエディタでコードを修正するなら問題ありませんが、デザインをDreamweaverなどで編集する場合には適しませんよね?

出来ればデザイナー寄りの意見がいただければ幸いです。

2007/02/27 17:00:59
id:heppokoA No.2

heppokoA回答回数65ベストアンサー獲得回数72007/02/27 17:11:19

ポイント50pt

ファイル構造については,質問でおっしゃっているように共通部分をまとめるなどしていて,上の回答者さんが出されているSmartyも使っています。

HTMLはタグから打っていく派なのであんまりデザインビュー的なものは使わないのですが,Dreamweaverでテンプレートを編集する場合には,「デザインタイムスタイルシート」というのが使えるかと思います。

http://www.google.com/search?hl=ja&lr=lang_ja&ie=UTF-8&a...

id:kt26

こんな便利な使い方があったんですね。

ブラウザでプレビューした時は表示されませんが、Dreamweaver上で見えるだけでも十分だと思います。

非常に参考になりました。ありがとうございます。

2007/02/27 18:36:19
id:tezcello No.3

tezcello回答回数460ベストアンサー獲得回数692007/02/28 02:04:40

ポイント26pt

サーバに多少負荷が掛かるかも知れませんが、PHPで動的に出してはどうでしょうか。

ヘッダ、フッタ、メニューなどの大きな塊だけでは無く、もう少し小さなパーツから全体レイアウトまでのテンプレート様のファイルを色々と用意します。

それらの中に普通のHTMLでは使わない様なタグと属性値を書いておき、それをキーワードにしてPHPで置き換えをします。

例えば、

<source name="table1.htm" raw="3" col="4"> とか
<replace name="parts.htm" repeat="5"> とか

ブログというかCMSのような感じでしょうか。


また、ちょっと違った角度からの回答を(...期待されているモノとずれてしまっていたらゴメンナサイ)。

僕が作るものは社内サーバでの利用が主なので、コンテンツのディレクトリをSAMBA で共有して、Win から開いてエディタで直接変更してます。

確認は実際に使用するブラウザからするので、横幅寸法が違うとか、フォントやキャラクタコードが違って文字化けするとか、プレビューが微妙に異なるとかのズレがありません。

タグ挿入のできるエディタを使えば、手打ちもそれほど苦にはならないと思います。

趣味のサイトは、似た様なディレクトリ配置になるようにしたサーバをローカルに作って、同様な事をしています。

レンタルしているサーバにアップロードする前に、迷惑をかけずにテストが出来るのがメリットですね。

Dreamweaver は使った事がありませんが、この手のヤツはあまり綺麗なHTMLを書いてくれない(事が多かった...今はどれ位進化したかは知りませんが)ので、タグは殆ど手打ちでやってます。TeraPad にはブラウザでのプレビューが簡単に出来るのでよく利用してます。

id:kt26

ご回答ありがとうございます。ただ、申し訳ありませんが、求める回答と異なります。

自分だけで作業する場合は、手打ちでも全PHP化でも問題ありませんが、他者(デザイナー)と兼業する場合、クライアントに納品する場合、WEBに公開する場合など、”自分以外の第三者がデザインを修正しやすい方法”についての相談です。

ですので、プログラマー視点だけではなく、デザイナー視点も含めていただけると幸いです。

2007/02/28 08:48:13

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

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません