補足 この記事は旧徳丸浩の日記からの転載です。元URL、アーカイブ、はてなブックマーク1、はてなブックマーク2。 備忘のため転載いたしますが、この記事は2008年6月2日に公開されたもので、当時の徳丸の考えを示すものを、基本的に内容を変更せずにそのまま転載するものです。 補足終わり 昨日のエントリ(徳丸浩の日記 - そろそろSQLエスケープに関して一言いっとくか - SQLのエスケープ再考)は思いがけず多くの方に読んでいただいた。ありがとうございます。その中で高木浩光氏からブクマコメントを頂戴した。 \がescape用文字のDBで\のescapeが必須になる理由が明確に書かれてない。\'が与えられたとき'だけescapeすると…。自作escapeは危うい。「安全な…作り方」3版で追加の「3.失敗例」ではDBで用意されたescape機能しか推奨していない このうち、まず「\」のエスケープが必

補足 この記事は旧徳丸浩の日記からの転載です。元URL、アーカイブ、はてなブックマーク1、はてなブックマーク2。 備忘のため転載いたしますが、この記事は2007年11月26日に公開されたもので、当時の徳丸の考えを示すものを、基本的に内容を変更せずにそのまま転載するものです。 補足終わり 本稿ではSQLインジェクション対策として、SQLのエスケープ処理の方法について検討する。 最近SQLインジェクション攻撃が猛威を振るっていることもあり、SQLインジェクションに対する解説記事が増えてきたようだが、対策方法については十分に書かれていないように感じる。非常に稀なケースの対応が不十分だと言っているのではない。ごく基本的なことが十分書かれていないと思うのだ。 SQLインジェクション対策には二通りある。バインド機構を使うものと、SQLのエスケープによるものだ。このうち、SQLのエスケープについて、十分

id:hasegawayosuke氏にそそのかされるような格好で、「はじめてのPHPプログラミング基本編5.3対応」という書籍を購入した。 本書は、ウノウ株式会社の下岡秀幸氏、中村悟氏の共著なので、現役バリバリのPHP開発者が執筆しているということ、下記のようにセキュリティのことも少しは記述されているらしいという期待から購入したものだ。 目次から抜粋引用 07-07 Webアプリケーションのセキュリティ [セキュリティ] 08-04 データベースのセキュリティ [SQLインジェクション] 09-13 セキュリティ対策 [セキュリティ] 本書をざっと眺めた印象は、「ゆるいなぁ」というものであるが、その「ゆるさ」のゆえんはおいおい報告するとして、その経過で致命的な脆弱性を発見したので報告する。 問題の報告 それは、本書P280に登場する「SQLインジェクション対策用の関数(dbescape)」

2008年の窓の杜大賞に輝いたのは、S.M.A.R.T.に対応したHDD/SSDの動作状況や健康状態をチェックできる「CrystalDiskInfo」です。健康状態は“正常”“注意”“異常”という3段階で表示され、その下側にはHDDの温度が大きな文字で表示されるため、HDDの詳しい知識がないユーザーでも一目でわかるように設計されているのが大きなポイントでしょう。もちろん、コアなユーザーも満足できるだけの各種情報が見やすく表示されるため、幅広い層のユーザーから支持を受けたのではないでしょうか。投票者のみなさんからも、『HDDの状態をわかりやすく伝えてくれるため、素人にもわかりやすい』『HDDの寿命判定に欠かせないソフト』といったコメントが多く寄せられました。 賞品：「NB-100」 （株）東芝 製 □Crystal Dew World http://crystalmark.info/ □窓の

「GD-高速道路ゴシックJA」は、高速道路標識の文字に採用されている書体“道路公団標準文字”を再現したフォント。Windows 95/98/Me/2000/XP/Server 2003/Vistaに対応するフリーのOpenType/TrueTypeフォントで、作者のWebサイトからダウンロードできる。なお、商用目的でも利用できるが、フォントや文字そのもので利益を得る場合はその限りではない。 ひらがな、カタカナ、JIS第一水準を中心とした漢字、英数字、記号のほか、道路標識の絵文字を収録し、高速道路標識の文字に採用され、通称“公団ゴシック”と呼ばれる書体を再現している。公団ゴシックは、ドライバーが高速で移動しながら文字を確認できるように、“読む”ためではなく、“見る”ためにデザインされており、それぞれの文字を図形として見せる字体が特長だ。 たとえば、三鷹の“鷹”をはじめとする、画数が多く潰れや

（株）アイ・オー・データ機器は8日、メインメモリ上に高速な仮想ドライブを構築できるソフトの最新版「RamPhantom3 LE」を、同社製メモリ購入者向けに無償公開した。Windows 2000/XP/Vistaに対応するフリーソフトで、現在同社のWebサイトからダウンロードできる。なお、ダウンロードの際は同社製メモリのシリアルナンバーを入力する必要がある。また、同社のメモリ購入者以外も利用できる上位版の「RamPhantom3」もダウンロード販売されており、価格は2,480円（税込み）。 「RamPhantom3 LE」は、メインメモリ上に仮想ドライブを構築して、“RAMディスク”として利用できるソフト。メインメモリの一部をドライブとして利用することで、HDDよりもはるかに高速なデータの読み書きが可能になる。 今回公開された最新版では、OS管理外のメモリ領域上でも仮想ドライブを構築可能に

会員・非会員など、ユーザの状況によってウェブサイトに複数の入り口がある場合、振り分けが必要となります。今回は、そのような振り分け画面での要素の配置についてのコツを紹介します。 この画面を訪れたユーザは、すでにサービスに入会している方でしたが、少し迷った末、一番上の「○○プランお申し込み」（新規入会者用のリンク）をクリックしてしまい、かなり先に進むまで自分が間違えていることに気づきませんでした。 そこで、上の画面を、次のように変えてみたところ、ユーザはスムーズに自分の状況に適したリンクを選択することができるようになりました。 この画面で問題が解消された最大のポイントは、振り分けの要素を左右に並べたことです。 人は左右に並んでいる要素に対しては「対等な要素」、あるいは「対比されている要素」だと認識する傾向があります。したがって、左右に要素を並べられると、無意識的に「2者を比較しよう」というモー

