CSSの作業分担方法は?

このQ&Aのポイント
  • グループ発表でHPを作成するにあたり、CSSの作業分担方法について悩んでいます。
  • ページ数は20ページあり、チームメンバーが5人です。
  • 制作方法として、パターンAでは1人が1つのCSSを作成し、パターンBでは1ページごとに1つのCSSを用意する方法が考えられますが、どちらが良いでしょうか?また、共通部分のCSS項目を別に用意する方法も検討したいと思っています。
回答を見る
  • ベストアンサー

CSSの作業分担可否につきまして

グループ発表で、HPを作成することになりました。 HPのページ数は20ページあります。 チームメンバーが5人いるのですが、一人あたり4ページの作成になりました。 このようにグループ制作の場合CSSは、  パターンA:1人4ページ担当なので、1人が1つのCSSを作成する。(よって、全20ページで、5人=5つのCSSがいる)  パターンB:1ページごとに1つのCSSを用意し、20個のページに対し20個のCSSを用意する。 どのように制作していくのがいいのでしょうか? 共通部分のCSS項目(Hタグ、Pタグ)等を別に用意し、5人が取り込んでからの制作はできないのでしょうか? 前回質問させていただいたのですが、やはり、  ・固定スタイルシートで共通部分(CSSのリセット等)を制作し各個人は優先スタイルシートで制作していくのが一般的なのでしょうか? ご教授お願いします。

  • CSS
  • 回答数2
  • ありがとう数2

質問者が選んだベストアンサー

  • ベストアンサー
  • ORUKA1951
  • ベストアンサー率45% (5062/11036)
回答No.1

うまく伝わらなかったようですね。 スタイルシートとHTMLを分けるのは、「構造とプレゼンテーションの分離 ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/intro/intro.html#h-2.4.1 )」です。  それは、 【引用】____________ここから スタイルシートはHTMLのマーク付けを簡素化し、またHTMLをプレゼンテーションの負担から大きく解放する。スタイルシートは、著者とユーザに対し、フォント情報、配置、色等の文書のプレゼンテーションを制御する手段を提供する。  ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ここまで[Introduction to HTML 4 (ja)( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/intro/intro.html#h-2.3.5 )]より  詳しくは ★14 スタイルシート ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/present/styles.html )  端的に言うと、構造とプレゼンテーションを分離することで、HTMLは極めて簡素になると共に、たった一つのスタイルシートを変更することで、すべてのページのデザインを一挙に変更できること。サイト全体のデザインを統一できる・・・・これが最大の利点となるからですよ。  ということは、グループで作業する場合、絶対的なリーダーが必要だということです。彼は、HTMLのマークアップ方法を定め、スタイルシートの製作を一手に引き受けることになります。たとえそれらの作業を分担するにしても、リーダーは一人であるべきですし、それが出来ないとグループで製作することは不可能です。 ※HPのページ数は20ページあります。  これはありえません。HPとはヒューレッドパッカード社のことです。もしホームページと言う意味でも誤りです。もしサイト内で「ホームページに戻る」というリンクを作成したら・・何をさすのですか?  ホームとは、故郷/出発点と言う意味の英語です。ハウスではありませんね。本来はブラウザを起動したときに最初に表示されるページで、それから派出してウェブサイトのトップページ---サイトの出発点---というところまでは許容範囲でしょう。(利用する立場ならともかく、少なくとも製作する立場になると正確に使用しないと混乱します。)・・・20ページのウェブページで構成されるウェブサイトで、そのサイトの「ホームページ」はひとつとしてお答えします。    実際の手順を説明すると次のようなイメージになります。 1) サイトに存在する予定のページを種類分けします。  (例)--ある学校のウェブサイトを例にすると    トップページーー1    自己紹介や著者への連絡先、プライバシーポリシー、サイトマップなど事務的なページ    カテゴリーのトップとなるページ 科紹介/学生生活など    各カテゴリーのページ      上記の紹介   基本的には、この4種類になると思います。 2) HTMLのマークアップ方法を定めます。特にclass名はきちんと決めておきます。 <body>  <div class="header">   <h1>このページの見出し</h1>   <div class="abstract">    <h2>要約</h2>    <p>簡単な説明</p>   </div>   <div class="nav">    <ul>     <li><a href=""></a></li>     <li><a href=""></a></li>     <li><a href=""></a></li>    </ul>   </div>  </div>  <div class="section">   <h2>本文</h2>   <div class="section">    <h3>項目</h3>    <p></p>   </div>   <div class="section">    <h3>項目</h3>    <p></p>   </div>  </div>  <div class="footer">   <h3>文書情報</h3>   <p></p>   <address></address>  </div> </body>  とかのきちんとした雛形を作成します。  スタイルシートの合わせて作成することが多いです。  ここで記述したclass名は、HTML5では要素として独立します。 →HTML5 3.1. 新しい要素 ( http://standards.mitsue.co.jp/resources/w3c/TR/html5-diff/#new-elements ) →「DIV要素とSPAN要素は、id属性及び class属性と併用することで、文書に構造を付加するための一般機構を提供する。 ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/struct/global.html#h-7.5.4 )」  きちんとした雛形が出来れば、あとはデータを流し込んでいくだけですから簡単でしょう。もちろん全員がHTMLの正しい知識を共有していることが必要です。すなわち、プレゼンテーションを一切考えずにひたすら文書構造を統一してマークアップできること。★この詐欺洋画最も重要★  →14.1 スタイルシートの概説 ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/present/styles.html#h-14.1 )  あとは、スタイルシートを調整してきますが、最初の雛形とスタイルシートさえ出来ていれば、スタイルシートに手を加えることはほとんどありません。  車を製造するときも同じで、全員がいっせいにタイヤを作ったり、エンジンを作るわけではありません。そんなことしたら車は永久に完成しません。大事なことは、作業分担です。それが共同作業と言うものです。

