Web活用備忘録

Webサイトをちょっと便利にするスクリプト

2009 年 1 月 13 日

こんにちは! アイタス新人?制作のTです。

Webサイトを巡っていて「ここがこうなっていたら便利なのに」と思われる「ちょっとしたこと」は多数あろうかと思います。

今回はその「ちょっとしたこと」を手軽に解決してくれるかもしれないスクリプトを紹介します。



PDF・ワード文書などのファイルサイズを自動的に表示する

addSize.js

会社案内やカタログ、パンフレットなどの文書をPDFにして配布する場合、ユーザーが不安に思うことは、まず「ダウンロードするのに何分かかるのか?」と「ファイルサイズはどれくらい?」この2点だと思います。そこでファイルサイズを記載すればダウンロードにかかる時間をある程度推測できますので、ユーザーの不安は軽減されますね。

ところが、PDFやワード文書などを多数公開していると、ファイルサイズを調べて併記するのがだんだん面倒になってきます。記述ミスをしてしまうかもしれません。

このスクリプトを使用すると、ページにリンクしたPDFなどのファイルのサイズを自動的に調べて表記してくれます。ちょっとした手間とミスを排除できるわけです。

このとき「○○回線の場合、○○MBのファイルはおよそ何分かかります。ただし、回線の利用状況や時間帯によってはより時間がかかることもございます」というふうに、ダウンロードに必要なおおよその目安の時間を別途記載しておくと、より親切になりますね。


動作デモについてはSKUARE.NETさまのデモページをご覧ください。



フォーム入力内容の例文や用語の説明を表示

CoolTips

「お問い合わせフォーム」のページで入力内容の例文や、アイコンや専門用語の説明が表示されると、ありがたいですよね。

では自分がユーザーとしてWebサイトを見ている時はどうかというと、フォームの記入欄の間や本文中に例文や解説を記載してあっても、途中で読むことに飽きてしまったり、一目見ただけでそのページを読み飛ばしてします。同じような経験をお持ちのかたもいらっしゃることと思います。

このスクリプトは解説を加えたい部分に適用すると、マウスカーソルがその部分をなぞったときに例文や説明を表示させられるスクリプトです。

これなら、きちんと必要な説明を行いつつ、ページの表示内容をすっきり減量できるのではないでしょうか。

動作にはprototype.jsおよびscript.aculo.usが必要です。



エクセルで作った表をWeb上で公開・並び替え

jquery.csv2table.js

価格表や機能一覧、お店の住所録など「並び替えて見たい表」は意外とたくさん存在します。

にもかかわらず、HTMLは表組が不得意で、一度つくった表組の修正もかなり手間です。

このスクリプトを使うと、エクセルシートをCSVテキスト(カンマ区切り文書)に変換したファイルを読み込ませて、直接表として表示可能です。

これを使えば更新や公開までの時間を短縮できますし、ユーザーに「並べ替えができる表」を提供できます。




<制作@アイタス

このエントリをはてなブックマークに追加このエントリをdel.icio.usに追加このエントリをLivedoor Clipに追加このエントリをYahoo!ブックマークに追加このエントリをFC2ブックマークに追加このエントリをNifty Clipに追加このエントリをPOOKMARK. Airlinesに追加このエントリをBuzzurl(バザール)に追加このエントリをChoixに追加このエントリをnewsingに追加

このエントリのキーワード:,

カテゴリー別一覧

 

キーワード

CMS アイタスの取り組み アイタスってなんだす 動画 Web活用 採用 書籍 セミナー・勉強会 Web施策に力を入れたい 新人スタッフ WordPressで企業サイト構築 Webサイト制作会社 実店舗への集客につなげたい ブランディング確立 魅力や特徴をわかりやすく伝えたい 講座 社内勉強会 ビジネスブログ 事業に活かしたい 企画立案