メタファー、日常生活であまり使うことのない言葉ですが、実はWebを通して私たちは日常的に触れています。 そもそものメタファーの意味はwikipediaに下記のように説明がありました。 メタファーは、言語においては、物事のある側面をより具体的なイメージを喚起する言葉で置き換え簡潔に表現する機能をもつ。わざわざ比喩であることを示す語や形式を用いている直喩よりも洗練されたものと見なされている。 参考: wikipedia Webにおけるメタファーで代表的、かつ議論があるものと言えば、保存を示す「フロッピーディスク」のアイコンでしょうか。 フロッピーディスクは昔、（今ではあり得ない量ですが）データを保存するものでした。そのなごりで私たちはフロッピーディスクのアイコンを見ると「保存するアイコン」と認識するようです。 この他にもWebにおけるメタファーの例はたくさんありますが、 今回は「メタファーがU

「文書保存のあのマークは何なの？」の時代へ。思考が停止してしまったUIデザイン　(神田 敏晶) - 個人 - Yahoo!ニュース 保存アイコンがフロッピーディスクをメタファーとしていることに違和感を抱く人は多い。いや、違和感ではなく、そもそもこのアイコンが何に由来するか、まったくわからないという人も増えてきているはずだ。 スマートフォンで電話をかけるときにタッチするアイコンもアナログ電話の受話器マークだったりする。 「活気的な新たなメタファーを伝える時には、古いメタファーを再定義し、アナロジーを駆使」しなければならないと神田さんは言う*1。 神田さんの記事だけでなく、ネット上でたまに出る話題だ。 では、代わりにどのようなアイコンが良いのか。いろいろとアイデアはあるようだ。また、フロッピーディスクを知らなくとも、すでに多くのソフトウェアで使われており、市民権を得ているから変更する必要はない

アプリケーションに必ずあるコマンドのひとつに「保存」があります。このメタファーとしてフロッピーディスクが長く採用されています。採用された当時は「フロッピーディスクのアイコンがあるから何かを記録するものだろう。よってこれは保存するという意味だ」と関連づけすることが出来たと思いますが今はその逆で「保存をするには、このアイコンをクリック」という認識になっているかと思います。 フロッピーディスクが姿を消してしばらく経ち、知らない人も多いのにも関わらず、このメタファが使われ続けられているのも、ひとつの理由として、アイコンが意味を示すものではなく、意味を示すためのアイコンになり、広く認知されているからかもしれません。Office 2007やGoogle Docsのような比較的新しいアプリケーションでもフロッピーディスクでも採用されているのも、そのひとつの表れでしょう。 Apple製のアプリケーションだ

わかってしまえば、なぁんだってことなのだけど、すごく悩んだので。 php の配列は(見た目は) 2 種類。 hash ぽいものと、array ぽいもの。 // array ぽい $input_a = array("red", "green", "blue", "yellow"); // hash ぽい $input_h = array("r"=>"red", "g"=>"green", "b"=>"blue", "y"=>"yellow"); 配列から要素を削除する場合、 unset を使いなさいと書かれている。 「php 配列 要素 削除」で検索しても、大体 unset しか出てこない。 マニュアルにはこんな風に。 // 配列の要素の一つを破棄する unset ($bar['quux']); これは hash のときに有効なので、以下は有効。 // $input_h['r'] から "r

[追記]気づいたらいつの間にか50ストックを超えていました。みなさんありがとうございます。[/追記] どうも、Opera Nextに（色んな意味で）驚きを隠せないあらっきぃです。 大抵の場合はArray#indexOfで事足りるんだけど、時々高速に配列に要素が存在するか調べたくなることがあります。 例えばこんな風に、要素数100000の配列があったとします。 var arr = (function(len) { var i, arr = []; for(i = 0; i < len; i++) arr.push(~~(Math.random() * len)); return arr; })(1000000);

