１．HTMLで普通にテーブルを書く。
| あ | い |
| う | え |
<TABLE><TR><TD>あ</TD><TD>い</TD></TR><TR><TD>う</TD><TD>え</TD></TR></TABLE>
改行しないでズラズラ書き連ねなければならない。こんな記法じゃ小さな表でもタグの閉じ忘れで表示がバグる危険があって実用になりまへんがな。
２．上記のTABLEタグに border = 0 を追記して枠を消してみる。（CSSで規定されてるので消えませんｗ）
| あ | い |
| う | え |
| ひらがな | カナ | ローマ字 |
|---|---|---|
| あいうえ | アイウエ | aiue |
| おっおっおｗ | オッオッオｗ | o..o..oｗ |
※記法
｜＊ひらがな｜＊カナ｜＊ローマ字｜
｜あいうえ｜アイウエ｜aiue｜
｜おっおっおｗ｜オッオッオｗ｜o..o..oｗ｜
HTMLより簡単＆閉じタグ不要。構造化を考えなくていいので間違いにくく、記述バグも抑制できる。バグったとしても修正が容易。縦線と＊は半角で書く。＊をつけるだけで勝手に太文字＆センタリングしてくれるのでラクラク。もっともこればかり使ってるとアホの子になりそうだがｗ
４．はてな記法で画像テーブルを作ってみる。
まずは練習
| 写真 | 解説 |
|---|---|
 |
指の形がよくない例 |
 |
指の形がよい例 |
楽勝。ここから本気出す。
| 画像 | 楽譜 | コメント |
|---|---|---|
 |
 |
左右のパッセージの幅が違うので、手のフィギュレーションも左右で異なる。弾きやすいフィギュレーションは個人差があるので、ロルティを真似ても弾きやすくなるとは限らない。このくらいの難易度の低いエチュードでそれぞれの手のもっとも弾きやすいフィギュレーションを研究すること。 |
IEでは画像幅固定で文字が追い出されてしまった。グーグルクロームだと勝手に画像を縮小して画面幅に収まるように調整してくれるが、これでは画像が小さすぎる。まずはIE対策で画像サイズをmediumに調整。
| 画像 | 楽譜 | コメント |
|---|---|---|
 |
 |
左右のパッセージの幅が違うので、手のフィギュレーションも左右で異なる。弾きやすいフィギュレーションは個人差があるので、ロルティを真似ても弾きやすくなるとは限らない。このくらいの難易度の低いエチュードでそれぞれの手のもっとも弾きやすいフィギュレーションを研究すること。 |
medium小さすぎｗ画像幅を250ピクセルで指定する。
| 画像 | 楽譜 | コメント |
|---|---|---|
|
|
左右のパッセージの幅が違うので、手のフィギュレーションも左右で異なる。弾きやすいフィギュレーションは個人差があるので、ロルティを真似ても弾きやすくなるとは限らない。このくらいの難易度の低いエチュードでそれぞれの手のもっとも弾きやすいフィギュレーションを研究すること。 |
IEはいい感じだが、クロームは相変わらず画像が圧縮されるので、文章部分に適当に改行を追加する。
| 画像 | 楽譜 | コメント |
|---|---|---|
|
|
左右のパッセージの幅が違うので、 手のフィギュレーションも左右で異なる。 弾きやすいフィギュレーションは個人差があるので、 ロルティを真似ても弾きやすくなるとは限らない。 このくらいの難易度の低いエチュードで それぞれの手のもっとも弾きやすい フィギュレーションを研究すること。 |
このあたりで妥協か。画像幅を300ピクセルにするとIEでの文字領域が狭まりすぎるのでこれが限界。画像はクリックすれば大きくなるので、200ピクセルくらいにしてとりあえず雰囲気が伝わればいいという考え方もアリ。
ちなみにFirefoxの表示はIEとほぼ等価。safariの表示はグーグルクロームとほぼ等価。safariやクロームはWeb製作者がおかしなデータを作っても、画面幅に表示を押し込めてくれるという点でユーザには優しいと言える。
PC用のブラウザは上記４つでほぼカバーできるはず。最近のユーザ割合は他サイト実績からIE５０％、クローム３０％、サファリとファイアフォックスがそれぞれ１０％ずつ。WindowsとMacの区別なしです。スマホのことまでは考えられないのでごめんなちゃいｗ
はてな記法だとテーブルの項目幅指定ができないのが諸悪の根源です。なぜこんな中途半端な機能をリリースするんだろう。こんな仕事のやり方が許されるなんて、コンシューマIT屋ってラクな仕事だなあと思います。無料だからガマンするけど、有料でこんなことやってたらユーザ逃げるぞほんとに。
