タグ

2010年8月1日のブックマーク (9件)

  • HTMLを綺麗にインデント·Ham Cutlet MOONGIFT

    Ham CutletはRuby/Sinatra製のフリーウェア(ソースコードは公開されている)。時々見かけるのだが、インデントが全く無視されたソースコードはとても見がたいものだ。Pythonだったら動きようもないが、他の言語の場合無視しようと思えばできてしまうので、とても辛い。 こんなに汚いソースコードが… プログラミング言語の場合、それでも統一はある程度できているのではないだろうか。問題はHTMLだ。時々ものすごいソースコードに出くわしたりすることがある。そんな時に使いたいのがHam Cutletだ。 Ham Cutletは既存のHTMLソースコードを貼付けて実行し、インデントを綺麗にして表示してくれるソフトウェアだ。インデントがきちんとすれば、タグの関連性が分かりやすくなりデザインの問題も発見しやすくなる。完了したソースはそのままコピーして利用できる。 こんな綺麗なHTMLに! 最近は

    HTMLを綺麗にインデント·Ham Cutlet MOONGIFT
  • 非デザイナーのためのデザイン基本テクニック その1 | 07design.blog

    デザイナーではない方も趣味でサイトを作っていたり、デザイナーに頼むほどでもない画像を作ったりする機会があると思います。デザイナーはセンスでサクサクと制作するイメージがあるかもしれませんが、実はデザインというものは数々のルールによって成立しています・・・デザイナーではない方も趣味でサイトを作っていたり、デザイナーに頼むほどでもない画像を作ったりする機会があると思います。 デザイナーはセンスでサクサクと制作するイメージがあるかもしれませんが、 実はデザインというものは数々のルールによって成立しています。 そのルールの知識があればデザイナーレベルとはいかないものの、見た目がきれいなグラフィックは作れるはずです。 デザインという言葉の定義やソフトの使い方から始めてしまうとややこしくなるので、 今回はあくまでも「とりあえず見た目をキレイにする」ということに重点を置いて説明します。 記事内で

    phista
    phista 2010/08/01
    分かってるようで分かってない?
  • サイトのガイドツアーを簡単に作ることができるツール『Touration』 | 100SHIKI

    サイトの簡単な使い方を説明するガイドツアーを作りたいときもあるだろう。 ただ、そうしたガイドツアーを作るのはわりと大変だ。スクリーンショットを撮って、説明を書いて、というのはいかにも面倒くさい。 そこで登場したのがTourationだ。 使い方は簡単で、「このサイトではまずこういうメニューがあって」「ここを押すとこうなって」「これが○○です」といった説明書きを実際のサイト上にぺたぺた貼り付けていけばいい。 もちろんそうした説明には順番をつけることも可能だ。また、ちょっと試してみたところ日語も問題ない。 こうしたガイドツアーをうまく使ってユーザーに疑問を抱かせないようにしたいですな。

    サイトのガイドツアーを簡単に作ることができるツール『Touration』 | 100SHIKI
    phista
    phista 2010/08/01
    お、よさげじゃないか
  • モダンなPHPの開発環境の構築方法 - 肉とビールとパンケーキ by @sotarok

    via. はてなブログ 誰か書くんじゃないかと思いつつ、まあ、お決まりのパターンとしてPHP版も書いてみよう。 PHPのこと見てると、書き方とか取り巻く環境ってあんま変わってないなーとか思いつつ、そして何がモダンなんだっけ?新しければいいのか?って話だけど。 一般的な OSX 環境および Linux 環境における、モダンな PHP 開発環境の構築方法についてまとめてみた。最新のPHPとxdebugがあれば十分。 PHP 5.3.2 のインストール ソースから入れてた時期もあるけどやっぱパッケージが楽だな。。オフィシャルじゃないリポジトリを使えばパッケージで入れられる。 pearとpeclは、パッケージ入れるときに一緒に入れちゃう。 pear や pecl そのものは、PHPよりも頻繁にバージョンアップされるし、パッケージになってたりなってなかったりの管理が面倒だから基的にpear/pec

    モダンなPHPの開発環境の構築方法 - 肉とビールとパンケーキ by @sotarok
  • コンプレックス配色をうまく使った、素敵なWebデザイン例 - かちびと.net

    様々な配色の中でも個人的に 気に入っているのがコンプレッ クス配色という配色です。自然 の中ではあまり見られない配色 で都会的なイメージや見る人に 印象を与えるのに大きく貢献して くれます。 不調和ゆえのの調和配色と言われるコンプレックス配色を利用したWebデザイン例。個人的に必要になりそうなのでメモとして残します。コンプレックス配色に関しては以前記事にしましたので宜しければ合わせてご覧下さい。 The English Network グレーに、やや紫がかったレッドカラーが印象的です。統一感もあって見やすい。 The English Network globaltradeqatar こちらもレッド&グレーですが、先ほどのと雰囲気は随分違います。ロゴだけ合わせてないのは理由があるのかな・・ globaltradeqatar estoyvolando.com シンプルながらダークカラーにビビッ

  • 【レビュー】Firefoxのメモリをもっとうまく使う方法 | エンタープライズ | マイコミジャーナル

    Firefox web browser - Faster, more secure & customizable Firefox 2系と比べるとFirefox 3系のメモリ消費はだいぶ改善されている。FreeBSDのメモリアロケータであるjemallocを採用したことが大きい。しかし、マルチプロセスアーキテクチャを採用したChromeが登場してから、ふたたびFirefoxのメモリ消費が気になるようになってきた。たしかにChromeの消費するメモリ量は多いが、タブがそれぞれプロセスとして分離しているため、タブを閉じると1プロセス分まるまるメモリが開放される。消費は多くても開放もしっかりしていて、いつまでも大量のメモリを消費し続けるFirefoxよりも魅力を覚えるユーザが増えている。 しかし、Firefox向けに提供されているアドオン/エクステンションは強力で魅力的。特定のアドオン/エクステン

  • Firebugの意外と知られていない機能紹介(プログラマ向け) - KAYAC Engineers' Blog

    羊毛布団を洗濯機にかけられないことを知りました。ago(@kyo_ago)です。 意外と知られていない機能が多い!?Firebugの使い方を見て、プログラマ向けも欲しくなったので書いてみました。 1. ショートカット一覧 以下のページでFirebugのショートカット一覧が公開されています。 http://getfirebug.com/wiki/index.php/Keyboard_and_Mouse_Shortcuts 取り合えず以下の二つだけでも覚えておくと効率的かもしれません。 F12でFirebugの有効、無効の切り替え 広いコマンドラインモード時にCtrl+Enterでコードを実行 また、以下のメニューからショートカットの変更も行えるので、他の拡張等とショートカットがかぶった場合でも別のキーで使用することが出来ます。 2. Firefox体のツールバーに「要素を調査」ボタン Fi

    Firebugの意外と知られていない機能紹介(プログラマ向け) - KAYAC Engineers' Blog
  • 黒ベースのクールなデザインいろいろ:phpspot開発日誌

    Web Design: Dark Layouts | Abduzeedo | Graphic Design Inspiration and Photoshop Tutorials 黒ベースのクールなデザインいろいろまとまってるエントリのご紹介です。 どれもなかなか良くデザインされていて、参考になります。 黒ベースというのには代わりはないのですが、それぞれユニークなデザインになっていますね。 関連エントリ 黒ベースのクールなWEBサイトデザイン集 黒ベースのダークでクールなWEBデザイン集 シンプルデザインだけど見やすい黒ベースのWEBレイアウト集

  • 2ちゃんねるのdat落ちしたスレをワンクリックで復活させる拡張機能「2chRevival」*二十歳街道まっしぐら(FC2ブログ時代)

    2chRevival」は2ちゃんねるのdat落ちしたスレ(全部見られなくなったスレ)を復活させるChrome拡張機能です。 他にもdat落ち復活拡張機能はあるのですが、「2chRevival」はワンクリックで復活させられるので便利です。 原理としては、2ch DAT落ちスレ ミラー変換機 ver.4を利用しています。 自動的に復活させることもできますし、ミラーサイトを自分で選択することも可能。 以下に使ってみた様子を載せておきます。 まず「2chRevival」をインストールしましょう。 そして、dat落ちしたスレを開いてみます。 dat落ちしているので、通常は、最初のレスしか見られません。 「2chRevival」をいれていると、上部に「DATファイルを復活させる」というリンクがあります。 「DATファイルを復活させる」をクリックするだけでOK。 このとおり、最後のレスまで全部見られま