人気ホームページが作れる簡単作成講座

人気ホームページが作れる簡単作成講座
margin ＆ padding 　余白

margin ＆ padding 　余白

「何もない」ということがデザイン性を高め、見やすく、好感の持てるホームページにします。余白をコントロールすることで、文字の配置を変えたり、背景色が指定された背景を広げたり、空間を空けることで見えないラインを引いてレイアウトを分けることもできます。

marginとpaddingの関係

margin : 10px
padding : 10px

HTMLタグの内側に余白を作るのがpadding。外側に余白を作るのがmarginです。余白を入れることで読みやすくしたり、デザイン性を高めたり使い道が多く、良く使われるタグの一つです。

使用例

border: 1px solid #FF9900;
↓
border: 1px solid #FF9900;
padding: 5px;

テキスト
↓
テキスト

border-left: 10px solid #FF9900;
background-color: #FFFF99;
↓
border-left: 10px solid #FF9900;
background-color: #FFFF99;
padding: 5px;

テキスト
↓
テキスト

＜＜前のページ　　次のページ＞＞
このページをブックマークする→　Yahoo!ブックマークに登録 Yahoo!ブックマークに登録

Webデザイン

Webデザイン力を磨いて、自分らしいホームページを作ろう
分かりやすいがアップさせるWebデザイン
  • 見るメディアではなく、使うメディア
  • ホームページ全体のデザインに統一性を持たせる
  • レイアウトにルールを持たせる
  • ナビゲーションに統一性を持たせる
  • 現在地を示す
  • リンクをはっきりと示す
色を味方に付けるWebデザイン
  • 色の基本を学ぶ
  • 色の持つイメージからテーマカラーを決める
  • 配色のポイント（減らす、無彩色）
  • 読みやすさを損なわない配色
XHTMLとCSS(スタイルシート）の理解を深める
  • XHTMLとCSSを理解することがデザイン性を高める
  • ホームページ作成ソフトがダメにした

▼すぐに役立つXHTML/HTML

▼すぐに役立つCSS（スタイルシート）

ホムつくメールマガジン　〜プロが明かす〜 これが人気ホームページの裏側だ！

メルマガ配信スタンド「まぐまぐ」　まぐまぐ殿堂入りメルマガ  （「まぐまぐ」にて殿堂入りしました）
ホームページ作成を一人で頑張るのもいいですが、仲間と一緒に頑張りませんか？
人気ホームページの作り方やホームページ運営者の生の声などの情報を発信していますので、ぜひあなたも購読してみてください。

このページのトップへ戻る
ホムつく講座の講師は
こんなヤツ！

ホムつく講座の講師はこんなヤツ！ホームページを作っていたら、この楽しさを、あなたに伝えてくなりました。ホムつく式のホームページの作り方を体験してみてください。
→プロフィール
→お問い合わせ

ホームページ作成に
必要なものは？

ホムつく講座がおすすめするソフトやレンタルサーバーを紹介しています。初心者の方や、悩んでいる方は是非参考にしてみてください。

→スタートガイド

ホームページを初めて作るのですが・・

ホームページはXHTMLとCSSで作ります。ほむつく講座では初心者の方にわかりやすいと評判の初心者講座があります。

→初心者講座

もっとデザインを
良くしたい

ホムつく講座では見た目だけが良いデザインではなく、ユーザー（利用者）の方が安心して、ホームページを閲覧できるデザインを学べます。

→Webデザイン

ホームページにアクセスが集まりません

ホームページは作れば沢山のアクセスが集まるわけではありません。そして、アクセスが多いだけのホームページでも意味がありません。あなたのファンができる人気ホームページを作り方を学びましょう。

→人気ホームページ