• このエントリーをはてなブックマークに追加
  • Evernoteに保存Evernoteに保存

Web制作を円滑に進める為に守るべき社内規定の色々

  • このエントリーをはてなブックマークに追加
  • Evernoteに保存Evernoteに保存
  • 0

各社必ずといって良い程、社内で決められたルールがあると思います。

まず使用ツール
デザインはPhotoshopなのかIllustratorなのかFireworksなのか
マークアップはDreamweaverなのかSublime Textなのか単純なテキストエディターなのか
システム開発のフレームワークなどなど。

会社に勤めているいる以上、組織(チーム)でプロジェクトを遂行する事となり
それぞれが好きなツールで進めてしまうと、円滑に進める事ができなくなる弊害が生じるので
社内では少なくとも、このようなルールが設けられています。

例えば
AさんがPhotoshopでBさんがIllustratorでそれぞれ同じプロジェクト案件を
デザインしていたらどうでしょう。
Aさんがデザインした所はAさんしか修正できなくなります。
これはチームとして同一プロジェクトを遂行する場合、時間のロスになりますし
そもそも面倒ですよね。
なので、求人情報を見ると必ず必須スキルとされているツールが明記されています。

その中でも制作する上で細かいルールがあります。

デザインではレイヤーの扱いや、ガイドの引き方など
マークアップはDOCTYPE宣言やインデントの取り方、CSSのハックなどなど。

組織に属する場合もそうですが、フリーランスとして外部と協業する場合も
必ずこのようなルールがあるので、その辺も意識し勉強すると良いと思います。

意識する点

デザイナーが意識すべき点

マークアップエンジニアがわかりやすい構成にする事。
ヘッダー要素、サイドバー要素、フッター要素など、各コンテンツを
きちんとレイヤー分類すると、マークアップエンジニアはわかりやすいです。
スライスを切る場合など、表示・非表示を頻繁に使ったりします。
レイヤーがきちんと分かれていると、そのような場合でも使い勝手が良くなります。
名前の付け方は基本的に英字にしていますが
細かくわかりづらい要素だけ日本語を使う事が僕は多いです。

マークアップエンジニアが意識すべき点

まずは宣言ですが、最近はほぼhtml5での記述にしています。
html5はまだ不明点や改善点があり、今後も仕様変更が考えられ
html5での宣言内でも往来通りdivも使える為
headerやnav、footer、article、section、asideタグを使うくらいです。
基本的にレイアウトの構成はdivで構成し、構文はarticleやsectionでマークアップしてます。
システムエンジニアがわかりやすいように各所コメント表記し
アップ時にコメントを削除するようにしています。

まとめ

社内、社外関わらず、GoogleやW3Cなどのルールもあり
もっとたくさんのルールがあるので、各部門ごとのルールは
今度、細かく記事にしていきたいと思っていますが
大事な事は、デザイナーもマークアップエンジニアも仲間の事を思いやり
仕事をするよう心がける事ではないでしょうか。

Ads
  • このエントリーをはてなブックマークに追加
  • Evernoteに保存Evernoteに保存
Ads