Blog
ブログで学ぶUX

カテゴリ: Web制作の記事

CSSで文字色を指定する方法

これも多く使用することがあるデザインです。文字の色を変更したい時は、colorを使用します。記述の仕方などは、背景の色を指定する時と一緒で、とても簡単です。文字色指定のプロパティはcolorなので、colorを使って好きな色を指定するだけです。文字色の指定の場合も、RGB値か色の名前を使用します。文字色の指定をしてみようでは実際に、例を見ていきましょう。body { color: white; ……

投稿日:

CSSで便利な隣接セレクタの使い方

CSSを記述するのに慣れてきた時に覚えるととても便利なものの1つに、隣接セレクタと呼ばれるものがあります。名前の通り、1つの要素に隣接して記述されている要素にスタイルを指定できるものです。+を使用して記述します。隣接セレクタを使ってみようでは実際に、例を見てみましょう。セレクタ+セレクタ{ プロパティ: 値; }上記の様な記述の仕方になります。例えば、h1に隣接するpの文字の色を赤くしたいとしま……

投稿日:

万が一に備えて!スマホのアドレス帳をGoogleで管理する方法

スマートフォンの機種変更の際に、電話帳の移し換えの方法がわからなくて苦労した経験をお持ちの方は多いのではないでしょうか。そんな時、Googleアカウントに電話帳を保存しておけば、面倒な手続きは一切なく、新しいスマホでもメールアドレスを使用できます。また、盗難時やスマホをなくしてしまった時にも便利なので、一度やっておくことをオススメします。Googleアカウントとの同期設定「アカウントの同期」なんて……

投稿日:

偏見をなくした良質なユーザーテストを行うための6つの方法

ゲリラ戦術を用いたユーザーテストに頼っている、小さなプロダクトチームでいつも働いてきました。私たちはこれらのテストのために、最適な数の参加者を募集しようとします。私たちは、ターゲットとなるオーディエンスを反映したグループ層であることを確認します。私たちは、より自然な行動を促し、参加者たちが陥りがちな偏見の影響を減少させる、形式張らないアプローチを利用します。しかし、私たちがほとんど話したことがない……

投稿日:

HTML・CSS・PHPなどのコードへのコメントタグの書き方まとめ

HTML・CSS・PHPなどの各プログラミングコードへのコメントタグの書き方をまとめました。ここで書いたコメントは実際にサイトで表示されるのではなく、プログラミング内だけに表示されるもので、主に自らが書いたコードが何を意味するかなどを分かりやすくしておくために用いられます。HTMLの場合<!-- ここに表示させないコメントを入れます -->HTMLの場合、コメントアウトは「<!-……

投稿日:

CSSセレクタの基本的な使い方

CSSセレクタはスタイルの適用対象を指定するコードです。ここではCSSセレクタ基本的な使い方を紹介していきます。* (すべての要素)* {color:blue;}(*)は全ての要素に対してスタイルを適用することができます。p (要素名)p {color:blue;}要素名により指定した要素に対してスタイルを適用することができます。上記例のようにpのスタイルを決定した場合pにのみ適用されます。&lt……

投稿日:

Photoshopで使える無料のグラデーションパターン6選

Photoshopのテクニックで使いこなすとレベルアップできるのがグラデーションです。2色以上の色が滑らかに変化することで、陰影をつけ、立体感をプラスしたり、空のようなイメージを作ったりなど、表現力がぐっとアップします。また、お気に入りのグラデーション素材をダウンロードして、ボタン作成やデザインの背景などの仕上げに活用することも可能です。今回はそんなグラデーションを使いたい際に便利なグラデーション……

投稿日:

Photoshopで使える無料の継ぎ目のない背景パターン7選

Photoshop、Illustratorで、使いこなすととっても便利な「パターン」機能。パターンを使うと、選択範囲に対して簡単にその場所を柄で塗りつぶすことが出来ます。一度インストールしておけばいつでも使えてとっても便利です。なかなか使い方がわからず活用できていない方も多いようですが、継ぎ目のない背景パターンを作れるので、こちらを知ってあれこれダウンロードしておくと、時短&デザインのクオリティア……

投稿日:

Photoshopの「境界線を調整」を使った画像の切り抜き方法

Photoshopでは画像の切り抜きが可能です。写真ももちろん可能です。現行のバージョン以前はポチポチと地道に切り抜いていましたが、Photoshop CS5から、「境界線を調整」機能が新機能として実装されました。こちらがとても便利で、以前より簡単に写真の物体や人物の切り抜きが可能となりました。今回は「境界線を調整」昨日を使って写真の切り抜きをしてみましょう。「クイック選択」ツールで切り抜き今回は……

投稿日:

【range】Pythonで連続したリストを生成する方法

スクリプトを作成するときなどで数値が連続したリストを扱う場合がよくあります。range()を使えば簡単にそのようなリストを生成することができます。range()で数列のリストを作成するrangeの書式は以下の2つがあります。range( 終了位置 )range( 開始位置, 終了位置 [ , 間隔 ] )range()は生成したリストを返します。例えば、0〜9までの数列を作成したいときは以下のよう……

投稿日: