タグ メニューアイコン
人気順 5 users 50 users 100 users 500 users 1000 usersウェブデザインにおける、ハンバーガーボタンについて考える「Analyzing The Hamburger Menu In Web Design」 | DesignDevelop
スマートフォンのメニューデザインの定番と言っても過言ではないハンバーガーボタン。当たり前のように利用されていますが、今回はそんなハンバーガーボタンに関して分析をした考察「Analyzing the Hamburger Menu in Web Design」をご紹介したいと思います。 メニューアイコンとしてなくてはならない存在になっていますが、その反面でハンバーガーボタンのデメリットを考え提唱してい... 続きを読む
クリック率が違う!?4タイプのメニューアイコンの比較検証! : ニキビ跡
スマホ対応の記事で、「≡」のようなメニューを見たことはないですか? このマークは『ハンバーガーメニュー』と呼ばれるメニューを表す記号です。 本記事では、ハンバーガーメニューと「MENU」と書いてあるメニューボタンでクリック率がどの程度違うのかA/Bテストを報告している記事から、その結果をご紹介します。 基本パターン ハンバーガーメニューの最も基本的なデザインです。 単純に三本の線が描かれて... 続きを読む
Safariアプリは意外に多機能!パソコン版の画面表示、画面内の文字検索など使い方まとめ− ISUTA(イスタ)オシャレを発信するニュースサイト
ウェブ検索でよく使うSafariアプリは、ただ検索するだけでなく、色々と便利な機能がついているのを知っていますか? 意外に知らない、Safariアプリに搭載されている機能をまとめたので、困った時の参考にしてくださいね! プライベートブラウズ パソコン版ページの表示 リーダー表示 メニューアイコンのカスタム 複数タブを同時に閉じる お気に入りサイトへの最速アクセス サイトの更新情報を一覧する 1.履... 続きを読む
iOS 9 の Safari でタブバーが表示されていると fixed な要素の計算上の位置がずれる - Qiita
何を言っているんだおまえは、と突っ込みたくなる方もいらっしゃるかと思いますが、ありのままに今起こったことを話すぜ…! まずは動画をご覧ください。 (YouTubeに飛びます) 再現条件とか 以下の環境において端末を横位置にした上で画面をスクロールさせてタブバーを表示させると、{ position: fixed }で配置した要素が正常に機能しなくなります。 上記の動画ではメニューアイコンに張ったクリ... 続きを読む
ミニマルテイストなフルスクリーンメニューを実装できる「jQuery fatNav」 | bl6.jp
jQuery fatNavはミニマルテイストなフルスクリーンのナビゲーションメニューを実装することができます。デモではメニューアイコンをクリックするとオーバーレイでアニメーション付きのメニューが表示されます。フワッとさりげない感じで表示されるのがとてもお洒落ですね。 以下はjQuery fatNavのデモになります。シンプルでスッキリしたデザインが特徴的です。 デモ メニューはフェードでズームイン... 続きを読む
折りたたみでテンキー付、Androidベースのフィーチャーフォン「AQUOS K SHF31」 - ケータイ Watch
ニュース 折りたたみでテンキー付、Androidベースのフィーチャーフォン「AQUOS K SHF31」 LTE対応でテザリングも可能に (2015/1/19 12:00) シャープ製の「AQUOS K」(SHF31)は、2015年春モデルのフィーチャーフォン。折りたたみ型でテンキーを備え、決定キーを押すとメニューアイコンが表示される、というお馴染みの形だが、実はOSにAndroid 4.4を採用... 続きを読む
どうなる「スマホポータル」~Syn.の未来を読み解くカギは、開発を担うビットセラーにあった - エンジニアtype
最近、スマホではてなブックマークやnanapiを開くと、メニューアイコンの箇所に出てくる通知マークが目に付く。これは10月16日、「新しいモバイルインターネット体験を創出する」としてKDDIが開始したSyn.(シンドット)の更新通知である。 《すべてのサービスが入り口となる、中心のないポータル構想》として発表されたSyn.は、スマホでよく使われているアプリやwebサービスに共通のサイドメニュー『S... 続きを読む
スマホのメニューデザインに悩んだらこれを見る 徹底収集36選!
スマホはメニューバーが命!! スマホでもっとも重要な動作は「タップ」ですが、その重要な役割を引き受けるのがメニューアイコンやリストです。ユーザが求めるコンテンツにスムーズにつなげられるよう、最適化していくことが必要です。 ただそのデザイン、「なんとなく」のものになっていませんか? 違和感なくスムーズにコンテンツにつなげるためには、最適なデザインを選択する必要があります。 今回は100のスマホサイト... 続きを読む
知っておいてよかった!Web制作時に効率上げる「便利」なCSSテクニック | コムテブログ
少し前にサイト制作でさりげなく使われているCSSテクニックをまとめましたが、今回はそれを補足する形で、これから増えそうなもの、使っていきたいものを今後忘れないようにメモしておきます。 もくじ 画像 1.ブレンドモード 2.表示範囲 3.透過+合成 4.半透明 エフェクト 5.マウスオーバーアイデア一覧 6.CSSのみでメニューアイコン 段組み 7.マルチカラム 8.段の表示順 9.コンテンツ流し込... 続きを読む
スマホサイトのUIでよく使うメニューのリスト表示まとめ33サイト | iPhoneデザインボックス
iPhoneデザインボックス » スマホサイトのUIでよく使うメニューのリスト表示まとめ33サイトスマートフォンサイトを作るときにヘッダーにメニューアイコンを設置してクリックするとメニューリストがでるようにすることがあります。表示の仕方やアニメーションは色々あるのでまとめました。最近は、流行り?なのかFacebookのアプリように横から出てくるメニューが多いです。 続きを読む
無料でダウンロードでき商用利用も可能なUIキット「Polaris UI Kit」 - GIGAZINE
チェックボックスやWindows 8っぽいメニューアイコン、ボタン各種など洗練されたデザインのUIキットが「Polaris UI Kit」です。無料でダウンロードでき、商用利用も可能。さらにUIキットと同時にアイコンセット48種類もダウンロードできるようになっています。 Polaris UI Free - User Interface Pack - Designmodo http://design... 続きを読む
クールな円形メニューをピュアCSS3で実装するチュートリアル:phpspot開発日誌
The Creation of a CSS3 Clickable, Rotating Menu | InsertHTML クールな円形メニューをピュアCSS3で実装するチュートリアル。 クリックすると回転したり良い感じに立体感が出ていたりアニメーションしたりCSS3の機能をフルに使った円形メニュー。 奇抜なメニューであっと驚かせたいという場合に使えそうです デモページ メニューアイコンもしっかり回... 続きを読む
SparrowライクなWebメールクライアント『Fluent』 - #RyoAnnaBlog
Tweet Sparrowの次に来るのはFluentか。 FluentはWebブラウザで動くGmailクライアント。Twtterのタイムラインのようにメールが縦に並び、サイドバーにはメニューアイコンが。添付画像はサムネイルが表示され、返信はインラインで。そう。このインターフェイスはまるでTwitter for Macのようだ。 Fluent.io - Keep your email flowing... 続きを読む
Googleアナリティクス、ユーザーインターフェイスを改良 & スピードアップ | 海外SEO情報ブログ
[対象: 中〜上級]Googleアナリティクスが、ユーザーインターフェイスを更新し操作性を向上させました。 と同時にレポート表示をスピードアップさせました。ユーザーインターフェイスの改良まず真っ先に気付くのはナビゲーションバーのメニューアイコンではないでしょうか。 視線を固定する役割を果たして見やすくなったように感じます。指数の比較をドロップダウンで選べるようになりました また集計単位の「時間別・... 続きを読む
Mozilla Re-Mix: Firefoxに多数の便利機能を追加することができるアドオン「Mar Mod」
Firefoxは、アドオンを追加することでその利便性を感じることができるブラウザですが、次々にアドオンを追加していてはきりが無いですね。 こうしたアドオンの中には、デフォルトで追加や変更ができればいいのにというような小さな機能を持ったものも多々ありますが、これらを別々にインストールして管理するのは非常に面倒なものです。 普通ならメニューアイコンを変更するならこれ、RSSアイコンを付与したいのならこ... 続きを読む