ニキビの化粧水専科ニキビの化粧水専科 パスワード
スマホデザインで見やすいサイズ、行間は？デフォルトのアプリ等を調べてみた｜株式会社アクトゼロ｜クリエイティブブログ
こんにちは、デザイナーの小林です。 最近スマホデザインで、アプリデザインや、機能性を持たせたUIのデザインが求められることが多くなってきました。 Photoshopで幅640pxで作成後、実機で確認をするのですが、どうも文字サイズを決めるのに毎回迷ってしまいます。 「小さすぎるんじゃないか？」 「見出しと本文の違いがパッと見で分かるだろうか？」などなど… そこで普段見慣れているだろう、スマホのデフォルトの純正アプリや有名アプリの文字サイズを調べてみました。 検証方法 iPhone4S（古くてスイマセン）でキャプチャーとる Photoshopで上からテキストをトレース。（このときの文字設定の数値を記載しています。） ホーム画面 通話履歴 メール リマインダー メモ帳 ミュージック Google Chrome Facebook Twitter Youtube はてなブックマーク evernot
次世代Android端末の画面サイズを見据えたスマホサイトデザインとブラウザのファーストビュー表示領域 « console.log :) | Don't forget trace :)
今回は、現行のiPhoneと現時点での最新Android端末のスペックから、 最適なスマホ向けサイトのデザインサイズを考察します。 スマートフォン向けサイトをデザインする際にデザイナーがまず確認するのが、 想定の画面サイズとファーストビュー領域ではないかと思います。 ※ここでいうデザインには装飾だけではなく、ページ設計の意味も含み、デザイナーにはページの設計者の意味も含みます。 現状は、やはりまだ「iPhoneの画面サイズ」をスタンダードとする人が多いでしょう。 しかし、世界的に見てもAndroidの勢いが強く、さらにハイスペックな端末もドンドン発表されています。 今後発表される次世代の「Android端末の画面サイズ」がデザインのスタンダードになる日も遠くないかもしれません。 本記事の結論をいきなり書きますと ・現状のAndroid端末を基準にする際の想定ファーストビューサイズ
(メルマガ拡大版)ラーメン屋さんのサイトはどう作るべきか
みなさま、こんにちは。本日は週に１度のメルマガ発行日。この日は打ち合わせも入れられません。この３年間１回も休まずシコシコと書いておりますが、最近は読者数がかっきりと固まったようになり、全く伸びていません。１ヶ月かかって増加した分が月末に減る的な。ガラケー時代のiモードの待ち受けみたいです。 でも有料メルマガの総合ランキングではじわじわ上昇していま11位。テレビでおなじみの津田大介氏も抜きました。ここから考えますに、メール文化に対する比重がどんどん軽くなってるのではないかと予想するわけです。自分も主軸はメールからスマホ対応のメッセンジャーに移ってます。仕事はハングアウト、遊びはLINEですね。LINEでメルマガサービスはじめてくれないかな?いまBLOGOSでもメルマガやってるので移行したいわ(BLOGOSもLINEがやってるのよ)。 さて、今日のブログはラーメンです!!! ※写真はイメージで
[CSS] スマホ対応は超重要! 私が最低限やっている6つのこと | ヨッセンス
こんにちは! ヨス（プロフィールはこちら）です。 今現在、Google検索では「スマホ対応」がされているかどうかは超重要になっています。 具体的にいうと、PCの検索順位はスマホでの検索順位が適応されているのです！ 今回は、ブログのスマホ対応でのポイントをくわしく解説します。 スマホ対応で困った6つのこと 今回は私がスマホ対応のために最低限やっている6つを紹介するのですが、分かりやすいように「問題点」を見出しにして紹介しますね。 スマホで見たら画像がはみ出す?! まずはこちらの比較画像をご覧ください。 画像サイズ（左: 変更前・右: 変更後） スマホで見た時に、上画像の左側のような画像を見たことありませんか? これは画像サイズがパソコンのままになっているんですね。大きいのではみ出しています。 これをスマホで見た時は自動で上画像の右側のように縮小してほしいんです。 でも大丈夫! CSSの<im
![[CSS] スマホ対応は超重要! 私が最低限やっている6つのこと | ヨッセンス](https://cdn-ak-scissors.b.st-hatena.com/image/square/f65ab4b0dcf3e460e3895ac786ca89120feaa297/height=288;version=1;width=512/https%3A%2F%2Fyossense.com%2Fwp-content%2Fuploads%2Fcss-for-smartphone-300.jpg)
スマホ版のウェブデザインをクリック一発で確認できるChrome拡張機能「MobileLayouter」
使い方はいたってシンプル。スマホ版のウェブデザインを確認したいページにアクセスし、右上のツールバーで確認したいスマホの端末をクリックするだけ↓↓ このようにサクッとスマホ用のページを見ることができます。↓↓ あとがき @isloopをフォローする かなり便利な拡張機能ではあるのですが弱点もあります。 まぁMobileLayouterが悪いわけじゃなくChrome自体の問題なのですが、ウィンドウの横幅が400px以上に小さくならないのですね。 したがってパーフェクトにiPhonenでのデザインを確認できないのがたまにキズではあります。（画面幅は320pxに出来ます。） まぁ、iPhone 6からどえらく画面が広くなるみたいですけど・・・。 あぁホントにデカクなるのかなぁ。Storyboardの分岐が増えてしまうがな・・・。ﾊﾅｼｿﾚﾀ 【関連】AutoPatchWork - 分割してるページ
スマホ向けサイトで設定ミスをすると68%の検索アクセスを失う など10+4記事 | 海外&国内SEO情報ウォッチ
BrightEdge（ブライトエッジ）が、モバイルの利用状況を調査した結果を公開した。 レポートのなかには、モバイル向けサイトの調査も含まれている。 たとえばモバイルサイトの構成によるランキングの差異だ。 グーグルは、レスポンシブ・ウェブデザインと動的配信、別URL構成の3つのモバイル向け構成をサポートしている。検索順位において、これらの3つには差異はほとんど見られない。優劣をつけていないというグーグルの説明は正しそうだ。 これは嬉しい発見といえる。しかし放っては置けないデータもある。 別URL構成のサイトには、設定ミスが非常に多く見られる。rel="alternate"がない ―― 61%Vary HTTPヘッダーを返していない ―― 41%rel="canonical"が間違っている ―― 35%rel="canonical"がない ―― 35%rel="alternate"が間違って
サイトをスマホ対応した時に意識したこと5つ - Design Color
もくじ サイト幅はリキッドレイアウト&リンク領域は大きめに 動画やGoogleマップも画面サイズに応じて伸縮するように なるべく画面遷移をしないように PC版のデザインでも見れるように 最後までスクロールした後のことも考える 1.サイト幅はリキッドレイアウト&リンク領域は大きめに サイト幅は基本的には320px想定で作っています。ですが、一言で「スマホ」といっても様々な解像度がありますよね。特にAndroidとか！しかも、スマホを横向きにするとまた解像度が変わってきます。 なので、ある程度どのサイト幅でも対応できるようにリキッドレイアウトで画面サイズに応じてサイト幅が変わるようにしています。 また、スマホは指で操作するため、リンク領域はなるべく大きめにするよう心がけました。（とはいえ、タグやはてブのリンクまでは大きくできなかったのですが）一部を除いては基本的にはリンク要素は「44px以上」
スマホ生活に欠かせない定番アプリと周辺機器 - ライター近藤謙太郎の場合
読者の皆さんは普段、日常生活の中でどの程度スマートフォンを活用していますか。本稿では、マイナビニュースで記事を書くライターの筆者が仕事に活用している定番アプリと周辺機器を紹介していきます。「こんな便利なものがあったのか」という気付きにつながれば幸いです。 Bluetoothキーボードで文章を書く 「出先でちょっとした文章を書きたい。でもPCは重いので持ち運びたくない」という人は、結構多いのではないでしょうか。そんな方にはBluetoothキーボードがおすすめです。筆者の愛用キーボードは「Wedge Mobile Keyboard」。軽い上に文字も打ちやすいので気に入っています。いまでは、ほとんど全ての取材記事をこのキーボードで書くようになりました。
たった1行！スマホサイトのコーディング時に役立つ小技8（サンプルあり） - Design Color
もくじ 幅をデバイスサイズに合わせる スマホを横にしたときに文字が大きくならないようにする 電話番号に自動的にリンクが付かないようにする リンクを押したら電話をかけられるようにする リンクを押したらGoogleマップアプリを起動させる リンクエリアを広げる paddingやborder分を気にせずwidth/heightの数値を指定する 長い文字列でも途中で改行させる 1.幅をデバイスサイズに合わせる まずはスマホサイトを作るときの基本ですね。サイト幅をデバイスの幅に合わせてあげるには、以下の一行だけで対応出来ます。 <meta name="viewport" content="width=device-width,initial-scale=1.0"> サンプル 2.スマホを横にしたときに文字が大きくならないようにする スマホを横にすると、解像度が変化すると共に文字サイズも大きくなってし
スマホ時代のコンテンツは「瞬間」か「没頭」じゃないか : けんすう日記
スマホ時代のコンテンツ QUARTZというメディアがあるのですが、その中に「QUARTZカーブ」というのがあります。メディアを運営していたり、ブログを真面目に書いているような人は知っている人が多いかもしれません。 アメリカの新聞の平均的な記事の長さは、紙面の上から下までの一段の記事で、語数にして700語台である（日本語に訳すと2千数百字になる）。だが、『クオーツ』は、500語よりも短い記事と、800語よりも長い記事に特化している。 この哲学に行き着いたのは、トラフィックを分析したところ、デジタルでよく読まれるのは短い記事か長い記事のどちらかだという分析結果を得たからでもあり、700語台の記事は無駄が多いと考えるからでもある。 アメリカで躍進中のビジネスニュースサイト『クオーツ（QUARTZ）』 その編集方針と経営戦略を聞いた | New York Sophisticated | 現代ビジ
スマホ初心者の母にスマートフォンサイトのUIについて色々聞いてみました | AOGIRI.net（アオギリネット）
おそらく自分の母親世代である方も対象になるであろうスマホサイトを制作するために、母に色々と意見を聞いてみました。 母は、スマートフォンで私のインストールしたアプリでレシピ見たり、天気予報を見たり、ニュースを見たりするぐらいで、積極的にネットで検索はしないけど、必要に迫られると見るというぐらい。 そこでいくつか驚いたこと、なるほどと思ったことがあったのでご紹介します。 右上の三本線はメニューとは認識しないどころか、「メニュー」という文言すら何を指しているのか分からない 最近、スマートフォンサイトではヘッダの右上に「三本線＋メニュー」のボタンが配置されることが多くなっています。三本線だけ、というサイトもありますが、万人がターゲットのようなサイトは、「メニュー」「MENU」の記載が大体あります。 しかし、私の「このメニューっていうボタンを押したらメニューが表示されるって分かる？」という質問に返っ
スマートフォンのコンバージョン率を上げる秘策 from Conversion Conference Boston 2013
[対象: 中〜上級] 僕が所属するセルフデザイン・ホールディングスの海外遠征の一環で、昨年の秋に米ボストンで開催されたConversion Conference Boston 2013に参加しました。 僕が海外カンファレンスに参加したときはセッションレポートをこのブログで公開するのが通常です。 ところがConversion Conference Boston 2013に関しては、帰国後予想以上に忙しかったせいもありレポートをまとめる時間がとれませんでした。 時間がたちましたが、ようやくまとめることができたのでセッションレポートを公開します。 この記事でとりあげるセッションはモバイルサイトのコンバージョン率を上げるための秘策です。 スピーカーは、SeeWhyの創設者、Charles Nicholls（チャールズ・ニコルズ）氏です。 では行ってみましょう。 モバイルにおけるコンバージョンの問題
PCでもスマホでもシームレスに使える、マルチプラットフォーム対応サービス8選
昨今のスマートフォンの普及にともなって増えつつあるのが、iPhoneとAndroid、それぞれを所有して使い分けている“二刀流”のユーザーだ。プライベートと業務で使い分けたり、交友関係で分けたり、あるいはガジェットへの興味から複数台を所有していたりと経緯や理由はさまざまだろうが、両方で同じサービスを使う場合、その操作性の違いに悩まされることもしばしばだ。 今回は、iPhoneとAndroid用のアプリをそれぞれ取りそろえ、PCも含めた各プラットフォームからほぼ同じ使い勝手で利用できるサービスを8つ紹介する。マルチプラットフォームを謳うサービスは数多いが、共通のデザインおよび操作性を持ち、プラットフォームの違いを意識せずにシームレスに使えるサービスとなると、実は意外と少ないものだ。スマホの二刀流化をきっかけに、これまで使い続けてきたサービスから、今回挙げるサービスへの移行も検討してみてはいか
【WordPress】スマホサイト作成！テーマファイルの効率化
index.phpでホーム、カテゴリ、タグ、アーカイブを共通運用 通常のテーマでは、ホーム（トップページ）は「home.php」、カテゴリ一覧ページは「category.php」、タグ一覧ページは「tag.php」、年月日のアーカイブページは「archive.php」を利用します。 私が今回作成したスマホテーマでは、これらは全て「記事一覧」を表示することにしました。そしてデザインや構造も統一して「index.php」という1つのファイルで共通管理することにしました。 WordPressは該当するテーマファイル（例えば「tag.php」など）が見つからなければ、最後には「index.php」を探して適用します。ファイルの優先順位は下の記事も参考にしてくだい。 ⇒WordPressのテンプレートファイルの種類と使い方を覚える – MdN Design Interactive このように1つのテ
地方は今でもガラケー主流なのか？ スマホの普及状況を地域別に調べてみた | 初代編集長ブログ―安田英久
今日は、「地方でスマホはどれぐらい普及してきているのか」つまり地域別のスマホ普及状況の話題です。 スマホばかりなのは首都圏だけで、地方に行くと、まだまだガラケーが多いよね。 こういう会話を、2012年～2013年頃に、よくしていました。ずっと東京にいるとみんなスマホを使っているように見えるけど、地方では実はそんなことなくて、まだまだガラケーが主流だということですね。 では、今はどうなのでしょうか？ 結論から言うと、どうやら地域によるスマホの普及状況は、以前ほど違いはなくなってきていると考えて問題なさそうです。 参照したのは、「全国スマートフォンユーザー1000人定期調査（第8回）」のデータ。博報堂DYグループのスマートデバイス・ビジネスセンターが行っている調査です。 2013年11月の調査では、全国のスマホ保有率は55.2%。地域別にみても、最も低い四国で48.9%、ほかは軒並み53%～5
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
NOW OR NEVER
iOS, Androidのさまざまなスマホ・タブレットのサイズやCSSでの値が一覧できるサイト -mydevice.io
ブックマークしておきたい、スマホUIをコレクションしている海外と日本のサイトのまとめ
TechCrunch
