カラーツール「0to255」で色を決めてメニューを作ってみる
このブログで何回か紹介している0to255というオンラインツールですが、かなり便利だと思うので使い方を説明してみます。 色に関する知識が乏しい私ですが、0to255を使うとまとまった感じの配色になるので重宝しています。今回は0to255を使ってメニューを作る際の色選びをしてみます。 0to255の使い方 まず、0to255の使い方についてですが、下の画像のように「PICK A COLOR」をクリックしてカラーコードを入力します。 今回は「#ff7400」を指定してみます。 すると、指定した色より明るい色と暗い色がグラデーションになってたくさん表示されます。近い色がたくさん表示されますので、これらをうまく使うとまとまった感じのメニューが作れます。 メニューの配色を決める ということで、以下のような配色でメニューを作ってみます。 メニュー背景のグラデーションと境界線の1pxラインに使う色を選ん
iView Slider
画像だけでなく、動画やiframe, HTMLコンテンツにも対応し、レスポンシブレイアウトやタッチデバイスもサポートしたスライダーをHTML5ベースで実装するjQueryのプラグインを紹介します。 iView Slider (jQuery) iView Sliderの特徴 iView Sliderのデモ iView Sliderの使い方 iView Sliderの特徴 iViewはキャプションやサムネイルをアニメーションで表示できるjQueryのスライダーで、イメージスライダー、コンテンツスライダー、バナー広告、プレゼンテーションなどさまざまな用途で利用できます。 IE6/7/8/9, Firefox, Chrome, Safari, Operaなど、主要ブラウザを全てサポート。 iOS, Androidのスマートフォンもサポート。 サイズは変更可能で、レスポンシブレイアウトに対応。 フレ
CSSの勉強中に困ったら
CSSの勉強中に色々困ることが起きて検索するのですが、だいたい同じところに行き着くので自分用のリンク集も兼ねてまとめておきます。 仕様を確認するとりあえずW3Cを見に行った方が早い。 そもそもプロパティや値について分かっていない場合はここで解決することが多い。 CSS current work & how to participate現在の状況と仕様書の目次。CSS3の日本語訳集 - 血統の森 web実験小屋日本語訳へのリンク集。W3Cの目次から探すのが面倒なときはGoogleで「w3.org プロパティ名」で探すと早い。「devs.w3.org」と「www.w3.org」を分けて検索するのもいいと思う。 ブラウザの対応と実装対応しているかどうかだけの場合は以下の2つのサイトで事足りる場合も多い。 When can I use… Support tables for HTML5, CSS3
ウノウラボ Unoh Labs: PHPで暗号化・復号化あれこれ
GT Nitro: Car Game Drag Raceは、典型的なカーゲームではありません。これはスピード、パワー、スキル全開のカーレースゲームです。ブレーキは忘れて、これはドラッグレース、ベイビー！古典的なクラシックから未来的なビーストまで、最もクールで速い車とカーレースできます。スティックシフトをマスターし、ニトロを賢く使って競争を打ち破る必要があります。このカーレースゲームはそのリアルな物理学と素晴らしいグラフィックスであなたの心を爆発させます。これまでプレイしたことのないようなものです。 GT Nitroは、リフレックスとタイミングを試すカーレースゲームです。正しい瞬間にギアをシフトし、ガスを思い切り踏む必要があります。また、大物たちと競いつつ、車のチューニングとアップグレードも行わなければなりません。世界中で最高のドライバーと車とカーレースに挑むことになり、ドラッグレースの王冠
スマートフォン最適化を実施する際に最低限抑えておきたいこと : LINE Corporation ディレクターブログ
こんにちは。livedoor グルメを担当している澤田です。 livedoor グルメでは3月に、iPhone版Safariブラウザでの表示最適化に対応いたしました。これは、iPhone版Safariブラウザでlivedoor グルメを閲覧した際に、PC版の画面ではなく、iPhoneの表示サイズや使い方に合わせてカスタマイズされた画面を表示させるものです。 最適化されてないサイトの場合は、基本的にPCと同じ画面がiPhoneに表示されるので、表示される画面が小さく、大量の画像データなどを読み込むため表示に時間もかかります。 この「最適化」の作業を行うことで、iPhoneユーザーにとって必要な機能を、より使い易いナビゲーションで提供できるようになります。 今回はその画面開発時に、ユーザーの使い勝手に留意して設計した、いくつかのポイントについてご紹介します。iPhoneをお持ちの方は、ぜひSa
サイト公開前に役立ちそうなフリーのツールやWebサービスいろいろ - かちびと.net
Webサイトを制作して公開する際は おかしいところが無いか、不備は 無いか不安になったり、という方も 少なくないのではないかと思います。 そこで、公開前に色々と確認出来たり、 最適化できる様なフリーのサービスや フリーソフトをご紹介します。 ここで言う「公開前」とは「サーバーにアップする」事ではなく、公開を告知したり、プレスリリースを出す前の状態とお受け下さい。ローンチ前と書くべきだったかもしれませんね。。誤解を与えていたら申し訳ないです。 では、ブラウザチェックツール、モニタ別表示チェック、表示スピードチェックツール、cssや画像の最適化ツール、などなどご紹介していきます。 ブラウザチェック 各ブラウザでどのように表示されているかの確認が可能なツールです。 BrowserLab 今のところ、一番良さそうなWebサービスでしょうか。adobe提供のブラウザチェックツール。要ユーザー登録です
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ページを開く
[CSS]背景画像に関する実用的なスタイルシートのテクニック集