リンクしたファイルに自動でファイルサイズを付ける「addSizes.js」:phpspot開発日誌
addSizes.js: Snazzy automatic link file-size generation | Natalie Downe リンクしたファイルに自動でファイルサイズを付ける方法があるみたいです JavaScriptライブラリの addSizes.js を使えばそれが可能です。 サーバに接続して、Content-Length ヘッダーを読んでいるみたい。 Content-Lengthを吐かないサーバだと使えない点に注意。 ファイルサイズを付けるのって面倒ですが、結構重要な情報だったりしますよね。 フリーソフトのダウンロードページなんかだと導入すれば、配布ファイルのサイズが変わってもそのまま使えるので、便利そうですね。
ブロックリンクのデザイン | Takazudo Clipping*
最近デザインでつまずいたこと。 つまずいたといっても自分はコーダーなので、ページ組み終わってから、むむっ…ｱｯｰｰｰ！となったこと。 ローカルナビ まずはこれ、ローカルナビの例 ローカルナビなんかのデザインなどで、Aの場合、液晶テレビ～のリンクは、明らかに文字しかリンク範囲が反応しないように見えるが、Bの場合は、枠の中全体がリンク範囲として反応しそうに見える。こんな感じでリンク範囲を文字の周囲にまで及ぼしたいときは、Bみたいに、どこまでがリンクとして反応するのかがすぐ分かるようにした方が使いやすいし迷わない。 ブロック形式のナビ 次はこれ、ブロック形式のナビの例 先程の例を生かして、全体をリンク範囲にしよう！だから、Aみたいなものを作った。 Aだけが存在する場合、これは、ブロック内全体リンクにして間違いない。 Bが加わったとき、Aがあるなら、当社の…の説明文もリンクしなきゃおかしいか
テレパス・ラボ : target="_blank" を使わないで新しいウィンドウでリンクを開く
target="_blank" を使わないで新しいウィンドウでリンクを開く方法 ここで紹介されているようにtarget属性は非推奨となっているためXHTML準拠するためにはこれ以外の方法にて実現する必要があります。 リンク元ではprototype.jsを利用してすべてのpopupクラスのリンクに新規ウィンドウで開くjavascriptイベントをバインドしていますが、ここではjquery.jsを利用して実装してみましょう。 function initOpenNewWindow() { var popupEvent = function(event) { window.open(this.href); event.preventDefault(); event.stopPropagation(); } $("a.popup").each(function(i) { $(this).click
hori-uchi.com: _blankを使わないで別ウィンドウを開くにはre
はてなブックマークをみていたら、気になるエントリーを発見。 [戯] target="_blank" を使わないで新しいウィンドウでリンクを開く方法 target="_blank"という書き方がXHTML 1.1 や XHTML Basicに準拠していないので、これらに準拠するようにしつつ、別ウィンドウで開くにはどうすればよいかという話です。 別ウィンドウで開くにはJavaScriptを使えってのが推奨される方法なんですが、onclickを使って定義するのはめんどうということで、この記事では、aタグにclass="popup"という属性を与えておけば、JavaScriptで別ウィンドウを開くということをしています。 この件については友人のHTML、CSSマスターなkawachi君と話したことがあって、そのときは、下のエントリで紹介されているrel="external"という方法を使うのがいい
JavaScriptのリンクもチェックできるリンクチェッカー「Xenu」
Xenuはフリーウェアで、再帰的にリンクや画像などのリンク切れをチェックできるソフトウェアです。 Xenu の特徴 Xenu のインストール Xenu の使い方 Xenu でJavaScriptで記述したリンクをチェックする Xenu の特徴 フリーウェア 通常のリンクをはじめ、画像、フレーム、プラグイン、背景、イメージマップ、スタイルシート、スクリプト、Javaアプレットなどのリンク切れのチェックが可能 ルートを指定すると、再帰的に全てのページのリンクチェックが可能 リンク検証後のレポートを作成 SSL(https://)のサイトに対応 リダイレクトに対応 ローカルファイルのリンク検証が可能 詳しくは、XenuサイトのDescriptionを参照ください。 検証後にtitle要素などの日本語は文字化けしますが、リンクチェックの機能に支障はありません。 Xenu のインストール 下記ページ
Snap Links – Get this Extension for 🦊 Firefox (en-US)
Note from Mozilla: This add-on has been discontinued. Try Snap Links Plus instead. The main goal of the extension is to allow easy and fast opening of multiple results presented by search engines (but it should work on any site). Snap Links is similar to other extensions that open multiple links yet it works in a different way from most of them. The most important differences are: - The user selec
ImgRed.com - Image Redirection
ImgRed.com - Image Redirection FAQ Source code Opt out Mirrors To avoid hot-linking an image, prepend http://imgred.com/ before the URL. To show a thumbnail of the image, prepend http://imgred.com/tn/ before the URL. Details: When posting on message boards or blogs, often you want to show or link to an image on another website. Directly showing or linking to that image is called hot-linking. It's
クリック ２０世紀
■ＨＴＭＬで２０世紀の年表がつくりたかった。 クリックするたびに、どんどん詳しい世界に入っていける年表。 時とともに縦横に広がってゆく年表。 ２０世紀のすべてを抱えこむような年表をつくりたかった。 ■年表をつくった。 ２０世紀を抱えこむなんておぼつかないけど、まだ半分だけだけど、ＨＴＭＬの年表ができた。 多くの人にみてもらいたいと思い、みてもらえるだろうかと思い、 楽しんでもらえればいいがと思う。 ■いつかこの年表を老若男女の知性が憩う場にしたい。 森のように２０世紀の喜怒哀楽を散策し、立ちどまり、もの想える場に育てたい。未来に、そういうものを残せればぼくはうれしい。
我的春秋: パンくずリストのマークアップ
ちょっと前に パンくずリスト（Topic Path）を作成する際に使えそうなサンプル8種（CSS HappyLife）というエントリーが盛況でしたが、今日はパンくずナビゲーションの論理構造面を補強する意味も込めて、(X)HTML マークアップの例を、サイト構造やサイトの目的に応じて、いくつか挙げてみました。CSS の話まで入れると長くなるので、今回は（も？）(X)HTML マークアップに話を絞ります。CSS については、特にセレクタまわりが結構 変わってしまいますが、ひとまず、HirasaWa さんのエントリーなどを参照してください。（気が向いたら、別エントリーを立てますけど、実際に書くかどうかは未定。） 階層型構造（tree structure） ［2006-02-11 追記］ 石川一靖さんより、「セマンティクスを重視するならa要素にrel/rev属性を加えてリンクの関係性を明示するのが
直リンクを防ぐには？…禁止と言っても無駄 - ［ホームページ作成］All About
「直リンク禁止！」と言っても無駄 「無断リンクは禁止！」・「直リンクは禁止します」と宣言しているウェブサイトをたまに見かけます。 禁止しようと思うことは自由ですが、「禁止します」と宣言しただけではまったく意味がありません。 誰でもどこへでも自由にリンクできるのがウェブです。 制作者が「リンクは禁止します」と言ったところで、そこには何の強制力もありません。 どうしてもリンクを禁止したい場合には、技術的な手段を使ってアクセス制限を施すしかありません。 そこで今回は、外部サイトからの直接リンクを技術的に制限する方法についてご紹介致します。 直リンクを禁止する主な用途 たいていのウェブサイトは、人々に見てもらうために公開しているでしょう。 とすると、外部サイトからリンクされることは、歓迎こそすれ、拒否するものではないでしょう。 しかし、以下のような場合には、直リンクを拒否せざる
PDFへのリンクに便利。リンク移動前に確認させる方法 [ホームページ作成] All About
PDFへのリンクに便利。リンク移動前に確認させる方法特定のリンクをクリックして移動する前に、移動して良いかどうか確認ダイアログを表示させてみましょう。HTMLファイルへのリンクだと勘違いして、PDFやDOCへのリンクをクリックしてしまうことを防ぐのに良いかも。 リンク先がHTMLとは限らない 通常のウェブページへのリンクだと思ってクリックしてみたら、実はPDFファイルで、Acrobat Readerが起動してしまった……というような経験はありませんか？ 急いでいるときにそうなると、腹が立ってしまう人も居そうです。 そこで今回は、リンクをクリックしたときに、本当に移動して良いかどうか確認ダイアログを表示する仕組みを用意する方法をご紹介いたします。 リンク先へ移動前に確認 次のリンクをクリックしてみて下さい。 サンプルリンク 確認ダイアログが出ましたか？ 次のような確認ダイアログが表示されたと
![PDFへのリンクに便利。リンク移動前に確認させる方法 [ホームページ作成] All About](https://cdn-ak-scissors.b.st-hatena.com/image/square/8f530daf3cb408d6b6a0ba6f38ed7ccece36cffc/height=288;version=1;width=512/https%3A%2F%2Fimg.aacdn.jp%2Faa%2Fcommon%2Fogp300_300.png)
ページ内リンクはどう実装すべきかについて考えてみた。
ナビゲーションスキップは主に音声ブラウザ向けに、グローバルナビゲーションなどをスキップするために実装されるものだが、前々からずっとナビゲーションスキップをどのように書けば最適なのか、についてはずっと疑問に思ってきた。というわけで、調べてみた。 前提：まずは最適なHTML（XHTML）を書くこと。 これが大前提。音声ブラウザによっては、heading要素（h1とかh2）を順にスクロールすることができるから。というわけで、XHTML＋CSSによるWeb標準での実装は大前提。というより、これをしっかりと書いておけば、ナビゲーションスキップを埋め込まなくても、音声ブラウザにとってはテーブルレイアウトに比べて、かなり便利になるようだ。 検討事項その1：そもそもナビゲーションスキップは見えるようにすべきか否か。 ナビゲーションスキップを見えるようにするべきか、しないべきかについて、まず考えておく必要が
ベースURLを指定する-base
■ 説明 <base>は記述されたページの基準となるURLとターゲットを指定する属性があります。<base>タグのhrefは基準URL、targetは基準ターゲット名を指定する属性があります。 これはページ情報になるので<head>の中に記述しましょう。 ■ 記述 <base href="url"> URLはフルパスで指定します。 <html> <head> <title></title> <base href="http://www.zzz.xxx/"> </head> <body> <a href="index.htm">トップページ</a> <a href="menu.htm">メニューページ</a> </body> </html> ■ 結果 <base href="http://www.zzz.xxx/">でと指定しているので、トップページはhttp://www.zzz.xxx/i
LinkThumb Plugin, miniaturas en tus enlaces | aNieto2K
Link Thumbnail, es una utilidad JS que se encarga de realizar una miniatura de la página a la que te redirige un enlace. Es bastante chulo y útil para evitar a algunos usuarios que visiten páginas que ya hayan visitado.[Demo] [Descargar] LinkThumb Plugin, ¿como no? es una adaptación para wordpress de este script, osea una forma cómoda de integrar esta funcionalidad en nuestros posts de forma facil
ハイパーリンクをより良い物に - Personnel
「リンクする」とはリソースとリソースの関係を明示すること リンク先にジャンプするのはブラウザが行っていることであって、この現象はリンクする行為と直接関係がありません。 問題点を指摘されるリンクの用い方というのは、必ずと言っていい程この基本を蔑ろにしたものとなっています。従って、極めてシンプルなこのリンクの本質を知っておけば： 間違えた用法でアクセシビリティを低下させてしまう といった事態を自然に防ぐことができる筈です。 簡単な例を挙げます。「ココをクリック」の「ココ」という文字列をアンカーにする行為は、しばしば批判されます。しかし「なぜ間違っているのか」については個々の具体的な問題としてしか説明されません。これでは、いつまで経ってもこれと類似した間違った方法でリンクしてしまう方が後を絶たないわけです。 この「ココをクリック」の問題点は実はたった一つです。もといそう考えるべきです。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
webサイトを作る時に顧客とあらかじめシンクロしておくと良い7つの基礎*ホームページを作る人のネタ帳
银川咨韵文化传播有限公司
http://elastic965.80code.com/blog/2007/02/html-semantics
http://www.caramel-tea.com/2007/01/change-mousecursor/
scrollBy - ページ内リンクをスムーズにスクロールする - youmos
