タグ

webに関するastronaughtsのブックマーク (28)

  • GoogleはレスポンシブWebデザインを推奨 - F.Ko-Jiの「一秒後は未来」

    PCサイトとスマホ向けサイトの表示分け方法にはいくつかあると思いますが、Official Google Webmaster Central Blogによると、GoogleはレスポンシブWebデザインの利用を推奨しているようです。 » Official Google Webmaster Central Blog: Recommendations for building smartphone-optimized websites そのうち日語訳も出ると思うのでここではざっくりと。 レスポンシブWebデザインを使うと、「すべてのデバイスに対して同じURLとHTMLを提示し、見た目はCSSだけで切り替える」ということが可能になります。 Googleは「Building Smartphone-Optimized Websites – Webmasters — Google Developers」

    GoogleはレスポンシブWebデザインを推奨 - F.Ko-Jiの「一秒後は未来」
  • 「Webサイト改善は図を描きなさい!」 〜 SiteCatalyst達人から教わった分析フレームワーク-Six Apart ブログ|オウンドメディア運営者のための実践的情報とコミュニティ

    TOP > 「Webサイト改善は図を描きなさい!」 〜 SiteCatalyst達人から教わった分析フレームワーク こんにちは。マーケティング担当の伊藤大地です。 先日、米AdobeでWeb解析ツール「SiteCatalyst」のプロダクトマネージャープログラムマネージャー(初出時、役職を誤って表記しておりました。お詫びし、訂正いたします)を務めていらっしゃる清水誠さんが、一時帰国された折に弊社に遊びに来てくださいました。たっぷり2時間、最新Webマーケティング事情やWeb解析についてお話を伺いした中から、WebのKPI測定・改善サイクルとそのノウハウについて、エッセンスをお伝えしたいと思います。 清水さんが提唱されているWeb改善のフレームワーク「コンセプトダイアグラム」という手法は、主に3つのプロセスから成り立っています。 ユーザー視点でサイトを図解し、コンセプトを明確にする サイトの

    「Webサイト改善は図を描きなさい!」 〜 SiteCatalyst達人から教わった分析フレームワーク-Six Apart ブログ|オウンドメディア運営者のための実践的情報とコミュニティ
  • webデザインにおける視線誘導のおはなし | 07design.blog

    こんにちは。今回はレイアウトの記事を書きます。「グーテンベルク・ダイヤグラム」という言葉をご存じでしょうか。 なんだかすごく中二心をくすぐられる言葉ですね。「グーテンベルク・ダイヤグラム」とは均等に配置された同質の情報を見る際の、・・・こんにちは。今回はレイアウトの記事を書きます。 「グーテンベルク・ダイヤグラム」という言葉をご存じでしょうか。 なんだかすごく中二心をくすぐられる言葉ですね。 「グーテンベルク・ダイヤグラム」とは均等に配置された同質の情報を見る際の、一般的な視線の流れのパターンを表した図式のことです。 簡単に言うと「人間の目は左上から右下方向へ、チラチラしながら遷移する」というものです。 こういった視線の流れのパターンは、エディトリアルデザインなどでは当たり前に使われている技法・考え方らしいです。 テキストをレイアウトする場合には、左上・右下に重要なコンテンツを配置す

  • Webサイト制作の一連の流れをまとめてみました

    Webサイト制作の一連の流れをまとめてみました。クライアント向けにまとめたものを少し手直ししてのせています。新人Web担当者さんや、新人ディレクターさんの参考になるかなと。 なるべく難しい言葉を使わず、理解しやすいよう平易な言葉で書いております。 ※流れや手順は制作会社によって違うのですが、概要はつかめるかなと思います。 目次と流れ 1. サイトのコンセプトを考える 2. 競合他社からクライアントのお店や商品を選んでもらうためのポイント(強み)を整理する 3. そのサイトで一番伝えたい内容を決める 4. お客さんが必要とする3以外の情報や、クライアントの伝えたい情報をまとめる 5. サイト更新は誰がするのかを決める 6. 想定使用デバイス(PCやスマートフォンなど)を決める 7. サイトの周知・宣伝方法を考える 8. ページの設計図をつくる 9. サイト制作にかかわる必要な素材を準備する

    Webサイト制作の一連の流れをまとめてみました
  • ウェブデザイナーは知っておきたい、ページレイアウトの代表的な10のパターン

    実際のウェブサイトを例に、ずっと廃れないであろうページレイアウトの10のパターンとその特徴を紹介します。 10 Evergreen Website Layouts (that will never go out of style) [ad#ad-2] 下記は各ポイントを意訳したものです。 2カラム、広いヘッダ 3カラム、広いヘッダ フォーボックス 不確定なグリッド 大きいスクリーンショット シングルカラム 打ち出し画像 固定サイドバー グリッドベースのギャラリー マガジンスタイル [ad#ad-2] 2カラム、広いヘッダ これは最も普通のレイアウトと言ってもよいでしょう。広いヘッダが上部にあり、960pxを2カラムにし、一つは広く、もう一つは狭くしたものです。狭い方はサイドバーでナビゲーションなどが設置してあります。 慣習的に、ブログでは広い方の右にナビゲーションを置き、スタティックなサイ

  • WEB制作に役立つジェネレーターの数々!ツールまとめサイト含め最近のお勧めを一挙ご紹介! | バンクーバーのうぇぶ屋

    皆さんはWEB制作の過程で何かジェネレーターの類とか使ってますか?使う派使わない派と別れるところかもしれませんが、僕はかなりヘビーに使う派。それも一個のジェネレーターに留まったことはほぼ無く、毎月、下手すりゃ毎週のように新しいジェネレーター試しては便利そうなら周りと共有してといったことを繰り返してきました。 飽きっぽいと言えば飽きっぽい、他にももっと良いのあるんじゃないかとあっちへ行き、もっと良いのあるよと言われればそっちへ行き、こっちの方がおいしいよと言われればホイホイ試してみる・・・・・なんか駄目な人間みたいですが気にしない方向で行きます! というわけで、僕が最近使ってみたり、教えてもらったりしたジェネレーター関連。ボチボチごちゃついて来たのと、このブログでまだ紹介してない物も色々あったし、2012年5月現在使っているジェネレーターの類を一度振り返りながらまとめてみようと思います! 良

    WEB制作に役立つジェネレーターの数々!ツールまとめサイト含め最近のお勧めを一挙ご紹介! | バンクーバーのうぇぶ屋
  • Web fonts

    Commercial fonts or free fonts?, this is a big dilemma that afflicts many designers as they find difficult to decide between beautiful but expensive fonts such as Helvetica or Futura and free fonts like the ones featured on Google Web Fonts, which also have a really nice design but will never be like the originals. This post more than being an extensive article where we discuss the benefits of fre

  • ディレクターが指摘すべきデザインの注意ポイント10個

    ずいぶん久しぶりの投稿になってしまいました。申し訳ない。 今回はタイトルの通り、ワイヤー上がった!デザイン依頼した!で上がってきたデザイン案(もしくはモックアップ)を見て、その段階でディレクターが何を「確認」すればいいのか?という内容についてです。 もちろん経験を積む。もしくは自分自身でデザイナーも経験するなどの機会に恵まれれば大丈夫なんですが、僕みたいに「いきなりWebディレクターという肩書きを与えられてしまった人」は、デザインの何を確認すれば良いのか分からなくなってしまうケースも多いんじゃないかな?と思って書いてみました。 実際にはマークアップ後まで影響してくるので、もっともっと項目は伸びると思うのですが、ひとまず僕が注意して見ているポイントを10個ピックしています。 色数を使いすぎていないか あれもこれも!と欲張りすぎて、結局なにが「一番強調したいのか」が分からなくなってしまっている

    ディレクターが指摘すべきデザインの注意ポイント10個
  • Google Safety Center - Stay Safer Online

    search. email. watch. store. share. browse. message. ask. meet. search. search. email. watch. store. share. browse. message. ask. meet. search. search. search. email. email. watch. watch. store. store. share. share. browse. browse. message. message. ask. ask. meet. meet. search. search. search. email. watch. store. share. browse. message. ask. meet. search.

    Google Safety Center - Stay Safer Online
    astronaughts
    astronaughts 2012/05/18
    Google さんからウェブに関するセキュリテイ的なこと
  • 素人とは違う、Webプロフェッショナルの仕事としてのWebコンテンツ開発を考えてみた | イベント・セミナー

    コンテンツの重要性は、Webの漆明期からうたわれている。しかし、これは特別な視点だというわけではない。書籍・テレビをはじめとしたメディアでは当たり前のことである。 それでは何がWeb特有なのだろうか。改めて「コンテンツは王様」だと言われている理由とは、何なのだろうか。 Webコンテンツがもつ2つの側面Webにおけるコンテンツ開発は、大きく次の2つに分類できる 「ヒューマン・リーダブル(Human Readable)」であること「マシン・リーダブル(Machine Readable)」であること1つ目の「ヒューマン・リーダブル」とは、魅力的な写真、もっと読みたくなるような文章、理解しやすいように整理された情報など、そのコンテンツを「人」が視覚・聴覚によって理解できるかどうかである。 書籍やTVなど従来の媒体でもヒューマン・リーダブルであることが良いコンテンツであることの根底にあることから、コ

    素人とは違う、Webプロフェッショナルの仕事としてのWebコンテンツ開発を考えてみた | イベント・セミナー
  • Japanese Web Design: Why Is It so Different?

    Why Is Japanese Web Design So Different? Like an internet time machine May 15, 2012 • words written by Koichi • Art by Aya Francisco When I think of Japan I tend to think of beautiful design. Zen gardens, temples, shrines, tea ceremonies, manga, anime, wabi-sabi… the list goes on and on. Yet for some reason Japan just can't put any of this together to make a decent looking website. Where did they

  • まにまにフェスティバル(まにフェス)

    株式会社イマジカデジタルスケープ 和やかな雰囲気でクリエイター・他業種の方と意見交換が出来、通常のビジネスイベントとは違った情報交換が出来る場でありました。ぜひまた機会がございましたらお願いいたします。 ウェブ解析士事務局 多くの方にオープンステージやブースにご来場いただきありがとうございました。 色々なお話をさせていただきながら、色々なお話をお伺いすることが出来て、大変有意義でした。 エイクエント エイクエントのブースにお越しいただいた方、ハードルの高い(笑)英語クイズにチャレンジしていただいた方、ありがとうございました。 たくさんの方とお話をさせていただき刺激を受けることができ、とても楽しい時間を過ごせました。 デザイナーで今後のキャリアのついて検討されている方、採用についてお困りの企業様など我々でなにかお役に立てることなどございましたらいつでもお気軽にご連絡下さい。 株式会社KDDI

    まにまにフェスティバル(まにフェス)
    astronaughts
    astronaughts 2012/04/05
    大阪で超豪華キャストいっぱいのビッグイベントがあるのに行けなくて残念・・・くやしぃです!!!
  • 新卒Webデザイナーにとりあえず読ませておきたいデザインの原理原則が学べるエントリー

    「素人っぽいデザイン」から抜け出すために、デザイ... / デザインを勉強したことがない人でもデザインできる... / 非デザイナーのためのデザイン基テクニック その...他...全10件

    新卒Webデザイナーにとりあえず読ませておきたいデザインの原理原則が学べるエントリー
    astronaughts
    astronaughts 2012/03/29
    非デザイナーも読めと聞いて。
  • ECサイト改善に効くゲーミフィケーションのアイデア

    「ゲーミフィケーション」というキーワードを2011年ごろからよく耳にするようになりました。「また新しいバズワードか?」「Webサイトの制作や運営とは関係のない話だろう」と受け止めている方も少なくないかもしれません。Webサイトにとってのゲーミフィケーションとは何か? 『ゲーミフィケーション―<ゲーム>がビジネスを変える』(井上明人著)の編集を担当したNHK出版の久保田 大海氏が解説します。(編集部) ゲームクリエーター、Webディレクター、ECサイトやモバイルビジネスの担当者など、をきっかけにたくさんの人に会うことで、ゲーミフィケーションについての考え方を深めてきました。 その中で、ゲーミフィケーションには大きな流れが2つあることに気づきました。(1)従来の据え置き型ゲームの流れ、(2)ソーシャルゲームの流れ、の2つです。 「(1)従来の据え置き型ゲームの流れ」は、ファミコンからプレイス

    ECサイト改善に効くゲーミフィケーションのアイデア
  • アドビの新ツール「Shadow」は、モバイル用Webアプリ開発者必須のツール

    モバイルデバイス用のWebサイトやWebアプリケーション開発で大変なものの1つが動作確認です。何台ものデバイスを机の上に並べて、ひとつひとつ確認しなければなりません。 アドビシステムズのAdobe Labsが公開した「Adobe Shadow」は、そうした苦労をしているデベロッパー、デザイナーにとって手放せないツールになるでしょう。 複数デバイスに対する同時表示とリモートインスペクション Shadowがどんなツールなのか解説用ビデオの説明を紹介しましょう。 iPhoneアプリのShadowを起動すると番号が表示されます。 その番号を、MacOSWindowsChromeブラウザのエクステンションとして配布されているShadowに入力します。これで、ChromeブラウザとiPhoneがペアになりました。 同じように、Android用ShadowもChromeブラウザとペアにすることができ

    アドビの新ツール「Shadow」は、モバイル用Webアプリ開発者必須のツール
    astronaughts
    astronaughts 2012/03/08
    これヤヴァイ。
  • Rails Girls

    Rails Girls - Get started with tech Our aim is to give tools and a community for women to understand technology and to build their ideas. We do this by providing a great experience on building things and by making technology more approachable. Learn sketching, prototyping, basic programming and get introduced to the world of technology. Rails Girls was born in Finland, but is nowadays a global, no

    Rails Girls
    astronaughts
    astronaughts 2012/02/23
    世界版 Rails 女子会??
  • Restaurants and Restaurant Reservations | OpenTable

  • 楽天から学べる日本的なWebアプローチ

    学べるところが多い楽天ページWebデザインに関わる様々な情報やノウハウが世界中で共有されているとはいえ、お国柄は存在します。Yahoo!でも、世界共通にみえる UI コンポーネントがありますが、アメリカと日中国ではアプローチが異なります。情報にメリハリをきかせているアメリカ。今の話題を中央にたくさん詰め込めるように工夫してある日。クリックをしなくても膨大な情報を消化することができる中国。ポータルサイトをひとことで言ってもやり方がいろいろあることが分かります。 各国の Yahoo! を見て「欧米はシンプルなのに、日中国はなんかごちゃごちゃしている」と感じた方はいるかもしれません。なぜそんな小さなところに情報を詰め込むのか、なぜページを整理しなのか、メッセージを絞ってメリハリをつけないのか、といった悩みを抱えるデザイナーもいるかもしれません。 日らしい忙しいデザインの代表例としてよ

    楽天から学べる日本的なWebアプローチ
  • http://www.cosmo-s.net/wp/viral-graph-1937.html

    我们的业务: 搜狗收录域名 高pr域名 备案域名 历史建站记录干净域名 高外链域名 域名筛选定制 seo相关域名 驿家域名

  • The Echo Nest : The Musical Brain

    Make your music website smarter. Tap into the Echo Nest's Musical Brain for the best music search, information, recommendations and remix tools on the web. API Methods First things first: read the API Overview Artist: get_audio get_blogs get_familiarity get_hotttnesss get_news get_profile get_reviews get_similar get_top_terms get_urls get_video Song: get_bars get_beats get_duration get_end_of_fade

    astronaughts
    astronaughts 2012/01/05
    おっとー。これは前から考えてたサービスに使えそうな API やないかい。