Google、Microsoft の CDN の jQuery UI を利用するjQuery UI の show と hide メソッドjQuery UI: テーブルをソート可能にするSortable でソート後の順番を POST リクエストで送信するcontenteditable と Sortable を併用するsortable、contenteditable、localStorage の組み合わせSelectable のリストを削除するSortable と Draggable でリストをドラッグアンドドロップで削除できるようにするjQuery.post() のシンプルな例で書いた記事を流用。jQuery UI の Sortable でドラッグ＆ドロップでソートした後の順番は id 属性で表現され、これらを配列形式で取得するには sortable(“toString”) メソッドを使う。

Google is embarrassed about its AI Overviews, too. After a deluge of dunks and memes over the past week, which cracked on the poor quality and outright misinformation that arose…

Twitterでつぶやかれている内容を検索する時に、演算子（パラメータ）なるものが用意されています。 この演算子を知る事で、Tiwtterのツイートをより早く検索する事が出来るようになります。 今回は、Twitterで用意されている演算子を、検索例とともに紹介していこうと思います。 Twitterの検索演算子（パラメータ）のまとめlang:ja「lang:ja」と検索すると、日本語のツイートだけを表示する事が可能です。他の言語のツイートが紛れ込んでいる時には、lang:という演算子を利用してみてください。 例えば、iPhoneは様々な国で使用されているので、日本でのツイートだけ検索したければ、「iPhone lang:ja」といった感じです。 なお、lang:jaの部分を変更すると、他の言語に絞って検索する事も出来ます。 lang:en→英語lang:ko→韓国語lang:zh→中国語la

プログラミング出来ないのにギークハウスを始めたら、420万円の出資を受けて1人でウェブサービスを開発することになった。 最終更新日： 2013/08/26 Ruby ※当記事は寄稿記事になります。 はじめまして。沖縄在住の24歳の@kimihito_ と申します。沖縄に居ながら、Webにある動画のみどころを集める、みどころ.comというサービスを、東京にあるベンチャーキャピタルである、サムライインキュベートさんより出資いただいて、一人で開発しています。 他にはギークハウス沖縄の言い出しっぺで運営しています。ちなみにギークハウスを始めたときには全くコードが書けませんでした(今も書ける方ではありませんが…)。 今回、沖縄に居ながら出したアイデアに投資され、現在開発しているウェブサービスが誕生するまでの経緯をお話しようとおもいます。 サムライインキュベートから出資私が現在住んでいるギークハウス沖

作成：2013/07/1 更新：2014/11/01 Web制作 > 先日ECサイトを制作したときに、動きのあるサイトにしないといけなかったので、色々調べて組み込んでみたんですが、jQueryでもう何でも出来ちゃいますね。近い将来ローカルで画像なんかを編集しなくても、ブラウザだけで色々できるようになるんじゃないでしょうか。今回は定番からちょっとマイナー（Google Analytics関係とか）なものまでjQueryの小技、プラグインを集めさせていただきました。 エンジニア速報は Twitter の@commteで配信しています。 もくじ スクロール １．ページ内リンク／フッターまわり／トップに戻る ２．パララックス スライド ３．カルーセル ４．レスポンシブなスライダー ５．ヌルヌルサクサクなスライドメニュー ６．サムネイル付きクロスフェードスライドショー 補助 ７．Google Ana

作成：2013/06/24 更新：2016/06/30 Webデザイン > ECサイトなどでは、デザインがクリーンすぎたり、余白が多いと成約率が下がることもあるので、フラットデザインをクライアントさんに中々提案できずにいます。（フラットデザインについてはこちら） とはいえ、画像が少ないからロードは早いし、なによりコーディングの時短も大きいですよね。そろそろ、フラットデザインに慣れてきたユーザーも多くなってきたし、Webサービスなんかでは積極的に使いたいところです。 今回は、WPテーマにテンプレート、必須ツールやCSSなどフラットデザイン絡みの情報を整理。まとめサイトをさらにまとめてあるので、大体は揃うと思います。 エンジニア速報は Twitter の@commteで配信しています。 もくじ １．オンラインツール ２．WordPressテーマ ３．Bootstrap テンプレート ４．アイコ

