WordPress3.4に最適化された、レスポンシブデザイン対応のWordPressのテーマファイル -The BoilerWordPress3.4に最適化され、デスクトップ・スマートフォンなどのレスポンシブデザインに対応した、カスタマイズに優れたHTML5+CSS3で作成されたWordPressのテーマファイルを紹介します。
Vol.1 ディレクターなら最低限知っておきたい色彩設計 - 機会損失を防ぐ！ECサイトの色彩設計 - Web Directors Studio
今回から3回にわたり、ECサイトの色選びについて学んでいきましょう。ECサイトにおいては、何よりも重要なのはその商品を売ることです。そのためには正しい色を使って、伝えたい情報を確実に伝達させ、機会損失を減らす必要があります。 自社の商品を販売しているのでなければ、多くの商品は競合サイトでも販売されているはずです。単にサイトのデザインや配色がよいだけで売れるわけでないことは、実際にECサイトを制作・運用したことのある人であれば、既に理解されていることでしょう。 では美しい色彩が必要ないかと言われるとそうではありません。美しいかどうかは主観によりますが、その商材を販売するのに適した配色である必要があります。また訪問者にサイトを印象づけることで、再訪しやすくすることも重要ですし、ユーザビリティに配慮してストレスを感じさせることなく購入してもらうための流れを作る必要もあります。 例は同じ写真を利用
「KPI」、「KGI」とは？〜今更聞けないマーケティング用語をおさらい！
日頃の業務で何気なく使っている専門用語。でもその言葉の意味、ちゃんと理解して使っていますか？ ソーシャルメディアマーケティングラボが、なんとなく分かっているつもりでも、実はよくわからなくて「もやもや」している？！今さら人に聞くのはちょっと恥ずかしい、ウェブマーケティング用語を分かりやすく解説します。 用語説明 KPI（Key Performance Indicator）重要業績評価指標 KGI（Key Goal Indicator）重要目標達成指標 ビジネスにおいては、各組織レベルで最終的な「目標」を定め、その目標を具体的に実現するための「手段」を策定し、その手段がきちんと遂行されているかどうかを定量的に測定する「指標」を決めることが必要となる。KGI（重要目標達成指標）は、目標（ゴール）に対する達成度合いを定量的に表すものであり、KPI（重要業績評価指標）は目標達成プロセスの実施状況を計
有名企業・団体のレスポンシブWebデザイン事例－Microsoft、NTT DATAなど。
海外ではレスポンシブWebデザインがいち早く企業や団体のサイトに取り入れられ、すでにたくさんの事例が上がっています。今回はそんな海外の数ある事例の中で、有名企業・団体のレスポンシブWebデザイン事例についてご紹介したいと思います。日本も2012年内のうちに、多くの有名企業がレスポンシブWebデザインによるサイト構築を進めるのではないかと感じています。 NTT DATA NTT DATA海外向けコーポレートサイト。とても美しいレスポンシブWebデザインの事例です。単にデザインだけの美しいだけでなく、350ページ(※注：ツールを使用して確認)を超える全ページを、ストレスなく閲覧できる設計になっています。特に、ニュースコンテンツもうまくレスポンシブ対応されている点や、スマートフォンで利用した場合の導線の引き方がスマートでした。(スマートフォンではシンプルなナビゲーションになっており、扉ページを挟
Google がお勧めするスマートフォンに最適化されたウェブサイトの構築方法
+1 ボタン 2 AMP 11 API 3 App Indexing 8 CAPTCHA 1 Chrome 2 First Click Free 1 Google アシスタント 1 Google ニュース 1 Google プレイス 2 Javascript 1 Lighthouse 4 Merchant Center 8 NoHacked 4 PageSpeed Insights 1 reCAPTCHA v3 1 Search Console 101 speed 1 イベント 25 ウェブマスターガイドライン 57 ウェブマスタークイズ 2 ウェブマスターツール 83 ウェブマスターフォーラム 10 オートコンプリート 1 お知らせ 69 クロールとインデックス 75 サイトクリニック 4 サイトマップ 15 しごと検索 1 スマートフォン 11 セーフブラウジング 5 セキュリティ 1
最低限覚えておきたいWEB配色の基本２大原理と６つの配色パターン
ユーザーに届ける価値を徹底的に追求する マーケティングを提供します © Copyright 2022 バズ部. All rights reserved. WEBサイトのデザインは、誰もが頭を悩ませる部分だ。 「どういう配色なら良い印象を持ってもらうことができるのか？」「どのレイアウトならコンバージョンが上がるのか？」など、様々なところまで考えを張り巡らさなければいけないからだ。 そこで本日は、The Art of Color Coordination というインフォグラフィックをご紹介する。これを見れば、WEB配色の基本の２大原理と、今すぐに使える６つの配色パターンがすぐに分かる。 そして、初心者でも、統一感のある配色のWEBサイトを作るための大きな助けとなるはずだ。 WEB配色の２大原理と６つの配色パターン画像を拡大して表示する ※追記：インフォグラフィックの最後のクレジットの部分が途切
タイムラインのサイズはこれで完璧！新Facebookページの写真サイズまとめ | ソーシャルメディア集客ラボ
ソーシャルメディア集客ラボの伏田です。 3/31に変更になるFacebookページで一番変わるのは、Facebookページの写真のサイズです。ユーザーからは、タイムラインの1ページしか見られないデザインのため、サイズにあった写真をアップしていくことが重要です。 まずは、サイズを確認してから新Facebookページの移行に対応していきましょう。今回はより理解しやすいように、StarbucksのFacebookページをもとに解説していきます。 新Facebookページのサイズ一覧 新Facebookページで表示される写真のサイズをまとめました。以下にまとめたのは表示される最大サイズなので、特に投稿では大きめの写真をアップするように心がけましょう。 １．カバー写真 851px × 315px カバー写真Facebookページの一番上に表示される写真です。最も目立つ場所に表示されるため、Faceb
Webデザインの評価項目をつくる
Webデザインの評価項目というのを、ディレクターやデザイナーの方々はつくっているでしょうか？ 評価項目があると、デザイナーやディレクターだけでなく、クライアントにとってもデザインの基準がわかりやすくなり、目標地点が明確になります。 今までつくったことがなかったという方は、この機会につくってみてはどうでしょうか。 改めて、Webデザインの評価項目をつくるメリットです。 デザイナー、ディレクター、クライアントにとって、デザインを評価する共通認識を持つことができ、三者間で認識のブレが少なくなる デザインの優先すべき項目（もっと企業の色を出したい、など）がわかりやすくなり、それをデザインに反映させることができる デザイナーは、すでに満たされている要素にそれ以上時間をかけることがなくなり、足りない要素に注力できる デザインの評価項目とデザインエレメント一覧表 私はWebデザインの評価項目を、以下のよ
良いデザインって？技術を学ぶ前に知っておきたいデザイン・レイアウトの基本的なこと
デザイナーになりたいって思った時にPhotoshopやIllustrator、cssやhtmlを勉強しなきゃな〜><て考えると思うのですが、技術的なことを学ぶ前にまずデザインが出来なきゃ始まりませんよね。 センス？かっこ良さ？奇麗さ？良いデザインにしたいけど、何をしたらいいかわからない。そんな時に何を考えたら良いのかデザインの基本をまとめてみようと思います XD はじめに 良いデザインって？ 最良の方法？ 1.コンテンツの目的 2.ターゲット 3.これらを組み合わせた例 デザインの基本 1.書体について 2.ジャンプ率 3.ホワイトスペースを生かす >ホワイトスペースで情報を分割する >ホワイトスペースで囲む >ホワイトスペースにあえてはみ出す 最後に はじめに デザインという言葉を聞くと、かっこいい、かわいい、おしゃれ、きれい、などと感覚的なものを思い浮かべる方が多いのではないでしょうか
WordPressのトップページを雑誌や新聞のような段組にする方法
WordPressのブログは一般的に記事タイトルと記事の概要が単純に縦に並ぶだけですが、jQuery Masonry という jQuery プラグインを使用すると、このブログのトップページのように雑誌や新聞のような段組で記事一覧を並べることができます。 jQuery Masonry は WordPress 用に作られたわけではありませんが、WordPress テーマに組み込んでトップページ等で使用することができます。 ただ、公式のドキュメント通りに JavaScript を書いただけでは WordPress テーマではうまく動かないので、やり方をここにまとめておきます。 ここでは、WordPress 3.3 のデフォルトテーマ「TwentyEleven」をベースに解説します。 準備 まず jQuery Masonry 公式サイト のページ中央にある「Download the script
Webサイトにおけるユーザービリティの復習をしたので、よくチェックするポイントをリスト化した
ユーザービリティに関して少し復習したので メモっておきます。初心忘れるべからずという 事で・・・Webサイトは基本的にユーザビリティ を考慮したレイアウトやコンテンツが理想です。 もちろんケースバイケースではありますが、 これは全共通して言える、という事を忘れない ようにメモ書き。 というわけで、申し訳ないですけど目新しい事は何一つ無い内容です。 そもそもこのブログ自体ユーザビリティを考慮した設計とは言えません（「やっちゃダメなこと」もしています）ので全然説得力ない感じです。 いろいろとテスト&エラーをして行きたいのでご了承下さい。 はじめに正しいユーザビリティはコンテンツによってケースバイケースだと思いますが基本的には僕はヤコブ・ニールセンの考えに従っています。 全ての項目は「すべてが正しい」ものではありません。100のサイトがあれば100通りのユーザビリティが考えられるはずです。場合に
WordPressを使ってWeb制作をする為の手順リスト・【改正版】+α
以前書いたWordPressでWeb制作する際 の手順リストが少し古い情報込みだったり するので改正版を書きます。先日、WPも 3.2のリリースを迎えましたので、手順リスト もアップデートすることにしました。多少考え が変わっているので内容も少し変更有ります。 以前のリストの改正版です。加えて他の情報も一緒に載せておく事にしました。 【2011・07・11】 WordPressインストールサーバーを用意（PHP5.2.4 以上 / MySQL5.0 以上）DBを作成WordPressをダウンロードし、解凍wp-config-sampleをwp-configにリネームし、内容をDBに合わせて変更プリフィクス（接頭語）を変更する（wp_→foodblog_）FTPソフト等でサーバーにアップロードサイト名やパスワード、IDを決める（adminは避ける）作成したユーザー名でログインダッシュボードの
webデザインにおける視線誘導のおはなし | 07design.blog
こんにちは。今回はレイアウトの記事を書きます。「グーテンベルク・ダイヤグラム」という言葉をご存じでしょうか。 なんだかすごく中二心をくすぐられる言葉ですね。「グーテンベルク・ダイヤグラム」とは均等に配置された同質の情報を見る際の、・・・こんにちは。今回はレイアウトの記事を書きます。 「グーテンベルク・ダイヤグラム」という言葉をご存じでしょうか。 なんだかすごく中二心をくすぐられる言葉ですね。 「グーテンベルク・ダイヤグラム」とは均等に配置された同質の情報を見る際の、一般的な視線の流れのパターンを表した図式のことです。 簡単に言うと「人間の目は左上から右下方向へ、チラチラしながら遷移する」というものです。 こういった視線の流れのパターンは、エディトリアルデザインなどでは当たり前に使われている技法・考え方らしいです。 テキストをレイアウトする場合には、左上・右下に重要なコンテンツを配置す
WEB標準デザイン、はじめの一歩 ～デザインからマークアップまで～
第6回 岡山WEBクリエイターズのセッション1で発表したスライド内容を全文掲載。第6回 岡山WEBクリエイターズ セッション1『WEB標準デザイン、はじめの一歩 ～デザインからマークアップまで～』 岡山WEBクリエイターズ勉強会でお話した内容を、スライドとともに全文掲載しています。 テキストはあくまで原稿そのままですので、実際に喋った内容とは幾分異なる場合があります。 スライドのPDFをダウンロード 講師概要 SKPRODUCT代表。 デザイン、コーディング、PHPによるシステム構築、ActionScriptを使用したFlashなど、WEB制作全般を行うWEBアーキテクトです。 岡山の大手企業・学校などを中心にWEBサイトと独自に開発したCMSフレームワーク『SEED』の提供を行っています。 本日は、WEB標準デザインはじめの一歩です。 WEB標準というと、技術的なことを想像される方
オリジナルコンテンツを加えたFacebookページ（旧ファンページ）を作ったので、手順をメモ
FBMLが廃止されてから一度も作って なかったFacebookページ（ファンページ） ですが、土日に少し時間が出来たので 改めてこのブログのFacebookページを 作ってみました。以前よりも面倒なようで すが、見方によっては手軽になった印象 ですね。 前回はデモ的に作りましたので完全放置でしたが、今回は割と真面目に運営を考えています。飽きるまでしっかり管理してみるつもりです。 尚、今回のFacebookページの作成にかけた時間はおよそ6時間です。制作プロセスを書いていきますので、少しでも参考になれば幸いです。 一応見せられるレベル、程度のものですけどｗ折角なのでコンテンツを1から2つほど作ってみました。1つは目次的に上記のようなページをリキッドレイアウトでコンパクトに配置。特に珍しいもんでもないです。 2つ目のコンテンツはこのブログのサイドバーにあるタブコンテンツっぽいものを作りました。
ウェブサイトのユーザビリティ、とっても大切な20のポイント
ウェブサイトに最も大切なのは、ユーザービリティです。 どんなにかっこいいデザインでも、どんなに重要なコンテンツを掲載しても、それを使うことができないのであれば意味はありません。 ウェブサイトのユーザビリティを向上する20のポイントを紹介します。 The Ultimate 20 Usability Tips for Your Website [ad#ad-2] 下記は各ポイントを意訳したものです。 最新の情報を中心にウェブサイトのデザインを組み立てる もし新しいコンテンツをあまりリリースしないのであれば、スタティックなコンテンツに重点をおいたデザインにします。更新頻度が高いようであれば、ブログ風に新着が目立つデザインにします。 ロゴは左上、メニューは右か下 ロゴは左上に配置し、メニューは右か下に配置します。ロゴはクリックして、サイトのトップページにリンクするようにします。このことはたいていの
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
国内のレスポンシブWebデザインに対応したWebサイト
Loading...
taikikawakami.tk
http://designaholic.cc/2011/03/webweb21.html
