キーワード検索「解像度」
ゼロからでも始められるスマートフォン専用サイト(iPhone&Android)の作り方を学べるサイト集めました | HTML5でサイトをつくろう
これからのWEB制作はPCサイトだけではなく、iphoneなどのスマートフォンやipadなどさまざまなデバイスでの閲覧を前提として作成しなければいけません。 iphoneサイトやAndroidサイトはHTML5やCSS3にかなり対応しているので簡単そうなイメージもありますが、縦画面、横画面など変化することを前提に構築しなければいけませんし、Androidは機種によって解像度が違う、機種によってCS...
スマートフォン向けフレームワーク注目の「jQuery Mobile」でスマホサイトを作ってみよう【基本編】 | HTML5でサイトをつくろう
jQuery Mobileってなに? jQuery Mobileは、javascriptのフレームワークです。スマートフォン向けの直観的で使いやすいUIを瞬時に作成できます。 JavaScriptをWebデザイナーでも扱える身近な存在に変えた「jQuery」。そのjQueryと同じ開発元からリリースされていることもあって、スマートフォン向けフレームワークとして注目のjQuery Mobile、文法...
いまのWebサイトを低予算でスマートフォンに対応させるための5つのTIPS
Web屋のネタ帳Webビジネスに必要な「戦略」「システム」「デザイン」の3要素とそれらをまとめる「マネジメント」について現場の実感と独自の観点でお送りするコラム・・・のはずなんですが、要するにWebがらみのシステム&デザイン業界に関する小ネタとツッコミの雑記です。スマートフォンは普及期に達しつつある、なんて話は今さら?では、「いまあなたが仕事で関わっているWebサイトをiPhoneやandroid...
プログラミン | 文部科学省
文部科学省「プログラミン」は1024x768ピクセル以上のモニタ解像度でご覧ください。 ご覧いただくためには、最新版のFlashPlayerをインストールのうえ、 JavaScriptを有効にしてください。「Adobe Flash Player」の最新版はアドビシステムズ社のWebサイトより無料でダウンロードできます。 インストール方法については、配布元の説明をお読みください。
どんな解像度のディスプレイでも文字をぴったり大きく画面にフィットできるjQueryプラグイン「FitText」:phpspot開発日誌
どんな解像度のディスプレイでも文字をぴったり大きく画面にフィットできるjQueryプラグイン「FitText」 2011年05月12日- FitText - A plugin for inflating web type どんな解像度のディスプレイでも文字をぴったり大きく画面にフィットできるjQueryプラグイン「FitText」 iPhone/iPadやPCでも文字をフィットさせられます。 ブラ...
これは必見かもなYoutube等の埋め込み動画を動的にリサイズするCSS例:phpspot開発日誌
CSS: Elastic Videos これは必見かもなYoutube等の埋め込み動画を動的にリサイズするCSS例。 ブロックのサイズが変更された際において動画を固定サイズにしてしまうとレイアウトが崩れてしまいますが、公開されているサンプルを使うと、HTML5動画、embed/iframeの動画をレイアウトに合わせてCSSで自由に伸縮可能。 解像度の違う、iPhone等でも動作を確認しているそうで...
スマートフォンアプリやスマホサイトのUI設計をする際に参考になる記事まとめ7つ - W3Q
【スマートフォンのユーザビリティチェックリスト】 1.小さくし過ぎない、詰め込み過ぎない 2.バラつきを無くす 3.タップしたオブジェクトは反応させる 4.画面遷移アニメーションを設定する 5.画像の解像度はきちんと合わせる 6.実装側でもデザインする 7.ローディング中も画面操作できるようにする 8.真っ白なローディング画面を避ける 9.更新頻度の低いコンテンツはローカルで保持する
iPadに最適化したサイトがつくれるかもしれない5つの方法(基本編) - EC studio デザインブログ
<link rel="stylesheet" media="only screen and (max-device-width: 1024px)" href="ipad.css" type="text/css" /> /* 好ましくない例 */これを使うことで横幅1024px以下のデバイスでアクセスされた場合に、ipad.cssを読み込むということはできるんですが、PCの場合でもこの程度の解像度の...
[JS]デスクトップはそのまま、新しいiPad, iPhone4には高解像度の画像を配置するスクリプト -jQuery Retina | コリス
Retinaディスプレイを採用している新しいiPad, iPhone4用にimg要素で配置した画像を高解像度のものに変更するjQueryのプラグインを紹介します。 jQuery Retinaのデモ jQuery Retinaの使い方 jQuery Retinaのデモ jQuery Retinaを使って画像を配置する方法は大きく分けて、3つあります。 imgタグに「data-retina」属性を加え...
ブラウザサイズに応じてclass名を自動で付け替えてくれるjQueryプラグイン「browserSizr」:phpspot開発日誌
ブラウザサイズに応じてclass名を自動で付け替えてくれるjQueryプラグイン「browserSizr」 2011年08月30日- jQuery browserSizr | jQuery Plugins ブラウザサイズに応じてclass名を自動で付け替えてくれるjQueryプラグイン「browserSizr」。 スマートフォンや色々な解像度のPCがあるご時世ですが、ブラウザのサイズに応じてコンテ...
ユーザーのIPアドレスやブラウザなどの詳細情報をまとめてメール送信させる「Support Details」 - GIGAZINE
OSの種類・解像度・ブラウザ名・ブラウザのウィンドウサイズ・IPアドレス・色数・JavaScriptのON/OFF・Flashのバージョン・CookieのON/OFFといった各種情報を簡単に表示し、指定したメールアドレスへ簡単に送信可能にしてくれるサイトが「Support Details」です。 Support Details | Tech Support Management http://su...
高解像度の画像のURLを入れるだけでGoogleマップみたいに拡大機能を付けられる「Zoom.it」:phpspot開発日誌
高解像度の画像のURLを入れるだけでGoogleマップみたいに拡大機能を付けられる「Zoom.it」2010年08月11日-Zoom.it 高解像度の画像のURLを入れるだけでGoogleマップみたいに拡大機能を付けられる「Zoom.it」。 こういうものを実現するライブラリ等はありましたが、Zoom.itはサイトにURLを貼りつけて送信するだけで、インスタントに実現でき、更に自サイトに埋めこむこ...
Retinaディスプレイ判別で自動で高解像度画像を出しわけ可能な単独ライブラリ「Retina.js」:phpspot開発日誌
Retinaディスプレイ判別で自動で高解像度画像を出しわけ可能な単独ライブラリ「Retina.js」 2012年04月12日- Retina.js | Retina graphics for your website Retinaディスプレイ判別で自動で高解像度画像を出しわけ可能な単独ライブラリ「Retina.js」 <img src="/images/my_image.png" /> という画像...
迫力あるフルスクリーンの背景スライドショーが実装できるjQueryプラグイン:phpspot開発日誌
Full Screen Background/Slideshow | jQuery Plugins 迫力あるフルスクリーンの背景スライドショーが実装できるjQueryプラグイン。 ブラウザのサイズに応じて画像のサイズも切り替わるというフルスクリーンのスライドショーが実現可能です。 大きめの解像度の写真を迫力そのままに出したいみたいなシチュエーションで使えるかもしれません。 フッターにサムネイルつき...
【Webアプリ】iPhone4 で画像をきれいに表示するもう一つの方法【mod_rewrite】 - nazonoDiary
12:46 | iPhone4は解像度が高いので、画像を切り替えないと、もやっとする。【Webアプリ】iPhone4 で画像をきれいに表示する色々な方法【試行錯誤編】 | KAYAC DESIGNER'S BLOG - カヤックの意匠部によるデザインやマークアップの話Retinaディスプレイに画像を最適化させるのって意外とめんどいよね!という現実に打ちのめされたので、まとめてみます。によると ぜん...
Googleマップ風のUIを実現できるJSライブラリ「Polymaps」:phpspot開発日誌
Polymaps Googleマップ風のUIを実現できるJSライブラリ「Polymaps」。 マウスホイールによる拡大・縮小機能もついてます。 サンプルも豊富です。 他にも同様のライブラリは存在しますが、1つの選択肢として覚えておいても良いかも 関連エントリ高解像度の画像のURLを入れるだけでGoogleマップみたいに拡大機能を付けられる「Zoom.it」 「Google Static Maps ...
レスポンシブウェブデザインの画象問題を解決する「Response JS」-JavaScript Library Archive
配布元:Response JS: mobile-first progressive enhancement in HTML5. ライセンス:MITライセンス 「Response JS」はレスポンシブウェブデザインの画象問題を解決するためのJavaScriptライブラリです。 レスポンシブウェブデザインではPC以外のiPhoneやAndroid、iPadなど複数の解像度、画面サイズ向けのデザインを1...
丸いレンズで画像をズームさせられるjQueryプラグイン「Zoomy」:phpspot開発日誌
Zoomy | jQuery Plugin | E-Magnification 丸いレンズで画像をズームさせられるjQueryプラグイン「Zoomy」。 このプラグインを使うことで次のような効果が得られます。 レンズのUIも実にリアルです。 アパレル系なんかのサイトで商品のディテールを見せたい場合に使えそうなUIですね。 関連エントリ高解像度の画像のURLを入れるだけでGoogleマップみたいに拡...
異なる解像度のデバイスでの動作確認がすぐ出来る「Screenfly」:phpspot開発日誌
Screenfly by QuirkTools ? Test Your Website at Different Screen Resolutions 異なる解像度のデバイスでの動作確認がすぐ出来る「Screenfly」。 あくまで解像度のみではありますが、ページ上で何の拡張も必要なくURLを入れるだけで解像度の変更が可能です。 デバイスの種類も豊富なので、多くの利用者見込みがあるサイトではこうし...
[ウェブサービスレビュー]PCの利用環境をまとめて確認できる「Support Details」 - CNET Japan
内容:「Support Details」は、アクセスするだけでPCの利用環境情報を一覧で表示してくれるサイトだ。取得した情報をメールで送信したり、CSVやPDFで出力することもできるため、自身の環境をすばやく確認したい場合はもちろん、サポートを受ける際などにも便利だ。 「Support Details」は、OSやブラウザの種別、画面解像度、IPアドレスといったPCの利用環境の情報を、アクセスするだ...