Supersized - Full Screen Background/Slideshow jQuery Plugin | Build Internet! 伸縮する全画面背景を設定できるjQueryプラグイン「Supersized」。 次のように、ブラウザのサイズを変えても背景画像がリサイズされます。 更に、スライドショーのように背景を切り替え可能です。 ありそうでなかったかもしれないプラグインですね。 背景に迫力のあるものを設定すればインパクトが大きそうです。 関連エントリ 便利なjQueryプラグインいろいろ これは面白！PHPとjQueryでクリックした位置が分かるクリックマップ作成 サイトに驚き！のページめくり効果をつけられるjQueryプラグイン

操作 キャリア 発売日 機種名 機種略名 ユーザエージェント タイプ1 タイプ2 ブラウザ 幅(x) ブラウザ 高(y) カラー ブラウザ キャッシュ GIF JPG PNG Flash Flash Ver Flash メモリ Java BREW HTML SSL ログ イン クッ キー CSS GPS 備考 更新状況 更新日

携帯サイトでの会員登録で、メールアドレス確認のためにユーザが入力したメールアドレスに仮登録メールを送信し、メールに書かれたURLから本登録をさせるフローにすることがあります。 弊社で行ったユーザビリティテスト（ユーザ行動観察調査）では、携帯サイトでの会員登録の途中で、自分の携帯電話に仮登録メールが届かず、ユーザが混乱して登録をあきらめてしまうケースが多数見られました。 このサイトでは、会員登録フローの画面上でメール受信設定についての記述がなかったため、メール受信設定をしていたユーザは、仮登録メールを受信するにはドメインを新たに追加する必要があることに気づきませんでした。 このような事態を防ぐために、携帯サイトではメール受信設定についてきちんと記述し、ユーザが自社のドメイン/メールアドレスを確実に追加できるようにしておくことが重要です。 この時に気をつけるポイントは2つあります。 1つ目は、

携帯サイトのユーザビリティはPCサイトと異なる部分が多く、携帯サイト特有のtipsが存在します。今回は、携帯サイトでのページ分割と、ページ内リンクの活用についてご紹介します。 従って、同じ量の情報を伝えるにあたって、 ページを複数に分割し、ページ遷移させる(ロードが必要) 1ページに情報をまとめ、ページ内リンクでコンテンツ間を移動させる(ロードが不要) という2種類の方法では、後者の方が「携帯電話=PCの代替」ユーザに好まれ、より多くの情報に接してもらうことができます。 実際、ページを複数に分割した場合、弊社のユーザビリティテスト（ユーザ行動観察調査）では図1のような行動が観察されています。 インデックスページへ戻ることを繰り返し、「面倒だ」と感じた時点でそのサイトへの興味を失い、閲覧を止めてしまうのです。 一方、1ページに情報をまとめ、ページ内リンクで誘導した場合の行動は図2のようになり

yamaokaです。 webページの表示を高速化する手法にはいろいろありますが、 その一つとして遅延読み込みという手法があります。 初期状態で表示する必要のない要素については読み込まず、 必要になったタイミングで読み込み、表示するようにする手法です。 ページの読み込みにかかる時間の大半を 画像の読み込みが占めている場合が多いので、 画像の読み込みを遅延させるという手法が多く取られます。 検討するべきケース では、画像の遅延読み込みはどのような場合に検討されるべきでしょうか。 最初から表示されている必要がない画像が存在し、その画像のサイズが大きかったり、 そうした画像の数が多い場合は検討してみる価値があると思います。 例えば、次のようなケースです。 初期状態では表示されないブロックに属する画像が存在し、 JavaScriptで表示するかしないかを切り替えているような場合 ページのずーっと下の

インターネットの普及が進みユーザのウェブサイト利用経験が増えるにつれ、ユーザにある種の慣れや先入観が発生していることがあります。ウェブサイトやページを設計していく上では、この慣れや先入観を加味して構成を検討することが重要です。 今回はこのようなユーザの慣れ・先入観について、弊社である企業サイトのユーザビリティテスト（ユーザ行動観察調査）を行った際の事例をご紹介します。 しかし、調査においてユーザに企業情報コンテンツを探してもらったところ、ほとんどのユーザはメインコンテンツエリアに置いたリンクを見つけることができませんでした。 これらのユーザの行動をアイトラッキングで確認したところ、トップページを訪れたユーザは、メインコンテンツにほとんど視線を移すことなく画面下部のフッターを注視し、企業情報へのリンクを探そうとしていましたが見つからず、ついで画面上部に戻り、ヘッダーを探したもののやはり発見で

Net_UserAgent_Mobile parses HTTP_USER_AGENT strings of (mainly Japanese) mobile HTTP user agents. It'll be useful in page dispatching by user agents. This package was ported from Perl's HTTP::MobileAgent. See http://search.cpan.org/search?mode=module&query=HTTP-MobileAgent

これまで実践メモでは、ウェブライティングの基礎など、ユーザにとって読みやすい文章表現についていくつか考察してきました。 ウェブライティングの記事一覧 今回は、訴求ポイントをFAQ形式で表現することで、ユーザに内容まで読まれやすくする方法をご紹介します。 このサービスでは、ただ子どもを預かるだけでなく、子どもの発達を考えたサービスを行っています。しかし、こうしたこだわりの説明文をコンパクトにすることは難しく、見出しでも曖昧な表現になってしまいがちです。 このページの場合、改善前はユーザは見出し以下の文章まで読まず、独自のサービスを訴求できませんでした。 そこで、特長の説明をQA形式にしたところ、ユーザは文章部分まで読むようになり、他社と違うサービス内容を理解するようになりました。 こういった、QA形式の文章がよく読まれるという行動は、弊社のユーザ行動観察調査の中で多く確認されています。 この

［警告］この文書は長年更新されていません この文書は本来、世の中の現状について解説するために公開しているものであり、 常に現状に追随することが期待されます。 しかし実際には、最後の更新（ページ末尾に記載）から相当な年月が経過しており、 記載内容は現状に追随していません。 また、この文書を今後更新する予定はありません。 したがって、この文書は本来の目的を達成していません。 最終更新当時の世の中の様子を伝えるという、 本来とは異なる目的で公開を続けているものです。 以上の点を理解のうえ、お読みください。 Summary 2006年春、「ビックカメラ Suica カード」が登場しました。首都圏在住で、ビックカメラ、 ＪＲともに利用する機会のある人にはお得なカードといえます。 ビックカメラ Suica カードは、使い方によって得られる特典が微妙に変わってきます。 このページでは、ビックカメラ Su

デザイナ向け「初めてのjQuery」

