このブログではないですが、Google Analyticsを見るとスマートフォンからのアクセスが結構あったので、スマートフォン向けのサイトを作ってみようと思いました。 ただ、スマホ向けのサイトは作ったことがないので、まず実際に色んなサイトを見て参考にしようと思い、ギャラリーサイトを調べてみました。 国内ギャラリー まずは国内サイトです。iPhoneが中心になっています。この3つのほかにも色々ありましたが、内容的には似ているので、更新頻度や使いやすさなどを基準に選びました。 iPhoneデザインボックス 画像が大きく見やすいです。個別ページでは画像も多くPCサイトとの比較もあってとても使いやすいです。カテゴリもしっかりしています。 iPhoneデザインアーカイブ 掲載サイト数が多く、更新頻度もかなり高いです。 スマートフォンサイト集めました。 すっきりしたデザインで見やすいです。カテゴリも業

娘の好きなアイドルを AKB48 からももいろクローバーZ にシフトチェンジ実行中のishidaです。 来月は娘の誕生日。プレゼントはももくろDVDでいいよね？ さてさて、Movable　Typeで構築したWebサイトでスマートフォン対応したいというクライアントさんからのご要望が多々あります。 デザインもページもオリジナルで作成はできますが、それなりのコストはかかってしまいますよね。 予算はないんだけど対応したいよ！って場合も出てきます。 そこで今回は予算もあまりかけずに、Movable　Typeをちゃちゃっとスマートフォン対応させるためのプラグインをまとめてみました。 フリーのMTテンプレートでスマートフォン対応 【Retinaディスプレイ対応】Smart Phone テンプレート for MT おまけも付いてくるよ。 - CSS HappyLife CSS HappyLifeさん作成に

photo credit: Plutor apptoiさんのページからびっくりするような情報が(ﾟдﾟ)！ iCloudでは5GBのオンラインストレージが無料で利用できるが、Box.netはその10倍の50GBのストレージを無料で提供するキャンペーンを開始した。キャンペーンはアメリカ時間の10月12日から開始されており、応募期間は50日間。キャンペーン終了までに最新のBox.netアプリをダウンロードして既存のアカウントにログイン、または新規アカウントを作成すると、無期限で利用可能な50GBのストレージが獲得できる。 via : apptoi: Box.netが50GBのストレージを無料で提供 なんと、あのBox.netが期間限定ではあるものの、iPhone/iPadユーザ向けに50GBのストレージを無料で提供するキャンペーンを行っているようです！ 早速、私もiPhoneアプリをダウンロー

スマートフォンやiPadなどのタブレットはもちろん、 様々なウィンドウサイズにも自動でレイアウトを 調整するレスポンシブなjQueryスライダーのご 紹介。FLEXSLIDERは4KBと軽量で、実装も 手軽なので覚えておくと重宝しそうです。マーク アップも簡単なのでiPhone向けサイトの構築 時に導入を検討したいですね。 以前もレスポンシブWebデザイン対応のスライダーをご紹介しました（Blueberryというスクリプトです）が、こちらは加えて軽量なスクリプトで表示も速いようです。 見た目はシンプルなスライダーですが、iPhoneやiPadのようなウィンドウサイズの狭いデバイスにもレイアウトを自動で調整してくれます。スクリプトも4KBと、とても軽量なのでMediaQueriesとうまく併用したいところですね。 iPhoneでの表示。自動で幅を調整しています。 iPadの幅だとこんな感じ。

来月はキャプテン・アメリカ見るし、気が付いたら年中アメコミ映画を見ているminamiです。 来月にはまた大きな発表がいろいろありそうなiPhone界隈ですが、iPhoneサイトのコーディングをする際につまづいてきたポイントを挙げてみました。 [HTML] input type="file"は使えない 画像をアップするコンテンツだからフォームに input type="file" を・・・と考えがちですが、iPhone版のSafariでは使用不可です。 [HTML] <meta name="viewport" content="user-scalable=no">が効かない 最近ハマったポイントです。ユーザーに画面の拡大をさせなくすることができるviewportのuser-scalableプロパティですが、本体のアクセシビリティ設定で「ズーム機能」をオンにしているとバッチリ拡大できてしまいま

iPhoneやiPad、Android端末の普及でスマートフォン専用のページを用意するサイトも増えてきています。 スマートフォンからのアクセスに対して「リダイレクトによってスマートフォン専用のURLに振り分けるとき」の注意点を今日はお伝えします。 rel=”canonical”タグで、対応するデスクトップ用ページのURLを指定してください。 重複コンテンツの発生を防止するためです。 現状GoogleはデスクトップPCとスマートフォンを区別せず同等に扱います。 スマートフォン用の検索結果も用意していません。 共に、ウェブクローラのGooglebotがクローリングします。 ※従来のモバイル端末はモバイルクローラのGooglebot-Mobileがクローリングします。詳しくはこちらの記事を参照。 スマートフォン用のコンテンツはデスクトップ用のページと、完全ではないにしてもほぼ同じになるはずです。

