Facebook風ドロワーメニューが手軽に導入できる drawer
「drawer」は、横からせり出してくる「ドロワーメニュー」をサイトに手軽に実装できるjQueryプラグインです。 ドロワーメニューはスマートフォンやタブレットなどのさまざまな画面サイズに柔軟に対応できる利点があり、GoogleやFacebookのモバイルサイトで利用されています。drawerプラグインは横幅の可変に対応していますので、レスポンシブ Web デザインにも利用できます。 drawerプラグインはGoogle ChromeなどのモダンブラウザーとInternet Explorer 10以降、スマートフォンではiOS 7のSafariとChromeに対応しています。 MITライセンスですので、著作権表示は削除せずに利用しましょう。 drawerは、パッケージマネージャーの「bower」でもインストールできます。bowerを導入している場合は、以下のコマンドですぐに利用できます。
アドビ、日本語対応フォントをGitHubで無料配布
日本語を含む3カ国語に対応したオープンソースフォント「Source Han Sans」をアドビがリリースした。Apache 2.0ライセンスで公開されており、Adobe Typekitのほか、GitHub、SourceForgeから無償でダウンロードできる。 Source Han Sansは、日本語／中国語（簡体字、繁体字）／韓国語の3カ国語（CJK）、台湾および香港の文字セットに対応したOpenTypeフォント。6万5535文字を収録し、Adobe-Japan1-6に含まれる異体字もカバーする。ウェイトはそれぞれExtraLightからHeavyまでの7種類。なお、日本語のフォント名では「Source」の日本語をイメージした「源ノゴシック」と表示される。 開発にあたっては、グーグルが資金提供とテスト、アドビが字形デザインとプロジェクト管理を担当。「6万5000以上の文字を1社で作るのは難
日本のスマホサイトは2年間でこんなに変わった (1/4)
スマートフォンやタブレット端末といった、いわゆる「スマートデバイス」を意識したWebサイト制作はもはや常識となっている。各企業のWebサイトは、次のような方法でスマートデバイスに対応していることがほとんどだろう。 スマートフォン向け専用サイトを構築する レスポンシブWebデザインで Webサイトを構築する viewportを調整する Web Professionalでは、2011年2月、有名企業のWebサイトがスマートフォンにどのように対応しているかを紹介した。 これらのサイトは、2年経ってどのような変化を遂げたのか。本記事では、取り上げたサイトに再び訪れ、サイトデザインのトレンドがどう移り変わったのかを観察。日本のスマホサイトの「BEFORE & AFTER」を紹介しよう。 半数以上のサイトがリニューアル まず、調査したサイト数に対してリニューアルしたサイトと、大きくは変化していないサイ
何でも見られる神ビューアー「GoodReader」を徹底解説 (1/4)
まずは「GoodReader」をインストールする 最初に紹介したいのが、超高機能ビューアーアプリの「GoodReader」。元々はPDFリーダーアプリだったのが、画像や音楽、動画に対応し、オフィス文書やHTMLファイルまで閲覧できるようになった。何より、連携機能が優れており、ブラウザーからダウンロードしたファイルやメールの添付ファイルを「GoodReader」に取り込んで表示できるのが便利。各種クラウドサービスやメールサーバーとファイルを同期したり、ファイルの圧縮・解凍機能もあるが、これは続編で紹介することにする。 価格はiPhone版とiPad版それぞれで450円。ユニバーサルアプリでないのが残念だが、iPad版はまたさらにすごいアプリに仕上がっているので、納得できることうけあいだ。 USB接続でPCからファイルを転送する まずは、ファイルを転送し、閲覧するまでのキホンをチェックしよう。
無料で使えるHTML5 JavaScriptゲームエンジンまとめ
HTML5とJavaScriptによるインタラクティブなWebアプリケーションの開発が注目される中、ゲーム分野では数多くのHTML5 JavaScriptゲームエンジン（ゲーム開発用のフレームワーク）が登場している。JavaScriptのライブラリーや情報をまとめているJSwikiによると、その数は70以上に上り、開発者はどのゲームエンジンを選べばいいのか判断が難しい状況だ。 本記事では、数多くあるJavaScriptゲームエンジンの中から、筆者がおすすめするライブラリーを紹介しよう。紹介するゲームエンジンはすべてMIT Licenseで提供されているので、個人はもちろん、商用でも利用できる。 Cocos2D JavaScript (http://cocos2d-javascript.org/) Crafty (http://craftyjs.com/) enchant.js (http:
実例で学ぶjQuery MobileのCSSカスタマイズ (1/3)
jQuery Mobileを利用するとスマートフォンサイトを手軽に制作できますが、基本テンプレートをベースに制作すると「いかにもjQuery Mobileらしい」デザインになってしまい、他のサイトと似通ってしまいます。 そこで今回はjQuery Mobileのテンプレートをフルカスタマイズし、オリジナルデザインのスマートフォンサイトを作成する方法を解説します。サンプルとして、次のようなカタログサイトを制作します。 トップページには新着商品のサムネイル画像が3つ並び、その下にはアコーディオンパネルでニュースを掲載しています。新着商品のサムネイル画像を選択すると詳細ページに遷移し、詳細ページで画像をタップすると画像を拡大して表示します。 HTMLの作成 デザインカンプを元にHTMLを作成します。head要素内は次のように記述します。 ■サンプル1[HTML] <!DOCTYPE html> <
絶対見ておきたい有名企業のスマホサイトまとめ (1/5)
この記事で取り上げているスマートフォンサイトの「BEFORE & AFTER」を以下の記事で紹介しています。合わせてご覧ください。 日本のスマホサイトは2年間でこんなに変わった iPhone、Androidの普及を背景に、スマートフォンのブラウザー向けにコンテンツや表示を最適化した「スマートフォンサイト」（スマホサイト）を開設する企業が増えている。当初はiPhone（iOS）の標準UIに倣った画一的なデザインが多かったが、最近では独特のレイアウトや斬新な色使いの個性的なスマートフォンサイトも増えてきた。 ここでは、Web制作者が見ておきたいスマートフォンサイトを紹介する。実務で参考にできるように、対象を日本語の企業サイトに絞り、業種別に分類してまとめた。スマートフォンサイトの制作に入る前にチェックしておこう。
ASCII.jp：Facebookページの作り方、教えます｜今日からできるFacebookファンページ制作＆運用ガイド
ローソン、無印良品、リクルート――世界6億人ものユーザーを抱える巨大SNS「Facebook」の日本での本格的なブレイクを前に、ファンページを開設する企業が相次いでいます。しかし、国内でのFacebookの企業活用はまだ始まったばかりで、実際にどのようにしてFacebookページ（ファンページ）を作り、運用したらよいのか？ 多くの企業が手探りの段階です。 本連載では、Facebookページの作成を請け負うWeb制作会社「TAM」の加藤 洋氏が、Facebookページの開設からカスタマイズ、ファンを獲得する方法まで、Facebook活用の具体的なノウハウをシェアします。（編集部） なぜいまFacebookなのか？ 私が勤務するTAMでは、Facebookをはじめとするソーシャルメディアの活用を企業へ積極的に提案しています。お話する中で必ず出るのが、「Facebookが他のSNSと何が違うのか
ぼくはまちちゃん！ こんにちはこんにちは!! (1/5)
古くからのmixiユーザーであれば、“はまちちゃん事件”を覚えている人も多いだろう。2005年4月、mixiで大勢のユーザーが“ぼくはまちちゃん！”というタイトルを付けた、謎の日記を次々に公開するという怪現象が起こった。 きっかけとなったのは、あるユーザーが投稿した日記。その日記の本文には「こんにちはこんにちは!!」という言葉とともに“あるURL”が貼り付けてあった。 このURLが罠で、不思議に思って押すと、クリックしたユーザーのページに“ぼくはまちちゃん！”というタイトルで同じ文面/URLの日記が勝手にアップされてしまうのだ。 投稿は“ねずみ算”的に増え、一時は混乱状態に…… さらに、勝手にアップロードされた日記を見て「友達が変な日記を書いている」と興味を持った友達がURLをクリック……。mixi内には“ぼくはまちちゃん！”という題名の日記が“ねずみ算式”に増えていき、一部のユーザーを混
ASCII.jp：Twitter APIとGAEでおもしろWebサービスを作ろう！ ｜Twitter＆Google App Engineで始めるWebプログラミング入門
みなさんこんにちは。ふむふむソフトの飯島です。 さっそくですが、みなさんはTwitter APIを使ってプログラミングしていますか？ すでに星の数ほどTwitterアプリやWebサービスはありますし、バリバリ使っている方も多いと思いますが、「知っているけれど、なかなか触るチャンスがなくて……」という方もたくさんいるのではないでしょうか？ そこで今回から5回にわたって、Twitter APIを使ったWebサービスのプログラミングについて解説したいと思います。ただAPIの使い方を解説するだけでは面白くないですから、Webサービスを公開するサーバーとしてグーグルのクラウドサービス「Google App Engine（以下GAE）」を使い、自分でサーバーを用意することなく全部無料で遊んでみましょう。 本連載では、サンプルコードのダウンロードはもちろん、Twitter APIの準備からGAEの準備、
最終決定版！ ネットで役立つ定番フリーソフト｜超定番から上級者向けまで！ ネットツール徹底活用
動画や掲示板、オンラインストレージなど、普段から利用しているネットサービスは数多くある。これらのサービスのほとんどはブラウザーから利用でき、専用ソフトがいらないという手軽さが魅力だ。しかしその半面、動画のダウンロードができなかったり、サーバーが混むと接続できなくなったりと、不便に思うことも多々ある。 そこで今回紹介するのが、こういったネットサービスを便利にしてくれるフリーソフト。初心者でも安心して使いこなせるものから、機能を特化した便利ツールにいたるまで、動画、画像、音楽、コミュニケーション、ファイル管理の5つのテーマにわけて紹介していこう。 動画を楽しむ まずは見たい動画の検索やダウンロード、再生ができるソフトが基本。これにプラスして、携帯プレーヤーの形式へと変換してくれるツールを使えば、ダウンロードした画像を活用しやすくなる。また、自分で動画を作るときに便利なデスクトップ録画ソフトも紹
40分で覚える！jQuery速習講座 (1/6)
いまやWeb制作に欠かせなくなったJavaScript。でも、「JavaScriptはほとんど“アリモノ”で済ませている」という方も多いのでは？ そこで、WebデザイナーやマークアップエンジニアなどのWeb制作者の方向けに、いま一番人気のJavaScriptライブラリー「jQuery」の基本を学べる特別レッスンをお届けします。題して、「40分で覚えるjQuery」。要点だけにぎゅっと絞って解説しますので、手を動かしながら今すぐjQueryを始めましょう。 【0分目：導入編】 jQueryのダウンロードと利用方法 jQueryのライブラリー本体（JavaScriptファイル）は公式サイトからダウンロードし、head要素などにscript要素を書いて読み込みます。
ドワンゴ小林宏社長が語る「ビジネスとしてのニコニコ動画」 (1/5)
言わずとしれた動画サイト「ニコニコ動画」を運営する、株式会社ドワンゴの小林宏社長。とかく話題に事欠かないサービスであることは確かだが、これからのビジネス的なロードマップはどう描いているのだろう 開始早々のYouTubeからの遮断、ユーザー発の様々なコンテンツの誕生、西村ひろゆき氏や元ドコモ役員の夏野剛氏の合流―― 「ニコニコ動画」は常にネットの世界に話題を提供してきた動画共有サイトだ。 アカウント登録者数は1500万人、うち月額525円を支払うプレミアム会員は60万IDを超えている（2009年12月14日発表時）。一時はYouTubeの国内平均利用時間や訪問回数の約3倍を記録するなど、海外勢が殆どを占めるネットサービスの中で、国産サービスとしての存在感も随一と言えるだろう。 ある意味「派手な」ニュースが相次ぐ一方、「黒字化」の遅れなど、ビジネス面では不明な点もあるのも事実だ。サーバーや通信
3日でニコ動を作ったネ申「戀塚氏」に取材してみた (1/5)
ドワンゴといえば、ケータイ電話向けの着信メロディー「いろメロミックス」や動画共有サービス「ニコニコ動画」といったサービスを生み出してきた企業だ。 この10月、そのドワンゴを題材にした新書「ニコニコ動画が未来を作るドワンゴ物語」が弊社から発売された（関連記事、Amazon.co.jpで見る）。フリージャーナリストの佐々木俊尚氏が延べ30人を取材し、ドワンゴの全貌を明かしたものだ。この中でもキーマンの1人として登場するのが戀塚昭彦（こいづかあきひこ）氏。 戀塚氏は「ニコ動を3日で作ったプログラマー」としてネットで知られており、現在もニコニコ関連の開発に携わっている。90年代にはゲームクリエイター集団「Bio_100%」のメンバーとして活躍。2001年に起きた「2ch閉鎖騒動」では、過負荷対策を行なって閉鎖を食い止めたUNIX板住民のひとりでもあった。 そんな戀塚氏はどういった経緯でドワンゴに入
Chromeで使えるエクステンション厳選25本！ (1/6)
sponsored 2024年4月に新キャンパスへ移転した静岡デザイン専門学校は、最新設備を備えた実習室とMSIのノートPCで学生の実践力を養成 sponsored 部屋が狭い日本家屋仕様になったピラーレスケース、自作初心者にもオススメ！ ピラーレスだがコンパクト、価格もお手頃なCORSAIRのPCケース「3500X」が完成度高い！ sponsored コスト、人材、セキュリティ…… データ活用の課題を包括的に解消するHPEの取り組み なぜHPEがソフトウェアを？ 統合データ基盤「HPE Ezmeral」に注力する理由を率直に聞いた sponsored “データをためる”と“データを活用する”の2製品が解決する課題、得られるメリットを知る 「HPE Ezmeral」がシンプルに実現する大規模データ活用の姿とは sponsored スマホ設定で快適なハイエンドゲーミングルーター「ROG Ra
30分でできる！Webサイトを高速化する6大原則 (1/4)
Webサイトを制作するとき、「パフォーマンス」を気にしたことがあるだろうか？ もしまったく気にしたことがないなら、気をつけた方がいい。閲覧に時間のかかる“遅いWebサイト”はユーザーにフラストレーションを与え、閲覧をやめさせてしまう恐れがある。 下記のグラフは、「Simple-Talk」という海外のオンラインメディアで発表されたユーザー調査の結果だ。アンケートページの表示にかかる時間を意図的にコントロールし、表示時間によってユーザーが感じるフラストレーションの違いを調べたものだ。 縦軸がフラストレーション（10段階）、横軸が表示までの時間を表している。1～5秒以内にページが表示された人に比べ、ページ表示までに5秒以上かかった人は2倍以上もフラストレーションを感じている。フラストレーションがあまりに高ければ、せっかく何らかの目的を持って訪れてきたユーザーも待ち切れずにブラウザーを閉じてしまう
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
現場でプロが培ったGoogle Analyticsの使い方