スマホサイトのパーツをことごとく網羅！「スマートフォンサイトUI図鑑」は是非手元においておくべき一冊
スマートフォンサイトを構築してて「このパーツなんて言う名前なのかな」「どうやって作るのかな」と言う瞬間は結構あるものです。 そんな悩める子羊を救う良著がKADOKAWA/アスキー・メディアワークスさんより発売されました。その名もCSS3&jQueryで作る スマートフォンサイトUI図鑑。 ありがたくも一冊ご恵贈頂きましたので、レビューしてみたいと思います。 いや、マジこの本オススメ。こう言う本、ほんとに欲しかったんです。 書籍の内容 何度もコピペして使いたい定番43パーツを厳選。 スマホサイトのUIの名前と使い方、ソースコードをまとめました。 「コーチマークってどんなUI?」「タイムラインってどうやって作るの?」 本書は、スマートフォンサイトの制作で欠かせないUIパーツの「名前がわからない」「使い方がわからない」「作り方がわからない」を解決する本です。 定番の43パーツを体系化して収録。豊
これは使えぬ！名前を思い出せない人に再会した時、その場をしのぐ6つの方法
先日Last Day. jpの@Sayobs さんが「1度人の顔見たら忘れない。僕は「スーパー・レコグナイザー」ってやつのかもしれない。」と言う記事をアップしておりました。 これは非常にうらやましい能力。私も記憶力には自信がある方なのですが、DPUBなどの大型オフ会で一度御会いしただけの方のお名前を忘れてしまうことがたまにあります。 そこで今回は「名前を思い出せない人に再会した時の対処法」と題してそんなピンチにおける対処法を考えてみました。 1.正直に聞く 「すみません…お名前もう一度伺ってもよろしいでしょうか…？」 身も蓋もございませんが、ぶっちゃけこれが一番だと思います。照れ臭そうに、つつましやかに、相手に嫌な気持ちをさせないように…。 「ホント私記憶力が悪くて…」などの一言を付け加えればなおよし。 2.「尋ねているのは苗字じゃなくて名前ですよ」作戦 私が何度となく共に死線を乗り越えて
社長を砂浜で埋める事で有名な株式会社LIGさんへ遊びに行って、プログラマーの段田さんに吹っ飛ばされてきました
個人的にはAltタグとtitleタグで遊んでいる会社と言うイメージしかないのですが、WEBCRE8.jpの@glatyou さんが「LIGに遊びに行くんですけど、おつぱさん行きませんか？」と誘ってくださったのでちょっくらどんな会社なのか見学に行ってまいりました。 （なお、写真の一部は@susipaku さんからご提供頂きました。ありがとうございます！） 最寄り駅は入谷 20:45鴬谷駅に集合した一向。メンバーは@glatyou さん、@susipaku さん、@YumiSora さん、@poyosi さん、@kojika17 さん、@Bamboo_C さん、@haru1351 さん、@madloverxxx さん。（@Yumisora さんは後から合流） 「21:00から会社にお邪魔する」とのことでしたので当然それを見越しての集合だと思っていたのですが、約20分程歩かされました。@glat
「間抜けで気持ちの悪い文章」を書くために知っておかなければいけない6つのテクニック
ブログや日記、メールなどを作成している際についつい「正しい文章」を書いてしまい、読んでいる人を辟易させたことはありませんか？ 日本語が乱れがちな現代社会。 没個性を重んじる風潮が強いこの国において、”この人は正しい日本語が扱えるきっちりした人だ”と言う印象を与えることは、あなたのイメージを損ねる原因となりかねません。 そこで本日は、読んでいて気持ちの悪い「間抜けな文章」を書くために知っておくべき6つのテクニックをご紹介しましょう。 間抜けな文章を書くために では実際に気持ちの悪い文章テクニックと文例を見ていきましょう。 最初に出ている青枠は気持ちの悪い（今回の講座においては正しい）文章、赤枠はきっちりと構成された大変に読み応えのない悪い例です。 1.敬体と常体を入り混ぜましょう。統一性が無くなるからだ。 私は篠崎愛ちゃんが大好きだ。 彼女の豊満な体にばかり目がいきがちですが、注目すべきはそ
Webページの表示速度アップに欠かせないCSSスプライトを超簡単に作成してくれるサイト「SpriteMachine」
Webページの表示速度をアップするために、アイコンやロゴなどの画像を1枚にまとめるテクニック。それが「CSSスプライト」なのですが、これって画像の作成とか位置の指定とか色々と面倒くさいんですよね。 そんなCSSスプライトを簡単に実装するためのWebサイトSpriteMachineのご紹介。スプライトマシーン…すごく…イイ名前です… imgを圧縮してアップロードするだけ サイトに訪れたらまずは画像配置のレイアウトと吐き出すコードのフォーマットを決めます。 ちなみにフォーマットはCSSだけではなく、SCSSやSASSも選択可能です。 次に、CSSスプライトにする画像をひとまとめにして、そのフォルダを圧縮、ZIPファイルにしましょう。 そしてそのファイルを上の場所にアップロードすると… 自動的に「spritemachine」というフォルダがダウンロードされます:) フォルダの中身はpng画像とc
Webデザイナー・コーダー必見の神アプリ！MacでWindows IEなどのブラウザチェックが出来る「Sauce」が便利すぎてヤバイ
Sauceは、約100種類のブラウザとOSの組み合わせでブラウザの表示確認ができるOS X用のアプリケーションで、簡単に起動・操作ができます。 Windows用のIE6/7/8/9/10をはじめChrome, Safari, Firefox, Opera、iPhone4/5/6, iPad4/5/6, Android4なども揃っています。 via: これは快適！Mac OS X上でWinのIE6/7/8/9/10など、さまざまなブラウザの確認ができるアプリ -Sauce | コリス Winを起動させるためのBoot CampもParallels Desktopも必要ない、と言うのがとても大きいですね:) アプリを起動したらアカウント登録画面を経てこの画面。アカウントは有料・無料があり、閲覧できるブラウザに制限などがかかります。 矢印の部分、Newボタンをクリック。 あとは見たいページのUR
[Mac][OS X Lion]ファイルの移動、コピーが超絶便利に！！ドラッグ&ドロップ拡張Macアプリ「DragonDrop」がすごい
ドラッグ&ドロップ時にシェイクするだけ！ さて、こちらの「DragonDrop」は、ファイルをドラッグ&ドロップする際に一度シェイクするだけで、そのオブジェクトを保留してくれる、と言うもの。 そんなわけで、公式サイトからのテンション高めの説明動画をどうぞ。 私、上の動画に心を奪われて夜も寝られないほど興奮しましたので早速DL。 起動すると、「ログイン時起動」「メニューバー上へのアイコン表示」など簡単な環境設定画面が出てきますので適宜設定しましょう。 この「DragonDrop」が便利なのは、例えばこんな風に、たくさんのウィンドウが開いているために移動先のウィンドウが見当たらない！なんて言う時。 一度つかんだ物を目的のフォルダに格納しようと、Exposeやらを駆使して移動させていると思わぬ操作ミスで意図しないフォルダへ入れてしまったりすることが結構あるんですよね…。 こんなときは一度、移動さ
![[Mac][OS X Lion]ファイルの移動、コピーが超絶便利に！！ドラッグ&ドロップ拡張Macアプリ「DragonDrop」がすごい](https://cdn-ak-scissors.b.st-hatena.com/image/square/4486bcd2c84d6e5f83bc3021e73f2eb4be46ac54/height=288;version=1;width=512/https%3A%2F%2Fozpa-h4.com%2Fwp-content%2Fuploads%2Fskitched-20120514-0334062.jpg)
7つのサンプルでjQueryを学ぼう！「jQueryが全く分からない人のため」の超初級者向け入門講座
HOME>jQuery>7つのサンプルでjQueryを学ぼう！「jQueryが全く分からない人のため」の超初級者向け入門講座 約半年前まで、興味はあれども全くもって触れたことのなかった「jQuery」。それどころか、「Javascript」を「Javasprict」と何度となく書き間違える癖のあった私。 結局、「スク水すいすいスクリプト」と語呂を合わせることによりようやく正しい綴りをマスターしたわけなんですが、仕事で扱うと言うこともあり多少はjQueryの仕組みが分かってきた今日この頃です。 そんなわけで、今回は「jQueryが全く分からない人のため」の超初級者向け入門講座と銘打ちまして、jQueryの基礎の基礎を学ぶための記事を書いてみました。 とは言っても「jQueryとはなんたるか」などといった難しい理論を記すつもりは一切ございません。（っていうかそんな偉そうなこと言える程修めてない
少ないメモリでやりくりしているMacユーザに！自動でメモリを解放してくれる無料Macアプリ「FreeRAM Booster」
どうも、おつぱ（ @OZPA ）です。 購入した新型MacBook Airはメモリ増設をしなかったのですが、とくにメモリも問題なくサクサク動いております。 ただ、もしもの時のために、メモリを自動で解放してくれるMacアプリ「FreeRAM Booster」をDLしてみました。 設定したメモリに達したら自動で解放！ 以前ご紹介したMemory Scopeはメモリが逼迫してきたらワンクリックで解放、と言う流れでしたが、この「FreeRAM Booster」は、設定しておいた数値以下にメモリが下がると自動的に解放してくれるというアプリです。 アプリ起動中は空きメモリ量を上部ステータスバーに表示してくれています。 設定などはこのメモリ表示部分をドラッグしましょう。 こちらが標準画面。現在の空きメモリの状況を棒線グラフにて時系列で教えてくれます。 左下「Recover RAM manually no
ソースコードをキレイに表示するWordPressプラグイン「SyntaxHighlighter Evolved」
どうも。@OZPA です。 WordPressのオリジナルテーマを作成したりして、最近htmlやphpのソースコードをブログに掲載するようなことが増えてまいりました。 そんなわけで、今さらながら導入しました、ソースコードを表示するのに便利なWordPressプラグイン「SyntaxHighlighter Evolved」のご紹介。 導入方法 プラグインは以下のリンクから入手するか、WordPressのプラグイン管理画面から「SyntaxHighlighter Evolved」を検索、有効化してください。 WordPress › SyntaxHighlighter Evolved « WordPress Plugins 対応しているコード SyntaxHighlighter Evolvedが対応しているのは、以下のコード。 html,actionscript3,bash,coldfusion
iPhone、iPadでどのようにWebページ・ブログが表示されているのかを確認する方法
Safari / aditza121 iPhone大好き！どうも、@OZPA です。 とまぁiPhone大好きと言っておきながら、新しく作成したブログテーマを未だにスマートフォン対応してないんですよこれが。 そんなわけでせっせかとスマートフォン用切り替えテーマを作成中なのですが、その際にPC上でiPhoneではどのようにwebページが表示されているのかを確認する必要があるわけなんです。 今回は、自分の備忘録的意味合いも込めまして、PC上でiPhoneのブラウジング表示を確認する方法をご紹介。 Safariの「開発メニュー」を使用する さて、そんな時はMac OSのデフォルトブラウザ、Safariを使用します。 Safariを開いて・・・ 環境設定を開きます。 そして、「詳細」タブの最下部、メニューバーに”開発メニューを表示”にチェックをいれましょう。 すると、メニューバーに「開発」が表示さ
管理ページに移動せずに、直接記事を編集できるWordPressプラグイン「Front-end Editor」！
ブログのリニューアルをして以来、サイトをいじったりWordPressをいじるのが楽しくてしょうがない@OZPA です。いじるのって本当に楽しい・・・ブログの話な！ さて、そんなわけで自分の過去記事をぼーっと眺めている時間が増えたのですが、たまに 「あ、ここの部分ちょっとだけ直したいな」 といったことですとか、誤字を見つけたりすることがあるわけです。 そんな時に、イチイチ管理ページに移動して目的の記事を検索、修正→UPと言う流れが非常にめんどうだったわけなんですが、そんな悩みを解決してくれた、管理ページに行くこと無く記事の追加・修正を行えるプラグイン「Front-end Editor」をご紹介いたします。 このプラグインはWebクリエイターボックスさんの以下の記事で知りました。 記事を簡単に編集できるWordPressプラグイン「Front-end Editor」 | Webクリエイターボッ
WordPressのオリジナルテーマ 作り方の記事まとめ
サイトじゃないですけど、今使ってる本。凄く分かりやすい。 チートシート 日本語版 WordPress チートシート | Webクリエイターボックス WordPressの覚え書きというか、カンニングペーパーです。コードなんぞをまとめました。他にもWordPressのチートシートはいたるところで記事にされていますが、CSSハックやCSS小技集に続き、 … コードを書く際に便利なカンペ。 CSS入門 わたくし、CSSもHTMLもまともに修めておりませんのでそのへんの知識を得るために。 CSSレイアウト実践講座 とほほのスタイルシート入門 テーマ、カスタマイズ参考 2011年に入って気になった最新Wordpressテーマの情報一挙公開 | バンクーバーのWEB屋 僕は出身が熊本でして、良い物のことを、”こりゃヨカバイ！”と言うことがあります（若い人は使わないよね、そうだよね。） さて、今日は僕が思
Macを使用するうえで覚えておくとめちゃくちゃ便利なショートカットを挙げ連ねてみる
Mac for every student ? / luc legay 作業効率を上げるための方法は幾つもありますが、まず押さえておきたいところといえば「キーボードショートカット」でしょう。 当然のことながら、ショートカットを知っているか否かというのは作業スピードに密接に関わってきます。 今回は、Macにて私がよく使用するショートカットや基本的なコマンドを含めて、覚えておくと便利なものを挙げ連ねておこうかと思います。 関連：Mac OS X のキーボードショートカット 超基本のショートカット 以下はMacを扱う上で超基本となるショートカットです。 たいていどのアプリケーションでもこれらのショートカットは共通ですので覚えておいて絶対に損はないです。 command + A：すべてを選択 command + Z：アンドゥ（リドゥ） command + S：保存 command + C：コピー
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Coda2 プラグイン「TEA for Coda」のZen-codingショートカットを変更する方法と、コマンドメニュー正式名称まとめ