MdN Design｜総合情報サイト
サイトのデザインに光と影を感じさせるときは、まず光源を明確に意識してみよう。画面上部から光が当たるのか、下部から照らし上げるのかを定義することで、 細かいパーツのハイライトやシャドウの方向が決まる。１つ１つのパーツの処理に理由があることが何よりも重要だ。光源は見えない場所に設定するだけでもよいが、あえて画面内にスポット的な光源を表現することで、そのスポットが当たるキャッチコピーや商品をより印象的に見せることができる【1-1】。 【1-1】視覚的にスポットライトのような演出を当てることで視線を誘導し、更にサイト全体の光と影の方向を決定づける 続いてハイライトについて考えてみよう。ハイライトは物体の、より光源に近いエッジ部分に現れる。Webデザインでは文字を読むことを主な目的としているため、 極端に立体的でユーザーの方向に盛り上がった表現は少ない。厚みのない物体を想定した場合、ハイライトはエッ
WordPressでブログじゃないWebサイトを作るときのいろいろ（サンプル付き）
とても長い記事になってしまいましたが、WordPress を使って、コーポレートサイトのサンプルを作ってみました。WordPress はブログだけじゃなくて、色んな Webサイトが作れますよね！今回は、私が WordPress でサイトを作る時にやっていることをまとめてみました。 今までこのブログの中で、いろいろな WordPress の Tips を書いてきました。でも WordPress を使った Webサイトの作り方そのものは、今まで書いた事がありませんでした。そこで今回は、 WordPress を使ってブログじゃない Webサイトをまるごとひとつ作って、私なりの作り方をまとめてみました。 今回のサンプルサイトでは、WordPress の固定ページ機能はもちろん、カスタム投稿タイプやカスタムタクソノミー（カスタム分類）を使って作っています。 ページを表示する為に使っているテンプレート
[CSS]コンテンツとサイドバーの高さを同じにするスタイルシート
サイドバーがコンテンツの高さと異なる際に、コンテンツと同じ高さのように見せるスタイルシートをwoork upから紹介します。 Really simple CSS trick for equal height columns 仕組みの概要は、コンテンツの右のボーダーを200pxにし、その上にサイドバーを表示して、サイドバーの高さをコンテンツと同じように見せるものです。 HTMLは、コンテンツとサイドバーのdiv要素を内包するdiv要素（wrapper）を配置します。 HTML <textarea name="code" class="html" cols="60" rows="5"> <div id="wrapper"> <div id="maincontent">...</div> <div id="sidebar">...</div> </div> </textarea>
[CSS]サイドバーのボリュームに関係なく背景の高さを揃えるスタイルシート
3カラムレイアウトの左右のサイドバーのコンテンツ量が少なくても、コンテンツと背景が同じ高さになるようにするスタイルシートをLine25から紹介します。 <textarea name="code" class="html" cols="60" rows="5"> <div id="content"> <div class="sidebar primary"><!--Left Sidebar--></div> <div id="main"><!--Main Content--></div> <div class="sidebar secondary"><!--Right Sidebar--></div> </div> </textarea>
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
