タグ

webデザインに関するono_matopeのブックマーク (95)

  • ロゴ、ウェブ、グラフィックデザインなど多数のジャンル。 | 99designs

    どんなビジネスニーズにも対応できる、クリエイティブなデザインエキスパートにお任せください。一際輝くデザインで、ビジネスを成功に導きます。

    ロゴ、ウェブ、グラフィックデザインなど多数のジャンル。 | 99designs
  • Pushing Your Buttons With Practical CSS3 - Smashing Magazine

    CSS3 is the partially implemented sequel to the CSS2 spec we all know and love. It’s already popping up in new browsers such as Firefox 3.5, Safari 4 and Chrome. In this article, the first of the articles that explore practical (and even far-fetched) implementation of CSS3, we start by applying CSS3 to something we all have to create: buttons. Calls to action are critical for any website, and a co

  • スタイルシートによる崩れない 2カラム 3カラム・レイアウト

    このウェブサイトは販売用です! desperadoes.biz は、あなたがお探しの情報の全ての最新かつ最適なソースです。一般トピックからここから検索できる内容は、desperadoes.bizが全てとなります。あなたがお探しの内容が見つかることを願っています!

  • web屋が主張する「リキッドレイアウト」に騙されないために - 鍵っ子ブログ

    鍵っ子ブログ(Key Blog):Keyが大好きな鍵っ子によるKeyのファンサイト。Keyに関する情報・コラム・考察・ニュースが中心 リキッドレイアウトの是非について web屋を自称する人の主張が余りにも酷い。 「その余白、もったいなくない?」っていう自然な感覚とそれをなんとかしようとするWebデザイン魂を眼前にすると、「横幅はやはり800px基準でしょ」とか「いやそろそろ1024px基準でもいいかも」とかいう議論自体がなんだかむなしいと感じただけだ。 その余白がもったいないと思う感覚とどうにかしようとするデザイン魂 - Web屋のネタ帳 つまりweb屋のネタ帳氏の主張は「ディスプレイの解像度に合わせて動的に表示を変えるAmazonすげー。それに比べて楽天は左右に余白が出来てそのスペースがもったいない」らしい。 たしかにその主張は一理あるが、ではweb屋のネタ帳氏のサイトはどうか。 スペー

    ono_matope
    ono_matope 2009/01/14
    フルHDだろうと全画面表示操作を推奨するWindowsが悪いし、標準に準拠しないIEが悪い。要するにMicrosoftが悪い。
  • ちょっとした説明に便利なTooltipsのスクリプトいろいろ | IDEA*IDEA

    ドットインストール代表のライフハックブログ

    ちょっとした説明に便利なTooltipsのスクリプトいろいろ | IDEA*IDEA
  • 見た目はどうする?どうできる?

    iPhone向けデザインコーディング 今回は、iPhone向けサイトを作るにあたっての、デザインコーディング(HTMLCSS)について紹介します。 iPhoneのSafariはかなり高いレベルでPCとほぼ同じようなブラウジングを行えますし、HTMLCSSへの準拠も高い(というよりむしろ律義すぎる)ので、普通にクロスブラウザ対応を考えて作ってあるWebサイトなら問題ないでしょう。しかし、iPhone固有の制限、設定などがありますので、いくつかのテクニックと注意点があります。 はじめに、テスト用の環境を整えましょう。 まずは、Safari(http://www.apple.com/jp/safari/)をインストールします。Safari3.1ならばiPhoneとほぼ同じような動作をします。理想としては、Macがある方が良いです。フォント有無の問題もありますし、iPhone SDK(http

  • iPhoneユーザーの多くがモバイル・サイトの使い勝手に不満

    モバイル関連テスト・ツールなどを手がける米Keynote Systemsは米国時間2008年10月9日,米Appleの携帯電話機「iPhone」のユーザーを対象に,モバイル・サイトの満足度について調査した結果を発表した。 それによると,米Yahoo!と米Fox Newsのモバイル・サイトに対する満足度はそれぞれ51%と64%にとどまった。また,どちらのサイトも,魅力的だと感じたユーザーは半数を下回った。多くのユーザーは,検索機能の使い勝手に不満を感じたほか,サイトが視覚的魅力に欠けるとコメントした。 この調査では,iPhoneユーザー75人以上に,娯楽関連ニュースの検索,閲覧,特定トピックの記事検索,友人への記事転送という一連の作業をさせ,Yahoo!とFox Newsの両サイトに関する満足度とユーザビリティについて尋ねた。 閲覧する際にフラストレーションを感じたというユーザーは,Yaho

    iPhoneユーザーの多くがモバイル・サイトの使い勝手に不満
    ono_matope
    ono_matope 2008/10/12
    情報量多いページは確かに無理はある。どのモバイル端末でもそうだけど
  • ウノウラボ Unoh Labs: 四角いリンク

    yamaokaです。 最近タブをメタファーにしたナビゲーションをよく見るようになりました。タブには大抵、内容を示すキャプションが付けられています。さて、どこからどこまでがリンクでしょうか。どの部分をクリックすればそのタブを選択できるでしょうか。 例えば、キャプションの文字だけにリンクが貼られている場合。利用者はタブの中のさらに狭い範囲、文字の部分を狙ってクリックしなくてはなりません。 実はマウスの操作というのは難しいのです。狭い範囲を狙って指定することにはあまり向いていません。目的到達のために狭い範囲のクリックを強制するのはどう考えてもよいインターフェースではありません。 そこで大抵のタブ型インターフェースではタブの枠の中全体をリンクとして扱えるようになっています。 アンカー要素のdisplay属性をblockにして、必要な高さと幅を与えることでリンクの範囲を四角形に広げることができますね

  • MOONGIFT: » これはすごい!Firefoxを使ってサイトのモックアップを簡単に作成する「Pencil」:オープンソースを毎日紹介

    これはデザイナーのみならず導入必須のソフトウェアと言えそうだ。 Webサイトを作る際には、モックアップが必要になる。それをベースにして「ここをこうしよう」「次はどこに遷移させよう」といった議論が可能になる。頭の中だけではイメージがはっきりせず、意見も出しづらい。 ドラッグアンドドロップでモックアップを作成できる そんなモックアップを作成しようと思ったら、紙やHTMLオーソライズソフトウェア、画像編集ソフトウェアを使うことが多かった。だが画像編集ソフトウェアではチェックボックスやテキストボックスが作りづらい、HTMLオーソライズソフトウェアではデザインの微調整が面倒、紙では重ね書きしづらい…とそれぞれに欠点があった。そこでこれを導入してみよう。 今回紹介するオープンソース・ソフトウェアはPencil、Firefoxアドオンとして動作するモックアップ作成ソフトウェアだ。 個人的にはモックアップ

    MOONGIFT: » これはすごい!Firefoxを使ってサイトのモックアップを簡単に作成する「Pencil」:オープンソースを毎日紹介
    ono_matope
    ono_matope 2008/08/25
    外部設計に便利そうだ…!
  • Marketcircle iPhoney

    Looking for a way to see how your web creations will look on iPhone? Look no further. iPhoney gives you a pixel-accurate web browsing environment—powered by Safari—that you can use when developing web sites for iPhone. It's the perfect 320 by 480-pixel canvas for your iPhone development. And it's free. iPhoney is not an iPhone simulator but instead is designed for web developers who want to create

  • 祝発売:iPhoneサイトを作ってみよう - builder by ZDNet Japan

    さあ、クラウドで解決しよう。 Google Cloud が「業務最適化」と 「イノベーションの実現」のヒントを提案 エッジからハイブリッド環境まで 考えられる全てのインフラ基盤を検証可能 Lenovoハイブリッドクラウド検証センター 中小企業のひとり情シスの現実 夢か幻か、はたまた現実か? ヘルプデスク業務の週休4日制を考える 現場のための業務カイゼン 30年以上の歴史をもつDXプラットフォーム 進化を続けるNotes/Dominoのいま DXの成否を分けるのはガバナンス Microsoft Security Forum 2021 Day2 どこよりもわかりやすい基調講演解説! エンドポイントセキュリティの転機 情報セキュリティ戦略が問われる今 重要インフラ事業者としてANAが考えること ビジネスのためのデータ基盤構築 DX時代の企業成長はデータ活用が鍵 新たな展開を後押しするSQL Se

  • あなたのサイトはiPhoneで見られますか? - @IT

    Java News.jp(Javaに関する最新ニュース)」の安藤幸央氏が、CoolなプログラミングのためのノウハウやTIPS、筆者の経験などを「Rundown」(駆け足の要点説明)でお届けします。(編集部) “小さな画面”の台頭 数々の新携帯端末が出るに従って、ごくごく普通にスマートフォンを使う人を見掛けることが多くなりました。WILLCOM(SHARP) W-ZERO3[es]が登場し、女性が普通にスマートフォンを使う姿も見掛けるようになり、不自然さもなくなってきたように思えます。 さらに最近、Apple社からiPhone/iPod touchの発表もあり、ますます携帯デバイスの利用者が増えてくることが予想されます。 そこで重要視されるのが、“小さい画面”のためのサービスや“小さい画面”で使いやすいWebデザインの手法です。 ■主なスマートフォンとその表示スペック(2007年9月14日

    あなたのサイトはiPhoneで見られますか? - @IT
  • 独学で極める “Webデザイン”の技と心:第10回 CSS Spritesでサイトを高速化|gihyo.jp … 技術評論社

    今日は、CSSを使ってサイトを高速化するテクニック「CSS Sprites(CSSスプライト⁠)⁠」についてのお話をさせていただきます。 サイトの高速化というと、プログラムの最適化を行ったり、サーバのチューニングを行ったりというイメージがあるかと思います。実はCSSを上手に使うことによっても、サイトの高速化を行うことができます。しかも、かなりの効果が期待できるのです。 CSS Spritesとは? 通常、ウェブページを制作する場合、デザインファイル(psdやpngなどの画像)をスライスし、HTMLのimg要素として埋め込んだり、CSSの背景画像として指定していることと思います。 それらの画像を一つにまとめ、1度の読み込みでのリクエスト数を減らすテクニックのことを「CSS Sprites」と呼びます。 このテクニックは、以前からマウスオーバーメニューを実現する際にも使われていたものでもありま

    独学で極める “Webデザイン”の技と心:第10回 CSS Spritesでサイトを高速化|gihyo.jp … 技術評論社
    ono_matope
    ono_matope 2008/05/27
    background-position:のマイナス値指定かー。話には聞いてたけどこうやるのか。ソフト側の支援と、柔軟に座標値変更に対応できるコーディングが必要になるねー
  • Googleがデザインするときに大切にしている10個の原則 - GIGAZINE

    Googleのユーザーエクスペリエンスチームに所属するSue Factor氏が、Googleの公式ブログにて「Googleらしいデザイン原則」について、10個の原則を提示しています。デザインというか、ネットサービスの設計自体に関する原則となっており、さまざまな場面で応用できそうなものとなっています。 詳細は以下から。 Official Google Blog: What makes a design "Googley"? Googleのデザイン原則は以下の通り。 1.人々に焦点を当てろ――彼らの生活、彼らの仕事、彼らの夢に 2.すべてはミリセカンド単位で数えろ 3.シンプルにすると強力になる 4.初心者ユーザーを引き込み、上級者ユーザーを魅了しろ 5.革新に挑め 6.世界に通用するデザインを 7.今日と明日のビジネスのために計画せよ 8.気を散らさず、目を楽しませるようにしなさい 9.人々

    Googleがデザインするときに大切にしている10個の原則 - GIGAZINE
  • 投稿系・コミュニティサイトで英語は使わないほうがいいっぽい | fladdict

    当たり前といえば当たり前だけど、色々調べたり実験したりしてみたところ、予想以上にクリティカルっぽい感じなのでメモ。 ナビゲーションを英単語にした場合、たとえそれが平易な英単語でも、小学生・中学低学年を全滅させる。ジェネレータやお手軽投稿系、モバイル投稿系は、ここで既に大ダメージをうけるっぽい。バズりたい場合には、英語をつかうなということか。やっぱりこういうものは突き詰めると、ヨーゼフ・ゲッベルスだなぁ。 ということは、逆に英単語や専門語の量をコントロールすることで、ユーザー層のリテラシーや職業、年齢層等をある程度コントロールできるのかもしれんのかな。

    ono_matope
    ono_matope 2008/04/06
    『逆に英単語や専門語の量をコントロールすることで、ユーザー層のリテラシーや職業、年齢層等をある程度コントロールできるのかもしれんのかな』
  • 「マウスオーバーでリンク先のサムネイルを表示」は導入してほしくない - ARTIFACT@はてブロ

    Twitterでちょっと盛り上がったのではてなにもメモ。あまり見かけない意見なので書いておく。 ※追記したけど、サービスのなかでも設定を無効にすることができるものも多い マウスオーバーすると、リンク先のサムネイルを表示するJavascriptがあるんだけど、あれが役立ったことないんだよなー。その割には陶しいので、だから、自分で導入する気はないし、できたら他のブログで導入して欲しくない。 サムネイル画像を表示すれば、閲覧者が興味を持ちやすくなるだろうという発想から生まれているんだろうけど、特殊なWebサービスで画面が特徴的だとかならまだしも、他ブログにリンクしている場合、ブログのサムネイル画像はそれほど特徴的でないので、そんなに役立つことはない。ブログの場合、閲覧者に関心を持ってもらうのなら、サムネイル画像よりも記事の中身を引用するほうがいいだろう。 ブログの記事が文字だけで素っ気ないから

    「マウスオーバーでリンク先のサムネイルを表示」は導入してほしくない - ARTIFACT@はてブロ
    ono_matope
    ono_matope 2008/04/05
    あれはウザい。本文抽出のテキストサムネイルだとどうだろう。
  • japan.internet.com Webビジネス - 売れないオンラインショップの条件

    ono_matope
    ono_matope 2008/03/05
    よく聞く話。この話題はもっと研究が必要そう。でもそのデザインじゃ「賢い」ユーザーは遠ざけるよね。結局誰に売りたいかっていうマーケティングの話に。
  • CSSのレイアウト作成に役立つ便利なリソースいろいろ

    最近のページやサイト作成に欠かすことのできない「CSS(カスケーディング・スタイル・シート)」ですが、そのレイアウト作成を行う際に便利なリソース22種類です。ゼロから作るよりは楽に製作できるはず。 詳細は以下の通り。 40種類のCSSレイアウトがそろっています。 Layout Gala: a collection of 40 CSS layouts based on the same markup and ready for download! CSSのフレームワーク blueprintcss - Google Code 16種類の異なるCSSベースのレイアウト intensivstation :: CSS Templates :: Templates 12種類のCSSによるレイアウト Dynamic Drive CSS Layouts- CSS Frames CSSのレイアウトを作成する

    CSSのレイアウト作成に役立つ便利なリソースいろいろ
  • アドビの新サイトがすごいことになってる - てっく煮ブログ

    まあまあ、何はともあれ、次のキャプチャを見てくれ。これはアドビの「会社情報 > アドビについて」のページの一画面だ。Adobe が先週末にサイトデザインを一新して、何気なく色んなページを見て回っていたときに発見したんだけど、この画像、どう見ても日語だ。「ディッ」と読める。ん?これ?消費者金融の「ディック」。「ィ」の折れ曲がり具合といい、これとしか思えない。もしや、「消費者金融で借金してでもアドビの製品を買いましょう」というメッセージなのか?何はともあれ、会社情報を表示するページで関連のない別会社の看板を表示して、しかもそれが消費者金融というのは、ちょっといかがなものかと思ってしまう…。いや、消費者金融を悪く言うつもりはないんだけど…。よくあることなのかもね深読みはいいとして、実は英語版の会社情報のページでも同じ画像が使われている。ということで、おそらく日語が読めない人間が「この写真はク

  • How To Destroy The Web 2.0 Look

    How To Destroy The Web 2.0 Look by Mauro | Nov 20, 2007 | Inspiration, Reference, Trends | 126 comments A trend always appears as opposition to another. Detailed Gothic art was replaced with the pure straight lines from  Greek temples in the Renaissance. The tons of hair spray, glitter and multicolor spandex 80’s were demolished by the black & white minimalism from the 90’s. The web is no exceptio

    How To Destroy The Web 2.0 Look
    ono_matope
    ono_matope 2007/11/29
    ごちゃごちゃするのでちゃんと見せるための技術がないと危険そう