Google Bloggerのテンプレートを自作する
Google Bloggerでは、様々なデザインのテンプレートが予め用意されていますが、自分独自のデザインを使いたいって思ったことないでしょうか。本記事では、僕が試行錯誤しながらテンプレートを作成する過程で学んだことをまとめます。 テンプレートとは 簡単にいうと雛形。ページによって異なる文章などの内容は空白にしておき、全てのページに共通なものだけを記述したもの。ページのレイアウトとかデザインとかブログのタイトル画像とかコピーライトとかを記述します。各ページの記事などは、システムがテンプレートの指定した部分に後で当てはめて使います。こうすることで、ページを作る度に、例えば、文章だけを書けば、いつも同じデザインやレイアウトを自動で施して表示されて、便利になります。 HTML(XML)を使う Google Bloggerでテンプレートを作成するには、HTML(本当はXML)を書けなければなりませ
WEB色見本 原色大辞典 - HTMLカラーコード
原色大辞典とは 原色大辞典は1997年にオープンしたネットの色見本サイトです。 9種類の色見本と色に関する各種サービスから構成されています。 色見本コンテンツは ブラウザで定義されているHTMLカラーネーム、 日本の伝統色、 世界の伝統色、 Webセーフカラー、 パステルカラー、 ビビッドカラー、 モノトーン、 地下鉄のシンボルカラー、 国鉄制定の塗装色 の9つから構成され、特に日本の伝統色は古来伝わる先人の色彩感覚を現代に伝えるものとして多くの方々から支持をいただいています。 文字列と背景色の組み合わせを試せる配色大辞典、 規則性のある組み合わせから色を選べる配色パターン。 色見本の他にも、今日のラッキーカラー、 コトバから色を解析して調合する成分解析、 ストライプを生成するストライプメーカー、 グラデーションを生成するグラデーションメーカー、 あなたの好きな色と色を調合する色調合、 サ
指定したキーワードをカラーコードに変換してくれるサイト「Colorize」 | ライフハッカー・ジャパン
「Colorize」は指定したキーワードをカラーコードに変換してくれるサイトです。「Sky」「Sand」などで検索するとその言葉で画像検索をし、画像検索の結果から平均した色をカラーコードで教えてくれます。 以下に使ってみた様子を載せておきます。 まずColorizeへアクセスしましょう。「lifehacker」で検索してみました。 しばらく解析が終わるとこのようにカラーコードが表示されます。「lifehacker」の色といえば「#91A66A」ということですね。Webデザインをしている際に、漠然としたサイトのイメージから色を決めたいときに活用できそうです。空って何色だろう、といった疑問に答えてくれるサイトです。ぜひご活用ください。 Colorize （カメきち）
ビジネス用の素材が見つかるサイト、商用利用可のみ7サイト集めました。 | Yakutatsu - オンライン上の調査ツールを用いて競合分析に必要な情報収集をワンストップで提供します
Yakutatsuのブログです。競合調査事例や競合調査に役立つ情報を発信しています 競合調査事例,調査ツール,SEO関連の情報,Webマーケティング関連の情報をメインでご紹介しています Home / ブログ Posted 2013年5月29日 by miyauchi & filed under まとめ記事. 役に立つ情報をお届けするやくたつブログです。 ブログの素材や画像を作成する際に写真素材やイラスト素材を探すのは、慣れていないと意外と手間がかかるものです。ここでは、ビジネス用の素材が見つかるサイトをご紹介します。 ①名入れギフト.comさん 名入れギフト.comです。Flickrからブログ用の写真素材が見つかるサイトです。ソースコードをコピペするだけです。名入れギフト.comはこちら ※2013年6月21日に追加 名入れギフト.comさんのサービスで「ブログ用の写真検索さん」です。Am
Whatcolor
Welcome home Here you can save a list of your favorite colors. usage: http://whatcolor.heroku.com/cdc (short notation) http://whatcolor.heroku.com/ccddcc (extended notation) http://whatcolor.heroku.com/009246/fff/ce2b46 (italian flag) http://whatcolor.heroku.com/c/00f (complementary colors) http://whatcolor.heroku.com/c/00f/3 (triad colors) http://whatcolor.heroku.com/a/00f (analogous colors) http
デザインの要素と原則
2017年6月29日 Webデザイン 今回はデザインの基礎をお勉強しましょう！デザインは複数の要素（エレメント）と原則（プリンシプル）から成り立っています。それらを簡単に説明するとともに、要素と原則を生かしたWebサイトを一諸に紹介します。私は「デザインセンスは才能」とは考えていません。デザインセンスはそれらの要素をどう組み合わせるか、という閃きとその引き出しの多さによるものだと思います。ぜひ参考にしてみてください！ ↑私が10年以上利用している会計ソフト！ デザインの要素（エレメント）と原則（プリンシプル）は全てのビジュアルデザインの基礎と言われています。要素はデザインの「表現手段」を形成し、原則は「構造的特徴」を構成します。デザインにおける要素と原則の認識は、視覚構成をすることにおいての最初のステップ。Webデザイン、グラフィックデザイン、プロダクトデザインなど、すべてのビジュアルデザ
Themeleon :: Twitter Profile Designer by COLOURlovers
Test tweet! Link example. @atreplyexample. This is where your first tweet will be! Don't worry, this will not appear on your timeline.
ブラウザサイズテスト
+ or arrow up to zoom in - or arrow down to zoom out space to cycle through sizes f to toggle fluff If you like Testsize.com, please also check out Time.is, for the exact time, time in London, time in Paris, time in New York, time in Sydney, or the time anywhere in the world! There is also a JavaScript clock widget which you can put on your own website, a meeting plan
Browsershots
No active screenshot factories. Please try again later. What is Browsershots? Browsershots makes screenshots of your web design in different operating systems and browsers. It is a free open-source online web application providing developers a convenient way to test their website's browser compatibility in one place. When you submit your web address, it will be added to the job queue. A number of
フォントサイズチェッカー
スタイルシートでフォントサイズを指定したときに、どのくらいの大きさになるのかを表示。 ブラウザの文字サイズ設定は「中」「標準」を推奨。 IE・Firefoxなら フォントサイズ100％は、 フォントサイズ16pxと同じ。 フォントサイズ12pxは、 フォントサイズ75％と同じ。 フォントサイズ50% フォントサイズ51% フォントサイズ52% フォントサイズ53% フォントサイズ54% フォントサイズ55% フォントサイズ56% フォントサイズ57% フォントサイズ58% フォントサイズ59% フォントサイズ60% フォントサイズ61% フォントサイズ62% フォントサイズ63% フォントサイズ64% フォントサイズ65% フォントサイズ66% フォントサイズ67% フォントサイズ68% フォントサイズ69% フォントサイズ70% フォントサイズ71% フォントサイズ72% フォントサイズ
色の組み合わせチェック - 読みやすい前景色と背景色
誰にも読みやすいコンテンツとするためには、文字色と背景色のコントラストをしっかり確保しなければなりません。これを客観的にチェックするため、色の明るさの差などを計算する仕組みを用意してみました。 色の組み合わせ検証 テストの手法 コントラストの計算 色覚偏位のシミュレーション 当サイトが独自に加えたコントラストの段階評価 コントラストと読みやすさの相関関係 色の組み合わせ検証 検証してみたい文字色と背景色の組み合わせを入力してみてください。色の指定には3桁もしくは6桁の16進数カラーコード、あるいは色名（CSS2の色名＋SVGの色名、計147色）およびrgb()の表現が使えます（初期値は、読みにくい例が入っています）。また、入力欄左ボックスから216色のパレットを呼び出して入力することもできます。文字色2、3は、複数の文字色の組み合わせを表示するためのオプションで、コントラストなどの計算は行
Japanese Traditional Colors
桜色 (さくらいろ) # 薄桜 (うすざくら) # 桜鼠 (さくらねず) # 鴇鼠 (ときねず) # 虹色 (にじいろ) # 珊瑚色 (さんごいろ) # 一斤染 (いっこんぞめ) # 宍色 (ししいろ) # 紅梅色 (こうばいいろ) # 薄紅 (うすべに) # 甚三紅 (じんざもみ) # 桃色 (ももいろ) # 鴇色 (ときいろ) # 撫子色 (なでしこいろ) # 灰梅 (はいうめ) # 灰桜 (はいざくら) # 淡紅藤 (あわべにふじ) # 石竹色 (せきちくいろ) # 薄紅梅 (うすこうばい) # 桃花色 (ももはないろ) # 水柿 (みずがき) # ときがら茶 (ときがらちゃ) # 退紅 (あらぞめ) # 薄柿 (うすがき) # 長春色 (ちょうしゅんいろ) # 梅鼠 (うめねず) # 鴇浅葱 (ときあさぎ) # 梅染 (うめぞめ) # 蘇芳香 (すおうこう) # 浅蘇芳 (あさすお
よりよいWebデザインにするための配色のセオリー :: Love & Design ::
第一印象を決めてしまうほど、色はとても大切な役割を持っています。 Webデザインのイメージを決める上で、色は最も重要な要素といっても過言ではありません。 配色には様々なルールがありますが、Webデザインの配色は好みやセンスに頼らず、目的や用途に合わせて「調和」と「役割」を持つ効果的な配色をしたいものですね。 そこでWebデザインでも“ 無駄にならない ”色彩心理や色の視覚効果など、配色のセオリーをまとめました。 では、さっそく配色の基本になる「色相」「明度」「彩度」「トーン」それぞれの色彩心理や視覚効果を紹介します。 色相差で配色 【イメージ効果】 暖かい⇔冷たい 動的な⇔静的な 情熱的な⇔理知的な → 色相が違う色同士を組み合わせると、色味の差が大きく感じられます。 背景色の心理補色（黄⇔青 赤⇔緑）の方向に色がずれ、左側の中のオレンジは青みを帯び、右は赤みを帯びて見えます。（色相対比）
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Dynamic Drive online tools: Button Maker
Repper -> create your own patterns!
This is what I saw - P.J. Onori
1キロバイトの素材屋さん
みんなで作るWEBデザイン参考集「ブックマ！」
Color Slider - 配色/色見本
http://www.onlinebannergenerator.com/