「XHTML」を含む日記

■[greasemonkey]Hatena::Bookmark::24H::Chart

修正:いい加減＆が変換されるのを何とかしてほしい

解説:Hatena::Bookmark::24H(http://hatebu24h.ashitano.in/)に、トップエントリの獲得したブックマーク数の推移のチャートを加えます。

// ==UserScript==
// @name           chart of Hatena::Bookmark::24H
// @namespace      http://anond.hatelabo.jp/
// @include        http://hatebu24h.ashitano.in/*
// ==/UserScript==

var url = unescape("http://chart.apis.google.com/chart?chs=160x60%26cht=ls%26chd=t:");
url = url + $X("//div[@class='clocktxt']", Array).map(function(s){return s.firstChild.nodeValue}).join(",");
//var id = $X("//h3/a/@href")[0].nodeValue;
//url = url + $X("//div[@class='entrytitle' or @class='entrytitle2'][.//a[@href='"+id+"']]/../preceding-sibling::div[1]", Array).map(function(s){return s.textContent.match(/\d+/)}).join(",");
var before = makeElements({
    nodeName: "div",
    className: "sidebox",
    childNodes: [{
        nodeName: "div",
        className: "sidetitle",
        innerHTML: "Recent top entry chart"
      },{
        nodeName: "div",
        className: "sidetitle",
        childNodes: {
            nodeName: "img",
            src: url
        }
    }]
});
var after = $X("//div[@class='sidebox']", Array)[0];
after.parentNode.insertBefore(before, after);

// util

// var 0.01
function makeElements(obj) {
    if (typeof obj != "object")
        return document.createTextNode(obj);
    if (obj instanceof Array)
        return obj.map(makeElements);
    var node = document.createElement(obj.nodeName);
    delete obj.nodeName;
    if (obj.childNodes) {
        [].concat(makeElements(obj.childNodes)).forEach(node.appendChild, node);
        delete obj.childNodes;
    }
    function extend(dst, src) {
        for (var i in src) {
            if (typeof src[i] == "object" && dst[i] && typeof dst[i] == "object")
                extend(dst[i], src[i]);
            else
                node[i]=obj[i];
        }
    }
    extend(node, obj);
    return node;
}

// by http://lowreal.net/blog/2007/11/17/1
// $X(exp);
// $X(exp, context);
// $X(exp, type);
// $X(exp, context, type);
function $X (exp, context, type /* want type */) {
    if (typeof context == "function") {
        type    = context;
        context = null;
    }
    if (!context) context = document;
    var exp = (context.ownerDocument || context).createExpression(exp, function (prefix) {
        var o = document.createNSResolver(context).lookupNamespaceURI(prefix);
        if (o) return o;
        return (document.contentType == "application/xhtml+xml") ? "http://www.w3.org/1999/xhtml" : "";
    });

    switch (type) {
        case String:
            return exp.evaluate(
                context,
                XPathResult.STRING_TYPE,
                null
            ).stringValue;
        case Number:
            return exp.evaluate(
                context,
                XPathResult.NUMBER_TYPE,
                null
            ).numberValue;
        case Boolean:
            return exp.evaluate(
                context,
                XPathResult.BOOLEAN_TYPE,
                null
            ).booleanValue;
        case Array:
            var result = exp.evaluate(
                context,
                XPathResult.ORDERED_NODE_SNAPSHOT_TYPE,
                null
            );
            var ret = [];
            for (var i = 0, len = result.snapshotLength; i < len; i++) {
                ret.push(result.snapshotItem(i));
            }
            return ret;
        case undefined:
            var result = exp.evaluate(context, XPathResult.ANY_TYPE, null);
            switch (result.resultType) {
                case XPathResult.STRING_TYPE : return result.stringValue;
                case XPathResult.NUMBER_TYPE : return result.numberValue;
                case XPathResult.BOOLEAN_TYPE: return result.booleanValue;
                case XPathResult.UNORDERED_NODE_ITERATOR_TYPE: {
                    // not ensure the order.
                    var ret = [];
                    var i = null;
                    while (i = result.iterateNext()) {
                        ret.push(i);
                    }
                    return ret;
                }
            }
            return null;
        default:
            throw(TypeError("$X: specified type is not valid type."));
    }
}

Permalink | 記事への反応(0) | 15:43

ツイートシェア

■auにOpenwave SDK6.2Kについて問合せしたら、、、

auのホームページの案内

http://www.au.kddi.com/ezfactory/tool/ue/

に従って、auエミュレータをダウンロードしようとしたら、

一時公開停止中となっていてダウンロードできない、、。

「いつごろダウンロードが再開されますか？

作成するコンテンツの動作確認がしたいので、早く使いたいです。」

というシンプルな質問を送ったら、

以下のような返事が来た。

質問に答えていない。むかついた。

---

日頃よりauをご愛顧いただきまして誠にありがとうございます。

KDDI au Eメールお問い合わせ窓口でございます。

コンテンツにおける技術情報について、ご案内いたします。

恐れ入りますが、弊社では、個別のコンテンツ作成や、au電話での再生

に関する技術的なご質問に関して、サポートを行っておりませんので、

何とぞ、ご了承くださいますようお願いいたします。

また、EZwebコンテンツの作成方法などの技術情報については、ホーム

ページにてご案内を差し上げておりますが、Openwave SDKに関するご質

問やご意見、XHTML対応モバイルコンテンツ製作についてのご質問につい

ては、Openwave SDKの窓口まで、お問い合わせくださいますようお願い

申し上げます。

他にご不明な点がございましたら、お気軽にお問い合わせください。

今後ともauをご愛顧くださいますようお願いいたします。

Permalink | 記事への反応(0) | 17:33

ツイートシェア

■鬱状態で退職してから

もう既に三ヶ月近く経った。

新たな就労の意欲も湧かないので、ここを見習って薬を飲みながら昼はゴロゴロして過ごす。ただ、眠ってしまうと規則正しい生活ができないので、何でもいいので暇つぶしをする。ネットやゲームばかりに興じていても仕方がないので、購入後未読の小説を読み始めたりして、自由に過ごしている。

最近になって少しずつ就労以外への意欲が湧いてきた。まず部屋を片付ける。以前の仕事に就いてから退職するまでの数年間、掃除機を軽くかけるくらいで、物自体は部屋中に放置していたままだった。心が弱ってくると清掃や身だしなみに気を遣わなくなる（部屋を片付けない、風呂に入らない、など）というが、ありゃ本当だ。それが、今はじょじょにだが片付けようと動き出している。

次に、昼間小説を読むだけではあまりに暇なので、何か勉強しようと思い、毎日パソコンを開いているんだからコンピューターに関連したものを一つやってみようとPHPとMySQLのテキスト買ってきた。XHTMLとCSSを趣味で齧ったことがあったし、テキストにWEB系云々と書かれていたのでちょっとやってみようと思う。書店でテキストを開いたときには正直ちんぷんかんぷんだったのだが、XHTMLのときも似たような状態ながらも何とか最後まで到達したし、こいつも時間をかけてでも最後までやってみようと思う。他には、デブになるのが嫌だから（現在の体型を維持したい）筋トレをじっくり。

現時点での問題点として、お金がまったくない（同族零細サービス業言葉＆リアル暴力有の正社員手取り9万で全く貯金できていなかった。今も督促なんかが来て「払わなければ」という気持ちにはなるんだけども）のと、就労の意欲が湧かないために失業手当の認定を受けることができるかどうかということ。あと、親知らずが痛いこと。

鬱状態に関しては快方には向かっていると思う。性欲も出てきた。ここでは「治りかけが一番危ないから」って書いてあるので調子には乗らないけど（第一治りかけなのかどうか自己判断しちゃいけないわな。一時的に調子が良くなっただけかもしれんし）、30という節目？ゆえに人生に関してはこれから快方へと向かうかどうか…こればかりはどうなるか分からない。

Permalink | 記事への反応(0) | 12:34

ツイートシェア

■はじめてSEOを専門業者に発注した。

まとめ

• 私個人が運営するサイトをSEO業者に発注したことに関する日記。（契約期間は11月1日から6ヶ月間）
• 業者の担当者とのやりとり、業者がSEOと題して行ったこと、順位変動等について私自身の考えを加えながら紹介中。
• 現時点ではまだ業者名を出すつもりはない。
  • 発注前に「少なくとも1ヶ月以内に月10000セッションをYahoo!から得たい」と言ってあり、業者は「それなら我が社のサービスを今すぐに」と乗っている。
  • 業者ははてブでもよく見るWEB担当者フォーラムでよく名称が出てくる企業。
• 発注したのはトップページに対して5キーワードで、サブページ4ページに関して計5キーワードで、Yahoo!・Google・LiveSearchで10位以内。
  • なるべく頻繁にトップページの5キーワード（キーワード1,2,3,4,5）での順位チェックと順位変動を記録していく。
  • キーワード1がいわゆるビッグキーワード、2,3,4,5がビッグキーワード＋１単語の複合ワード。

• 11/10から3日間くらい。Google検索「SEO業者」で20位に入ってた。
• Webマーケティング ブログで紹介された。
• 「はじめてSEOを専門業者に発注した。Part2」> http://anond.hatelabo.jp/20081120014452

はじめは特に本気じゃなかったんだけど、一括見積もりみたいなサイトを利用してみた。予算は10万円以下にしといた。

その結果、3つの業者から連絡が来た。そのなかに、よくweb担とかに出てくる業者があって、ほかの業者に比べて見積もりが安かったから、そこにしてみた。

んで、担当の人と30回くらいメールのやりとりをした。当初、見積もりの段階ではトップページをビッグキーワード1つで上位表示してほしいって書いておいたけど、担当の人が予算が10万円あるなら、トップページだけじゃなくサブページもSEOを施してみてはどうかと提案してくれたから、そういうことにした。

結果、トップページをビッグキーワードを含む5キーワードでSEO（このうち4キーワードは業者に考えてもらった）、サブページ4ページを複合キーワード計5つでSEOということになった。サービスの内容はページのHTMLをチェックし「ページ改善書」というのを作ってくれるというものと、外部リンクの増殖。

どのくらいで効果が出てくるのか？と聞いたところ、キーワードによって異なるけど、ほとんどの場合は11から15日で上位表示している。ビッグキーワードに関してはもう少し遅くなるかもしれないが、そうでなければこのくらいとのこと。

サービスの開始は毎月1日か15日からで、1日からはじめるのなら今すぐに発注所をFAXせよとのことで、すぐに発注書を送った。ちなみに料金は翌月末払いだった。

発注書を送ると、すぐに確認のメールが来た。また外部リンクに使うキーワードのリストもきて、わからないことがあったら気軽に質問してくださいといったことが書かれていた。

外部リンクに使うキーワードのリストを見て、さっそく疑問がわいてきた。例えばトップページはキーワード1、キーワード2、キーワード3、キーワード4、キーワード5の5キーワードで上位表示ということだったけど、設置する外部リンクに使われるテキストは「キーワード1キーワード2」というもの。（リンクに使うテキストには字数制限があるそうだ）

キーワード345はリンクに使われていないがそれでも上位表示は可能なのか。すべてのリンクを「キーワード1キーワード2」とせずに、リンクの何割かを「キーワード1キーワード2」とし、残りの何割かを「キーワード3キーワード4キーワード5」としないのはなぜか。といったことを質問した。

一週間経つけど、これについての回答はこない。回答きた。システムの問題らしい。

システムの都合上、多くのアンカーテキストを扱うことができないが、検索エンジンは関連する語句を見分ける能力があるからキーワード1キーワード2を使ってもキーワード3,4,5で上位表示を行うことができると考えている。

改善書にてキーワード3,4,5は無理やりサイトタイトルに入れるように指示された。

無理やりってのは、「はてな匿名ダイアリー」→「はてな無料ブログ　匿名ダイアリー」みたいな感じ。

また、今日になって発注後はじめてのメールがきた。外部リンク設置作業1段階目が終了したとのこと。メールには「これから20から25日ほど経ったら、効果が出始めると思います」といったことが書かれていた。さて、ここでまた疑問がわいてきた。

発注前の話では15日ほどで上位表示されている場合がほとんどと言われていたが、発注後では20日ほどで効果が出始めるとなっている。となると15日の時点ではまだ効果が出始めていないということだから、15日ほどで上位表示されている場合がほとんどであるということと矛盾している。これについても質問をしたが、まだ返信はこない。回答きた。

平均して11日だが、発注されたキーワードは難易度が高いため20日ほど要すると考えている。

キーワード2,3,4,5については業者に決めてもらったのだが、業者はそのときに「ビッグキーワードは難しいが、ターゲットをしぼったこれらのキーワードなら短期間で上位表示できることが多い」と言っていた。「短期間」なのに「平均」の倍近くの期間を要するなんて、これまた腑に落ちない。

また「ページ改善書はいつ送られてくるのか」と質問したところ、「ページ改善書は今回のみ特別に無料で作成します。のちほどお送りいたします。」といった内容の返信がきた。発注前では契約内容としてページ改善書というのが入っていたが、発注後では「特別無料サービス」のような「おまけ」のような言われ方をしている。ここもどうも腑に落ちない。

ちなみに外部リンクを設置したサイトのリストももらった。外部リンクは500ページに設置したそうだが、500ページというのは5つのサイト（RSSを自動取得してページを量産するタイプのブログ、独自ドメインで構築されている）のそれぞれ100ページ（いちおうインデックスされているみたい）からということみたいだ。さっそくだがAdSense違反報告に出しといた。

web担の記事で、今回発注した業者の代表が「リンク元ページとリンク先ページとの内容が関連しているほどSEO効果が高い」「リンク元ページが多くのページからリンクされているほどSEO効果が高い」といったことを書いていた。しかしながら今回設置された外部リンクは関連性の低いページからのリンクで、また被リンク数の指標を示すGooglePRがなしか０のページからのリンクだった。言っていることとやっていることが違うが、どういうことなのか、と質問のメールを出しておいた。返信きた

外部リンクについては情報開示できません。

発注前は良質なリンクといわれていたが、どうもこれが良質なリンクだとは考えづらい。私が知識不足なだけなのだろうか。

補足:11/7

ちなみに料金は月額4万円ほど。契約期間は最短の6ヶ月で発注した。担当の人は韓国人と日本人のハーフみたいな名前だった。

見積もりがきた残りの2つの業者はどちらも初期費用10万の月間費用数十万で、予算10万？笑わせんなｗみたいな感じの内容だった。

まぁ、1ヶ月くらいたって順位がどう変わったか等を報告するよ。

補足:11/8

ブクマがたくさんついてたからもう少し具体的なことを補足しておく。

はじめに発注したのはYahoo!の月間検索回数20000回ほどのキーワード。担当に提案されたのはこのキーワード＋1単語の複合キーワード4つで、それぞれ2000回ほど。さらにサブページ4ページに対して計5キーワード、それぞれ2000回ほど。

また発注前の時点で私のサイトはGoogleとLiveSearchで担当に提案されたキーワード＋1単語の複合キーワードでは上位に表示されているが、発注したキーワードではGoogleもLiveSearchも80位ほど。Yahoo!はここ1年で100位以内に入ったことはない。セッション数はGoogle:LiveSearch:Yahoo!=90:8:2くらい。サイトの内容としてはYahoo!からのセッションのほうが成果をあげやすい。今回発注したのは上記の10キーワードでGoogle・LiveSearch・Yahoo!の3検索エンジンで目標10位以内というもの。

サイトのスペックは、GooglePR4、Yahoo!被リンク8000、Google被リンク100、Yahoo!/Googleインデックス数260、はてブ7件、Jエントリーに登録されてる。ブログをCMS代わりに使ってる個人運営のサイト。

http://b.hatena.ne.jp/entry/http://anond.hatelabo.jp/20081107171440

えらいタイムリーなタイミングでメールの返事が来とるｗ

被リンクの増殖はスパムと評価されないように、何回かにわけ、1週間単位で設置していくそうだ。開始から7日たった11/7にメールの返信がきたというのも納得できなくもないかもしれない。

http://anond.hatelabo.jp/20081108163851（抜粋）

SBMで多くのブクマを集めた方がよっぽど上位表示されるような気がする。

サイト診断をしてもらったのだが、今考えると、金返せ、と言いたくなる内容だった。

「サイトのヘッダー部分の画像を変えた方が良いですよ」

「Googleページランクを確認した方が良いですよ」

こんなもんだぞ。これってSEO業者のコンサルティングなの？

悪い事は言わんから、効果なかったらあきらめた方が良いかも。追加で金払ったりするのはやめた方が良いよ。

6ヶ月の契約で発注書を送っちゃったから、多分これから6ヶ月分は効果があろうとなかろうと料金を払わなければいけないと思う。もしかしたら「発注前後で言ってることが違うぞ！金返せ！」みたいに訴えれば払わなくて済むかもしれないのかもしれないけど、そういう面倒なのは嫌だ。

もちろん、効果がなかったら契約期間の延長をすることはない。これは担当の人にも言ってある。

実際に、担当の人とのメールのやりとりでしつこく「検索エンジンは外部サイトからのリンクを重要視している」と言われたし、「タイトルタグやメタタグにキーワードを入れることで上位表示云々」とも言われた。多分だけど、少なくともこの担当の人は回答テンプレみたいなのを打ち込んでるだけでSEOについて大した知識はないんだと思う。もしかしたら改善書というのも、このレベルのものなのかもしれない。

私のサイトはどちらかというとWEB初級者が好むような内容。だからはてブやdeliciousにはあまりブクマが付かず、Yahoo!ブクマが多い。けどYahoo!ブクマははてブと違って直リンクじゃないからたくさんブクマされてもあまり意味ないんだよね。もちろんゼロではないと思うけど。

検索エンジンの中の人が「被リンクは少なくともtitleタグより重要だ」と言っているように、やっぱりSEO業者ってのは料金が高かろうが安かろうが、外部リンクの設置がメインなんだと思う。

今は上位に表示されなければ金は取らないというところにしか頼む気にはなれないなあ。

そういうところはトラックバックスパムとか掲示板スパムをやりまくって、たまたま順位アップしたときだけ料金請求をし、順位アップしなかったら放置って感じが多いらしい。

金がたまったらSEO塾を受講してみたい。

補足：11/9

http://b.hatena.ne.jp/entry/http://anond.hatelabo.jp/20081107171440

koichi22

5キーワードくらいの順位取得ならGRC使っておけばいいんじゃないかな。

http://seopro.jp/grc/

紹介ありがとうございます、さっそくインストールしました。いい感じですが、無料版だと5キーワードまでしか設定できないんですね。残念。トップページの順位チェックに使わせていただきます。現時点でのトップページの順位は

http://anond.hatelabo.jp/20081109222125

その程度の予算しかないのに、SEOをしよう、という考えを改めるべき。

他の会社はもっとSEOに予算使ってます。

私がSEOを発注したのは企業サイトではなく、私個人が運営しているサイトだよ。確かに「もっと資金を用意してから」っていう意見はそのとおりだと思うけど、今年中にまとまった金が必要になってしまってね。個人相手だから業者も適当にあしらってる可能性もなくもないか。

補足11/10

※まだサブページにキーワード6,7でリンクを設置しただけのはずだから、サブページの被リンクがトップページに多少の影響を与えているかもしれないけど、恐らく自然と落ちたのだと思われる。

メール着た。

サイトを拝見したところ、非常に良く出来たつくりになっております。

ただ、少し改善した方がよいと思われる所がございました。

お世辞か？以前までは「改善書」となっていたが、今回のメールからは「改善指示書」と名称が変わったそうだ。メール中にはtitleタグ、metaタグ（keywordsとdescription）、キーワード出現率に関する説明がそれぞれ2行ずつくらい書いてあった。

それと、添付されていた改善書をこれから見てみようと思う。ちょまって、なんかこれひどい。一番最初に書いてあったのが「<META NAME="ROBOTS" CONTENT="NOINDEX, NOFOLLOW">を入れるな」。普段からXHTMLを使っているからか、全部大文字だと初心者っぽく見えるな。

メタディスクリプションタグとは、HTMLのソースコードに<description> ｘｘｘ </description>タグとして記述されているタグことです

説明間違ってる・・。

ごめん、なんか誤読してた。titleタグとmetaタグの具体例はちゃんと書かれていた。もっとも、キーワードを繰り返しすぎでおかしな文章になっていたけど。下記ページの悪い例のほうみたいな感じ。

http://www.suzukikenichi.com/blog/write-rich-keyword-content/

補足：11/11

昨日今日と、Googleが大きくランクダウンしてる件。まぁランクダウンしてるといっても、下位から超下位でトラフィックに大した影響はないのだけども。

補足：11/12

急降下したり、急上昇したり、もう少し穏やかにしてくれないものかね。LiveSearchなんか結構上がってるように見せかけて、11/9と比較すると実際には下がってるという。

http://b.hatena.ne.jp/entry/http://anond.hatelabo.jp/20081107171440

sozesoze

SEOスコープはどう？　ttp://search.submit.ne.jp/seoscope.html

紹介ありがとうございました。さっそく使ってみましたが、微妙です。

いちいちログインしなきゃいけないのが面倒なのと、登録した3サイト（というか3ページ）の順位チェックも一括ではなく、サイトごとにいちいち「診断結果レポートを見る」をクリックしなければいけないのが面倒です。（先日紹介したGRCというのは、「実行」をクリックすると登録されているページ・キーワードを一括にチェックできます）

それと、LiveSearchには対応していないみたいですね。

今、順位をチェックしてみたところ、サブページ（キーワード6,7,8,9,10）はすべて「圏外」と出てました。サブページのうち2ページに関しては、11/7の時点で外部リンクの設置がすべて完了しているとのことだったけど…

補足：11/13

補足：11/13

順位変動しすぎだろ・・

補足：11/15

担当者ではなく企業に直接問い合わせてみた。

すごく悩んだのだけど、やっぱりひどすぎる気がする。担当者は話が通じなそうだから、業者のお問い合わせフォームから直接問い合わせてみた。「必ず2営業日以内にご連絡」と書かれていたから、17日までには返信がくるはず。

問い合わせた内容は担当者の説明が矛盾していること、担当者の説明が誤っていること、担当者が糞だから違う人に代わって説明してほしいということ。

11/16：担当者から返信きた。下記はそのコピペである（タイプミスは担当者のもの）

お世話になります。（企業名）の（名前）でsう。

弊社のサービスのご説明に関して、行き違いがり申し訳ございませんでした。

改めて現在の状況を確認し、資料をまとめ、再度ご連絡させていただきますので今しばらくお待ちください。

補足：11/16

補足：11/17

キーワード５がここ1年くらい2位をキープしてたけど、3位に下がってた。ちなみに2位はついこの間まで3位だったページで、1位のサイトのサブページ。

補足：11/18

順位チェックツールでちゃんと動いてくれるものを探しています。

複数のURLを複数のキーワードで一括チェックでき、（短期間でも）ログを保

存できるツールを探しています。オンラインのものでも、ダウンロード・インストールが必要なものでもいいのでオススメがあれば教えていただけるとうれしいです。

Permalink | 記事への反応(7) | 17:14

ツイートシェア

■「ヨドバシ・ドット・コム」がリニューアル後おかしくなってるそうな

どうしたんかいな、とネットワークトレースをとってみた。そしたら、トップ画面の要求に対してこんな応答が返っていた。

GET / HTTP/1.1
Host: www.yodobashi.com
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: ja,en-us;q=0.7,en;q=0.3
Accept-Encoding: gzip,deflate
Accept-Charset: Shift_JIS,utf-8;q=0.7,*;q=0.7
Keep-Alive: 300
Connection: keep-alive

HTTP/1.1 200 OK
Date: Wed, 29 Oct 2008 02:02:31 GMT
Server: Apache
Pragma: no-cache
Cache-Control: private
Expires: -1
Set-Cookie: JSESSIONID=FAE13F42154EB566479E047B57CBF2EA; Path=/cs
Set-Cookie: SS_X_JSESSIONID=AFA6E52B61BCC8A2C2704B1F60B98B6A; Path=/
Set-Cookie: SS_X_JSESSIONID=AFA6E52B61BCC8A2C2704B1F60B98B6A; Path=/
Set-Cookie: SS_X_JSESSIONID=AFA6E52B61BCC8A2C2704B1F60B98B6A; Path=/
Set-Cookie: SS_X_JSESSIONID=AFA6E52B61BCC8A2C2704B1F60B98B6A; Path=/
Set-Cookie: SS_X_JSESSIONID=AFA6E52B61BCC8A2C2704B1F60B98B6A; Path=/
Set-Cookie: SS_X_JSESSIONID=AFA6E52B61BCC8A2C2704B1F60B98B6A; Path=/
Set-Cookie: SS_X_JSESSIONID=AFA6E52B61BCC8A2C2704B1F60B98B6A; Path=/
Set-Cookie: SS_X_JSESSIONID=AFA6E52B61BCC8A2C2704B1F60B98B6A; Path=/
Set-Cookie: SS_X_JSESSIONID=AFA6E52B61BCC8A2C2704B1F60B98B6A; Path=/
Set-Cookie: BIGipServerPool_www_yodobashi_com_cms=1258399936.20480.0000; path=/
Content-Length: 83878
Keep-Alive: timeout=15, max=100
Connection: Keep-Alive
Content-Type: text/html;charset=Windows-31J

えーと。どこから突っ込んでいいのやら。

ベンダ変えた方がよくないですか？＞ヨドバシ

Permalink | 記事への反応(1) | 11:26

ツイートシェア

■http://anond.hatelabo.jp/20081013123012

DTPオペレーターから移ってきた俺からすると、できる事／やれる事／やらなきゃいけない事が多すぎる

非常に難しい職種だと思うんだけど。

例えばサイトを作るにしても、どんな技術を身に付けて、どんなフローで作成していけばいいのか悩む。

手打ちでxhtmlが正しい？WYSYGのツール使うと吐き出すhtmlが汚いからダメ？とかさ。

Permalink | 記事への反応(0) | 13:31

ツイートシェア

■本当に、僕はこれを辞めるべきなのかどうか、すごく迷っている。

僕はいま猛烈に死にたい。増田に聞きたい。僕は会社を辞めるべきかどうか。

僕は今、アメリカで働いてる。こっちの大学を出て、しばらく糞みたいな仕事をして、今もまだしている。昨年末にいろいろあって（個人的な事情で鬱病になって仕事ができなくなった）、会社を首になり、１ヶ月で就職活動をこなして、友人のつとめていた会社に入った。しかしここは全く自分と合わない職場だった。しばらく自分の鬱病の気を出さないように頑張って仕事もかなり頑張ってこなしたつもりだが、最近は全く干されまくっている。

仕事は web のフロントエンドエンジニア。JavaScript とか CSS とか XHTML とかを組む簡単なお仕事です☆そんな人が、Flash まんせーの会社入っても、ねぇ。やっぱりうまく行かないよねぇ。

ヴィザを失ったら、もうアメリカにいることもままならない。だから無職でいることは出来ないんだよねぇ…せっかく大金払って、アメリカの大学出たのに、今、あんまり職歴もつけずに日本帰っても、そんないい仕事につけるとは思えないし、将来アジアに進出しようかと思ってるけど、そうも行かないだろうし。

どうしよう。教えて、助けて増田！

Permalink | 記事への反応(1) | 23:47

ツイートシェア

■今日から本気出す

夏休み終わる頃にはPHPとかXHTMLとかCSSとかちゃんと理解しているようになる。

Permalink | 記事への反応(0) | 12:23

ツイートシェア

■ウェブデザイナーになりたい。

09年新卒生です。関西の私大の文系学部に在籍しています。

ウェブデザイナーになりたいです。

XHTML+CSSでのサイト製作は経験があります。Photoshopも使えます。

その他プログラミング言語については現在勉強中です…（PHP+MySQL）

今まで極普通にIT/WEB関連企業を中心に就職活動していたんですが、フォトショとCSSで色んなデザインを作ったり、ぽちぽちコーディングするのがもともと好きで、そうだ、じゃあウェブデザイナーとかやってみたい、と今更になって思いました。

ですが、どういう会社にいけばいいかわかりません…ウェブデザインを専門にやっている会社、というと、雑誌とかでいろいろ見かけるのですが、リクナビなどではまったく見かけません。おそらく直接企業にアポイントメントを取るのが正しいのかと思いますが、リクナビでエントリーする場合に比べ、そうした方法はアポイントメントに対する本気度が高く捉えられ過ぎてしまうのではないかというのが不安です（皮算用的ですが…要は数当たって合った会社をみつける、というような普通の就活の方法が取れないのではということ）。

そもそもそういう会社って新卒の採用率どれぐらいなのでしょうか…。

個人的なイメージだと専門学校などからの就職がメインなのかなぁなどと考えていたりするのですが…。

Permalink | 記事への反応(4) | 14:36

ツイートシェア

■

はじめは、書院で書いてた日記をフロッピー経由でパソコンに移して、ホームページビルダーにコピペするところからだった。

ソース表示の時に出てくる暗号じみた文字列内に、レンタルCGIのカウンターをつけるため、おっかなびっくり1行加える。

普段は全部GUI上で完結。ソースなんて可能な限り見たくない。

その後、DreamWeaver+Fireworks4のセットを1万円台後半で手に入れて(その後のVerでぼったくり価格に変貌)、画像のスライスを使えばどんなレイアウトでも作れるようになった。

近所の人から製作を頼まれるようになったので、お金をもらって作ることに。

そういう作業にようやく慣れてきたところで、どっかのエラい人が「今後はXHTMLとCSSです。コンテンツと装飾を分離します」と言っているらしい。

なんかそれをやらないと業者的にナメられる気配が濃厚。

仕方が無いので覚える。せっかく今のままでも普通に見れるのを作れるのに、めんどくさい。

というかこれ、GUIで作れないの？今時手打ちってどうなのよ。能率激減。

さて、それはそれとして。

プログラムやれたらもっといろんなことができるんだろうなあ、と思い続けて数年。

フリーのCGIに言葉の置換コードを1行コピペすることから取っ掛かりを得て、ようやくプログラムアレルギーをちょっとだけ克服。

その後さらに数年かけて、Perl・PHP・MySQLで目的の物をなんとか作れる程度まで覚えることができた。

で、今度は「美しいコード」だそうで。

メリットが無いと意欲も湧かないので、教えてください（教えて君）。

それにはどういうメリットがあるの？

Permalink | 記事への反応(1) | 09:44

ツイートシェア

■webの混沌を愛せないかな

・キーワード検索のやり方も知らず、リンクアンカーで彷徨った末に胡散臭い情報商材に引っかかる初心者。

・数万通のメールを送信して金持ちになるスパマー。

・自サイトのスペースをドット単位で販売して100万ドルを手に入れた男。

・スネオの髪型を洒落でニセ立体化してみたらニュースに載るほどの騒ぎに。

・アダルトサイトの迷宮のようなリンクアンカー。

・mixiで犯罪自慢して人生オワタする若い人。

・その人を個人情報保護なんて糞喰らえな勢いで「祭る」匿名の人たち。

・例え裁判所から命令されてもお金を出す気は全くないどっかの管理人さん。

・ウイルスを作ってもそれを罰する規則が存在しないので別件逮捕。

・リミックスされまくって、もはや元ネタの追跡すら難しいMAD動画。

・自サイトのローカルルールを絶対化するサイト管理人。

・無断リンク禁止サイトに押しかけて正義を気取るモヒカンさん。

・新しいwebサービスには恐ろしいスピードで飛びつくが、意外と普通の人がよく使うページを知らなかったりするGeekたち。

これらの全てを許容する、今のこのWorld Wide Webが大好きだ。

webは混沌を常にはらんでいる。

多様性は混沌も生むが、進化も生む。

多様性の結果として混沌と大量のゴミが生まれたとしても、その中から進化が１個でも生まれればそれは進化としては正しい。

----

すべてを整えようとするのは理系技術屋の性なのかな。

技術屋ができるのはあくまで情報の生成から整理までであって、管理はできない気がする。

Googleがやっているのは整理。ティム・バーナーズ・リーがやろうとしたのは管理に近い。（ただし強制力はない。webの情報に機械的意味を持たせて整理しようとしたXHTML(XML)規格は、BlogをはじめとしたCMSのおかげである程度普及したが、Webを席巻する程には至らなかった）

※しかも、Geekから見ると整理されているように見えるものでも、同じものが初心者からは複雑怪奇（というか超難解）に見えたりもするので、事態がますますややこしくなっているように見える。

Permalink | 記事への反応(0) | 21:57

ツイートシェア

■

PHPをおぼえたい。

学部の友だちで院進学が決まってるやつがいて、プレゼミなんかで色々勉強してるんだが、こっちはXHTML+CSSぐらいしか出来ないから、いわゆる「パソコンのはなし」をするときにコンプレックスを感じる。俺ができないから、というよりも、「俺ができないし勉強する気もないのに『俺はパソコンに詳しい』という態度で話してる」と見られてる(気がする)のが凄く嫌だ。

別に実際そういうつもりがあるわけじゃないんだけど、そいつとそういう話をするときにどうしても自分の知識がたりてないことを認識してしまって、気後れする。

そういう情况を解決するためにも、WEBに関係する技術で個人的にいちばん必要としているPHP(+MySQL)について勉強したい。

最終的には、人力検索や教えてgooみたいなユーザーに評価をつけられるQ&A掲示板の制作と、HTMLテンプレートが使えるようになりたい。

というわけで、増田的にお推めの本、教えてくれませんか?

入門でもいいし、ちょっとがんばらないと読めないようなやつでもいいので。

Permalink | 記事への反応(4) | 10:41

ツイートシェア

■60行テンプレートエンジンがパワーアップしてレイアウト機能に対応

前の60行テンプレートエンジンを改良して、レイアウトテンプレート機能を追加してみた（それでも全部で90行）。

レイアウトテンプレート機能とは、例えば個別のテンプレートが<table>...</table>を出力して、それをレイアウトテンプレートが<html><body>...</body></html>で囲って出力するとかそんなの。

詳しくは終わりの方のサンプルをみてくれ。

これは Ruby on Rails（とその仲間たち）にある便利機能のひとつ。

ついでにいうとSmartyにはない機能のひとつ。

今まで知らなかった人はぜひ試してくれ。チョー便利だから。

前回はたくさんのブックマークありがと。

コメントで「男前テンプレート」と名前がついてたので、勝手に採用。

名前がキモいっていわれるよ？でもそんなのカンケイネー

あと、これ以上の機能追加はしないので、各自勝手に改造して使ってくれ（そのためにコメントをつけてるから）。何でも人任せにするな。

コード：

<?php
/*
 *  OtokomaeTemplate.php -- レイアウトテンプレートに対応した90行のテンプレートエンジン
 *
 *  - レイアウトテンプレート中で echo $_content; とすると中身が表示される。
 *  - テンプレート中で設定した変数をレイアウトテンプレートで使うことが可能。
 *  - レイアウトテンプレート名をテンプレート側で指定することも可能。
 *  - 使い方：
 *      require_once('OtokomaeTemplate.php');
 *      $TEMPLATE_DIR    = 'templates';  // 省略可、パーミッションに注意
 *      $LAYOUT_TEMPLATE = 'layout.php'; // 省略可
 *      $context = array('title'=>'Example',
 *                       'list'=>array(10,'<A&amp;B>',NULL));
 *      include_template('template.php', $context);
 *  - 要 PHP 5.1 or later
 *  - ライセンス: public domain （自由に改造してね）
 */

/*
 *  設定用のグローバル変数
 */
$TEMPLATE_DIR    = NULL;   /* テンプレートを探すディレクトリ */
$LAYOUT_TEMPLATE = NULL;   /* レイアウトテンプレートのファイル名 */

/*
 *  テンプレートを読み込んで実行する。
 *  $_context は変数名をキー、値を要素とする連想配列。
 *  $_layout はレイアウトテンプレートのファイル名。
 *  - NULL または省略した場合は $LAYOUT_TEMPLATE を使う。
 *  - FALSE ならレイアウトテンプレートを使わない。
 *  - $_context['_layout'] = '...'; とすればテンプレート側でも指定可能。
 */
function include_template($_filename, $_context, $_layout=NULL) {
    global $LAYOUT_TEMPLATE;
    $_content = render_template($_filename, $_context);
    if (@$_context['_layout'] !== NULL)   // テンプレート側で指定された場合は
        $_layout = $_context['_layout'];  // それを使う。
    elseif ($_layout === NULL)            // 引数で指定されなかった場合は
        $_layout = $LAYOUT_TEMPLATE;      // デフォルトのファイル名を使う。
    if ($_layout) {
        $_context['_content'] = $_content;  // レイアウトテンプレート中で使う変数
        $_content = render_template($_layout, $_context);
    }
    echo $_content;   // or return $_content;
}

/*
 *  テンプレートを読み込んで実行し、その結果を文字列で返す。
 *  include_template() の実体。
 */
function render_template($_filename, &amp;$_context) {
    $_cachename = convert_template($_filename);
    extract($_context);     // 連想配列をローカル変数に展開
    ob_start();
    include($_cachename);   // テンプレートを読み込んで実行
    return ob_get_clean();
}

/*
 *  テンプレートファイルを読み込み、convert_string() で置換してから
 *  キャッシュファイルに書き込む。読み込み時のロックは省略。
 *  (file_get_contents() もファイルロックできるようにしてほしいなあ。)
 */
function convert_template($filename) {
    global $TEMPLATE_DIR;
    if (! file_exists($filename) &amp;&amp; $TEMPLATE_DIR)
        $filename = "$TEMPLATE_DIR/$filename";
    $cachename = $filename . '.cache';
    if (! file_exists($cachename) || filemtime($cachename) < filemtime($filename)) {
        $s = file_get_contents($filename);
        $s = convert_string($s);
        file_put_contents($cachename, $s, LOCK_EX); // LOCK_EX サポートは 5.1.0 から
    }
    return $cachename;
}

/*
 *  テンプレートの中身を置換する。
 *  - '#{...}' を 'echo ...;' に置換
 *  - '%{...}' を 'echo htmlspecialchars(...);' に置換
 *  - ついでにXML宣言も置換
 */
function convert_string($s) {
    $s = preg_replace('/^<\?xml/', '<<?php ?>?xml', $s);
    $s = preg_replace('/#\{(.*?)\}/', '<?php echo $1; ?>', $s);
    $s = preg_replace('/%\{(.*?)\}/', '<?php echo htmlspecialchars($1); ?>', $s);
    return $s;
}
?>

サンプルPHPコード:

<?php
require_once('OtokomaeTemplate.php');
$TEMPLATE_DIR    = 'templates';
$LAYOUT_TEMPLATE = 'layout.php';
$context = array('list'=>array(10,'<A&amp;B>',NULL));
include_template('template.php', $context);
?>

レイアウトテンプレート(layout.php):

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
          "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  <body>
    <h1>%{$title}</h1>
    <div id="maincontent">
<!-- テンプレートの内容 -->
<?php echo $_content; ?>
<!-- /テンプレートの内容 -->
    </div>
  </body>
</html>

テンプレート(template.php):

<?php // レイアウトテンプレート名をテンプレート中で指定する場合 ?>
<?php //$_context['_layout'] = 'mylayout.php'; ?>
<?php // レイアウトで使用する変数をテンプレート中で指定する場合 ?>
<?php $_context['title'] = 'レイアウトのサンプル'; ?>
<table>
<?php foreach ($list as $i=>$item): ?>
  <tr bgcolor="#{$i % 2 ? '#FFCCCC' : '#CCCCFF'}">
    <td&gt;#{$i}</td&gt;
    <td&gt;%{$item}</td&gt;
  </tr>
<?php endforeach ?>
</table>

出力例：

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
          "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  <body>
    <h1>レイアウトのサンプル</h1>
    <div id="maincontent">
<!-- テンプレートの内容 -->
<table>
  <tr bgcolor="#CCCCFF">
    <td&gt;0</td&gt;
    <td&gt;10</td&gt;
  </tr>
  <tr bgcolor="#FFCCCC">
    <td&gt;1</td&gt;
    <td&gt;&lt;A&amp;B&gt;</td&gt;
  </tr>
  <tr bgcolor="#CCCCFF">
    <td&gt;2</td&gt;
    <td&gt;</td&gt;
  </tr>
</table>
<!-- /テンプレートの内容 -->
    </div>
  </body>
</html>

いくつか補足：

• コードやサンプルがおかしくない？
  • → スーパーpre記法のバグ。色付きにすると日本語が化ける件も含めて、バグフィックスしてください＞はてな。こんなんじゃサンプルコードが載せられん。
• つかわさせてもらってええのん？
  • → もちろん。そのための public domain。改変、商用、非公開、無問題。
• #{} や %{} の中に '}' が入ってたらうまくいかない
  • → 仕様。PHP の式には '{ }' が現れることはめったにないので実用上困らない。もし '}' が現れたら <?php echo ...; ?> すればいいだけ。
• 変数の中に"#{foo}"という文字列が入っていたら表示が崩れる。「convert_string("#{$value}")」とした時の$valueの中身が"#{hello}"とかね。
  • → そんなことない。変換時と実行時（評価時）の動作を勘違いしてる。
• キャッシュ無しかよ。
  • → あるわけがない。別のキャッシュ用ライブラリ使え（PEAR::Cache_Liteとか）。つうか出力をキャッシュする機能はコントローラに持たせる機能であって、テンプレートエンジンに求めるのはほんとは筋違い。
• ほんとにSmartyより速いの？
  • → Smartyより速いというか、Smartyが遅いだけ（Smartyが速いというのは迷信）。自作ベンチマークだと、Smartyの約2倍から3倍の速さ。ただしレイアウトテンプレート機能を使うとちょっと遅くなる。
• 使ってみたけど体感速度は2倍も違わないよ？
  • → 2倍速くなるのはテンプレートの部分だけで、アプリケーションが2倍速くなるわけではない。
• PHP4で使いたいんだけど。
  • → file_put_contents()を取り除けば、PHP4でも使えるはず。自分で改造してみて。

Permalink | 記事への反応(2) | 23:27

ツイートシェア

■[DIY]55行で作るC#用テンプレートエンジン

http://anond.hatelabo.jp/20071030034313 の二番煎じ

あまりのアホさに、作ってて気が狂いかけた

方針

• <%= expr %> で C# の式を echo(Htmlエスケープ付き)
• <% code %> で C# のコードを埋め込み
• eval……使ってもいいよね？

using System;
using System.CodeDom.Compiler;
using System.Collections.Generic;
using System.IO;
using System.Reflection;
using Microsoft.CSharp;

delegate void ConvertTemplateDelegate(TextWriter tw, Dictionary<object, object> args);
static class TemplateGenerator {
    public static ConvertTemplateDelegate Generate(string code) {
        CompilerParameters param = new CompilerParameters();
        param.GenerateInMemory = true;
        param.ReferencedAssemblies.Add("System.Web.dll");
        CompilerResults rs = new CSharpCodeProvider().CompileAssemblyFromSource(param, ParseTemplate(code));
        if (0 < rs.Errors.Count) {
            StringWriter sw = new StringWriter();
            sw.WriteLine("Compile Error...");
            foreach (CompilerError err in rs.Errors)
                sw.WriteLine(err.ToString());
            throw new Exception(sw.ToString());
        }
        return (ConvertTemplateDelegate) Delegate.CreateDelegate(typeof(ConvertTemplateDelegate), rs.CompiledAssembly.GetType("Template", true).GetMethod("Convert"));
    }
    private static string ParseTemplate(string code) {
        using (StringWriter sw = new StringWriter()) {
            sw.WriteLine("using System; using System.Collections.Generic; using System.IO; using System.Web;");
            sw.WriteLine("public static class Template {");
            sw.WriteLine("public static void Convert(TextWriter tw, Dictionary<object, object> args) {");
            int index = 0;
            while (0 <= index &amp;&amp; index < code.Length) {
                int i = code.IndexOf("<%", index);
                sw.WriteLine("tw.Write(\"{0}\");", EscapeString(i < 0 ? code.Substring(index) : code.Substring(index, i - index)));
                if (0 <= i) {
                    i += 2;
                    int i2 = code.IndexOf("%>", i);
                    if (0 <= i2) {
                        string cc = code.Substring(i, i2 - i);
                        if (cc.StartsWith("="))
                            sw.WriteLine("tw.Write(HttpUtility.HtmlEncode(\"\"+({0})));", cc.Substring(1));
                        else
                            sw.WriteLine(cc);
                        i = i2 + 2;
                    }
                }
                index = i;
            }
            sw.WriteLine("}}");
            return sw.ToString();
        }
    }
    private static string EscapeString(string code) {
        return code.Replace("\\", "\\e").Replace("\"", "\\\"").Replace("\t", "\\t").Replace("\n", "\\n").Replace("\r", "\\r").Replace("\\e", "\\\\");
    }
}

サンプル C# コード。ためしにテンプレートから Xml 生成して、標準出力してみる。

class Program {
    static void Main(string[] args) {
        ConvertTemplateDelegate func = TemplateGenerator.Generate(TemplateEngine.Resource1.template);
        using (StringWriter sw = new StringWriter()) {
            Dictionary<object, object> arg = new Dictionary<object, object>();
            arg["title"] = "template sample";
            arg["data"] = new string[] { "foo", "fooo", "<strong>foooooooooo!</strong>" };
            func(sw, arg);
            Console.WriteLine(sw);
        }
    }
}

サンプルテンプレート

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
          "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  <head>
    <title><%= args["title"] %></title>
  </head>
  <body>
    <h1><%= args["title"] %></h1>
    <table>
<% string[] data = (string[]) args["data"]; %>
<% for(int i = 0; i < data.Length; i++) { %>
      <tr bgcolor="<%= i % 2 == 0 ? "#FFCCCC" : "#CCCCFF" %>">
        <td><%= i %></td>
        <td><%= data[i] %></td>
      </tr>
<% } %>
    </table>
  </body>
</html>

出力例

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
          "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  <head>
    <title>template sample</title>
  </head>
  <body>
    <h1>template sample</h1>
    <table>


      <tr bgcolor="#FFCCCC">
        <td>0</td>
        <td>foo</td>
      </tr>

      <tr bgcolor="#CCCCFF">
        <td>1</td>
        <td>fooo</td>
      </tr>

      <tr bgcolor="#FFCCCC">
        <td>2</td>
        <td>&lt;strong&gt;foooooooooo!&lt;/strong&gt;</td>
      </tr>

    </table>
  </body>
</html>

CodeDom 使って動的コンパイル……って、このコードのままだとセキュリティ的に大問題な気がするな。

素直に ASP.NET 使ったほうが楽だと直感した。

あと EscapeString すっごく自信ない。たぶん修正が必要だと思うｗ

Permalink | 記事への反応(0) | 23:32

ツイートシェア

■40行で作るPerl用テンプレートエンジン

60行で作るPHP用テンプレートエンジン

やってしまった・・・。

方針：

• PHPのように＜?php・・・?＞が無いのでそのまま表示と(foreach|if|unless)に対応。
• [% $c{title} %]で普通に表示(TTっぽい？)
• [# $c{title} #]でHTMLエスケープ表示

package SixtyLinesTemplate;

use strict;
use warnings;
our $VERSION = '0.01';

sub convert {
    return unless defined(my $str = shift);
    $str =~ s{&}{&}gso;
    $str =~ s{<}{&lt;}gso;
    $str =~ s{>}{&gt;}gso;
    $str =~ s{\"}{&quot;}gso;
    $str;
}

sub include_template {
    my $tmpl = shift;
    my %c = %{+shift};
    eval convert_template($tmpl);
    die $@ if $@;
}

sub convert_template {
    my $tmpl = shift;
    my $cache = $tmpl.'.cache';
    return scalar do { open my ($FH) , $cache; local $/; <$FH> }
        if ( -f $cache &amp;&amp; (stat($tmpl))[9] <= (stat($cache))[9] );
    my $out = do { open my ($FH) , $tmpl; local $/; <$FH> };
    $out =~ tr/()/\x28\x29/;
    $out =~ s/\[%\s*(foreach|if|unless|end)\s*(.+?)\s*{?\s*%\]/");".(lc($1) eq 'end' ? '} print q(' : "$1 $2 { print q(")/ige;
    $out =~ s/\[%(.+?)%\]/);print $1; print q(/g;
    $out =~ s/\[#(.+?)#\]/);print SixtyLinesTemplate::convert($1); print q(/g;
    $out = 'print q('.$out.');';
    open my ($FH) , '>' , $cache;
    print $FH $out;
    $out;
}

1;

サンプルコード：

use SixtyLinesTemplate;

my $context = {
    'title' => 'Example',
    'list'  => [10,'<A&amp;B>']
};

SixtyLinesTemplate::include_template('template.tmpl',$context);

サンプルテンプレート：

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
          "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  <head&gt;
    <title>[# $c{title} #]</title>
  </head&gt;
  <body>
    <h1>[# $c{title} #]</h1>
    <table>
[% foreach my $i (0..@{$c{list}}-1) %]
      <tr bgcolor="[% $i % 2 ? '#FFCCCC' : '#CCCCFF' %]">
        <td&gt;[% $i %]</td&gt;
        <td&gt;[# $c{list}[$i] #]</td&gt;
      </tr>
[% end %]
    </table>
  </body>
</html>

出力例：

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
          "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  <head>
    <title>Example</title>
  </head>
  <body>
    <h1>Example</h1>
    <table>

      <tr bgcolor="#CCCCFF">
        <td>0</td>
        <td>10</td>
      </tr>

      <tr bgcolor="#FFCCCC">
        <td>1</td>
        <td>&lt;A&amp;amp;B&gt;</td>
      </tr>

    </table>
  </body>
</html>

foreachんところが汚く見えるかもしれませんが、あれは添え字を取ろうとするとああなるんでご勘弁を。

普通にループするだけならforeach my $item (@$c{title}) でいけますゆえ。

あと存在しない変数とか使うと死んだり警告でたりするのでevalの前にno strictとno warningsをやった方がいいかもねぇ。

って何まじめに検証してんだ俺・・・orz

追記：

SixtyじゃなくてFortyだね。恥ずかし！

追追記：

danさんに添削頂いたYO！

でも＆amp;の奴はちゃんと書いてるんだけども投稿すると勝手にエスケープされてしまってるんだよね。何でだろ？

ちなみにこのconvertの処理はCGI::Utilから拝借しました。

Permalink | 記事への反応(1) | 15:31

ツイートシェア

■60行で作るPHP用テンプレートエンジン

唐突に、PHP用のテンプレートエンジンを作ってみる。

方針：

• ふつうのPHPファイルをテンプレートとして使う。
• <?php echo $var; ?> は面倒なので #{$var} と書けるようにする。
• <?php echo htmlspecialchars($var); ?> はもっと面倒なので %{$var} と書けるようにする。
• ついでにXML宣言も <<?php ?>?xml ... に自動置換する。

【追記】レイアウト機能を追加してみた

コード：

<?php
/*
 *  SixtyLinesTemplate.php - 60行しかないけどSmartyより速いテンプレートエンジン
 *
 *  使い方：
 *     require_once('SixtyLinesTemplate.php');
 *     $TEMPLATE_DIR = 'templates'; // 省略可、パーミッションに注意
 *     $context = array('title'=>'Example',
 *                      'list'=>array(10,'<A&amp;B>',NULL));
 *     include_template('template.php', $context);
 *
 *  ライセンス: public domain （自由に改造してね）
 */

/*
 *  テンプレートを探すディレクトリ。
 */
$TEMPLATE_DIR = NULL;

/*
 *  テンプレートを読み込んで実行する。
 *  $_context は変数名をキー、値を要素とする連想配列。
 */
function include_template($_filename, $_context) {
    $_cachename = convert_template($_filename);
    extract($_context);
    include($_cachename);
}

/*
 *  filename を読み込み、convert_string() で置換してから
 *  filename.cache に書き込む。読み書きのロックは省略。
 *  (file_{get,put}_contents() はファイルロックできるようにすべきだ。)
 */
function convert_template($filename) {
    global $TEMPLATE_DIR;
    if (! file_exists($filename) &amp;&amp; $TEMPLATE_DIR)
        $filename = "$TEMPLATE_DIR/$filename";
    $cachename = $filename . '.cache';
    if (! file_exists($cachename) || filemtime($cachename) < filemtime($filename)) {
        $s = file_get_contents($filename);
        $s = convert_string($s);
        file_put_contents($cachename, $s);
    }
    return $cachename;
}

/*
 *  テンプレートの中身を置換する。
 *  - '#{...}' を 'echo ...;' に置換
 *  - '%{...}' を 'echo htmlspecialchars(...);' に置換
 *  - ついでにXML宣言も置換
 */
function convert_string($s) {
    $s = preg_replace('/^<\?xml/', '<<?php ?>?xml', $s);
    $s = preg_replace('/#\{(.*?)\}/', '<?php echo $1; ?>', $s);
    $s = preg_replace('/%\{(.*?)\}/', '<?php echo htmlspecialchars($1); ?>', $s);
    return $s;
}
?>

サンプルPHPコード：

<?php
require_once('SixtyLinesTemplate.php');
$TEMPLATE_DIR = 'templates'; // optional
$context = array('title'=>'Example', 'list'=>array(10,'<A&amp;B>',NULL));
include_template('template.php', $context);
?>

サンプルテンプレート：

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
          "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  <head>
    <title>%{$title}</title>
  </head>
  <body>
    <h1>%{$title}</h1>
    <table>
<?php foreach ($list as $i=>$item): ?>
      <tr bgcolor="#{$i % 2 ? '#FFCCCC' : '#CCCCFF'}">
        <td>#{$i}</td>
        <td>%{$item}</td>
      </tr>
<?php endforeach ?>
    </table>
  </body>
</html>

出力例：

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
          "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  <head>
    <title>Example</title>
  </head>
  <body>
    <h1>Example</h1>
    <table>
      <tr bgcolor="#CCCCFF">
        <td>0</td>
        <td>10</td>
      </tr>
      <tr bgcolor="#FFCCCC">
        <td>1</td>
        <td>&lt;A&amp;B&gt;</td>
      </tr>
      <tr bgcolor="#CCCCFF">
        <td>2</td>
        <td></td>
      </tr>
    </table>
  </body>
</html>

Permalink | 記事への反応(8) | 03:43

ツイートシェア

■ペリーの「PHPにしてくださいよ」

• いまどきPHPではなくPerlで動いているあたり、mixiはどうかしてると思う方々へ捧ぐ

ねぇ〜、PHPにしてくださ〜い。え、PHPにしてくださいよぅ。

ねぇ〜。もぅ。OHねえ〜、いいじゃないよぅ〜

減るもんじゃなしぃ〜。

へ、ペリーとても悲しい。悲しいでーす。ねぇ〜ぃ。PHPにしてくださいよぉ〜。

もう〜。開発者の血を入れ替えてくださいよぅ〜。ねえー。も。もーう！

な、ねえっ！もう！なっ！なに！もう！

こ、このっ、じょ、じょ、上場！

なに、それ？

武器？

なに？それ？なんの意味があるの？

何をそれで実行しようとしてるの？

あなたがーた。

怒り？哀しみ？喜び？喜怒哀楽？

なんっ！

いいじゃなーい、PHP〜。

PHPにすれば、済むのです。

・・・・

おぅ。なしのつぶて、でーすか？

ねえ。

ちょっ、そっちのはじっこに座てる人、そう、そう、あなた。

あなた、どう思う？

あなた、HTML派？XHTML派？

ねえ。

ちょっ、喋ってよ〜。ねえ〜もう。

ちょ、さっきから、黙って、し、もう〜、喋ってよぉ〜。

しかと？しかとですか？

ふんっ！

じゃあ、私はあなた方がそうやって私をしかとする様を、

し・か・と・見守ることにします・・・

・・この、プログラムヲタ！！

あ、あっ、うそ、うそ。気、悪くした？

あっ、あっ、あ、でも、そんなにオタクっぽくないよね、Perlerって。

オタクじゃないのね。おーん・・

お〜ん、ペリーねえ、この間、サイトつくったの、美容室の。

企業サイトなら、カウンターつけようと思たんだけどもねぇ。

お店だったからね、トップページのFlashにしたの。ネ。

ううん、初めてじゃないのね、二回目。うん。

あの、<BGSOUND&gt;でMIDI流すのもいいかなぁと思たんだけどねぇ、ちょっと大袈裟になるでしょ？

だから、うん。

最初はねぇ、Swish。で、今度のはAdobeのFlashなんだけどねぇ。

うん、二回ともトップページでFlashね。うん。

PHPにしーてくーださーい。ふー。PHP〜。

ねへぇ。PHP、してくださいよぅー。ＮＯ〜。

わう、もう！なっ！何やねん！なっ！

もぅ、トップページいったら、招待されろ。招待されたら、コミュニティいけ。

コミュニティいったら、「わぁー。荒らしだあー！」

なにそれ！

で、「たった４日で退会しる！」。

英語デ言ッタラ、We can not allow you．

なに？口説いてるのそれ？それで口説いてるつもり？

Yahoo!、落としたつもり？

もう！なっ！

PerlとPearlの発音の区別もできないくせに！ねぇ。

DOCTYPEも出さないのぅ？ここん家は？

DOCTYPEも？ああ、いい、いい。あっ、もう、まぁ、ま、ん。

コード読めないしね。うん、社長だから。んー。

もうねえ、私の好きなね、日本のことわざに、

「果報は寝てまつ」っていいます。

寝ましょか？ここで。寝させてもらいましょ〜か？

おっ、ほほほほほほっ。

It's a joke ! joke!　ジャ、ココハじょーくあべにゅーデス。

ハハハ・・・OH！OH！OH！OH！

ふ〜。

PHPしてよ〜。ぴいえっち、・・ねぇ。

Perl、それ、そんなPerlしてないで。

PHPにするといいよ〜。

もてるよ〜。もてちゃうよ〜。もてもて。ダヨ〜。

もう、ねぇ、スゴイ。それに。

快適なDreamweaver的生活もねぇ、エンジョイできちゃう。

できちゃう！

register_global、どこでもパラメータねぇ〜。PEAR::HTML_Form、便利ね〜。

＜?php ?＞。さわやか〜。Zendの作ったFramework。ＯＨ！最高〜ッ！！

それに引き換え、Perlのままと、jcode.plはぬるぬるする。cgi、動かない。

で、サブルーチン。ハッシュ。ラクダ本。OＨ！みんな古い！

あっ〜、もうPerlッ、最低ッ！！

もう。あなた達だけよ、今時、Perlしてるの。

おー。だから、ね。いい？だから今こそ、PHPにすれば、い、いーの。

ねえ、ねぇ、でないとね〜。mixi、バッシングするよ。

孤高の天災バカ社長なめると、後が怖いよ〜っ。

ねぇ、どう怖いかは、詳しくいわないけれどもねぇ。

Permalink | 記事への反応(0) | 13:52

ツイートシェア

■Template:HTML

自分はシュミ程度にしかWEB系の技術は知らなくて、XHTML+CSSでのコーディングができますよー程度なんだけど（もちろん自分のシュミ程度にね、

この間知り合いの…職種はなんていうのか分からないけど、某大手IT系企業に勤めてる友人が、趣味で作ってるサイトのソースを見せてもらった。

ソースっていうか、サーバーを覗いたんだけども、phpが使われてて、それつかって？HTMLをテンプレート化して作ってた。

用はこれはヘッダー用、フッター用、サイドバー用、携帯版のフッター用??みたいな感じ。

自分ほんとにHTMLしか知らなかったので、うっわーなにこれ超便利じゃん！ってことですげー興奮した。

んなわけで俺も使ってみたいんだけど、その部分だけ抜き出したようなジャンルの本または解説サイト、って余り無いのね？いや、ちょろっとググって見ただけなんだけど。

いや、たぶんすげー非常識なこと書いてるとは思うんだけど、phpやらの機能の一環で実現してるっていう感じの認識でいいのかな。

そんで俺が使いたかったらphpを１から勉強すればOKなの？

なんかもう便利すぎて、HTMLの機能でこれがあればすんげーーー便利なのに、って思ったんだけども。

誰か教えてくださいませ！

Permalink | 記事への反応(2) | 20:36

ツイートシェア

■http://anond.hatelabo.jp/20070911074005

HTMLでデザインしようとするな。

HTMLは論理的な構造を示すもの。

これは見出しだ、とかこれは表だ、とかな。

「今後のために」についてはXHTML/CSSという枠組みで特に言うことはない。

Permalink | 記事への反応(0) | 09:35

ツイートシェア

■今から

サークルの後輩にXHTML/CSSでのコーディングについて教えるんだけど、

今後のウェブのためにこれだけは言っといて！みたいなのある？

Permalink | 記事への反応(1) | 07:40

ツイートシェア

■http://anond.hatelabo.jp/20070902121736

むしろ今は圧倒的に必要とされているプレーンなドキュメント（断じてXHTML+CSSではない）というものが（未だ限定的な需要でしかない）ウェブプラットフォームの幻想圧力で吹き飛ばされているような。

いいかげんHTMLはもうFIXで次でやろうよ、的に思うんだが。

ハックというのは手抜き技なんだが今はハックがはびこり過ぎて設計までハックでやっつけようとしている気がする。

Permalink | 記事への反応(0) | 16:10

ツイートシェア

■マークアップエンジニアって結局何やる人なの？

何か名前の響きからしてこんな感じの人を想像してたんだけど

• マークアップの技術者→SGML系統のマークアップ言語全般に関する技術者？
• (SGML,) (X)HTML, XML文書を作成する
  • いろんなバージョンとか種類のマークアップ言語の仕様の知識がある(かつ状況に合わせて仕様を選ぶことができる)
    • XHTMLなら1.0, Modularization, 1.1, Basic, Mobile Profile...
  • 関連する諸々の仕様の知識もある
    • HTTP, URI (, IRI)...
• スキーマ(DTD, XML Schema, RELAX NG...)を作成する
• スタイルシート(CSS, XSLT (, XSL-FO, DSSSL)...)を作成する
• ウェブアクセシビリティ(WCAG...)の知識がある
• セマンティックなんとか(Dublin Core, microformats, RDF, GRDDL...)の知識がある

でもいままでamachang発言((X)HTML+CSS しか出来ない人は真剣に第二の何かを探したほうがいいとか)の反応ざっと見てきたけどid:amachang(とその周辺)が「マークアップエンジニア = (X)HTML+CSS しか出来ない人」として話を進めてるのにも関わらずそれについて反論があんまりないんだよな。「趣味じゃなくて仕事として(X)HTML(とCSS)を作成するためにはこれこれこういう知識が必要なんだよ」とか「マークアップエンジニアには(X)HTMLとCSSしかすることがないとでも思ってんのか馬鹿」とか言ったりするのかと思ったらほとんどそんなことなくて、むしろ同意ですとかそんなこと言われなくてもわかってるよとかJavaScriptだって同じじゃんとか見た感じそんなのばっかり。どうも俺の想像した職業とは違うらしい。

マークアップエンジニアって本当に(X)HTMLとCSSの知識だけで(X)HTMLとCSS書いてる人なの？反応見ててそもそも(X)HTMLとCSSに理解があるのかってこと自体にまで疑問を感じるんだけど。

Permalink | 記事への反応(1) | 22:27

ツイートシェア

■テーブルレイアウトについて一言いおう。

複雑じゃなければ（3カラムにわける程度なら）、テーブルレイアウトの方がメンテナンスも特にめんどくさくもないし良いんじゃないだろうか。

CSSで段組の解説サイトとか作っちゃって、floatとかめんどくさい意味不明な仕様に頭を悩ます日々も消えるぜ。

とか思いつつも今日もXHTML/CSSでWeb標準サイト（笑）を作る俺であった。

Permalink | 記事への反応(3) | 17:13

ツイートシェア

■

http://anond.hatelabo.jp/20070724133040

まあ増田のせいというよりは、はてな記法のフォーマットルールがおかしい気もするが。「改行」と「改行二つ連続」の扱いが同じってどういう神経だ。

俺の感覚だと、前者は段落変え(p)じゃなくて改行(br)に変換(でなきゃ無視)して欲しいんだが……なんでこんな仕様なのか、誰か知ってる？

はてな記法は当時人気のあったいくつかのwikiの記法を元に作ったもの。改行の扱いが独特なのはwiki記法の影響だと思う。

当時ポピュラーだったYukiWiki、PukiWikiともに、改行は無視される仕様になってる。これは、整形済テキストの方に影響を与えないで、ソースになるテキストの方には改行を挿入して見やすくしたい、という状況を想定しているのだと思う。多分もともとは、HTML内で改行が無視される（空白と同様に扱われる）のと同じ発想なんじゃないかな。

話が少し飛ぶけど、こういった点から、国内のwikiは元々は論理マークアップ志向だった事が想像できる。各種記法は書いてあることの意味を表現するものであって、外見（ここに改行が入るとかココはインデントするとか）を指定するものではない、というような。実際、YukiWikiの開発時期は、論理マークアップという考えが広く広まるきっかけとなったHTML4.01やXHTMLの公開時期と非常に近い。

ちなみに、他の各種の記法と比較しても、はてな記法の書きやすさはかなり良好。仕様を見ていると、ソースの見易さを犠牲にして書きやすさを重視したんだろうな、と感じる。再編集する事が少ない（=ソースの見易さを犠牲にしても問題ない）日記記述に特化した感じ。ホントに、気になるのは段落や改行周りくらい。

Permalink | 記事への反応(0) | 13:57

ツイートシェア

■根本的にCSSの意味がわかってない

今作ってるサイトは、クライアントが現在所有しているサイトの構造を基本にしてくれということだったので丸ごとダウンロードして改装中なんだが、なんだか色々な意味でアレゲだ。

デザインそのものがベタで古臭い感じだったので、どうせ何も知らない社員がビルダーか何かで作ったんだろうぐらいにしか思っていなかったのだが、中を見たら意外にもxhtmlで書かれていてちゃんとCSSを当てている。

ただ、その当て方を見てるとやっぱり根本的に何か勘違いしているのが見て取れる。例えばヘッダ部分を空のdivにして、背景画像としてロゴイメージを指定してあったり。素直にh1にimg入れろよ。

他にも1色ベタ塗りのメニューボタン背景が画像で指定されていたり。

メニューがdlで作られているけどddがなかったり。

会社のサイトなのにロボット検索避けが入ってたり。

どう見ても構造化ドキュメントにスタイル当てたんじゃなく、見栄えのために構造を作った感じだ。

WYSIWYGなエディタで生成したってなかなかこうはならない。多分かなり変な覚えかたしたんだろうなぁ。

Permalink | 記事への反応(0) | 15:30

ツイートシェア