たった2行でできるWebサーバ防御の「心理戦」 − ＠IT
高い壁を作るだけがセキュリティ対策ではない。攻撃者の心理を考え、彼らに選ばれないシステム作りも大きな効果が望めるのではないだろうか。本連載では視点を変え、攻撃者に選ばれないためにできる、ほんのちょっとした対策を取り上げる。（編集部） 対策をもう一歩進めるための新たな視点を持とう システムは動くだけではなく、セキュリティ対策がなされていなければいけないといわれ始めて久しい。セキュリティという言葉を聞くと、物理的なものだけではなく、ネットワークセキュリティを連想するほどの認知度も得ているのではないだろうか。 個人宅のネットワーク環境にもファイアウォール機能を搭載したルータがあり、PC1台1台にアンチウイルスソフトがインストールされている。いまとなっては珍しくなく、むしろ当たり前とも思えるようになった。 一方、ネットワークに存在する脅威というと、ウイルス、ワーム、ボット、サイトの改ざん、個人情報
yohei-y:weblog: HTTP ステータスコードを正しく使おう
先月、ぐるなび API がリリースされていました。 ぐるなびさんの持っている膨大なデータベースに Web API を通して気軽にア クセスできるようになったのは、非常に喜ばしいし、その英断に感謝したいと 思います。 しかし、Web API 仕様書、特にエラー仕様を見てちょっとがっかりしました。 もう少し上手にデザインすれば、もっとよかったのに…、という思いです。 一度出してしまった API はそう簡単に変えられないと思いますが、 参考までに僕だったらどうするか、を書いてみます。 この仕様の一番の問題はエラーコードです。 以下は 2-2 のエラー仕様に記述されているサンプルです。 <?xml version="1.0" encoding="UTF-8"?> <gnavi> <error> <code>602</code> </error> </gnavi> タグが三つ(gnavi, erro
404 Blog Not Found:あなたのページを最速にする14の掟
2007年05月11日18:45 カテゴリiTech あなたのページを最速にする14の掟 人気Webサイトの管理人、必読。 紹介ページ: 14 rules for fast web pages (Skrentablog) PPTのスライド: http://www.web2expo.com/presentations/webex2007/souders_steve.ppt 実は、これらはYahoo!の"Chief Performance Yahoo!"(本当にそういう役職名)であるSteve Soudersによる以下のblog entriesをまとめたもの。 Performance Research, Part 1: What the 80/20 Rule Tells Us about Reducing HTTP Requests Performance Research, Part 2:
ウノウラボ Unoh Labs: 色選びのコツ
こんにちは！ yamazakiです。 高度なプログラミング話だらけのこのブログには全く馴染まない話題でアレですが、今回は「色」について書いてみようと思います。 Webサイトを作っているとき、ちょっとした書類を作るとき、「どんな色を使おうかなぁ」というのは毎度結構迷うところです。今回はそんなときにもしかしたら少しは役に立つかもしれない、色選びのTipsです。 色の「トーン」を意識してみよう 色の基本、というと大抵どんな本を見ても「色相」「彩度」「明度」という三つのパラメータがまず出てきます。「色相」「彩度」「明度」というのは 色相…その色が「赤」なのか「青」なのか「緑」なのか、その色の「色味」 彩度…色の「あざやかさ」。 明度…色の「明るさ」。黒がもっとも暗く（明度が低く）、白がもっとも明るい（明度が高い）。 なのですが、この三つのパラメータをもとに色を考えていても、いまいち「どの色に
１つのファイルにJavaScriptとCSSをまとめて記述する方法:phpspot開発日誌
My experiments with .Net : Combine CSS with JS and make it into a single download! １つのファイルにJavaScriptとCSSをまとめて記述する方法。 まず、test.jscss というファイルを作って、次のように内容を記述します。 <!-- /* function t(){alert('test');} <!-- */ <!-- body { background-color: Aqua; } そして、次のようにJavaScriptとCSSを呼び出す際に先ほど作成したtest.jscssを指定することができます。 <html> <link type="text/css" rel="stylesheet" href="test.jscss" /> <script type="text/javascript"
テキストサイズ変更に応じて画像のサイズを変えるCSSテクニック:phpspot開発日誌
Create Resizable Images With CSS | Smiley Cat Web Design I'm a big fan of layouts that still work if a user increases their browser's text size. テキストサイズ変更に応じて画像のサイズを変えるCSSテクニック 方法１ 次のDIVがあったとして、 <div class="resize"></div> 次のＣＳＳを適用します。 .resize { background: url(image.jpg) -130px -140px no-repeat; border: 3px double #fff; float: left; height: 12em; margin: .2em 1em 1em 0; width: 12em; } すると、文字サイズを変更
CSSコーディングの際に役立つエキスパートによる７０の方法:phpspot開発日誌
70 Expert Ideas For Better CSS Coding | Smashing Magazine CSS isn’t always easy to deal with. Depending on your skills and your experience, CSS coding can sometimes become a nightmare, particularly if you aren’t sure which selectors are actually being applied to document elements. CSSコーディングの際に役立つエキスパートによる７０の方法。 最初にＣＳＳをリセットせよ、とか、デバッグ用 ( .floatLeft, .floatRight クラス等 )のクラスを定義しよう、といった有用なテクニックが７０も記述されて
CSSだけでメニューにツールチップヒントを付けるテクニック:phpspot開発日誌
CSS: Menu Descriptions | Mike’s Experiments | MikeCherim.com This is a CSS technique that could be useful if you want to give users accessible added content such as tool-tips, notifications, or alerts, without adding unnecessary clutter to your page. CSSだけでメニューにツールチップヒントを付けるテクニック。 次のようにメニューにカーソルを合わせるとヒントが表示できます。JavaScript不使用なので、JavaScriptが苦手な方も実装可能です。 JavaScriptは使わずにやりたい場合は覚えておきたいテクニックですね。 関連エントリ
CSSを使ったテキストをデザインとして魅せるテクニック集:phpspot開発日誌
Mandarin Design: Text Tricks CSSを使ったテキストを魅せるテクニック集が色々公開されていました。 例えば、次のような見出しの１文字を修飾するテクニック 次のようなCSSで実現可能のようです。 <!-- the drop cap --> <span style="margin-right:6px;margin-top:5px;float:left;color:white;background:khaki;border:1px solid darkkhaki;font-size:80px;line-height:60px;padding-top:2px;padding-right:5px;font-family:times;">T</span>his is a drop cap with a black background, white text, and a
成功するショッピングサイトに必要な17の新常識 | POP*POP
SEO関連の話題を扱っているseomoz.orgにて興味深い記事がありました。「17 New Rules for Successful E-Commerce Websites」です。 ショッピングサイトを作るときにはどういった点に気をつければいいか、かなり参考になるのではないでしょうか。 以下に詳しくご紹介（あまり好きではないですが、説明の都合上、元記事からそのまま画像を拝借しています）。 ユーザーがどこにいるのか教えてあげよう ユーザーがトップページ以外にいる場合、どのセクションにいるのかわかるようにしましょう。パンくず型のナビゲーションも有効です。 選択条件を解除できるようにしよう ユーザーは一般的に選択条件を追加しながらサイトを見ていきます。そうした選択条件はすぐにはずして元に戻れるようにしておきましょう。 一般的な並び替え方法はきちんと用意しよう ユーザーが選択しやすいように「価格
ぼくがCSSを書くときに手放せないツール - ぼくはまちちゃん！(Hatena)
こんにちはこんにちは！！ CSS書いてますか！！ ぼくなんか書きすぎて border: 1px solid red; が0.5秒で打ち込めそうな感じなんです＞＜ ところで、CSSいっぱい書いてると、ぱっと見ただけでおよそ何ピクセルか、 わかったりするようになるから人間ってすごいよね！ この余白は 6px だな、こっちのblockは 40px くらいかな？ とか…！ 大きいのは難しいけど！ 最近はエラスチックなんとかレイアウト？っていう em で指定しちゃうのが流行だそうだから pxはあまり使わないのかもしれないけどね！ ところで、そんなぼくがCSSを書くときに必須なツールがあります！ 紹介しちゃいますね！ きっと手放せなくなっちゃうよ！ ひとつが、カラーピッカーだね！ 画面上の好きな色を拾うやつ！ これは色々なものが公開されているから省略しますね！ ぼくはこれつかってるけど！ もうひとつ…
フッターが素晴らしい19サイトを参考に足もとを見直そう | Web担当者Forum
通常、フッターには基本的なナビゲーションを繰り返して用い、著作権情報やプライバシーポリシーなど「細字部分」にあたるものが書き込まれる。また、標準に基づいたデザインの人気が高まり、フッターにXHTMLやCSSへの準拠を示すバッジが置かれるようになった。 新しいクライアントのために、フッターが完全に不足しているサイトを再デザインしながら、僕がデザインをまとめるとフッターがやる気のない付け足しになってしまうのはどういう具合なんだろうと思った。僕のフッターはたいてい内容が乏しく、デザインも大好評とはいかない。これまでに作った最も内容豊かなフッターはおそらく、ミニサイズのサイトマップとコンタクト情報がちょっとばかり入った、Avatar Financialのものだろう。 こうして僕は興味をもった。ほかのウェブデザイナーはフッターを何に使っているんだろうか？ウェブを回って集めた、フッターが目を引く19サ
Geekなぺーじ：ダメな中小企業Webサイト
「Ten clues that your Web site is dead」という記事がありました。 コンピュータ関連ではない小規模な企業などでは、このような考え方は確かにありがちかもしれないと思いました。 面白かったので要約してみました。 誤訳などの可能性があるので、詳細は原文をご覧下さい。 1. 「インターネットはまだこれからだ」と思っている インターネットによる革命は既に数年間続いており、膨大な数のユーザもいます。 2. Webサイトを持っていない Webサイトを持っていないのは自社の名前をつけていないのと同じぐらいの事です。 Kitch氏によると、小規模ビジネスの3割はWebサイトを持っていないそうです。 そのような企業はすぐに消えてしまうそうです。 3. 自分のWebサイトの更新方法を知らない Kitch氏によると、小規模ビジネスのWebサイトはデザインのみに頼っても意味が無いそ
黄金比をサイトのデザインに取り入れる簡単な３つの方法 | コリス
その調和された比率は、トランプカードなどの日常的なものから、ギリシアのパルテノン神殿、ミロのヴィーナス、モナリザなどの芸術分野まで、多数存在します。 黄金比を使ったデザイン テクニックついては、下記も参考にどうぞ。 黄金比とは、黄金比を使ったすごいデザインテクニックのまとめ -Webデザイン・紙デザインに 黄金比を矩形に使用する 黄金比をマージンに使用する 黄金比をパーツに使用する 黄金比を矩形に使用する サイトで使用する画像などの矩形に黄金比を適応します。 サンプルでは、144pxと233pxの組み合わせを使用していますが、「1:1.6」を利用して100pxと160pxなど簡易なものでも効果はあると思います。 黄金比を横長の矩形に使用 黄金比をマージンに使用する レイアウトにグリッドシステムを取り入れマージンを使用した場合、数種類のサイズが必要になる場合が多くあります。 その際、１つの値
新米の開発者とマーケ担当者に贈る24のサイト内SEOチェック項目 | Web担当者Forum
ここで取り上げる話は、たいていの人がウェブサイト自体の、つまりオンサイト検索エンジン最適化（SEO）情報として、かなり一般的な話だと思うだろうけど、どれほど多くのSEOコンサルタントやウェブ開発者が新しいサイトを立ち上げる際に、ここに挙げる基本ステップを無視したり、忘れたりしているか知ったら驚くかもしれない。 オンサイトSEOに関するこれら24のチェック項目やテクニックを利用すれば、どんなリンクビルディングやリンクベイティングでも、すばらしい結果が得られるだろう。 テーマに沿った、または関連性がある最良のキーワードでオンサイト最適化（OSO）を行うため、最初のキーワード調査を終えたら、予算100ドルでAdwordsのテストキャンペーンを実施しよう。 どのページにも、コピーしたものではなくて、上手く書けている魅力的なタイトルとページ内容説明タグがあるか確認しよう。 サイト上の関連性がある個別
PHPでCSSを圧縮して出力する方法:phpspot開発日誌
Compress CSS code When you develop a website you know that you will always have to keep a balance between design and productivity. You need good working pages, easy layout, easy navigation, impressive design etc. PHPでCSSを圧縮して出力する方法。 ブラウザがCSSを解釈するにあたって不要な、コメントや、タブ/スペース、改行なんかを取り除いたものを出力してくれるサンプルが掲載されていました。 圧縮することで、ブラウザがCSSファイルを解釈するバイト数が減り、微少ですが解釈の高速化と、ネットワーク的負荷の低減が期待できますね。 次のサンプルコードでそれが可能です。 CSSファイル
ウノウラボ Unoh Labs: ウェブアプリ開発を助けるGETコマンドを使ってハックしてみよう!!
2GBのSDカード買って意気揚々と歓迎会に突撃したらカメラごと持って帰るのを忘れて生きていくのがつらくなったjokagiです． ガジェットには名前と連絡先をお忘れなく． さてウェブアプリケーションの開発をしていると当然ですがブラウザーで画面の確認をしたりしますが，ブラウザーで確認をしているとキャッシュに悩んだり面倒くさいことが少なくありません． 普通そういう時はtelnetなどで直接HTTPプロトコルでウェブサーバーと会話するわけですが面倒くさいですよね． $ telnet www.yahoo.co.jp 80 Trying 203.216.231.160... Connected to www.yahoo.co.jp. Escape character is '^]'. GET / HTTP/1.1 Host: www.yahoo.co.jp HTTP/1.1 200 OK Date:
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Breadcrumb CSS - Appleに習うパンくずデザインCSS - youmos
Twitterが激しく面白すぎる件と日本語のTwitterツールいろいろ | caramel*vanilla
Webデザインとグラフィックの総合情報サイト - MdN Interactive - Webデザイン超基本のお作法50選