※この記事はChromeで見るのがおすすめです。 こんにちは。新規開発グループ ディレクター兼マークアップエンジニアの浜です。 スマホ連載の第4回目は、HTML5とCSS3という実装寄りの内容になります。とは言っても難しいコードはあまり出てきません。「HTML5とCSS3で何ができるのか」という事をメインに、知っておくと、構成書を作る時のアイディアベースになったりデザイナー・マークアップエンジニア（コーダー）と打ち合わせをする際に話しやすくなる内容をお送りします。 記事のアウトラインは以下です。 そもそも、HTML5とCSS3ってもう使えるの？ HTML5とCSS3を使うメリットは？ HTML5とCSS3で何ができるの？ そもそも、HTML5とCSS3ってもう使えるの？ 使えます。 （※ここから先は、その根拠について説明します。必要ない方は、次の章に飛んでしまっても構いません） 現在のスマ

このところHTML5関連のモバイルアプリケーション開発について調べていて、先週の水曜日にはSwapSkills主催のイベント「jQueryモバイルで簡単！ スマートフォンサイト作成」に参加してjQuery Mobileについて勉強してきました。 jQuery Mobileとは、jQueryのプラグインとして利用するモバイルアプリケーション用のライブラリです。そしてその驚異的なまでの簡単さは、これから業務用のモバイルアプリケーションの作り方を一変させてしまう可能性を感じさせます。 jQuery Mobileの大きな特徴は次の3つです。 1）HTMLを書くだけでモバイルアプリケーションができてしまう 2）モバイルのユーザーインターフェイス対応の部品が多く揃っている 3）iOS、Android、WebOS、Windows Moblie、Symbianなどクロスプラットフォーム対応である 具体的な

モバイルサイトの制作事情が大きく変わりつつある。iPhone/Androidなどのスマートフォンがシェアを伸ばすなか、ケータイサイトのスマートフォン対応や、PCとスマートフォンのクロスデバイスサイトの制作ニーズも高まっているという。そうした新しいモバイルサイトの制作を学ぼうと、勉強会「SwapSkills スマートフォン時代の携帯サイト作成術」が、6月19日に東京都内で開催された（主催＝allwebクリエイター塾）。ゲストにIMJモバイル　ディレクターの丸居久仁男さんとブロガーの森 啓輔さんを迎え、70人近くのWeb制作者らがノウハウを共有した。 モバイルサイトに欠かせないユーザビリティ 「スマートフォン時代のモバイルユーザビリティ」というタイトルで発表したのは、IMJモバイルのディレクター丸居久仁男さん。丸居さんは、「2012年には全体の2割がスマートフォンになる」という携帯電話市場のシ

個人利用を中心に急伸を続けるスマートフォン市場は、もはやニッチ市場ではなくなりつつある。過去に企業サイトの携帯電話（フィーチャーフォン）対応が問われたように、今後スマートフォン向けのサイト対応が課題になると考えられる。2010年はスマートフォン元年といわれていたが、2011年は企業のスマートフォンサイトへの投資検討が本格化してくるだろう。 2010年、スマートフォンの市場規模は急成長し、『スマートフォン利用動向調査報告書2011』（MCPC監修、インプレスR&D発行）によると、2011年3月末（2010年度）の契約数は、前年の497万契約から63％増の810万契約となる見通しだ。調査によると、契約数は年平均40％以上で拡大を続け、2015年度には4,712万契約に、コンテンツ配信事業も急成長することが予測されている。こうした調査からも、今からサイトをスマートフォンに対応しておくことが決して

iTunesは、言うまでもなく便利なアプリですが、何も問題がない訳ではありません。iPhoneと同期している時に、問題が起こることはよくあります。そのような時のために、iTunesアプリ以外を使って、各種ファイルを同期する方法を、ご紹介しましょう。これで、iTunesを使わずに同期ができますよ。 ■写真 iPhoneでどんな風に写真がみたいとか、どれだけ写真を入れておきたいとか、そういったことを言えるほど、写真に関するオプションはありませんでした。米Lifehackerで最近紹介したアプリ『PhotoSync for Lazy』は、WindowsとiPhoneの写真を、自動的に素早く同期できます。クロスプラットフォームのアプリ『PhotoSync』は、パソコンと接続しなくてもワイヤレスで、iPhoneのカメラロールの写真をパソコンへ転送可能です。 『Dropbox』も、どのプラットフォーム

夏休みスペシャル 2024 iPhoneで3Dモデルを手軽に作成、無料の純正アプリ「Reality Composer」を試す 2024.08.09

当ブログをスマートフォン対応したいなーと思ってはいたけど、iPhone持ってないしXperiaの需要はどうなんだろうとか考えたり言い訳しつつずっと放置してましたが、今回 iPod Touch （先代の）を借りたので、勉強がてらiPhone対応と言うかスマートフォン対応してみました。 何かを実験するには自分のサイトが一番手っ取り早くて良いですね。 サイト持ってない方は、ホント何でもいいので、何かしら作ったほうがいいかなーと思います。 ドメイン取得して、サーバレンタルして、構成練って、デザイン・コーディングして、FTPクライアントでファイルアップしてみたり、MTやWPインストールしていじったり、CSS3の実験したり色々使えて便利ですし、カッチリ作れば実績にもなりますしね。 と、それは良いとして、スマートフォン対応したんです。えぇ。 CSS HappyLife for iPhone URLのオシ

『MarkeZine』が主催するマーケティング・イベント『MarkeZine Day』『MarkeZine Academy』『MarkeZine プレミアムセミナー』の 最新情報をはじめ、様々なイベント情報をまとめてご紹介します。 MarkeZine Day