ShiftTail
質問者

お礼

>きちんとした雛形が出来れば、あとはデータを流し込んでいくだけですから簡単でしょう。もちろん全員がHTMLの正しい知識を共有していることが必要です。すなわち、プレゼンテーションを一切考えずにひたすら文書構造を統一してマークアップできること。★この詐欺洋画最も重要★  →14.1 スタイルシートの概説 ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/present/styles.html#h-14.1 )  あとは、スタイルシートを調整してきますが、最初の雛形とスタイルシートさえ出来ていれば、スタイルシートに手を加えることはほとんどありません。 再度解説ありがとうございます。 やはり、HTMLの構造の理解が必要なんですね。 参考にさせていただきたいと思います。

その他の回答 (1)

回答No.2

データ入力(HTML入力)は分担できますが、デザイニングは1人でやらないと、ページごとに全く違うデザインになったりして、共通性というか、一貫性が保てないのでは? なので、1人で作ったCSSファイルを全員が<link>するのがいいと思います。 --------- >パターンA:1人4ページ担当なので、1人が1つのCSSを作成する。(よって、全20ページで、5人=5つのCSSがいる) > パターンB:1ページごとに1つのCSSを用意し、20個のページに対し20個のCSSを用意する。 >共通部分のCSS項目(Hタグ、Pタグ)等を別に用意し、5人が取り込んでからの制作はできないのでしょうか? > ・固定スタイルシートで共通部分(CSSのリセット等)を制作し各個人は優先スタイルシートで制作していくのが一般的なのでしょうか? 全部、可能です。 すみません、上から目線的な表現になってしまいますが、知識、技術を持っているならどの方法を選んでもかまいません。

ShiftTail
質問者

お礼

>全部、可能です。 >すみません、上から目線的な表現になってしまいますが、知識、技術を持っているならどの方法を選んでもかまいません。 いえいえ。とんでもないです。 大変参考になりました。 ありがとうございます。