FINDJOB! 終了のお知らせ 2023年9月29日にFINDJOB!を終了いたしました。 これまでFINDJOB!をご利用いただいた企業様、求職者様、様々なご関係者様。 大変長らくFINDJOB!をご愛顧いただき、誠にありがとうございました。 IT/Web系の仕事や求人がまだ広く普及していない頃にFind Job!をリリースしてから 約26年間、多くの方々に支えていただき、運営を続けてまいりました。 転職成功のお声、採用成功のお声など、嬉しい言葉もたくさんいただきました。 またFINDJOB!経由で入社された方が人事担当になり、 FINDJOB!を通じて、新たな人材に出会うことができたなど、 たくさんのご縁をつくることができたのではないかと思っております。 2023年9月29日をもって、FINDJOB!はその歴史の幕を下ろすこととなりましたが、 今後も、IT/Web業界やクリエイティブ

指定の文字列が含まれているか検索し見つかった場合は位置を返す(indexOf, lastIndexOf) String オブジェクトのインスタンスメソッドである indexOf は、対象の文字列に指定の文字列が含まれているか検索し見つかった場合は位置を返します。同じく lastIndexOf メソッドは、対象の文字列にして指定の文字列が含まれているかを文字列の最後から検索します。ここでは String オブジェクトの indexOf メソッドおよび lastIndexOf メソッドの使い方について解説します。

indexOfにはあまり知られてない裏技的な使い方がある。 よく知られてるString.indexOf indexOf 構文 indexOf(searchValue[, fromIndex]) パラメータ searchValue 検索する値を表す文字列。 fromIndex 呼び出す文字列内の検索を始めるための位置。0 とその文字列の長さの間にある整数を指定できます。デフォルトの値は 0 です。 概要 呼び出す String オブジェクト 中で、指定された値が最初に現れたインデックスを返します。fromIndex から検索を始め、値が見つけられない場合、-1 を返します。 indexOf - MDC Doc Center 概要からわかるように、文字列の出現インデックスを取るものだが、肝心なのは見つからない場合-1を返すことだ。 これを利用してとある条件の下で以下の三つの正規表現ライクなこと

WordPress 3.1 から導入された管理バー。 僕は好きなんだけど、結構嫌いな人は多いみたいですね。 そんな人達に管理バーがあると便利だよって伝えたいエントリ。 まずは、以下の2つのプラグインをインストールしてみてください。 Debug Bar Debug Bar Console そうすると、管理バーの右端に「Debug」ってメニューが追加されるはずです。 これが相当便利。 wp-config.php に以下の3行を追加することで、このプラグインは真価を発揮します。 define('SAVEQUERIES', true); define('WP_DEBUG', true); define('WP_DEBUG_DISPLAY', false); デバッグ作業終了後は、これらはコメントアウトしておいたほうが良いでしょう。 Deprecated というメニューを選択すると、WordPres

コーポレートにちょうどいい国産CMS baserCMS を使って制作をしているので、制作上のメモを書きます。 Doc宣言+Meta テンプレ XHTML1.0 <?php $bcBaser->xmlHeader() /* IE6の互換モード問題が危惧される場合は呼び出さないほうがいい */ ?> <?php $bcBaser->docType() ?> <html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja"> <head> <?php $bcBaser->charset() ?> <?php $bcBaser->title() ?> <?php $bcBaser->metaDescription() ?> <?php $bcBaser->metaKeywords() ?> </head> <?xml versio

github に repo つくった。 高速化してあるので下のコードとちょっと違う。デモも作ってみた。 いまさら js で DOM アニメーション。やってみると意外と簡単だった。 最初は setTimeout を使ってたんだけど最近使えるようになった requestAnimationFrame に切り替え。っても setTimeout の呼び出しを requestAnimationFrame に変えるだけだったんだけど。 あと jQuery.Deferred を使ってアレが終わったらコレしてねも実装。動きを書き下せるようになった。 まず下準備として requestAnimationFrame のブラウザサポートの差異を吸収する。 var requestAnimationFrame = window.requestAnimationFrame || window.webkitRequestA