Thousands of Free Templates Just for You! The easiest way to create professional designs for free! Choose from our ever changing library of free mockups, designs, videos and logos.
スマートフォン向けの 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>に見えるのが隠し味になっていま
制限 同時に再生できる音源は1ファイルのみ 再生できるタイミングはユーザイベントのハンドラ内だけ プリロード不可 OS自体のサイレントモードと連動せず BGMを流すだけならこんな方法も $('<div>BGMを再生しますか?</div>').appendTo('body').click(function () { $(this).remove(); (new Audio('bgm.mp3')).play(); }); $('body').on('click', 'a', function (e) { e.preventDefault(); $.get($(this).attr('href')).success(function (html) { $('body').html(''); $('body').append($(html).find('body')); }) });
最近では、Googleスプレッドシートを使っている人も多いと思う。Googleスプレッドシートは、オンライン上で簡単に共有でき、同時編集も可能である。これだけで十分に役立つのだが、実は、ほとんどの人はスプレッドシートの本当の可能性に気づいていない。 あまり知られていないが、Apps Scriptという仕組みが提供されておりスプレッドシートのデータを書き換えたり、チャットツールと連携するなどの様々な処理が可能だ。うまく使うことで業務効率を大きく改善できる。 ここでは、サンプルとしてスプレッドシートを使って、簡単な社内向けタスク管理ツールを作ってみよう。 今回作るもの シンプルなタスク管理用のシートだ。小さなプロジェクトであれば、このようなシンプルなもので管理することも多いだろう。 機能としては、次の2つを実装してみよう。 ステータスの変更時(タスクが割り当てられたり、開始したり、完了)に、チ
ICANN, the Internet Corporation for Assigned Names and Numbers, requires us to ask you as a Registrant of a domain name to verify your contact information for this domain with your provider. As a Registrant of a domain name, a new domain registration or changes to the first name, last name, contact address or email address of an existing domain name, requires verification of the information within
The way mobile devices are being used is changing all the time, and users are increasingly expecting exceptional experiences from the applications they use. In this post, Tim R. Todish brings us guidelines to help you create a great experience in your mobile application. In your pocket right now is the most powerful “remote control” (as Drew Diskin put it) that has ever existed. It is no ordinary
AppMobi has just launched 2 new HTML5 javascript frameworks for developers building mobile applications. The new aUX (appMobi User Experience) APIs are being offered to the community as open source projects here on GitHub, where they are available for free. One framework is designed for building apps using appMobi's suite of tools while the other can be used by anyone building HTML5 mobile apps, s
How to contribute? If you want to help with testing, simple render HTML5 test page on your mobile device and fill the blank test result below. Sharing is caring ♥ Feedback? If you have an issue/feedback with any data, just update with a small message explain the change; or if not sure, raise an issue.
YSlow for Mobile works as a bookmaklet. Users can now run the equivalent of regular YSlow in Mobile browsers as well as any bookmarklet enabled desktop browsers. Mobile Installation Instructions Option One - Bookmark This Page Bookmark this page; Edit the bookmark URL to remove everything up to and including the hash ("#"). The bookmark URL starts with "javascript:" as shown in the screenshot belo
At the Velocity Conference today, Yahoo! announced the launch of YSlow for Mobile, which brings YSlow’s web performance analysis to the mobile platform for the first time. YSlow for Mobile analyzes your mobile web site performance, and suggests ways to make mobile web pages load faster – right in your mobile device. It is a bookmarklet – an unobtrusive JavaScript program stored in a browser’s book
スマートフォンなどのモバイル向けのWebサイトを作るときに考えておきたいこと、制作に役立つツールなど、その辺りの情報が記載されたWebサイトを仕事でちょっとまとめることがあったので公開します。要は俺ブックマークまとめです。 常日頃溜め込んだものを身近な人たちだけに教えるのはもったいないと思いましてね。さすがに何年も前のは入れてませんし、各種公式資料みたいなものも入れていませんが、昨日今日出た新しい情報までを順不同で入れています。興味のある方はリンク先でお勉強してください(全部英語ですけどね 笑)。 ※「Responsive Web Design」とか「Adaptive Web Design」とかの情報はほとんど入れていません(抜いてますw)。ほぼほぼスマートフォン向けのWeb制作に特化したリンク集です。 Mobile Web Resources, BrowsersMobile Web Pr
The alpha service of the new Mobile Checker has been retired. Be mobile friendly The Mobile Checker is a tool for Web developers who want to make their Web page or Web app work better on mobile devices. Learn more. Contribute Looking to contribute to Mobile Checker? There are many ways to get involved in its development. Please take a few minutes to read this document to understand how you can hel
初めての投稿となります。エンジニアのmatsuです。 携帯向けウェブサイトを1時間でスマートフォン対応する方法を紹介します。 概要 2011年4月7日のニュースにて携帯電話の新規契約数のうち、スマートフォンが占める割合が50%を越え、スマートフォンが本格的に普及する兆しが見えてきました。 現在、スマートフォン向けサイトを新規構築するためのチュートリアルは数多く出ていますが、既存の携帯サイトをスマートフォンに最適化する方法があまり紹介されていないのでこの記事で紹介したいと思います。 このチュートリアルを行うと以下のようになります。 実装 全部で8ステップあります。 このチュートリアルではブログのトップページを例にとって説明します。 前半では文字コードの変更、HTMLの変更といった構造を変更します。後半では絵文字や文字スタイルを行い、仕上げとしてHTML5のバリデーションを行っていきます。最初
The rise of smart devices like the iPhone and iPad has led to an application goldrush, with companies racing to stake their claim. In the early days we saw a few lucky pioneers strike gold, but like most gold rushes, the obvious targets were quickly depleted. Digital prospectors lured by the promise of gold are now arriving to find a very different market—one rife with competition and few obvious
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く