関連するQ&A

  • CSSの作業分担化

    HPを作成することになったのですが、 (1)共通パーツの構成を考えました。 いよいよ、3人ほどでCSSのデザインを考えていくことになったのですが CSSのデザインは1人でやったらほうがいいのでしょうか? 1人3ページ 等の分担方法を考えています。 3人で分担してできるなら分担してやろうと考えているのですが ただ単にimportを使うだけではうまくいかないだろうな。と思っております。 どのように3人で取り組むと、うまく3人でCSSの作業分担ができるものなのでしょうか?

    • 締切済み
    • CSS
  • スタイルシート(CSS)の質問です

    スタイルシート(CSS)初心者ですが、教えて下さい。 HPを作成しております。 HP内を検索する「サイト内検索CGI」を設置しております。 検索枠(フォーム)を下記CSSタグ入力しております。 style="border:1px #999999 solid" とあるサイトで、角が丸くなっているフォームを見ました。 CSSでフォーム角を丸くする事は可能でしょうか? もしくは画像を使えば可能でしょうか? どうぞ宜しくお願いします m(_"_)m

    • ベストアンサー
    • HTML
  • HPビルダーでCSSを使ってフレームごとにデザイン変更

    HPビルダー8でフレームを使って左、右下(メイン)、右上での3画面でHPを作成中です。 左・右上・右下でそれぞれ違う背景を違うデザインで使いたいと思っています。 スタイルシートを利用中なのですが調べてもよく理解できずわかりません。 今はビルダーのスタイルシートの細かい指定方法がわからないので直接 手打ちでCSSファイルにメインページのデザインを入れて、 左・右上のフレームページはheadタグ内に個別に入れています。 できれば作業が簡易化できるようにフレームごとに違うデザインのCSSを それぞれ適用させたいとおもうのですが具体的な方法を教えていただけますか? CSSファイルなどを直接いじる方法でもHPビルダーの機能を使う方法でもどちらでもかまいません。 CSS系のサイトは一通り見てみたのですがさっぱりわからないので 具体的に記述例を教えてくれると大変ありがたいです。よろしくおねがいします。 CSSファイルの記述(一部) body{background-image : url(../○○.jpg);} 左ページの記述 <head> <STYLE type="text/css"> <!--body{background-color:#ffffff}--> </style> </head> 右上ページの記述 <head> <STYLE Type="text/css"> <!--body{background-color:#808080}--> </style> </head>

  • CSSについて

    CSSについて質問させてください。 CSSをタグの中に直接書き込む場合 <div style="color:#ffa500; font-size:20pt; font-weight:bold; text-decoration:underline;"> このような場合のstyle="部分は、styleタグと呼んで いいのでしょうか? divタグの中に記述しているので、styleプロパティと 呼ぶのでしょうか? CSSのリファレンスにはstyleプロパティはありません。 ということは、やっぱりdivタグのstyleプロパティで CSSを指定していると考えるのでしょうか?

  • CSSでHP作成したい。メニューコンテンツはどのように作ったらいいですか?

    CSSでHP作成したい。メニューコンテンツはどのように作ったらいいですか? こんにちは。 今まで、ホームページビルダーを使って、HTMLでウェブページを作ってきました。 左カラムをメニュー部分として、インラインフレームで作成していました。 この度、SEO対策から、 CSSを使ったテンプレートに代えて作り変えようと思っています。 でも、いまいちよくわからないのですが、 スタイルシートで左カラム(メニュー)を書くとなると、 全てのページを作った後にリンクを貼って、 そのメニュー部分をすべてのページにまた複製しないとならないですよね?? 私のウェブサイトは、100ページ弱あるので、 なかなか考えただけで大変そうです。。。 スタイルシートで、2カラム形式左メニューのページを作成したことのある方、 もし良かったら方法を教えて下さい。 ※ちなみに、ブログは自己カスタマイズが大変なので利用しない方向です。 FC2で持っていますが、やっぱりHTMLの方が使いやすいので・・・

    • ベストアンサー
    • SEO
  • cssが長くなってしまう。他に良い方法は?

    サイトのレイアウトをCSSで行なっているのですが、例えばノーマルなテキストの色・スタイル、リンクの色などの設定がぺージ(コンテンツ)ごとに違います。なので「pタグ内のスタイルはこれ」と絶対的に定めることが出来ません。 全ページでテンプレートを使用していて、それが既に外部CSSを1つ呼び出しています。コンテンツごとにCSSを用意するのがスマートに思えますが、そうすると外部CSSを複数指定することになります。どこかでこの方法は推奨されないと聞いたんですが、本当ですか? もしそうである場合、その1つのCSSに全ページ分のスタイルを記述することになりますが、それもまたCSSのソースがバカでかくなってしまいます。 これはどうするべきでしょうか?

  • css の h2 の最初

    外部スタイルシートを使っているのですが、そこで、h2のことなのですが、見出しの最初をたとえば☆にしたいと思います。 もちろん、htmlのタグに<h2>☆見出し</h2>と書けばいいのですが、できれば、CSSで☆の部分だけ自動的に入るようにしたいのですが、そのようなことは可能でしょうか? 可能だとすればどうすればいいか、教えてください。

    • ベストアンサー
    • HTML
  • スタイルシート(CSS)の中にテーブルのようなスタイルシートをつくりたいです。

    Dreamweaver8にてHPを作成しております。 今回CSSをやってみようと思い試行錯誤しながらがんばっているのですが、 現在スタイルシートのfloatタグなどを使って、 ヘッダー、メニュー、コンテンツ、フッターというよくある構成で作っております。 そしてコンテンツ部分以外はテンプレート機能を使い共有できるようにしています。 そして新しいページを作る際、コンテンツ部分だけを編集していくのですが、真ん中で2つにわかれた2段組の文章をつくりたくて、テーブルを使用したところ、テーブルが縦に長くなるとCSSで指定した範囲を超えてしまいレイアウトが崩れてしまいます。 これがテーブルでなく文章でなら縦に長くなっても自動的にCSSの高さが長くなってくれます。 ですので、題名のようにCSSでテーブルのような機能のあるものを教えていただきたいのですが、素人でなにぶん申し訳ないですがよろしくお願い致しますm(_ _)m

    • ベストアンサー
    • HTML
  • HTML+CSSについて質問です

    当方のHPは左サイドにメニューリスト、中央部分に記事を書いている2カラムです。また、ページ数は100ページくらいありますが左サイドのメニューリストは全て共通となっています。左サイドのメニューリストは定期的に更新しているのですが、一つの項目を追加したい(削除したい)場合、全てのページの左サイドメニューを更新しなければならず、かなりの手間がかかってしまいます。なので、左サイドメニューは独立したHTMLを作成し、更新の手間がかからないような形にしたいと考えています。このようなHTML+CSSを作成する場合、どのようにすればよろしいのでしょうか?また、参考になるサイトがあればご教授よろしくお願いします。ちなみに当方のHPを作成する知識は、基本的なタグやCSSがわかる程度の初心者レベルです。

    • ベストアンサー
    • HTML
  • CSSの覚え方

    ブログをやりたいのですが、スタイルシート CSS という概念がよく分かりません。HPビルダーを使っているのですが、どうすれば取っつきやすく理解できますか? まず、具体的にどうやって覚えていけばいいか教えてください。

    • ベストアンサー
    • HTML

専門家に質問してみよう