自宅サロンママのためのネット集客術

女性個人事業主専門 WordPressで作るホームページ作成講座

アメブロカスタマイズに必須!色に関する便利ツール

5108 views
約 4 分
ホームページやブログをカスタマイズするときに、必要となってくるのが色の指定方法。 Web上で色ってどんな風に表現してるの? どうやって指定するの? 色の組み合わせがうまくいかない・・   そんな時に、 使える便利ツールのご紹介です。

Webカラーコードとは?

私たちが画用紙に赤で絵を描こうと思った時、 赤い色鉛筆や、クレヨン、絵の具を使ってぐるぐると描きます。 パソコン上で赤い絵を描こうとしたら、 ”ここは赤で描く”という命令をかけます。 例えば、 アメブロのサイドメニューのタイトル文字がこのように黒で書かれている時は、 黒字   実際は、こんなふうに指定されています。 .skinMenuTitle{ color:#333333; } 『サイドメニューのタイトル文字は黒にしてね』って書いてあります。 この#333333ってのが、カラーコードというものです。   なので、 .skinMenuTitle{ color: #0000ff; } と、書き換えると・・ 青い文字 となります。 この辺りの細かいやり方は、 アメブロでサイドバーや記事タイトルの文字と下線の色を変える方法 をご覧ください。   これらのWeb上の色に関しての設定をする際に、使える便利ツールをご紹介します。  

カラーコードを調べるには?

カラーコード一覧は、Web上にたくさんあります。 原色大辞典 Webカラーコード大辞典 タブで、和色や洋色、パステルカラーの一覧に切り替えることができます。   カラーコード一覧表   セーフモード マウスポインターをコードの上に重ねると、左右の背景に色が広がります。

配色を調べるには?

この色に合う色は、どんな色かしら? 同じサイト内に複数の色を使う時には、配色をうまくすると見栄えが全然違います。   そんな時の便利ツール! coolors ※Login画面が出る場合もありますが、そのままキャンセルしていると消えます。   coolors   スペースキーを押すだけで、永遠と配色パターンを表示してくれます。 カラーコードの上をクリックすると、選択できるのでコピーして使えます。カラー好きにはたまらず、気づいたら何十回もスペースキーを押し続けていた・・なんてことも。  

coolorsの使い方

例えば、1色だけ使いたい色が決まっていて、それに合う色はどれかなーって探したい時。 指定したい場所のカラーコードの上をクリックして、コードを入力(コード表からコピペ)します。 coolorsマニュアル   鍵のマークをクリックして、Lockします。 coolorsマニュアル2   キーボードのスペースキーを押すと、様々な配色が表示されます。 coolors-manual3   表示されたカラーコードをクリックすると選択されるので、コピーしてCSSに貼り付けて使用します。  

その他の便利ツール

  色見本と配色サイト Color-Sample.com color-sample 上のバーに表示されている色を選ぶと、 ・flickr(写真共有サービス) ・その色を使ったWebサイト(カラーコード付) ・カラー一覧 →さらにこの中の色をクリックすると、配色見本がだだだーーっと出てきます。   『配色見本』をクリックすると、サンプルが表示されます。 配色見本 アメブロカスタマイズを自分でやりたい!という方は、こんなサイトを利用して、是非素敵なブログを作ってくださいね。

東京と大阪でSEOの基本が学べます

東京と大阪でSEOの基本が学べます

【女性個人事業主限定】

東京と大阪で、SEOの基本が学べる期間限定講座を行います。

今後もネットで集客していくなら知らないと絶対に損してしまう、SEO対策の基本をわかりやすく、女性個人事業主向けにアレンジした他では学べない特別な内容です。モヤモヤしていたSEOの謎がスッキリ解決し、今すぐできることがわかります。

ブログだけの集客に限界を感じているという方へ

いまさら人に聞けない【ネット集客の基本】をまとめたPDF資料が今すぐダウンロードできます!

  • 検索にひっかかるってどういうこと?
  • WordPressって何?
  • SNSってやったほうがいいの?
  • メルマガって何のためにやるの?
  • LINE@って必要?
    ・・・他

一般的なネット集客のノウハウをおうちサロン・女性個人事業主の方向けにアレンジしてまとめました。

資料の詳細を見てみる

この記事を書いた人

PC講師20年、おうちサロン歴6年。
次男の障害をきっかけにママ支援をするも、SEOの知識の無さから本当に必要な人に情報が届かないという、もどかしさを経験。それをきっかけにWordPress、SEOを本格的に学び、同じ悩みを持つ女性個人事業主の方に向けて、情報発信をしています。

詳しいプロフィールはこちら