お仕事絵のページ作りました

割と昔からPBWにて、ちょこちょこと描かせて頂いてたのですが、結構枚数がたまったので許可を頂き展示することにしました。

少しでも楽しんで頂けると幸いです。

TextpatternのSectionにBasic認証的なものを付ける

結論から言うとあっさり出来ました。

プラグインがあるのかと思いきや、全然見つからなくて凹んでいたらタグがあったという…。

<txp:password_protect />というタグがあるので、使ってみました。すんなりと Section に Basic 認証らしきものが適用されました。

ただし、このタグは一度指定した id と pass が適用されると変更できない気がするのは私だけですかね…。

何か変更する際に必要な部分があるのだろうか…。

Ver 4.4.1 より正常に動作するようになりました。

CotEditorでMarkdownを行う

Markdownとは

例えば見出しを<h2>見出し</h2>と書くのがマークアップです。

マークダウンはこの書き方とは異なります。具体的には## 見出しと書くことで、フィルタなどで変換し、<h2>見出し</h2>と出力する記法です。詳しくは検索などしてみて下さい。

CotEditorでMarkdownする方法

より Perlスクリプトをダウンロードし「#!/usr/bin/perl」の後に


# %%%{CotEditorXInput=Selection}%%%
# %%%{CotEditorXOutput=ReplaceSelection}%%%

と記述し、CotEditorのスクリプトフォルダ(ApplicationSupport内にあるかも)に、放り込みます。


$ chmod +x Markdown.pl

と、実行権限を与えると多分使えます。

リニューアルしました

サイトを全部CMS化して管理しようと思い立ち、ついでなのでHTML5にしました。さようならxhtml1.1。こんにちはHTML5。CMSはいつも通りTextpatternです。

CSS3も使ってます。SafariとGoogleChromeではうっすらとアニメーションが適用されると思います。IEはver9以外は壊滅的なので、IE9でご覧になってくれると嬉しいです。

さて、この度HTML5で書くにあたり色々と調べてメモしながら作業をしたので、そのへんも書いていこうと思います。

参考書にしたのは、オライリーから出ている入門HTML5という本です。これは既に手元にあったので改めて読み返しました。ミツエーリンクスの矢倉さんが訳しています。

また、入門HTML5にも書かれていますが、HTML4からHTML5への移行について解説した結局どうすればいいの? - Dive Into HTML5も参考になります。

参考サイト

HTMLの構造変えるついでに、ちょこっとrole属性も使用しました。新しい技術はドキドキしますね。

sectionやarticleの使い方

次に多くの人が頭を悩ませてるらしいsectionとarticleについて。

どうやらsectionの誤用が多いみたいです。解答も併せて欲しかったですね。そんなわけで、私もsectionについて色々調べてみました。

vantさんのはてなグループ内のsectionに関する記事です。私はイマイチ理解できませんでした。

結構分かりやすい記事だと思います。ただ、当時の私はよく分かりませんでした…。

自分なりのarticleとsectionの境界線

さて、上記の参考になりそうな文書の他にも色々とそれらしき記事を読んだのですが、今一分からないので、とりあえず辞書を引きました。以下エキサイト辞書よりそれっぽい単語を抜粋してみました。

section
意味:(ものの)部分、断片、(全体を組み立てる)部品部、(書物・文章の)節、段落
article
意味:(新聞・雑誌の)記事、論説、(条約・契約などの)個条、条項、条款

ほんで、

article 要素は、ドキュメント、ページ、アプリケーション、サイトの自己完結したものを表します。つまり、シンジケーションのように、単独で再配布でき再利用できるよう意図したものです。これはフォーラムの投稿、雑誌や新聞の記事、ブログのエントリ、ユーザーが投稿したコメント、インタラクティブなウィジットやガジェット、その他、コンテンツの独立した項目が考えられます。

cite: article 要素 - セクション - HTML要素 - HTML5 タグリファレンス - HTML5.JP

シンジケーションて何じゃらほいと思って検索したらAtomやRSSの類いのことでした。

というわけで、article要素に関しては、RSSで配信できるレベルの文書や記事ってことかな?ということで決着をつけました。

一方、巷で色んな人を散々悩ませていたsection要素はRSSなんかで配信できないレベルの、文字通り「部分、断片」ってことで決着をつけました。

基本的に文書の構造化用として使うのがいいみたいです。装飾は従来通りdivにしておいた方が無難かと思います。

アウトラインチェックのウェブサービスも便利です。私は結構ゆるいアウトラインですが、ガチガチな人もいるのかな。

そんな感じで、HTML5になりました。私は一番吃驚したのはブロック要素とインライン要素が消滅して、フローコンテンツ、セクショニングコンテンツに分類されてて、今までの概念が消えたことです。多分消えてはいないと思うんですが多少変更があるみたいで、そこらへんはまだまだ追求と理解が甘いので、地道に学習していけたらいいなと思います。

DiigoとInstapaper使い始めました

今までブックマークはDeliciousを利用していましたが、ブックマークのログが表示できなかったりエクスポートしてもブックマークが保存されてなかったりと悲しい事態が発生したので、Diigoを併用することにしました。尚、前述のエラーはDeliciousサポートセンターにメールを送ったら颯爽と修正してくれたので現在は問題なく使用できます。

ZootoolDeskhotWonderpageなど幾つかのソーシャルブックマークサービスも試したのですが、Deliciousのマルチポストが出来るということでバックアップを予てDiigoを使うことにしてみました。

最初は、使い方はさっぱり、タグが中々反映されないなどで戸惑ってはいたのですが、今はhighlight機能なんかもぼちぼち使い始めてちょっとは慣れてきました。(全てのタグが反映されるまでは時間がかかるようです)

いまのところ大きなエラー…例えば文字化けやブックマークされないエラーなどは、特に遭遇することもなく快適に利用できています。タグが全て表示されないのが若干不満ですが、マルチポストをしているDeliciousで一覧が見られるので別にいいか…ということで片づけました。Delicious同様にブックマークの公開・非公開の調整もできます。

同時にInstapaperイイヨ!とをぞーさんにオススメされたので、こちらも使い始めました。すごいシンプルなブックマークというかクリップサービスといった方がしっくりくるかな。使いやすくて良いです。

Instapaperでとりあえずバババとクリップして、時間が空いた時に整理を予てDeliciousやDiigoにブックマークするというやり方になりました。タブの開きすぎも無くなり大分ブラウザがシンプルになりました。いいですねこういうの。

Diigoについて