90年代後半から2000年代にウェブ制作を経験した者なら『とほほのWWW入門』と聞いて、ピンと来ない人はいないだろう。同サイトは、HTMLやJavaScript、Ruby、Pythonなどの基礎知識が学べる、ウェブ制作初心者にとってはバイブルのような、とてもありがたい存在だ。サイトが開設されたのは1996年。国内でインターネットが普及し始めた初期からある老舗サイトで、お世話になった人も多いはずだ。 2016年10月を最後に更新がされていないようだが、それでも20年間コンテンツを出し続けるのは、かなり大変なことだったのではないか。同サイトの管理人・杜甫々(とほほ)さんは、いったいどのような人物なのか。サイトを開設したきっかけやインターネット初期の空気感などについて、話を聞いた。 「とほほのWWW入門」管理人・杜甫々さんとは? ――今回は取材に応じていただき、ありがとうございます。杜甫々さんは

こんにちは、Webアプリケーションエンジニアのid:nanto_viです。みなさんHTMLのフォーム検証機能は使っていますか? 近年は各Webブラウザの対応も進み、お手軽にフォームの利便性を高められるようになっています。 そんなフォーム検証機能のひとつがinput要素のpattern属性です。pattern属性の値にJavaScriptの正規表現パターンを指定することで、ユーザーの入力が意図しないものであった場合、フォーム送信ができなくなります。下図は5桁の数字の入力が求められるところに3桁しか入力せずフォーム送信しようとしたところです。ブラウザに組み込みのエラー表示が出現し、またそのメッセージにtitle属性の値が使われていることを確認できるでしょう。(pattern属性を指定する際には、title属性に書式の説明を記述することが推奨されています。) <input type="text"

