スマートフォン対応でよく使うhtml、css、javascriptのまとめ
スマートフォン(ios、android)向けのウェブサイト・ウェブアプリを作る際に個人的によく使うhtml、css、javascriptの備忘録。 html関連 headタグ内での設定<!-- //デバイスサイズにあわせて表示領域を変更する --> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- //電話番号のリンクを無効化 --> <meta name="format-detection" content="telephone=no"> <!-- //ホーム画面用アイコン --> <link rel="apple-touch-icon" href="icon.png"> <!-- //ホーム画面用アイコンの光沢を無効化する --> <link rel="apple-touch-icon
Webサイト制作でつまずきがちな解像度に関わるあれこれ │ Design Spice
アプローチ方法は違うものの、このdipと先程のデバイスピクセル比はほぼ同じ目的を持った機能です。 参考：Androidレイアウトの単位 – dpについて掘り下げる – アンテナ立てて viewport 仮想的なウインドウサイズです。 viewportがないと仮定した場合、デバイス幅320pxのiPhoneでインターネットにアクセスした時のウインドウサイズは320ピクセルとなり、通常のサイトを閲覧するには不便です。 そこで仮想的に大きいウインドウサイズとすることで、通常のサイトでもひと目で情報が見え、閲覧性や操作性を高まります。 viewportのデフォルト値は980ピクセルです。 （※iPhoneは980ピクセルで間違いないのですが全てのスマホで980ピクセルでしょうか？ 情報が見つからなかったので知ってる方は教えてください） また、viewportの数値はサイト側で指定できます。 スマホ
これがスマートフォン向けサイトを作るときの viewport 設定３パターンだ
スマートフォン向けの Web サイトを作るとき、viewport の設定次第で使い勝手が大幅に変わる。 最近はレスポンシブ Web デザインが流行してるけども、その大前提として viewport の設定パターンを抑えておくのは重要だろう。 この記事では、viewport の設定によって、見た目・使い勝手がどう変わるかを解説する。 パターン1: 何も考えずに HTML を書く まずは、viewport を指定せずに、単純な HTML をスマートフォンで表示してみる。 <!DOCTYPE html> <head> <meta charset="utf-8"> </head> <body> <img src="/images/logo-ja.png"> <p>色んな素材がごった煮になった様子をお椀で表現しています。 湯気が<strong>「てっく」</strong>に見えるのが隠し味になっていま
株式会社インプレスR&D｜POD技術を活用した出版サービスを提供する会社
SERVICE インプレスR&Dは、電子書籍とプリント・オンデマンド（POD）技術を利用することで、デジタルファーストの次世代型電子出版プラットフォーム「NextPublishing」を開発。電子書籍と印刷書籍（紙の本）の同時制作、過剰在庫の解消を実現し、「持続可能な出版」をさまざまな形で提供しています。 一般には、専門的な書籍の発行や新しいテーマの企画は販売部数が限られ、収益を上げることが難しくなります。しかしインプレスR&Dでは、NextPublishingを使用することによりこのハードルを越えることが可能になりました。弊社は、優れた個人や組織が持つ貴重な知識・知見をもっと早く、もっとたくさん世に出したいと願い、積極的に企画・原稿を募集しております。
購買プロセスに加速度的に取り入れられるスマートフォン - モバイル ショッパー リサーチの結果から
＊お知らせ＊ こちらのサイトでは、新しいブログの記事は更新されません。 2016 年 2 月 23 日以降の投稿は、「広告主コミュニティ」の公式ブログにて行われます。 Posted by 柿原 正郎 マーケットインサイト シニアリサーチマネージャー 今日の生活者のショッピング行動は、ますます複雑にマルチチャネル化してきています 。テレビ、新聞、デスクトップ PC、スマートフォン、タブレットなど、さまざまなメディアから生活者は多種多彩な情報を得て、実際の買い物でもオンライン・オフライン双方の様々な購入チャネルをますますスマートに選ぶようになってきています。また、オンラインの買い物でもオフラインの買い物でも、Google が提唱している ZMOT (Zero Moment Of Truth) *の重要性はますます高まっています。 * ZMOT とは、生活者の購入決定プロセスにおいて、購入意向を
スマートフォンサイトを作る時に便利なフリックが実装できるjQueryプラグイン7選
スマートフォンを使うときによく使う操作方法としてフリックがあります。このフリックの操作でギャラリーができるjQueryプラグインを集めました。 Androidを持ってないので、全てがAndroidで動くかは未検証ですがだいたい動くと思います。 flickGal 自分が一番つかってるのがこのflickGalです。 PC（IE以外）でも動作します。 flickGal・・・iPhoneでフリックギャラリーを簡単に実装できるjQueryプラグインです – piglovesyouの日記 flickable こちらはPCでフリックができるようにできるプラグインです。そのままスマートフォンでも使えます。 PCでも（IE6でも）よく動きます。 jQuery.flickable: iPhone and Android like flick scrolling plugin flickSimple こちらもP
通勤中でも寝る前でも！iPhoneプログラミングを勉強出来る簡単な方法！ » SHINGOLOG
Appleから提供されているiOSのプログラミングガイド。日本語に翻訳されたiOSのドキュメントがあります。iOSデバイス向けのアプリを開発するにあたっては、必読の内容となっています。 これらは全てPDFで提供されています。 ですのでiPhoneでPDFを開き、iBooksで保存することが出来ます。 このように、持ち運んで空き時間に勉強できるんです。 PDFのリンクは下記にまとめていますので、iPhoneでご覧ください！ iOSのドキュメント一覧(2011.8.20現時点) Audio & Video AV Foundationプログラミングガイド iOSカメラプログラミングトピックス Audio Session プログラミングガイド Core Audio の概要 iPodライブラリアクセス プログラミングガイド Tools & Languages Objective-C
無料で学べる！iPhoneアプリ開発情報まとめ厳選38個！ » SHINGOLOG
iPhoneアプリ開発に関する本は溢れていますが、iOSはとても奥が深く、本だけでは自分に必要な情報を集めきることは不可能です。そこで、突っ込んだ情報はインターネットを使って、探していくことが必要です。今回は、インターネットで公開されている有益なサイトをまとめてみました。 iPhoneアプリ開発の基礎 いまさら聞けないiPhone/iPadアプリの作り方の基礎 目指せ！iPhoneアプリ開発エキスパート iPhoneプログラミングの基礎：View Controller 第2回 iOSアプリ開発の準備 iOS Developer Programへの登録方法 C言語すら知らなかった私が２ヶ月でiPhoneアプリをリリースするまでにやった事。 Objective-Cについて Objective-C入門 Objective-C 最速基礎文法マスター Obejctive-C 3分クッキング 苦しんで
スマートフォンサイトの作成術 - 大川洋一
2011年4月2日に開催されたPHPカンファレンス関西で使用した「スマートフォンサイトの作成術」のスライドです。Read less
絶対見ておきたい有名企業のスマホサイトまとめ (1/5)
この記事で取り上げているスマートフォンサイトの「BEFORE & AFTER」を以下の記事で紹介しています。合わせてご覧ください。 日本のスマホサイトは2年間でこんなに変わった iPhone、Androidの普及を背景に、スマートフォンのブラウザー向けにコンテンツや表示を最適化した「スマートフォンサイト」（スマホサイト）を開設する企業が増えている。当初はiPhone（iOS）の標準UIに倣った画一的なデザインが多かったが、最近では独特のレイアウトや斬新な色使いの個性的なスマートフォンサイトも増えてきた。 ここでは、Web制作者が見ておきたいスマートフォンサイトを紹介する。実務で参考にできるように、対象を日本語の企業サイトに絞り、業種別に分類してまとめた。スマートフォンサイトの制作に入る前にチェックしておこう。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
