タグ

2011年6月3日のブックマーク (11件)

  • グリッドレイアウトでWebサイト構築したい時にはGrid calculator and generatorが手軽で良さそう - かちびと.net

    なかなか手軽で自分向きだったのでメモ。 グリッドレイアウトを意識したWebサイトの 構築の際に、希望の幅を入れれば、その 幅に応じたグリッドレイアウト用のcssが 生産されます。ファイルはフレームワークの Blueprint cssが生成されます。 手軽で自分好みだったのでメモがてらご紹介。いわゆるグリッドレイアウト用の計算機です。 幅を入れるだけで、作れるレイアウトを自動で計算してcssも出してくれます。cssBlueprintベースのようですね。 この設定だけでOK。 例えば、960pxで164~200pxくらいのカラムを10px以内の感覚で開けて並べたいという時の設定値だと3通りのレイアウトがあるようです。 条件の幅を広げれば、作れるグリッドの種類も増えます。 レイアウトが決まったら Preview & Download CSSをクリックすればプレビューとDLが可能です。 コンテン

    グリッドレイアウトでWebサイト構築したい時にはGrid calculator and generatorが手軽で良さそう - かちびと.net
  • Googleの+1を簡単実装&カスタマイズできるjQueryプラグイン「Google 1-Button」:phpspot開発日誌

    Googleの+1を簡単実装&カスタマイズできるjQueryプラグイン「Google 1-Button」 2011年06月03日- jquery-gplusone-js - jQuery Google 1-Button plugin - Google Project Hosting Googleの+1を簡単実装&カスタマイズできるjQueryプラグイン「Google 1-Button」。 likeが押されたときのonlikeコールバックイベントが使えたり、表示に関するカスタマイズをオプションで指定できるみたいです。 like後のコールバックで「ありがとう」みたいなメッセージを表示させるのも簡単にできそうですね。 最小のコードは以下でOKみたいです。 <div id="gplusone-example"></div> <script type="text/javascript" src="j

  • 素朴なテイストがいい感じのベクターデータ付きのアイコン素材 -Textured Icons

    Freebie: 40+ Awesome Textured Icons [ad#ad-2] ダウンロードできるアイコンのフォーマットはPNGで、サイズは32x32です。 また、レイヤーが保持されたベクターで作成されたPSDファイルも含まれています。 Photoshopのキャプチャ アイコンは全部で44種類あり、ソーシャルメディアをはじめ、ウェブサイト、ウェブアプリケーションに利用できるものが数多く含まれています。

  • [CSS]デザインも美しい、アニメーションで開閉するアコーディオンを実装するチュートリアル | コリス

    HTML5+CSS3を使って、ユーザビリティを考慮した省スペースで多くのコンテンツを配置するアコーディオンパネルを実装するスタイルシートを紹介します。 デモページのキャプチャ Pure CSS3 accordionの実装 HTML5への対応 HTML5(section要素)を使用するので、サポートしていない古いブラウザ用に準備します。 <script>document.createElement('section');</script> 参考:HTML5 Shiv あとは、外部スクリプト「html5.js」を記述し、IEなどの古いブラウザでもHTML5のエレメントが利用できるようにします。 <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script> HTML 各パネルはsection要素で管理し、バー

    n_isam
    n_isam 2011/06/03
  • 踏まえておきたい、ウェブ制作・開発にフレームワークを使う際の長所と短所

    現在、JavaScript, CSS, PHPなど数多くのフレームワークがリリースされており、ウェブ制作・開発に利用している人もたくさんいると思います。 それらのフレームワークを実際に利用するときに、踏まえておきたい長所と短所を紹介します。 Pros And Cons Of Using Frameworks [ad#ad-2] 下記は各ポイント意訳したものです。 はじめに ウェブ制作にフレームワークを使う長所 ウェブ制作にフレームワークを使う短所 ウェブ制作に役立つフレームワーク集 はじめに 近道があるのに、なぜ毎日同じことをする必要があるのか問いただすべきです。フレームワークはあなたの作業をより速く、より簡単に助ける近道である、と考えてください。ここで「より良く」というキーワードを含めなかったのは、より速くより簡単ということが常に良いことを意味するものではないといことです。 まず、フレー

  • 使える.htaccessテクニック10個:phpspot開発日誌

    10 useful .htaccess snippets to have in your toolbox | CatsWhoCode.com 使える.htaccessテクニックが10個紹介されていて便利そうなのでご紹介です。 紹介されている内容は以下のとおり サイトのURLで www があったら取る設定 画像への直リンクを防ぐ WordPressのフィードをフィードバーナーに301リダイレクト FeedBurnerならAdSenseを貼れたりします 特定のファイルを強制ダウンロードさせるようヘッダーにContent-Disposition attachment と mimeを設定する phpの設定もある程度は.htaccessでも出来る例 アクセスした際の拡張子を消す .html なしでもアクセス可能にする mimeタイプとユーザエージェントによってコンテンツをgzip圧縮する設定 デフォ

  • シネマグラフGIFアニメで驚きの効果を作成するPhotoshopチュートリアル:phpspot開発日誌

    How to Make Cinemagraph GIFs with Photoshop - Video Tutorial シネマグラフGIFアニメで驚きの効果を作成するPhotoshopチュートリアル。 次のような、ちょっとサプライシングなGIFアニメが作れます。実になめらかですね。 作成のチュートリアルムービーは以下。作成にはPhotoshopCS5のExtendedバージョンが必要ですが、体験版でも試すことが可能です。 Extendedバージョンが欲しくなりますね。 関連エントリ プロレベルのPhotoshopチュートリアル集 広告デザインのためのPhotoshopチュートリアル15 動画で学べるPhotoshopチュートリアル20 光のエフェクトを与えたクールなイメージ作成Photoshopチュートリアル25

  • CSS3で実装するApple.comのナビゲーションメニュー:phpspot開発日誌

    The fancy Apple.com navigation menu created using only CSS3. CSS3で実装するApple.comのナビゲーションメニュー。 Appleのサイトで実装されているメニューをCSS3で実装してしまおうというデモ。 グラデーションが綺麗に表現されています。 検索ボックスも次のとおり 画像として使われているのはロゴと虫眼鏡のみ。 検索ボックスが伸縮しない部分は公式とちょっと違いますが自分で実装してみても面白いかもしれませんね。 関連エントリ 立体的なCSS3でデザインされた検索フォーム実装チュートリアル CSS3をフル活用した立体的な画像ギャラリー作成デモ CSS3で実装されたボタンのサンプルやチュートリアル総まとめ CSS3で動くプログレスバー作成サンプル

    n_isam
    n_isam 2011/06/03
  • モバゲータウンのノウハウ満載! フレームワークMobaSiFを使おう!:第1回 ケータイ向けWebアプリケーション開発特有の技術要素|gihyo.jp … 技術評論社

    はじめに iモード/EZweb/Yahoo!ケータイなどで利用されるケータイブラウザは、極端な言い方をするとPCブラウザやフルブラウザとは「まったくの別物」です。今回はまず、ケータイブラウザ向けWebアプリケーションを開発する際に考慮すべき技術要素の説明を行います。次回以降は、そういった技術要素を共通的に処理できるフレームワークとして、筆者たちの所属する株式会社ディー・エヌ・エー(DeNA)がオープンソースソフトウェアとして2008年5月に公開したMobaSiF(Moba Simple Framework)を解説していきます。 特集は、WEB+DB PRESS Vol.45の特集1「[イマドキ]ケータイ開発実践入門」の第2章、第3章を再構成したものです。なお、紙面の都合上で省略した説明も補っています。 各キャリア端末の世代分類 NTTドコモのiモードが開始されたのは1999年2月で、すで

    モバゲータウンのノウハウ満載! フレームワークMobaSiFを使おう!:第1回 ケータイ向けWebアプリケーション開発特有の技術要素|gihyo.jp … 技術評論社
    n_isam
    n_isam 2011/06/03
  • WordPressでCMSを作るなら絶対に覚えておきたいプラグインいろいろ | Web活メモ帳

    WordPressでサイトを作る際に毎回入れるプラグインを人に教える機会があったのでブログでもご紹介します。 新しくブログを作る時や仕事でカスタマイズする際に参考にしてもらえれば幸いです。 全てのサイトで必ず導入するプラグイン このサイトでも使っていますし、クライアントのサイトを作る際にも毎回導入しています。 セキュリティ関係やSEO対策プラグインが主なものですよ。 All in One SEO Pack サイト全体、個別記事、ページ毎にタイトル、description、キーワードの設定などが出来るようになります。 SEOに必要な最低限の機能はカバーされていますので、マストなプラグインですね。 Akismet スパム対策のプラグイン。 オンラインサーバでコメントの内容をチェックするスパム対策サービスです。 標準でインストールされているので、管理画面から有効化してAPIキーを入力するだけでO

    WordPressでCMSを作るなら絶対に覚えておきたいプラグインいろいろ | Web活メモ帳
  • wise9 › JavaとJavaScriptの20年戦争

    モバイルゲーム 物凄い勢いで勃興したモバイルゲーム業界は、いろいろな課題や問題に直面しながらも巨大化し、今日の時点でのスマートフォン向けゲームの市場へと継承されていきます。 モバイルゲーム歴史 2001 Javaアプリと3Dゲームの登場 Javaが利用できるようになったことにより、ダウンロード型のゲームが供給できるようになりました。 2002 携帯電話端末の大容量化・3D化競争 Java搭載携帯電話端末が登場してからごく僅か1年の間に、アプリのサイズに関しては10倍に広大化し、表現方法も2Dから3Dにシフトし始めました。J-PHONEは『ゼビウス』や『スペースハリアー』などといった昔のアーケードゲームを、ドコモはSIMCITYなどパソコンで世界的規模のヒットを飛ばしたゲームを主力商品としていました。 2003 モバイルゲームの一般化 メモリの制限が厳しいJava仮想マシン上ではなく、OS