「SmCsvEdit」は、データの閲覧に特化したタブ切り替え型のCSVエディター。Windows 2000/XP/Vistaに対応するフリーソフトで、作者のWebサイトからダウンロードできる。 行や列のコピー・削除といった基本的な編集機能をはじめ、指定した列をもとに並び替えるソート機能、セルの結合機能、データの集計機能、列の非表示機能、行の絞り込み機能など、CSV/TSVデータの閲覧・編集に便利な機能を豊富に備えている。 なかでも、特定の列を非表示にできる機能や、特定の条件をもとに表示行を絞り込む機能は、ほかのCSVエディターには見られない大きな特長だ。大量の行や列で構成されたログファイルやデータベースファイルなどのデータを閲覧する際に有効だろう。 特定の列を非表示にするには、対象となる列を選択した状態で［表示］メニューや右クリックメニューから［列非表示］を選択するだけ。このとき、複数の列

Webサイトの検索機能で、「テキスト」と「画像」、「ニュース」と「製品情報」など、複数のカテゴリを切り替えて検索できる機能を提供しているものがあります。今回はその切替の方法について考えます。 ある金融情報サイトで、企業名でサイト内検索を行ったところ、「記事」カテゴリでの検索結果が0件と表示されました。 このとき、結果が0件だったことを認識したユーザは、ページ上部のタブをクリックして「株価」に切り替えました。このとき 自分がクリックしたタブが切り替わる（アクティブなタブが濃い色になる） という変化で、ユーザには自分が別のカテゴリに移動したことが伝わりました。 しかし、検索結果部分の見た目に変化がなかったため、ユーザは「どちらのカテゴリにも自分の求める情報がない」と判断して、このサイトを立ち去りました。 このページではタブ切り替えだけでは再検索されず、新しい画面で改めて「検索」ボタンをクリック

IE6, IE7 で tabindex 属性を JavaScript 側から設定する時の注意 これは完全にバグといえる仕様なのだが、IE6 と IE7 では JavaScript（IE だから本来は JScript）側から setAttribute などを使って tabindex 属性を設定してやる時、属性名を "tabIndex" にしてやらないと認識しないことを知った（"I" がキャメルケースになっている）。WAI-ARIA（2008-08-06版 WD 邦訳）絡みで色々といじっていた時に発見。因みに IE8 RC1 では修正されている。 次の JavaScript コード断片は、IE で tabindex 属性を設定する時の方法を説明したものである。 // ターゲット要素 var elem = document.getElementById("test"); elem.setAttr

このウェブサイトは販売用です！ studyinghttp.net は、あなたがお探しの情報の全ての最新かつ最適なソースです。一般トピックからここから検索できる内容は、studyinghttp.netが全てとなります。あなたがお探しの内容が見つかることを願っています！

このウェブサイトは販売用です！ studyinghttp.net は、あなたがお探しの情報の全ての最新かつ最適なソースです。一般トピックからここから検索できる内容は、studyinghttp.netが全てとなります。あなたがお探しの内容が見つかることを願っています！

submit, buttonを角丸にしたデモ 対応ブラウザは、IE6+, Fx2+, Op9+, Safari2+, Chrome, iPhoneとなっています。 オプションでは、角丸のサイズ、アンチエイリアスの有無、角丸を適用するコーナーの指定などができます。 スクリプトはjQueryのプラグインのため、動作にはjquery.jsが必要です。 Post on:2008年11月15日

これを利用したデモを下記に設置しました。 IEを判別するスクリプトのデモ IEであれば「This is IE.」 IE以外は「This is NOT IE.」 とアラートを表示します。 IE6/7/8beta2, Fx2/3, Op9.6, Safari3, Chrome1で試したところ正しく動作しました。 コメントには、IE8でも動作する、とあります。

シンプルなツールチップも簡単に実装できるだけなく、デザインのカスタマイズが可能で、対応トリガーも豊富なツールチップのスクリプト「BeautyTips」を紹介します。 BeautyTips demo BeautyTipsは機能が豊富というだけでなく、テキストや画像、AJAXコンテンツの表示、ツールチップの表示位置の自動補正など基本性能もしっかりと抑えられており、フォームエレメントへの表示、ツールチップ元の変更なども可能です。 ツールチップはcanvasで描かれており、画像は必要ありません。 対応ブラウザはIE6.x+, Fx3.x, Op8+, Safari3.xとのことで、canvas非対応ブラウザにはExplorerCanvasが使用されています。また、IE6のz-indexへの対応にbgiframe、ホバー処理にhoverIntentが使用されています。 ※Chrome 1, Fx2で

seekAttention 注目箇所だけハイライトのアニメーションで強調。 スクロール・ドラッグなど操作関連のjQueryのプラグイン

