ページ内リンクはスムーズスクロールしなくても一瞬点滅すればいいんじゃないかという実験
スムーズスクロール以外の方法で、ページ内リンクによって画面が切り替わったことを利用者にわかりやすく伝える方法はないかということで、ページ内リンクでの移動時に画面を一瞬点滅させるスクリプトを jQuery で書いてみました。 タイトルが （謎） な感じですが...... ページ内リンクでページ上部に移動させたりするとき、最近は所謂スムーズスクロールってやつを実装するのが当たり前になっていますよね。パッと瞬時に画面が切り替わってしまうと、ページ内で移動したことがわかりにくいので、スクロール処理を入れることでわかりやすくしてあげましょうって言う、親切心から採用されるケースが多いと思います。 実装方法は JavaScript と CSS アニメーションの組み合わせや、JavaScript （というか jQuery） でというのが多いと思いますが、今回はそのスムーズスクロールの実装方法はどれが良いの
ブランディングとは何か。ブランディング活動の基本をWeb制作時に意識しよう。 第三弾『Webサイトを構築する上で注意すべきポイント』 / Maka-Veli .com
全12カテゴリー。分野別で見る、 Webサイトを構築する上でそれぞれ注意すべきポイント Webサイトの目標＝プロジェクトの目標、ではないということ。 続：Webサイトを構築する上で注意すべきポイント に続き、第三弾です。 前回までは、業界別それぞれの注意点や、そもそもサイトを作るという事とは？などについて書いてきましたが、今回はもう少し深く、マーケティングを視野に入れて考えてみたいと思います。企業のブランディングについてです。 そもそもブランディングとは何か ブランディングとは、企業、法人がお客さまやユーザー等へ、自社のブランドを構築・訴求する為の活動その物です。ロゴやデザインに留まらず、接客方針、キャッチコピー、地域性など、様々なモノが対象になり、それを伝える事、そしてターゲットの頭・心にその概念を留めさせ、同業他社との差別化を図る為に行います。 良質なモノに、ある特定の印が付
minspi | Webデザインが好きな人のためのソーシャルブックマークサービス
どうしてもお金を借りたいけれどもどんな消費者金融に申し込んだらよいのか全然わからない…迷ってしまって不安がある…そんな愛媛在住の人たちは必見です！このサイトは愛媛県在住の方のために優良な消費者金融を紹介しています！ぜひ参考にしてみてください。困ったら絶対アクセス
美少女ゲームのWebサイトにおけるキャラクター紹介ページについて - 詩になるもの
そんなわけで。美少女ゲームのWebサイトにおけるキャラクター紹介ページについて考えた。 結論から書くと、「キャラクター紹介ページ（に限ったことではないけど）はそのゲームのコンセプト、雰囲気、方向性などに合わせて作ることが大切」という至極普通の印象を持った。 1 最近、みなとそふとの姉妹ブランドとして作られたホエール。そのデビュー作「オレの彼女（ツレ）はヒトでなし」のWebサイトを見てて思ったことがある。キャラクター紹介ページが設定資料集のコピペっぽい。 キャラクター紹介ページから適当に一人選んで見てもらえばわかるように、オレツレのキャラクター紹介は立ち絵画像＋データで構成されている。データの部分には事細かにキャラクターの設定が書かれているわけだけど、これがどうにも情報過多だ。特に髪型、髪の色、目元の情報は絵を見れば分かるんだから不必要だろう。 それでいて、全体的な情報量には不足を感じる。そ
見えてきたECサイトの人気レイアウト
ECサイトのレイアウトは、ユーザーに情報を的確に届ける上で重要な役割を果たす。サポタントの調査結果から、ECサイトでトレンドになっている検索窓の設置場所やサイト幅のピクセル数が分かった。 Web・モバイル業界の人材事業を手掛けるサポタントは7月30日、EC（電子商取引）サイトのレイアウトのトレンドに関する調査結果を発表した。楽天市場（100サイト）、Yahoo!ショッピング（50サイト）に出展しているECサイトおよび企業が独自に運営するECサイト（100サイト）を7月に調査した。 70％がページ上部に「検索窓」を設置 Webページの上部に検索窓を設置しているECサイトは全体の70％だった。増加する商品点数に対し、検索性を向上させる目的で検索窓を設置するECサイトが増えているという。
美味しいカステラなのに楽天メソッドが極まりすぎてて残念な場合
長崎心泉堂の「幸せの黄色いカステラ」というのを楽天で取り寄せてみました。 とても卵の味が濃くて、甘さはその分抑えてあり、非常に美味しいカステラでした。 よくあるカステラとは明らかにひと味もふた味も違います。届いた１本を数日で食べきって、またすぐに注文しちゃったくらいです。 また、アフターケアも充実していて、買った後、こんなメールまで届いたのです。 題名：【長崎 心泉堂】カステラは無事お届けできていますか？ お世話になります。 カステラ専門店【長崎心泉堂】 受注担当 待鳥智美です。 ＜中略＞ さて、ご注文の品は無事お届けできておりますでしょうか ご贈答の場合は、お届け先様にお気に召していただけましたでしょうか？ カステラのお味はいかがでしたでしょうか? ぜひ、私どもに、お客様の声をお聞かせくださいませ。 お願いします。 というのも、お客様の声によりよい商品作りがあると考えるからです。 当社の
中国の町並みをドット絵で再現したE都市がすさまじい - てっく煮ブログ
中国の地図サイト「E都市」は一昔前の RPG のようにドット絵で中国の町並みを再現しています。描き込みの量もすごいし、再現されている範囲も広くて驚きました。たとえば 上海 はこんなの。もちろんドラッグで移動できます。少し拡大してみます。さらに拡大してみます。右下のビルの看板の文字が読めちゃってます。自分が見た範囲では全ての場所で地図がここまで拡大できました。すべてのズームレベルでしっかりと描き込んであるのが驚きです。Google Maps の衛星地図とも比較できます。衛星写真を45度ぐらい時計回りに回転すると、上のドット絵に近くなりますね。道の形や屋根の色まで忠実に再現されています。北京を旅する北京 の天安門広場〜紫禁城。天安門にズームイン。もちろん毛沢東の肖像画まで再現。オリンピックで話題になった鳥の巣スタジアムも再現されています。すぐ近くはビル街だったんですね。香港を旅する香港 の大量
みんなのクリエイティブエージェンシー：C-team
マツエクをつけているとオイルで出来ているクレンジングは基本ＮＧです。マツエクのグルー(接着剤)と油の相性が悪くマツエクが取れやすくなってしまうからなのですがマツエクを付けている人はどんなメイク落としを使っているのでしょう […]
見るだけでも一見の価値あり！絵画のような美しいサイトデザイン集:phpspot開発日誌
Most beautiful websites of 2008 | CrazyLeaf Design Blog 見るだけでも一見の価値あり！絵画のような美しいサイトデザイン集ということで美しいサイトが多数紹介されていました。 単にサイトというには惜しい芸術作品ばかりで見るだけでも楽しめます。 Saizen Media Nem Studio Efingo Project Vino Kavoon Belvedere Inc Quality XHTML Avalon Star Level 2D mediaBOOM Sensi Soft Five Cent Stand Blogsolid Dana’s Garden OLDesign Trickeries FortySeven Media A.viary Kulturbanause Noe Design Studio 20CM Records 全部
■FOR-NEXT - 岡本倫ホームページ
<BODY> <P>こちらは岡本倫のホームページ ■FOR-NEXT です。</P> <P>エルフェンリートとノノノノの話題や、日記のページなどがあります。</P> </BODY>
Web2.0風のボタン等がクリック一発で作れるPhotoShop用レイヤースタイル:phpspot開発日誌
Deziner Folio Blog Archive Ultimate Web 2.0 Layer Styles - Free Download Photoshop Layer Styles are the easiest way to speed up the design process. I found that my previous article - Ultimate Web 2.0 Gradients v3.0 was a lot helpful to many.Web2.0風のボタン等がクリック一発で作れるPhotoShop用レイヤースタイル。 サイトの「Download」ボタンでダウンロードし、.ASLファイルをダブルクリックでインストール完了します。 インストールしたら、「ウィンドウ」メニューから「スタイル」を表示します。 すると次のようにインストールされたスタイルが表
Web2.0風デザインのための秀逸チュートリアル68選 | S i M P L E * S i M P L E
こ、これはかなり使えます・・・。 が、とっても紹介が難しいのでさらりと。今回は実験的なエントリーとして画像一切なしで。 『Web2.0風デザインのためのチュートリアル68選』です。 » Web 2.0 Webdesign-Tutorials | Dr. Web Weblog 以下の7つのカテゴリーにわかれています。 サイトをこれから作るぞー、という人には大いに参考になる素晴らしきチュートリアルかと思います。 ビジュアル効果系（1～11） ロゴ系（12～25） テキスト（26～33）系 バッジ系（34～39） ボタン系（40～46） レイアウト系（47～60） Web2.0まとめ系（61～68） 個人的には1、2、12、13、40、41あたりが好きですね。今後使えそう。 しかし、こういう海外サイトのまとめをまとめとして紹介するのは難しいですよね・・・。そのまま紹介するのも「どうなの、それ？」
jmblog.jp - Web2.0っぽいグラデーションのコツ
そろそろ「Web2.0的デザイン」という言い回しが恥ずかしくなってきましたが、それはそれでおいといて。グラデーションは今っぽいデザイン（ちょっと言い方を変えてみた）では外せない要素と言えるかと思いますが、プロのデザイナーの方はさておき、素人が挑戦すると、色の選択に失敗してイマイチ・・・なんてことになりがちです。 » A Gradient Tutorial » 9rules Network Official Blog こちらのサイトでは、グラデーションを作る際のポイントが説明されています。 さて、どれが一番きれいでしょう？1 は彩度（鮮やかさ）が足りません。上のサイトでは「a classic problem」と紹介されています。2 はマシですが、ちょっと素人臭さを感じます。まぁ好みは人それぞれだと思いますが、やっぱり 3 が一番きれいだと思います。 ちなみに僕は、次のようにしてグラデーション
『ウェブ2.0 HOW-TO デザインガイド』がよくまとまっています | S i M P L E * S i M P L E
なんだか前にもこういうまとめを紹介しましたが、また良くまとまっているのがあったのでご紹介。 Web design scratchのサイトで「Web 2.0 how-to design guide」なるまとめがありました。 » Web 2.0 how-to design guide 15の項目でまとめられていますね。 Simplicity（とにかくシンプルに！） Central layout（真ん中に寄せるレイアウトで） Fewer columns（段組は少なめに） Separate top section（トップ部分は分けて目立たせよう！） Solid areas of screen real-estate（レイアウトにはメリハリをつけて） Simple nav（ナビゲーションはシンプルに！） Bold logos（ロゴは大きめに！） Bigger text（フォントも大きめに） Bold
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ワードプレステーマTCD
Webpark 
新人Webデザイナーに読ませたい、初心者向けの基礎を丁寧に解説している記事
基礎からわかるホームページの配色
【WEBデザイン】原研哉さんを中心に巻き起こった深夜のフォント熱論まとめ
人気のWEB2.0的サイトのロゴを100個ひたすら並べてみた - デザインウォーカー | DesignWalker - ロサンゼルスで働くウェブデザイナーの日記