PhotoSwipe
What’s new in v5Code quality and rewrite in ES6The script is now distributed as an ES module and does not require a build step to use. The documentation is also updated and now includes more examples. Simpler initialization and dynamic import supportPhotoSwipe now supports dynamic import and does not block page rendering. <script type="module"> import Lightbox from './photoswipe-lightbox.esm.js';
iPhone,iPadをPC上でエミュレータ「iBBDemo2.0」使い方？快適にシミュレーター可能
あなたのサイトやブログは今大流行中のアップルのiPhoneやiPad（日本ではソフトバンク販売）でどのように見えるだろうか？iPhoneやiPadが手元になくても見える方法はないのか？このブログはiPhoneで以下のように見えました。 iPadでは以下のようにシミュレーション（デモンストレーション）できました。 私のこのブログはＰＣでシミュレーションしてiPhoneやiPadを画像にあるように見えることを確認しました。日本語がないので苦労しましたが、このシミュレーションを可能にした無料エミュレータのソフトの「iBBDemo2.0」の使い方とは？ 無料ソフトのエミュレータ「iBBDemo2.0」の使い方 iPhoneやiPadでどのように見えるのかを簡単にＰＣでシミュレーションしてくれるエミュレータが「iBBDemo2.0」ですね。この優れもののソフトはアップルのＳａｆａｒｉ（サファリ）とい
ラウンドアバウト | デベロッパーコネクション - テンプレートダウンロード
宣言やmetaタグなどが記述されているのみの、デザインを含まない白紙のテンプレートです。ラウンドアバウト推奨のデフォルトCSSとCSS変換シート、device-group.confも含まれています。 ※これはラウンドアバウトバージョン2系・ラウンドアバウト（IIS版）用テンプレートです。ラウンドアバウトバージョン1系では使わないでください。 ※デフォルトCSS変換シートを使用するには、device-group.confもバージョン2系用にする必要があります。 →device-group.confの配置箇所に関してはインストール手順書をご参照ください。 <?xml version="1.0" encoding="UTF-8"?> <?ra-page viewport="auto" image-convert="no" g="SP"?> <!DOCTYPE html PUBLIC "-//W3
スマートフォンサイトの制作 - 基礎編 - - ぺーぺーエンジニアのおぼえがき
はじめに iPhone+Androidスマートフォンサイト制作入門を読んだことを忘れないようにメモ iPhoneの仕様を確認 端末 iPhone3G iPhone3G S iPhone4 ipad 解像度 iPhone3G、iPhone3G S : 320 x 480px iPhone4 : 640 x 960px iPhone4はiPhone3G、iPhone3G Sと比べて解像度が2倍あるが、 ブラウザーは100%表示時に320 x 480pxで表示する仕様になっている為、見た目が変わらない ブラウザ ソフトウェア：safari レンダリングエンジン：WebKit プラグイン プラグイン非対応 文字コード 文字コード変更不可 ・表示された文字コードを変更できないため、metaタグで正しく文字コードを指定する ・テキストファイルに直リンクを貼り表示させる場合はShift JISでしか見え
初心者のためのスマートフォンサイトを作るときに見ておきたいサイト｜WEB Drawer -WEB制作に関するメモサイト-
スマートフォンサイトを本格的に作るようになってきたので、いろいろ基本的なことから調べてみました。 自分はコーディングがメインなので、HTML/CSS/JSが主になっています。 制作する前に仕様の確認 スマートフォンの仕様が載っています。一通り目を通すと、製作してる時に「これができない！」などの問題が回避できるかもしれません。 ASCII.jp：サイト制作の前に知りたいiPhone/Androidの仕様｜実践！iPhone＆Androidサイト制作ガイド ASCII.jp：サイト制作の前に知りたいiPhone/Androidの仕様｜実践！iPhone＆Androidサイト制作ガイド スマートフォンサイトの制作 – 基礎編 – – ぺーぺーエンジニアのおぼえがき スマートフォンサイトの制作 – 基礎編 – – ぺーぺーエンジニアのおぼえがき iPhone iPad向けサイトを制作するためのいろ
jQuery Mobileとは――スマホ時代の到来とWeb制作 (1/3)
「jQuery Mobile」は、モバイルWebアプリケーションやスマートフォンサイトの構築でいまもっとも注目されているフレームワークです。jQuery Mobileを使えば、iPhone/Androidをはじめ、さまざまなスマートフォンのブラウザーに対応したスマートフォンサイトを手軽に制作できます。 jQuery Mobileを使ったスマホサイト制作の基本から実践的なテクニックまで、ベストセラー「Web制作の現場で使う jQueryデザイン入門」（Web Professional Books）の著者・西畑一馬さんが解説します。（編集部） 「jQuery Mobile」は、モバイルWebアプリケーションやスマートフォンサイトの構築でいまもっとも注目されているフレームワークです。jQuery Mobileを使えば、iPhone/Androidをはじめ、さまざまなスマートフォンのブラウザーに対
初心者でも２週間でiPhoneアプリが作れちゃうTitanium Mobileがすごい件 | 株式会社インフィニットループ技術ブログ
初心者でも２週間でiPhoneアプリが作れちゃうTitanium Mobileがすごい件 どうもこんにちは、フレッシュさに定評のない新入社員のtek_kocです。 初めてのお仕事として「Titanium Mobileでアプリを試しにつくってみる」というのを担当していました。 JavaScriptはあまり使ったことがないですし、そもそもMacもほとんど触ったことがなかったので苦戦するかと思いましたが、２週間ほどでとりあえず形になるところまでできました。Titanium Mobileすごいです。 ということで、Titanium Mobileで試しにアプリ開発をしてみた感想を書いてみました。 そもそもTitanium Mobileとは？ Titanium Mobileとは、Appcelerator社によるスマートフォン対応アプリケーションの開発環境です。 iPhoneやiPad、Androidを
スマートフォン(iPhone/Android)アプリ制作時に役立つ画像サイズのまとめ
こんにちは、鴨田です。 最近、スマートフォン関連の仕事が多いのですが、 スマートフォン絡みのデザインをするときに、 この画像はどんなサイズだったっけ、 っていうことが多いので、まとめておきたいと思います。 ■画面サイズ[画面解像度](単位：px) iPhone3G / 3GS 320×480 iPhone4 640×960 iPad / iPad 2 768×1024 HT-03A 320×480 Xperia (SO-01B) / Xperia arc (SO-01C) 480×854 HTC Desire (X06HT) 480×800 Nexus One 480×800 Galaxy S 480×800 IS03 640×960 Galaxy Tab 600×1024 主要な機種だけ載せておきます。 AndroidはWide対応が主流ですね。 ■Lancherアイコンサイズ(単位：p
C言語すら知らなかった私の半年後 - 2個めのiPhoneアプリをリリースするまでにやった事 | Last Day. jp
『iOkinawa!2.0』をリリースしてからはXCodeに触れる時間が無くなってしまいました。それでも新しいアプリケーションは作りたい気持ちはあったので2月から又アプリケーション開発に着手しました。 Fasterous 1.2（￥85） カテゴリ: ライフスタイル, ソーシャルネットワーキング 販売元: Ray Matayoshi – Sayobs（サイズ: 0.4 MB） 全てのバージョンの評価: （7件の評価） 忘れてるORZ３，４ヶ月全くXCodeに触れてないなかったので、もう何が何だか思い出すのに時間がかかりました。やっぱり毎日少しでも触ってないとダメですね。 何を作るか？最近自分の過去のスケジュールテーブルを書かないといけなかったのですが、その時日誌とかそういった類のものを一切つけてない私は全く自分が何をしてたわからず愕然としました。 @goryugoさんオススメのPoster
スマートフォン講座 : LINE Corporation ディレクターブログ
2011年04月19日 【スマホ集中連載 第11回(最終回)】過去10回分の“大事”なところをまとめました Tweet 2011年04月14日 【スマホ集中連載 第10回】 "キャリアの動向も気にしていますか?"〜各アプリマーケットのコンテンツや決済、審査などを徹底研究 Tweet 2011年04月12日 【スマホ集中連載 第9回】 "意味まで正確に理解していますか？" Androidアプリ開発における重要用語集 コメント数:コメント(0) トラックバック数:トラックバック(0) Tweet 2011年04月07日 【スマホ集中連載 第8回】デコメ投稿サイトのビジネスチャンスと、立ち上げまでにしてきたこと コメント数:コメント(0) トラックバック数:トラックバック(0) Tweet 2011年04月05日 【スマホ集中連載 第7回】 小技紹介 "Android端末で画面キャプチャを撮る方
Yahoo！JAPANが「アプリ検索」公開 Appleが全アプリデータ供給
ヤフーは3月9日、iPhone／iPadアプリを検索できる「Yahoo！検索 アプリ検索」を公開した。App Storeの全アプリデータをAppleが初めて供給し、検索結果に反映させている。 PC版サイトでは検索窓上部の「一覧」からプルダウンで「アプリ」を選択して検索。iPhone版サイトでは検索窓の虫眼鏡をクリックして「アプリ」を選択する。無料・有料や価格の安い／高い順などの条件で絞り込みも可能だ。 検索結果ページでは該当するアプリの説明文や価格などを表示し、各アプリのiTunes Storeのページにリンクする。「表示形式」で「スクリーンショット」を選ぶと、検索結果ページにスクリーンショットのサムネイルを表示する。
「jQuery Mobile」の登場で、モバイルアプリケーション開発は大きく変わる － Publickey
このところHTML5関連のモバイルアプリケーション開発について調べていて、先週の水曜日にはSwapSkills主催のイベント「jQueryモバイルで簡単！ スマートフォンサイト作成」に参加してjQuery Mobileについて勉強してきました。 jQuery Mobileとは、jQueryのプラグインとして利用するモバイルアプリケーション用のライブラリです。そしてその驚異的なまでの簡単さは、これから業務用のモバイルアプリケーションの作り方を一変させてしまう可能性を感じさせます。 jQuery Mobileの大きな特徴は次の3つです。 1）HTMLを書くだけでモバイルアプリケーションができてしまう 2）モバイルのユーザーインターフェイス対応の部品が多く揃っている 3）iOS、Android、WebOS、Windows Moblie、Symbianなどクロスプラットフォーム対応である 具体的な
iPhoneデザインアーカイブ
【初めての方はこちらをクリック】 iPhoneデザインアーカイブは、携帯サイトキャプチャ集「モバイルデザインアーカイブ」の姉妹サイトです。 iPhoneサイトを制作する上で参考になる秀逸なデザインを持つサイトのキャプチャを集めています。 iPhoneサイト制作を請け負ったけど、「なかなかデザインがまとまらない」「洗練されたデザインを参考にしたい」といった方のために、 優れたiPhoneサイトのデザインを集めました。また、iPhoneサイトにまだ手を出されていないモバイルデザイナーの方に、iPhone サイトデザインの雰囲気を掴んでいただくことで、「今後の仕事の幅を広げるきっかけになれば・・」、という思いで立ち上げました。 デザインに優れたiPhoneサイトはもちろん、技術的に優れたiPhoneサイト、そして現在のトレンドを捉えたiPhoneサイトを掲載しています。 なお、意識的にiPhon
HTML5/CSS3で作るスマートフォンサイトの基本 (1/5)
スマートフォンサイトのサイト設計、画面設計に続き、今回はデザインとHTML/CSSの制作です。前回作成したワイヤーフレームをもとにデザインカンプを作成し、HTML/CSSをコーディングしていきます。 Photoshopでデザインカンプを作成する 最初に、グラフィックソフトを利用してデザインカンプを作成します。今回はPhotoshop CS5を使いましたが、FireworksやIllustratorなど使い慣れたツールで構いません。 デザインにあたっては、スマートフォンのブラウザーの画面領域を定義したテンプレートを用意してからデザインパーツを作成、配置していきます。画面領域はサイズを測ってガイドを引いてもよいですが、本連載の第5回で紹介したデザインテンプレートを利用するのが手軽です。
作って学ぶスマートフォン対応サイトの基本 (2/4)
基本のHTMLを作成する 最低限の制作環境が整ったところで、さっそく簡単なスマートフォン向けWebページを作成してみましょう。エディターを起動して、次のようなHTMLを用意します。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>スマートフォンサイトテスト</title> </head> <body> </body> </html> 今回はHTML5で記述していますが、基本的にはHTML4やXHTMLなど、PC向けのHTML/XHTMLがほぼ利用できます（iモードなど携帯サイト用のHTMLは正しく表示できません）。続いて、基本的なマークアップを施していきます。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>
スマートフォンサイトをデザインする7つのポイント (1/3)
Webサイトをデザインするときは、単なる見た目の美しさだけでなく、情報の見やすさや使いやすさなどの「ユーザビリティ」や、高齢者や障がい者の方も快適に使える「アクセシビリティ」に留意する必要があります。さらに、スマートフォンサイトのデザインでは携帯電話端末ならではの特性も考慮しなければなりません。 デザインに必要な環境を整える WebサイトのデザインではいきなりHTMLを書くのではなく、まずPhotoshopやFireworksなどの画像作成ソフトを使って「デザインカンプ」を作成し、画像パーツを切り出してHTML化していくのが一般的です。こうした流れはスマートフォンサイトの場合でも変わりません。 ブラウザー枠を用意しよう PCサイトを制作するときには、デザインカンプを実際のサイトのイメージに近づけるため、Webブラウザーの枠を含む状態でデザインすることがよくあります。そこで、スマートフォンサ
iPhone向けサイト構築 基礎文法最速マスター - EC studio デザインブログ
弊社代表の著書、「iPhoneとツイッターで会社は儲かる」の出版記念と、巷で話題の「基礎文法最速マスター」ブームに便乗して、iPhone（iPod Touch）向けサイト構築における基礎とプラス応用のネタと、参考になるリンク集をまとめました。 2010/11/18追記： iPhone向けサイト制作の書籍を執筆しました！ 既存のデスクトップ向けサイトをモデルにした iPhoneに最適化したサンプルサイトの紹介と コードの解説をしています。 iPhone向けサイト制作の入門書に最適です。 「HTML5＋CSS3で作る 魅せるiPhoneサイト」 基礎編 対象ブラウザはMobileSafariです レンダリングエンジンはSafariと同じwebkitですが、MobileSafariの方にはiPhone向けの一部独自拡張（CSS）があります。検証の際は、通常のSafariのウィンドウサイズを狭くし
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
HTML5とCSS3を使ってスマートフォン向けサイトを構築 － iPhone版Yahoo!JAPANトップの開発事例紹介
実践！iPhone＆Androidサイト制作ガイド
Webサイトをスマートフォン対応してと言われた時に見ておきたいサイトまとめ｜caraldo.net | WebとiPhoneとロードバイクが大好き！