Photoshopレベル補正等＆Webレイアウト
トーンジャンプ：色の抜け
PCで表示しやすい色：青
自動補正機能は、暖色系の色を再現しずらいため注意
イメージ→色調補正→シャドウ・ハイライト
画像解像度変更：画像の再サンプルのチェックがWEB使用に重要
スマートオブジェクト：元の画質を保持したまま編集や拡大・縮小、回転、ワープが可能な機能
//////////////////////////////////////////////////////////////////////////////////
基本的なWebページのテンプレート
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>テンプレート</title>
<style>
body,div {
margin: 0;
padding: 0;
}
body {
background-color: #CCCCCC;
font-family:
"Hiragino Kaku Gothic ProN",
Meiryo,
sans-serif;
}
#container {
background-color: #FFFFFF;
width: 740px;
height: auto;
margin: 0 auto;
padding: 10px;
}
#header {
background-color: #B1DAF0;
height: 100px;
margin-bottom: 10px;
}
#nav {
background-color: #FFE3F1;
height: 40px;
margin-bottom: 10px;
}
#wrapper {
background-color: #F3B2B3;
width: 740px;
height: auto;
overflow: hidden;
margin-bottom: 10px;
}
#content {
background-color: #F9F5E7;
width: 530px;
height: 300px;
float: right;
}
#sidebar {
background-color: #CFFAAB;
width: 200px;
height: 300px;
float: left;
}
#footer {
clear: both;
background-color: #7FC4BF;
height: 40px;
}
</style>
</head>
<body>
<div id="container">
<div id="header">header</div>
<div id="nav">nav</div>
<div id="wrapper">
<div id="content">content</div>
<div id="sidebar">sidebar</div>
</div><!--#wrapper-->
<div ID="footer">footer</div>
</div><!--#container-->
</body>
</html>
margin: 0 auto; 中央に表示
上下する2項目のmarginの上下は相殺される
・TIPS
global-nav 検索で2文字と認識（SEOに有利
global_nav 検索で1文字と認識
http://jigsaw.w3.org/css-validator/validator.html.ja#validate_by_input
検証
http://www.tagindex.com/stylesheet/basic/naming.html
タグインデックス：タグの種類一覧
http://blog.html.it/layoutgala/
レイアウト例