<textarea name="code" class="css" cols="60" rows="5"> .tooltip{ display: none; position: absolute; padding: 10px 13px; z-index: 2; background-color: #f5f5b5; border: 1px solid #DECA7E; font-size: 12px; line-height: 18px; text-align: center; } </textarea>

昨日紹介した「わずか「12文字」でIEを判別するスクリプト」に続いて、Firefox 2/3, Safariを判別する1行のスクリプトをThe Spannerから紹介します。

Fixed Footer Backgrounds with CSS demo, demo 2 デモではスクロールバーの有無の２パターンがあり、スクロールをしてもブラウザのサイズを変更しても背景画像がフッタの位置に固定表示されています。 仕組みの概要は、bodyに背景色と背景画像を指定し、背景画像は「fixed bottom」にします。 コンテンツを内包するdiv（headwrap）を設置し、ページ上部に表示される背景画像を指定します。 <textarea name="code" class="html" cols="60" rows="5"> <body> <div class="headwrap"> <div class="container">Content</div> </div> </body> </textarea>

Solucijaでは、個人・商用サイトでフリーで利用できるXHTML/CSSのテンプレートを配布しています。 Solucija − Free CSS Templates 各テンプレートは、オンラインで動作確認をすることができます。 利用する際の制限は特になく、個人・商用サイトで利用が可能で、各テンプレートにあるコピーライトの表記も掲載しておく義務は無い、とあります。 各テンプレートは軽量（60KB）を意識してハンドコーディングで制作したとのことです。

Usability Postから、一枚の画像で、四隅が角丸のパネルを実装するスタイルシートを紹介します。 Scalable Content Box Using Only One Background Image demo 仕組みは、全体を囲む「div」と見出し「h2」に同じ背景画像を指定し、それぞれポジションを「bottom」と「top」にして配置するものです。 仕組みのイメージ 本文のテキストは、背景画像の長さ分（デモでは1000px）までテキスト量が増えても正常に表示されます。 見出しは、同じく見出しの長さ分（40px）までとなります。 追記： 下にある「Update」に、本文量がどれだけ増えても大丈夫なバージョンがあります。 demo 2

A Stripe of List Style Inspiration リストの中身を表示・非表示にしている仕組みは、通常時「display:none;」、ホバー時「display:block;」となっています。 グラデーションの数を増やすときれいかなと思い、数を増やしたサンプルをアップしてみました。 サンプルページ もっと増やすともっときれいかも。

CSS Globeのエントリー「line-heightを使用するメニュー」から、リストでマークアップしたナビゲーションの各項目の高さを揃えるスタイルシートの紹介です。

リスト要素をフロートさせて作成したナビゲーションをブラウザの中央に配置するスタイルシートをCSSplayから紹介します。 ナビゲーションのwidthは指定無しの成り行きです。 Centering Float Left Menus デモでは、CSSハックやinline-block, table/table-cellを使用せずに実装されています。 下記に、それをシンプルにしたデモをアップしました。 シンプルにしたデモ IE6/7/8beta2, Fx3, Op9.5, Safari3, Chrome1で正常に動作しました。IE5.5, Fx2はダメでした。 追記：その1 リストを内包するdivに「text-align:center;」をしたら、上記ブラウザ＋Fx2に対応できました。 なんで、きくのだろう、、、？ シンプルにしたデモ（Fx2対応） 追記：その2 「ふ」さんのコメントにより、Saf

Konstruktors Notesのエントリー「How to Create Beautiful and Elegant HTML Lists Using CSS」から、CSSを使用して美しくエレガントなリストを制作する方法を紹介します。 How to Create Beautiful and Elegant HTML Lists Using CSS 各ブラウザによるリストのレンダリングの差 リストにmarginやpaddingを指定した場合、「Internet Explorer」と「Gecko, Webkit and Opera」の各ブラウザで、レンダリングが異なります。 <textarea name="code" class="css" cols="60" rows="5"> ul, ol{ margin:auto -3em 1em 0; padding:0; position:rel

Styling form controls with CSS, revisited フォームの各エレメントのブラウザごとの表示。 追記： 2008年2月28日 「text field designs」を追加。

テーブル要素(tableなど)を使用しないで、リスト要素(ul, li）を使用して制作するカレンダーの紹介です。 Tableless Calendar In Use デモ pixelspreadのデモでは、カレンダーをリスト要素でマークアップし、スタイルシートで表組みのようにしています。 カレンダーのようなエレメントはテーブル要素にしていましたが、表組みではなく、リスト要素の方がいいな、と思いました。

グラデーションを使用したアローでデザインされた、シンプルでクールなパンくずのスタイルシートをVeerle's blogから紹介します。 <textarea name="code" class="html" cols="60" rows="5"> <ul id="crumbs"> <li><a href="#">Home</a></li> <li><a href="#">Main section</a></li> <li><a href="#">Sub section</a></li> <li><a href="#">Sub sub section</a></li> <li>The page you are on right now</li> </ul> </textarea>

Styled Menuから、IE6/7, Firefox, Opera, Safari, Chromeに対応した、フリーのナビゲーションを紹介します。 Styled Menu ナビゲーションはリスト要素で実装されており、ラベルを日本語に変更するなどカスタマイズも可能です。

Matthew James Taylorのエントリーから、高さの異なるdivで組んだカラムの高さを揃えるスタイルシートを紹介します。 Equal Height Columns with Cross-Browser CSS & No Hacks demo: 2カラム demo: 3カラム 以前、紹介した「高さの異なるカラムを揃えるスタイルシート」では、ページ内アンカーで要素が消失したり、IEで印刷できないなどの不具合がありましたが、今回紹介するものは、その２つの不具合が無いものとなっています（IE7調べ）。 対応ブラウザは、IE5.5, 6, 7, Fx1.5, 2, 3, Op8, 9, Safari, Google Chromeなどほとんどのものに対応しています。 仕組みはカラムごとにdivを用意し、それぞれをずらして配置します。 下記は、そのイメージです。

New CSS Sticky Footer - 2009 demo 主な対応ブラウザは、IE6/7/8, Fx2/3, Op9.6/10, Safari3.2, Crome1となっており、他にも多くのブラウザに対応しています。 対応ブラウザリスト New CSS Sticky Footerは、同じくフッタを下部に固定表示する「CSS Sticky Footer」の空divの使用を排除しHTMLをよりクリーンにし、マルチカラム対応にしたものとのことです。 仕組みはシンプルで、下記が最小の構成になります。 HTML マルチカラムの場合は、「id="main"」のdivに配置します。 <textarea name="code" class="html" cols="60" rows="5"> <div id="wrap"> <div id="main" class="clearfix"> </d

ネットブックで動く軽量Linuxディストリ大全（前編） ～ 低スペックPCでさくさく快適環境 ～ 小型で廉価な「ネットブック」が人気を集めています。日本では少数派ですが、ワールドワイドで見ると価格を抑えるためにLinux、それもさくさく動作する軽量なLinuxディストリビューションを搭載して出荷されるケースが多いようです。その特徴をご紹介します。皆さんもお手元のネットブックで試してみませんか？（編集局） Shin.鶴長 2009/1/26 人気高まるネットブック、Windowsで？ それとも…… 「ネットブック」といわれる小型で廉価なノートPCが好調です。各メディアがこぞってネットブックを取り上げ、モデル比較から改造ネタまで、さまざまな特集を目にする機会が増えました。こうした盛り上がりにすっかり物欲を刺激され、購入に向け検討されている方も多いのではないでしょうか。 筆者も例外ではなく、手に

IEBlog : The Internet Explorer 8 User-Agent String As Dean announced, a beta version of Internet Explorer 8 will be released in the first half of 2008. IE8のユーザエージェント文字列は次のようになるようです。 Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.0) アクセス解析なんかを作っている方は早めに対応できますね。 MSIE 8.0 ということで、なんとなく時代の経過を感じてしまいました。

3月1日に、これまで公開されてきたすべてのバージョンを含む、Netscapeブラウザとメーラーの開発・サポートが終了します。 現在Netscapeを使っている方には、後継製品であるMozilla FirefoxやMozilla Thunderbirdへの移行が推奨されています。ブックマークやメールを引き継ぐ方法は利用しているバージョンごとに異なりますが、Mozilla Japanが公開している「Netscape ユーザのための Firefox/Thunderbird 移行ガイド」にて網羅されています。 操作性が変わっても問題ないという方は、Operaなど他のブラウザを試してみるのも良いかもしれません。 さて、日本には未だNetscape 7.1を「推奨ブラウザ」としているサイトが多く存在しています。これはバージョン7.1が、Netscape日本語版の最終バージョンであるからと推測されます。

20日に発表されたGoogleの新しいWeb API、Google AJAX Language APIは、誰でも簡単に言語の翻訳を行えるようにするJavaScript APIだ。同APIを使うと、JavaScript文字列に対して「日本語←→英語」や「中国語←→英語」と言った変換を簡単に行えるのみならず、文字列が何語で書かれているかを自動判別することもできる。 同APIのパワーがどれほどのものかというと、以下のような翻訳サイトを10分足らずで作れてしまったほどだ(ソースコードは次ページで解説)。 非常にシンプルなAPI(メソッド2つしかない!)にも関わらず、そのパワーがあまりに凄まじすぎる。この興奮をぜひ皆さんにもお伝えしたいと思う。 ということで、さっそくLanguage APIの使い方を学んでいこう。

PHPでケータイのFlash対応・非対応を判定できる関数を作ってみました Tweet 2008/3/18 火曜日 matsui Posted in Flash, PHP | 7 Comments » ケータイコンテンツでよくある処理に、Flash対応端末であればFlashを、非対応端末であれば画像を出すという処理があります。 今までは、定義ファイルやデータベース内にデータを持って、対応・非対応を判定していたのですが、設置等が面倒ですし、動作も遅いです。 今後発売されるほぼ全ての機種は、Flash対応端末となりそうな感じなので、判定処理をPHPで関数化してみました。 ご利用上の注意事項です。 2008年3月18日時点での端末リストでテストしています 今後はFlash非対応端末が出ないということ、端末の命名規則が大きく変わらないことを仮定しています もしFlash非対応端末が出たり、命名規則を

PHP＋memcache＋Repcachedを試してみた　再び - Do You PHP はてな Do you php さんで、PHP＋memcache＋Repcachedを試した結果例が公開されています。 Repcached とは、memcached のレプリケーションを取る仕組みで、KLabから公開されています。 PHPからmemcachedを使う例は「PHPでパフォーマンス向上のためのキャッシュテクニック色々」も参考に出来ます。 キャッシュデーモンを複数に分散させたい場合に使えそうですね。

CSSnewbieのエントリーから、ボックスモデルのマージン(margin)とパディング(padding)の利用シーンにおける違いを紹介します。 When to Use Margins and Padding マージン(margin)を採用する場合 パディング(padding)を採用する場合 ブラウザによる問題 マージン(margin)を採用する場合 borderの外側にスペースが必要な場合。 スペースに背景色(画像)を適用したくない場合。 上下に隣接したボックスにスペースを設ける場合、マージンの相殺を期待して、大きいサイズを有効にしたい場合。 例：15px + 20px の場合、スペースは20px。 ※相殺されない場合もあります。 パディング(padding)を採用する場合 borderの内側にスペースが必要な場合。 スペースに背景色(画像)を適用したい場合。 上下に隣接したボックスにス

Super Tablesは、テーブルのヘッダを固定表示にし、縦横にスクロールバーを表示させるスクリプトです。

Ann Arbor Michigan Web Design AgencyYou have a split second to make a great first impression on your website See how 3.7 Designs can help you convert more prospects into leads, customers, and members through advanced design psychology and our exclusive Six Layers of Design™ process.

APIが提供されていないサービスから欲しい情報だけを取得するには、HTMLなどから自前でスクレイピングを行うしかありません。PHPでのスクレイピングに役立つライブラリなどをまとめてみました。 PerlやRubyには色々と便利そうなものが見つかるのですが、PHPにはなかなかこれといったものがないですね。 Webスクレイピングライブラリ HTMLScraping HTMLをXML化してDOMやXPathで操作できるクラス。主にHTTP_Request+HTMLParser(XML_HTMLSax3を含む)/Tidy+Cache_Liteという構成で、スクレイピングに必要なものが一通り揃っている。ライセンスはLGPL他。 WebScraper シンプルな汎用スクレイピングクラス。HTTP_Client+HTMLParser(XML_HTMLSax3を含む)という構成で、XPathで要素を抽出でき

minimal icons 1.8.6 by ~sryo on deviantART 携帯絵文字のような小さいアイコンセット「minimal icons」 次のような小さいアイコンが公開されています。 アイコンライブラリファイルのiclファイルで配布されているので、IconShopなんかを使うことで使えるようです。 関連エントリ RSSやデスクトップ用のアイコンが詰まったアイコン集「FreshIcons」 フリーのアイコンを探す＆入手できるサイト集 12500以上のハイクオリティなアイコンをまとめたサイト「IconArchive」

会員登録やサービス申込などのコンバージョンをゴールとしているウェブサイトのターゲットは、そのゴールの達成までに「説得が必要なユーザ」と、「説得が不要なユーザ」の2タイプに分けて考えることができます。 今回は、後者の「説得が不要なユーザ」について取り上げます。 このサイトには、非会員が利用できるサービスもあるのですが、入口ページで会員登録へのリンクを目にしたユーザが、即座に登録を開始しました。 このユーザは、会員登録へのリンクを見たことで、登録した方が多くの機能を使えるのだろうと予想し、とりあえず登録しておこうと考えたのです。 こうした「説得が不要なユーザ」の存在については、アクセス解析による定量的な事例もあります。 あるサイトで、会員登録のボタンをトップページ右上から左上に移動し、クリエイティブを目立つものに変更しました。 この変更の結果、トップページ流入直後の会員登録率が増加し、同時にサ

ドキュメントvsマニュアル マニュアルは開発ドキュメントに勝るのか！？ 著者：シンクイット編集部 公開日：2008/04/01（火） マニュアルがあれば開発ドキュメントは要らない？ 2月の特集「楽々デブドックを書こう！」の「正直使う？ガイドライン」の「第1回：開発者ガイドラインとはなんだ？」を掲載したところ、以下のような読者からの記事評価をいただいた。 「作成ドキュメントの情報量が多く管理がしづらい。ドキュメント作成工数に時間が取れない。顧客側の立場でもありますが、すべてのドキュメントに目を通すとは思えない。 それよりも完成後のマニュアル作成に力を入れれば、必然的に開発ドキュメントになるのではないかと最近は思っています。利用者の立場で書くマニュアル兼開発ドキュメント…な手法がほしい」 シンクイット編集部内では、このコメントのような手法が実現可能かどうか検討を行ったところ、「可能性はありそう

手書き風日本語フリーフォント　あいこフォント あいこフォント（Aiko）は20代前後の女性の手書き文字を参考にして作成した無料ダウンロードできる書体。近年の女性の文字のクセを取り入れつつもデザインとして統一感のある書体です。しっかりとした考え方を持ちつつも、女性らしい可愛らしさをもっている。そんな女性像をイメージした書体です。ひらがな、カタカナ、アルファベット、記号のみの書体ですが、一般的な丸ゴシックの漢字と組み合わせて使える、最適な線の太さになっています。手書きを手本にしている為、漢字に対してカナが小さいデザインになっており、文章、見出しともに読みやすくなっています。 つまり、文字で「キモチ」を表現したいときに威力を発揮するフォントなのです。 女性誌、自然派志向のデザインに手書き風のフォントが相性が良いのはもちろん、吹き出しなどのコメントにもピッタリです。手書きフォントよりも視認性が高

Browser CSS Hack/Filter supportは、IE4, Ns4から、IE8, Fx2, Op9.5, Safari3など、多くのブラウザのCSS Hack/Filterの対応をまとめたサイトです。 Browser CSS Hack/Filter support Browser CSS Hack/Filter supportは、dithered.comのCSS Filterをバージョンアップしたもので、CSS Hack/Filterの対応を検証しているのは下記のブラウザになります。 ※バージョン表記は省略。 Internet Explorer (Windows)：4.0.1～8beta Internet Explorer (Mac OS)：4.0～5.2.3 Pocket Internet Explorer (PocketPC)：4.0.1～5.2 Gecko(Firef

specky boyのエントリーから、ブラウザのスタイルの初期化やレイアウトのテンプレートなど、スタイルシート設計のベースとなるCSSのフレームワークを紹介します。

手書き風日本語フォント はるかフォントとは はるかフォントは女性のキュートな手書き文字を参考にして作成した書体。近年の女性の文字のクセを取り入れつつもデザ インとして統一感のあるフォント。自分らしく自由にイキイキと活動している。そんな元気な女性像をイメージしています。ひらがな、カタカナ、アルファベッ ト、記号のみの書体ですが、一般的な丸ゴシックの漢字と組み合わせて使える、最適な線の太さになっています。 例えば、文字で「女性の元気」を表現したい時に威力を発揮するフォントです。 ティーン向け女性誌などのデザインに、手書き風のフォントが相性が良いのはもちろん。吹き出しなどのコメントにもピッタリです。手書きフォントよりも視認 性が高く読みやすいのに、手書きのような「やさしさ」や「味わい」も感じられるHaruka（はるか）フォントをぜひお試し下さい。この下に使用例サンプルを作ってみました。DTP・デ

「P1エミュレータ」は、ケータイサイト（docomo／SoftBank／auの3大キャリア）、及びスマートフォンサイト(Android、iPhone）の表示・動作を確認できるエミュレーターです。 ページのレイアウトや絵文字など、各キャリアの仕様や個々の端末によって大きく異なる見栄えや、イメージ・動画の再生状況などを一つのソフトで確認することを可能にし、ケータイサイトの管理・運営に掛かるコストを大幅に軽減する画期的ツールです。

MP3やWAV形式の効果音がダウンロードできるサイトの紹介です。 クリックなどの効果音は、ほとんどがロイヤリティフリー(Royalty Free)となっていますが、サイトに収録されている全てを確認するのは不可能なので、一部条件付きのものがあるかもしれません。

過去のユーザビリティ実践メモでは、ECサイトでの商品写真の使い方について取り上げてきました。 関連記事： 実際の大きさがイメージできる商品写真を置こう 写真で見せる商品紹介 今回は、住宅の間取り図、家具の寸法図、通信教育の教材サンプルなど、文字情報を含む画像を掲載する際の配慮したいポイントを2つご紹介します。 ユーザは画像中の文字から何らかの情報を読み取るわけですから、その文字が小さかったり、画像が粗くて読み取れなかったりすると、ストレスを感じてしまいます。それだけでなく、判断に必要な情報が獲得できないことで、その商品(物件・教材)の検討をやめてしまうこともあります。 このような場合、大きくて鮮明な画像を掲載するのがベストなのですが、ファイルサイズの制限から思うように掲載できない場合もあるでしょう。その際は、重要な数字や箇所だけHTMLのテキストにして伝達する、という代替策が有効です。 ■

リンク名やボタン名は、その先にどういった情報や機能が存在するのかをユーザに伝える重要な役割を果たします。 今回は、旅行サイトのケースを例に、ラベリング（名づけ）が与える影響を取り上げます。 旅行サイトに訪れたユーザAは、宿泊先を探すという目的でサイトを訪れたにも関わらず、トップページにある、『宿泊予約』というリンクを見て、本当は正解であるこのリンクを意図的に避けてしまいました。 同様の目的をもったユーザBは、別の旅行サイトのトップページの『ホテル・旅館検索』というリンク名を目にすると、即座にクリックしました。 いずれも同種のページにリンクされており、ユーザが目的を達成するための正しい入口でした。 ユーザの行動を分けた要因は何でしょうか。主に次のような要因ではないかと考えられます。 宿泊先を探すユーザの行動フェーズは、 宿泊施設、宿泊プランの検討 宿泊施設、宿泊プランの選定 予約手続き とい

資料請求や申込みフォームにおけるユーザの離脱を防ぐ方法はこれまでもご紹介しましたが、今日は「入力フォームに遷移する手前」で行う離脱を防ぐ心がけを私の実体験からご紹介したいと思います。 郵便番号、住所、名前と入れ画面をスクロールすると、次の項目に、「お客さま番号」という項目があることを見つけました。 始め、このお客さま番号が何の番号か思い当たらなかったのですが、入力欄の脇にある「お客さま番号とは」というリンクから、毎月届く領収証（「電気ご使用量のお知らせ」）に記載されている番号であることがすぐにわかりました。（このサイトでは、実際の領収証のイメージで説明しており、とてもわかりやすくなっていました） しかし、領収証の保管場所をすぐに思い出せなかった私は、また後日手続きを行おうと思いここで画面を閉じてしまいました。 皆さんはこのような経験をされたことはないでしょうか？ このような状況にユーザが置

しかし、プルダウンでの項目選択を行う入力フォームにおいては、この便利さが逆効果になる場合があります。弊社のユーザビリティテスト（ユーザ行動観察調査）で観察された例をご紹介しましょう。 1ページの入力項目が多く、何度かスクロールしなければ「次へ」のボタンまでたどり着けない入力フォームを使うという作業で、ほとんどのユーザはホイールを使いながら入力を進めて行きました。 その中で、あるユーザがプルダウンの項目を選択し終え、ページをスクロールして次の項目へ入力を進めようとホイールを操作したところ、直前に入力したプルダウンにまだフォーカス（ハイライト）が当たった状態であったため、選択項目が別のものに変わりました。つまり、ホイール操作がページのスクロールではなく、プルダウン内の選択項目の移動に使われたということです。 ユーザはページがスクロールしないことにすぐ気づき、ページ内の空白部分をクリックしてプル

当サイトではCookieを使用しています。引き続き当サイトを閲覧することにより、ポリシーを受け入れたものとみなされます。今後表示しない詳しく見る

張られているリンクをより多く見つける目的で、GooglebotにHTML Formを送信させて出てきたページもクロールさせる、という発表があった。 JavascriptやFlashの中から他ページへのリンクを抽出するというのは既に実施していて、今回はそれをページ上の入力フォームにも拡大するものだということ。いわゆるディープウェブ、見えないウェブといわれる領域への進出だ。 クロールされるフォームは以下のようなものに限定されるようだ。 GETメソッドであること robot.txtなどで除外指定されていないこと passwordフィールドを持たないこと user, id, accountなどのフィールドを持たないこと これらを満たすフォームに対して、クローラはいくつか適当な文字を入れてフォームを実行し、その結果新しいリンクが現れたらその先もクロール対象にする、ということ。 この方法で見つかったリ

XSSは知ってても、それだけじゃ困ります？ もいちどイチから！ HTTP基礎訓練中（1）　Webアプリのセキュリティについてもっと詳しく知りたいけれど、まず何を勉強すればいいの？ そんな疑問に応える新連載！ （2007/9/28） リクエストをいじれば脆弱性の仕組みが見えるのだ！ もいちどイチから！ HTTP基礎訓練中（2）　Webサイトを見るということは、HTTPのやりとりを行っているということ。それをのぞき見していじってみるとさらに理解が深まります （2007/10/26） Ajaxのセキュリティ、特殊なものだと思ってました もいちどイチから！ HTTP基礎訓練中（3）　AjaxでなければWeb2.0ではない、といわんばかりのAjaxブーム。対抗するには「セキュリティ2.0」が必要なのか、勉強会で確認！ （2007/12/7）

builder by ZDNet Japanをご愛読頂きありがとうございます。 builder by ZDNet Japanは2022年1月31日にサービスを終了いたします。 長らくのご愛読ありがとうございました。

今を知り、未来を見据える 培ってきたノウハウを最新技術へ対応させる レガシーシステムのモダン化実現への道 ビジネスのためのデータ基盤構築 DX時代の企業成長はデータ活用が鍵 新たな展開を後押しするSQL Server活用 VMware modern App Days特設企画 VMware Tanzuによって拓かれる未来 これからアプリケーション戦略の道しるべ オラクルスペシャリストが語る！ 多くの企業で利用されるオラクルDBの課題 アセスメントの重要性とコスト最適化 DX推進を阻害する3つの要因 プロフェッショナルが語る データ分析・データ活用の実現 激変するビジネス環境の中でのDX モダンアプリケーション戦略への取り組みが 市場の競争力の源泉となる 内閣官房やラックが登壇 ゼロトラストが官民一体で サイバーセキュリティを定義する クラウドネイティブの実現 モダンインフラの構築・運用の課題

cat888 live เว็บไซต์ของเราได้รับการรับรองว่าเป็นเว็บพนันที่มีคุณภาพเยี่ยมที่สุดในประเทศไทยสำหรับการพนันออนไลน์ เว็บพนันที่มั่นคงและปลอดภัยที่สุดสำหรับการเดิมพันออนไลน์ที่ทำการเงินอย่างมั่นคงและปลอดภัยและรับรองความเป็นส่วนตัวของคุณในการเล่นเกมพนันที่นี่. ทางเรามุ่งเน้นให้ประสบการณ์การพนันออนไลน์ที่ไม่ซ้ำซากและน่าสนุกที่สุดเลยค่ะ! cat888 หวย เมื่อคุณมีความระมัดระวังในการพนันออนไลน์ คุณจะมั่นใจได้ว่า

Hartija - Css Print Framework Hartijaをページに実装するには、ダウンロードした「print.css」を下記のように「media="print"」を記述して配置します。 <textarea name="code" class="html" cols="60" rows="5"> <link rel="stylesheet" href="print.css" type="text/css" media="print" /> </textarea>

yamazakiです。最近だいぶあたたかくなってきましたね。おかげで日中眠くて仕方ないわけですがいかがお過ごしでしょうか。 ウノウに入る以前も含めてそれなりに長いことHTMLとCSSを書いてきたわけですが、今回は試みに、「だいたいこういうところに気を使われたHTMLだと、CSSでのデザイン適用やレイアウトがやりやすいな」というこれまでの経験則を簡単ですがまとめてみたいと思います。 まあ、このあたりはCSS書く人とHTML書く人の間でちゃんとルールを決めておけばいいだけの話なので、そもそも何の役に立つのか疑問といえば疑問ですが（笑 たとえばユーザがCSSを書いてスキンを作れるようなサービスを作る際、どういったHTMLにするかを決める、みたいな時には少し参考になる、かもしれません。 ID、クラスを適切に割り振って、要素がCSS側から一意に特定できるように たとえばグローバルナビゲーションとカ

Webデザイナー 印刷会社、Web制作会社などのデザイナー/ディレクターを経て、2007年からフリーランスとして活動。デジタルハリウッド講師。 http://www.morethanwords.jp

ページ遷移前に確認をする、onbeforeunload - 実用 windowのonbeforeunloadハンドラで、Event#returnValueに値を入れると、ページ遷移直前にユーザーに確認ダイアログを表示することができる(んだって)。ネタとしては古いかもしれませんが、ページ移動時にダイアログで確認する際のonbeforeloadイベントの使い方。 ページ移動時の確認ダイアログをどうやるんだったか、うろ覚えで、ちょっと調べるのに手間取ったのでメモ。 次のように書いておけば、ページ移動時に確認ダイアログを表示して移動するかどうかを確認できます。 window.onbeforeunload = function(event){ event = event || window.event; event.returnValue = ' ページ移動時の確認文言 '; } Firefox2と

企業における会計業務の目的，財務諸表ができるまでの仕組み，会計ルールの基本原則である企業会計原則，主要な業務プロセスにおける会計処理，期末における決算処理の流れなど，会計の基本的な知識を学びます。 ■コンテンツ中の用語解説は機能しません。あらかじめご了承ください。 はじめに 講座ガイド 第1章　会計の基本を理解する（標準的な学習時間　30分） 第1節 SEが会計を学ぶ意義 業務知識はSEの必須教養 会計は最も優先度の高い業務知識 第2節 会計の役割と実務 企業外部向けの報告：財務会計 企業内部向けの報告：管理会計 会計の実務 チェックテスト 第2章　財務諸表の作り方と読み方を理解する（標準的な学習時間　90分） 第1節 複式簿記で財務諸表を作成する 経営状態をストックとフローで測る 家計簿では企業活動を把握できない 露天商で複式簿記を体験する 単式簿記で営業成績

CSS Trickのエントリーから、IE6でよく遭遇する6つのバグとその解決方法の紹介です。 IE CSS Bugs That’ll Get You Every Time ボックスモデルのバグ マージンが二倍になってしまうバグ min-width, min-heihgtと同等の指定 Stepdownバグ hover擬似クラスをa要素以外にも対応 透過PNGを透過表示に対応 ボックスモデルのバグ <textarea name="code" class="css" cols="60" rows="5"> div#box{ width:100px; border:2px solid black; padding:10px; } </textarea>

yamaokaです。 何かソースコードを書いた場合、皆さんはどのようにテストをしていますか？ PHPの場合、PHPUnitやSimpleTestを使ってユニットテストをすることが多いと思います。でも、ユニットテストのために新しいファイルを作ってメソッドを実装したりするの、面倒くさくないですか？ Pythonには標準でDocTestという仕組みが付いています。詳細はPythonのドキュメント（日本語）を参照してもらうことにして、簡単に言うと、実際のソースコードの中にコメントとしてテストケースを書いてしまおうというアイデアです。 「実際のソースコード＝テストケース」になるのですから、メソッドを修整したからテストケースも修整して…という手間が少なくて済みますよね。そうしたDocTestの仕組みを、PHPに移植しようとする試みを紹介します。 rhacoのDocTest rhacoは「PHPのライブ

アートディレクター webデザイナーを経て現在イー・アクセス株式会社AOLJAPANポータルサイトのアートディレクター。 http://www.jp.aol.com/

2008年4月の連載ランキング5位（一覧を見る） 【即実践！HTML+CSS】 身につけたい！正しいコーディング作法

「ツール」カテゴリーの人気ランキング かぞえチャオ! 変更前後のステップ比較もできる、モジュール切り出し機能付きステップカウンタ(ユーザー評価：4.5) MakeExe VBScript/JScriptを素早く・簡単にExeファイルにする(ユーザー評価：4) ここみチャオ! 「かぞえチャオ!」で切り出したモジュールの比較結果(DIFF)を表示、保存する(ユーザー評価：0) ソースカウンター プログラムのソースコードのステップ数(行数)、工数、コスト、品質指標などをカウントする(ユーザー評価：0) aatool2 ツリー形式で直感的にASN.1データの解析・編集ができる(ユーザー評価：0)

BRIANS PET TOKYO主催者 WebデザインからRuby on RailsでのWebアプリ構築までをトータルに行うWebコンテンツデザイナー。現在はBRIANS PET TOKYOにてWebアプリケーション「DORIBAR（ドリバー） 」を開発中 http://brianspet.com

Building Web 2.0 Tag Clouds in PHP PHPでタグクラウドを実装するサンプルプログラムが公開。 配列データを以下のようにタグクラウド化します。 PearのHTML_TagCloudを使って実装することも出来ますが、配列から自分でタグクラウドをカンタンに作成する際の１つの参考にできそうです。 関連エントリ タグクラウドのCSSスタイルシートサンプル集 PHP用タグクラウド生成ライブラリ（HTML_TagCloud）利用サンプル

John Resig - Pure JavaScript HTML Parser JavaScript単体で動作するHTMLパーサー。 JavaScript単体で、HTMLをパースしてXMLに変換するデモも公開されています。 次のように、閉じていなかったり、不正なＨＴＭＬを正すことが可能です。 JavaScriptでの実装のため、クライアントサイドでこの処理が可能になります。 例１） <b>Hello <p>John ↓ <b>Hello </b><p>John</p> 例２） <a href=">aaa ↓ <a href=""">aaa</a> HTMLtoDOM関数で、HTMLをDOMに変換することも可能みたい。 JavaScriptでスクレイピングしたりできそうですね。 関連エントリ PHPでのスクレイピングに役立つライブラリ色々 XPath使いのための日本語チートシート

Ywcafe.net This Page Is Under Construction - Coming Soon! Why am I seeing this 'Under Construction' page? Related Searches: Anti Wrinkle Creams 10 Best Mutual Funds Contact Lens Health Insurance find a tutor Trademark Free Notice Review our Privacy Policy Service Agreement Legal Notice Privacy Policy|Do Not Sell or Share My Personal Information

PHPのための基礎－ソフトウェア工学としてのPHPプログラミング PHPの基礎ではなく、PHP「のため」の基礎としたのには理由があります。連載「PHP開発プロジェクトの夢と現実（http://www.thinkit.co.jp/free/article/0705/5/1/）」で、PHPは習得しやすいプログラミング言語であることを書きました。また、そのことによる弊害も述べました。 今回の連載では「言語としての」PHPについてはある程度わかっているのだけれど、いまひとつプログラミングに自信が持てないという、初級または中級の方々を主な対象として、プログラミングの基礎を解説します。本連載は、「ソート」に焦点をあててその考え方を具体的に説明していきましょう。 改めてソートとは ソート（sort）とは、ものをある規則に合うように並び替えることです。ここではソートアルゴリズムを考えて、ソートを行う関数を