Webデザインの教科書
テクニック集
Scroll
  1. ホーム
  2. レシピ

Webデザインのテクニックすぐ実践できるデザインレシピ集

Webページを作ってる時にデザインに困ったことないですか？

どうしてもうまくいかなかったり、思い通りにならない時があると思います。

今回は意外と知らない便利テクニックを紹介します。

デザインレシピ一覧

HTMLとCSSだけで出来るテクニックを紹介します。

どれも実際に使われているテクニックだけを選んでいます。

どうぞお好きなデザインレシピからお選び下さい。

文字のデザイン

  1. 文字のフォントを変える

    Google Fontsを使って、目的に合わせた様々なフォントに変更しよう。

  2. 文字のレスポンシブ対応

    画面の大きさに合わせて文字サイズを調節するCSSテクニックと書き方。

画像テクニック

  1. 背景画像とレスポンシブ対応

    背景画像の使い方と、画面の大きさに合わせて綺麗に表示するCSSテクニック。

公開の前にすること

  1. iPhoneの対応

    Glacier

    HTML&CSSでiPhone画面に合わせたデザイン設計とその確認方法。

  2. URLの正規化

    http://sheep.com/
    https://sheep.com/
    http://www.sheep.com/
    https://www.sheep.com/

    URLの正規化と検索エンジンの関係を知って、検索順位の最適化をしよう。

  3. 最終更新日の表示

    記事の新鮮度をアピールしよう。Webページの最終更新日を自動で表示する方法。

  4. パンくずリストの作成

    • トップ
    • サービス
    • デザート

    検索エンジンのためのパンくずリストの作り方とその確認方法。