WEB制作会社の方にお伺いしたいのですが
会社設立後や新しい担当者(転職者含む)でのサイト制作の際に
XHTMLやCSSの基本部分のテンプレートを作ったと思うのですが
それは何を参考にしたのでしょうか?
制作会社の作品のCSSソースを見ると
.maT10{margin-top:10px;}でclass指定するタイプとかあります
(特にこの記述が掲載されているものを探している訳ではないです。)
以前ネット上のものを参考にしてはだめなのかと質問するとひどく叱られた事もあり
お金を出して技術を買うという意味で書籍を購入するのですが
牧野工房さんやCSS Niteさんの本も参考にしたのですがネット上にあるものとは
違うような気がします(別の本ではCSSを分けるのは非効率になるので分けないとか)
ネット上のものは・・・なんていうかファイル名やコメントの書き方まで同じなので
明らかにどこかを参考にしていると思うのですが、
もしかして何かに入会するとダウンロードできるとか素材として購入するとか
されているのでしょうか?
もちろんW3Cの仕様を見て全部理解して1から作ればいいのですが、
我流っぽくなって一般的ではないし、業界の人が参考にしているサイトを知らない
とか努力が裏目となる評価になると思っています。
自分で検索するのでもいいのですが、出所が知りたいので・・・
もしよろしければデザイン部分ではなくソース部分などを参考にされている
サイトを教えていただければと思います。
(今回は質問と関係のない発言はご遠慮下さい。)
No.1ベストアンサー
- 回答日時:
単なる偶然のような気がしないでもないです。
.maT10なんてクラス名は、どう見てもウエブ音痴のclass名ですしね。margin-top:0などに将来デザインを変えたくなったらclass名も変えるのでしょうかね。(^^)
『id属性及び class属性と併用することで、文書に構造を付加するための一般機構を提供する。 ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )』も読んでない連中・・。div.header,div.sectionとかつけるのが本来のclass名ですよね。
>以前ネット上のものを参考にしてはだめなのかと質問するとひどく叱られた事もあり
参考にすべきは、仕様書ですよ。「ネット上のものを参考にしてはだめ」は、そのまんま書籍にも当てはまりますよ。
スタイルシートの解説書でしたら、こんなデザインが出来る、あんなデザインが出来るというプロパティの説明が目的ですから、HTMLの文書構造には立ち入りません。
私が作業者に言っているのは、デザインは盗め・・しかしHTMLは仕様書に従え!!・・
徹底的にデザインは一切無視してHTMLを作らせます。作ります。その後、スタイルシートでデザインに取り掛かりますが、HTMLさえきちんと出来ていれば、基本的にHTMLに手を加えることはありません。何種類かのスタイルシートを用意して、それを切り替えてどのデザインが良いかの評価に移ります。
・スタイルシートを切り替えることでサイト全体のデザインを一新できる。
と言うのが文書構造とプレゼンテーションの分離の一番の目的ですから。たとえば、
「1カラムのリキッドレイアウトについて。( http://oshiete.goo.ne.jp/qa/7292209.html#a3 )で示したHTML、あなたなら、どうデザインしますか?
>(別の本ではCSSを分けるのは非効率になるので分けないとか)
複雑なデザインのサイトの場合は基本的に分けます。
・永続的スタイルシート
・メディア別スタイルシート
・media=screen
・外骨格のみ
・色の指定
この二つは分けることが多いです。
要は作業効率・メンテナンス効率・データ量で判断します。
何種類かに分類できるサイト
・トップページ
・各分野のトップページ
・商品説明
・会社案内
では、サイト全体に適用させる永続的スタイルシートでfont-familyとかsizeとかを、骨格は、4種類、色は2種類に分けておけば、スタイルシートは小さくて済みますね。
HTMLのソース部分は、ユーザーさんの意向もありますが基本的に読み解ける範囲で文書構造をマークアップするので参考になるサイトは要らないでしょう。スタイルシートは、デザインのみネット上や、たまに書籍も見ますが、あくまで外見だけなのでソースを見ることはありません。
他社は知りませんが、DreamWeberなどのテンプレートを使用しているところが多いかと思います。
Dreamweaver テンプレートとサンプル | Dreamweaverデベロッパーセンター ( http://www.adobe.com/jp/devnet/dreamweaver/sampl … )
dreamweaver テンプレート ダウンロード - Google 検索 ( http://www.google.co.jp/search?q=.maT10%7Bmargin … )
いつも回答ありがとうございます。
>将来デザインを変えたくなったらclass名も変える
たぶんクラス名を置換するんだと思います。
style属性を短くしただけなので、なんか違和感はあります
HTMLの文書構造については
歴史背景を考慮して構造やデザイン分離はしていますが
学生の頃の「試験対策」と「教科書をまるごと覚える」との比較のように、どうしても仕様書よりテクニック探しでその場しのぎになっているのは反省します。
>1カラムのリキッドレイアウトについて
質問文だけざっと見て背景に意味があるならimg要素かなとか、
メニューをdivのところはulにしたほうがいいかなとか、
ボタンの画像はCSSで背景指定でいいかなとか思いました。
デベロッパーセンター はチェックしてませんでした(汗)
ORUKA1951さんの下で仕事されてる方がうらやましいです
リンク先をよく見ておきます。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- Web・クリエイティブ 独学でwebデザイナーを目指すには 2 2022/09/17 16:27
- HTML・CSS サイトをマルチデバイス対応にする為の準備や、CSSなどのおすすめサンプル集やアドバイスを頂きたいです 1 2022/07/13 22:15
- HTML・CSS CSSがなぜかfont-sizeだけ効かない...記述がまちがっているんでしょうか 5 2022/04/09 17:52
- 会社・職場 今後どうすれば…… 相談です。 父が大工をやっており、もう時期辞める予定なのですが 今後、作業小屋な 8 2023/04/05 16:06
- ビジネスマナー・ビジネス文書 管理組合・議案書内の理事長の挨拶文書について 1 2023/03/25 23:54
- 分譲マンション 管理組合・議案書内の理事長の挨拶文書作成にについて 2 2023/03/26 01:56
- その他(プログラミング・Web制作) WEBアプリ開発に必要な言語 5 2023/06/28 16:57
- 会社・職場 今後の仕事について 閲覧ありがとうございます。 私は現在28歳の男性です。 自分が向いている仕事、続 3 2022/08/01 12:19
- その他(IT・Webサービス) WEBサイト内のファイルを探す方法は? 1 2022/11/11 16:38
- Web・クリエイティブ 創作活動について質問です。 ・自分が過去に虐められたり人間関係で悩んで部活やクラスで孤立した経験等を 2 2022/10/10 22:14
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
line-height指定で発生する余白...
-
一括で全体を右にずらす
-
article、section、hgroup?
-
div要素が重なってします
-
html5でheaderの中にnav
-
ブログのサイドバーが下にくる
-
オシャレな区切り線はありませ...
-
グラフィックス
-
idとclassの指定方法
-
HTML属性での「""」 「''」違い
-
<div>テキスト</div>
-
html divボックスの入れ子で中...
-
html5にて水平線の引き方は?
-
HTMLとCSSの次に覚えることは何...
-
html の divとtable の役割
-
h1のテキストサイズよりh2の方...
-
【html&css】太さの違う2本線の...
-
改行がしたいのですが、うまく...
-
携帯サイト、ナノでのタグ編集...
-
コンピューターの画像ブロック
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
htmlのolやulなどlistにtitleや...
-
HTML属性での「""」 「''」違い
-
div要素が重なってします
-
<div id="container">の使いか...
-
複数のボタンを等間隔に、かつ...
-
html の divとtable の役割
-
divとpの使いわけ
-
ヘッダーとフッターだけ背景を...
-
min-heightとheightの違いについて
-
セクションをdivで囲むと見出し...
-
画面を縮小するとカラムが落ち...
-
ヘッダーを左右に二分割する方...
-
1時間30分を簡単に表したいで...
-
スペースを使わず文字位置を揃...
-
CSSで、contentsがfooterに重な...
-
h1に自分自身へのリンクを張...
-
divの中に外部のHTMLを埋め込む
-
divを横に並べる方法
-
hタグの右横に画像を表示
-
h1のテキストサイズよりh2の方...
おすすめ情報