新年あけましておめでとうございます。今年もボチボチやっていきます。本稿ではPHP製のWebスクレイピングライブラリGoutteを紹介します。Goutte(グット)とはGoutteは必要十分な機能を持ったWebスクレイピングライブラリです。そもそもWebスクレイピングというのは、外部Webページから必要なデータを取ってくるくらいの意味です。つまり、GoutteはWebスクレイピングを簡単に行う道具だと考えればいいでしょう。 具体的には、GoutteはWebクローラとHTMLパーサを組み合わせたようなものです。Cookieやフォームの扱いなどWebブラウザとしての機能は一通り揃っていますし、CSS風の要素指定もできるなど、機能面では他のライブラリと遜色ないように感じます。 さらに僕個人がGoutteに期待している点は、安定性とロングサポートです。Goutteは主要機能をSymfony2お
You can't parse [X]HTML with regex. BecauseHTML can't be parsed by regex. Regex is not a tool that can be used to correctly parseHTML. As I have answered inHTML-and-regex questions here so many times before, the use of regex will not allow you to consumeHTML. Regular expressions are a tool that is insufficiently sophisticated to understand the constructsemployed byHTML.HTML is not a regular
PHP5上でSmartyを利用しています。PerlのCPANモジュール、HTML::FillInForm のように、フォームのパラメータにデフォルト値を入力させたいのですが、Smartyのリファレンスを見る限り、html_radiosなどのhtml_**系関数で直接フォーム部品を生成出来るようなのですが、テンプレート上の既存のフォームにデフォルト値を設定するタイプの機能は見当たりませんでした。 Smaryで上記の要件は満たせないのでしょうか?他にHTML::FillInForm のような機能をもつものがありましたら教えて下さい。もしくは実装上のアドバイスでも結構です。 ※個々のフォーム要素の中で条件分岐して設定を行うのは避けたいです。
iPhone / iPod touch の画面サイズへの調整 画面サイズ:320×480px(Safariの表示領域は320×356px) 横幅980pxまでのサイトは自動で320まで縮小するiPhone向けサイトを作成する場合は、meta name=”viewport”を指定すると、iPhoneでの最初の表示サイズ等を指定できます。 1 <meta name="viewport" content="width=320, "> 例えば上記のように書いた場合、横幅320ピクセル分までの領域をiPhoneの画面上に表示する事になります。 横幅を何も指定しない場合、横幅980ピクセルまでの領域が、画面上で表示されるように自動的に縮小します。 ※iPhoneでは画面サイズに合わせて文字が改行するわけではなく、PCのモニタなどで表示する横幅980pxまでの位置で文字を改行し、それを縮小すると
iPhone 買いました。iPhone 4。はじめてのスマートフォンですよ。 で、この機会にこのサイトのスマートフォン最適化を図ろうと考えたわけです。今までなにもしてなかったので。しかし恥ずかしながらスマートフォン向けのサイトを作った経験がなかったので、どこから手をつけたものかわからない。そこで、とりあえず参考になりそうなネタを探そうと「wordpressiphone 最適化」あたりでググってみたところ (このサイトはWordPress で作ってます)、どうも WPtouchiPhone Theme というプラグインが人気らしい。このプラグインは有効にするだけでWordPress サイトをスマートフォン向けに最適化してくれる便利なもので、採用してるサイトもよく見かけます。 でもプラグインをそのまま導入したんじゃ面白くない。やっぱテーマは自分でいじりたいし。となると、とりあえず知りた
現在動いているシステムやテンプレートを触り、重要度の小さな「iPhone対応サイト」を作るなんてナンセンスです。 (私個人的には重要度MAXですけど、、、) それでもiPhone対応はしたいものです。 そこで!CSSのみでiPhone対応する方法をご紹介いたします。 この方法ですと、システムによる不具合発生を最小限に抑える事ができるので、かなり有効な手段だと思います。 実際の方法は「Read more」 作業時間 私の場合、tableで困ったりしたので2時間強でした。iPhone設定 ページ内に下記のように追記してください。 オススメは、全てのCSS読み込み後がよろしいかと思います。 <link media="only screen and (max-device-width:480px)" href="/css/******.css" type="text/css" re
Ajaxian で Wot no magnifying glass? - Ajaxian という記事があった。HTML はそれなりにかじってるつもりだけど、以下のmetaタグが何を意味するのかが分からなかったので調べてみた。 <meta name="viewport" content="width=320; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" /> Travellers Tales :iPhone 用 Web ページおよびアプリケーションの作り方 -iPhone DevelopmentGuidelines を読むによると以下の通り。 以下は viewport meta tag の属性です。すべてを設定する必要はありません。 width:デフォルトの幅は 980、範囲は [200, 10,000] heigh
「W3Cの賞味期限はあと何年ぐらいだと思いますか?」。先日、あるパーティーでこう聞かれた。私は虚を衝かれたように、思わず真意を聞き返した。なぜなら、私にこの質問をしたのは、日本人として唯一、W3CのXMLワーキンググループで1997~98年のXML 1.0の標準化プロセスに携わった村田真氏だったからだ。村田氏は現在、Office Open XML(主にMicrosoft Officeで用いられる文書形式)の標準化についても情報処理学会 情報規格調査会の専門委員として国際標準化に携わっているなど、この道のエキスパートだ。 驚きはしたが、やはりとも思った。W3Cはもう標準化組織としての黄金期を過ぎ、権威が失われつつある。もしかすると標準化プロセスにしても、もっと良い別のやり方があるのではないか。このところずっとそう感じていたからだ。 W3Cのウィジェット標準を知っていますか? 村田氏の見立てで
IE7のズーム機能を使うと、ラジオボタンやチェックボックス、文中に入れた画像がおかしくなります。こんな風に。 <input type="radio" />ウェブ全体から検索 <input type="checkbox" />日本語のページを検索 <img src="/clip/cmn/img/entry-bg-01.gif" />オマケ IE7のズームで崩れるサンプル これを直す方法。 IE6までは、問題のある要素にheight:0を指定するという、holly hackと呼ばれるバグ対処方法で、数々の問題のあるバグが解決されてきました。IE7になっても、コレに変わり、min-height:0を指定すれば直るじゃん!と思ってました。 しかし、その方法でもこれは直らない・・・。他のズーム機能のあるブラウザではこんなこと起こらないのに、どうすればいいか到底見当もつかない・・・ひどすぎるIE7・・
1リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く