wiki:pne-correctio
 ここの情報は古いです。ご理解頂いた上でお取り扱いください。

TOC(titleindex,heading=リンク,pne)?

Correctio テンプレート文法誤りを修正

OpenPNEテンプレートの文法的な誤りを修正するプロジェクトです。

2.10に含める改善について

2.10では、時間があまり無いので、下記の項目を修正する

修正項目

  • 現在の全PCテンプレートを http://www.w3.org/TR/html401/ に適合するようにする
  • ブラウザ確認時にはHTMLValidatorを用いて文法エラーが出ないようにする
  • テンプレート編集時にはCrescent Eveを用いて文法エラーが出ないようにする
  • HTLMValidでない違反を修正する
    • タグの物理的ミス(閉じ忘れ、閉じすぎ、属性の重複指定)
  • 管理画面も現在のXHTMLもどきからhttp://www.w3.org/TR/html401/ レベルに落とす
  • nl2brを<br>でだすようにする。
  • correctioコミュニティの特設トピックで指摘されている点を修正する

2.10特設修正用SNSについて

↓↓↓↓以下は2.10開発系では、目標値とする。必須改善項目では無い。↓↓↓↓

Correctioコミュニティからの課題

Correctioコミュニティで上がったトピックを指針として掲載します。

スペーサー画像は廃止しCSSへ

<img src="./skin/dummy.gif" style="width:7px;height:7px;" class="dummy">

 tableレイアウトに付き物の、上記のような透明画像を用いた位置調節を多用していますが、img要素にはalt属性が付物です。視覚障害者向けの読み上げブラウザやテキストブラウザなどでは、alt属性の値を表示したり読み上げます。なので、必須属性となっています。
 このスペイサー用のタグも、肥大部分ですね。CSSでmarginやpaddingにpositionなどで何とかなるケースが多いので、検討してみる価値はあります。

テーブルレイアウトを段階的にCSSへ

配置に関してtableと組み合わせて多重構造にしているケースも多いのですが、これも要検討です。クロスブラウザ的な問題から tableレイアウトにしていると思いますが、レガシーブラウザのどの当りまでをフォローしないといけないのか、メリットとデメリットを秤にかけ直してもよいかと。

  • → Forma Mutatio, XHTML+CSS

開発時のテンプレート作成・編集指針

UIの新規追加時や変更を行う際に、意識しておくべき項目です。

レイアウト崩れを防ぐための課題

入力値の上限を設け、レイアウト崩れを防ぐ

→ これは HTML+CSS で扱う問題ではないのでは?

スタイルはCSSファイルに

HTMLインラインでスタイルを定義するのはやめる。残っているとしたらCSS側にはき出す。

※style=xxxxなどのインライン表現は使わない。

妥当 (valid) であること

テンプレートを修正してコミットする際には、常にHTML Validにしておく

編集時ターゲットのHTMLバージョンは【※バージョン決定待ち】

  • 現行バージョンは HTML 4.01 Transitional
  • テンプレート新規開発時には XHTML 1.0 Transitional で可能な限り Strict の範囲で (未確定)

閉じタグは省略しない

必須要素はブラウザが文句言わなくても省略しない

ターゲット環境

IE6 IE7 FireFox2をターゲット環境としてリリース前チェックを行う

【決定待ち】ボーダー

tdで書くのかそれともboder_01などのClass指定にするのか?

ブラウザ依存タグは使わない

※詳細情報希望

※参考: XHTML 1.1 で定義されている要素一覧 (XHTML 1.0 Strict を微修正したもの)

今後の方針

決定項目

取り掛かっていきましょう

必須attributeの属性値の追加

>警告を修正していく。 >多くはalt=""。dummy.gifのimgタグがそのほとんど。見つけ次第、適正な値を入れていく。
>発見するために、Html Validator、Crescent Eveなどを使う。
alt="" => alt="dummy"を全テンプレートに適用
置換処理で行えるので、テンプレートを上から(アルファベット)順に置換していく

htmlの文法エラーの訂正

>見つけ次第直していく。
>エラーを修正していく
閉じタグの閉じる位置の間違い修正(警告)
<form ><td>~</form></td>のようなものはCrescent Eveでエラーを示すので、エラーを示す部分を修正

↑までは2.10で達成させる

>タグの閉じミスを探して修正
>発見するために、Html Validatorを使っていく。
</form>のようなタグの閉じ忘れをhtmlvalidatorでチェックして修正(エラー)
ブラウザチェックを行い、エラーがある部分を判断して修正
htmlとしての出力は分岐があるものがあるので、考慮する必要がある

Smartyのコメント({*})を削除すること

>ブラウザでのレンダリングが崩れてしまう可能性があるので、
>検討をしてからインデントを適用してから削除する。
テンプレートの<table>~</table>内のSmartyのコメントである({*})を削除する
インデント作成+({*})の削除

↑はbranchを作るなりして検証作業をしていく

検討中項目

どのようなツールを使うのか

Crescent Eveでの構文解析について

>Smartyのif文や演算子が誤認されてしまう。
>EclipseやemacsなどのエディタにSmartyの構文解析ができないものだろうか。

Html Validatorでの構文解析

>生成されたHTMLの結果しか表示されないので、
>ページの状態によって分岐パターンを網羅するようにしなければならなくなってしまう。

却下項目

こちらは、現段階では延期で

thタグ等の適切なマークアップについて

>先ずHtmlの文法として違反しているものから対応していく。
>個人的にはやるべきだと思っていのるので、Html文法の違反を修正してから取り掛かる項目としたい

tableタグのsummarry

>Html Validatorでは警告が出される。
>Htmlの文法の違反を修正してから、どういったsummaryを入れるべきか検討していこうと思う。

Htmlのコメントタグ廃止

>コメントタグはエンドユーザには不要との指摘。
>こちらもthタグ同様にHtml文法の違反を修正してから検討。

プロジェクトチケット

component=pne-correctio

#631
【HTML】webapp/modules/pc/templates/h_config.tpl
#632
【HTML】webapp/modules/pc/templates/o_login.tpl
#633
【HTML】webapp/modules/pc/templates/c_join_err_age.tpl
#634
【HTML】webapp/modules/pc/templates/c_event_edit.tpl
#635
【HTML】webapp/modules/pc/templates/c_event_add.tpl
#637
【HTML】webapp/modules/pc/templates/c_event_add_confirm.tpl
#638
【HTML】webapp/modules/pc/templates/c_edit.tpl
#639
【HTML】webapp/modules/pc/templates/h_config_prof.tpl
#640
【HTML】webapp/modules/pc/templates/h_config_prof.tpl
#641
【HTML】webapp/modules/pc/templates/h_schedule_edit_confirm.tpl
#642
【HTML】webapp/modules/pc/templates/h_schedule_edit.tpl
#643
【HTML】webapp/modules/pc/templates/h_schedule_add.tpl
#644
【HTML】webapp/modules/pc/templates/h_com_add.tpl
#645
【HTML】webapp/modules/pc/templates/f_message_send.tpl
#646
【HTML】webapp/modules/pc/templates/c_join_request.tpl
#647
【HTML】webapp/modules/pc/templates/h_diary_edit.tpl
#648
【HTML】webapp/modules/pc/templates/h_regist_prof_confirm.tpl
#649
【HTML】webapp/modules/pc/templates/h_regist_prof.tpl
#900
ブラウザ毎のレンダリングがおかしい
#1180
テストチケット
#1200
過度に多用されている罫線用 dummy.gif の style 属性の削減
#1221
style属性をsyyleとタイプミスしている箇所がある
#1336
dummy画像のalt=""をalt="dummy"に変更する
#1337
閉じタグの位置の適正化
#1377
span要素にname属性が指定されているのを削除

Last modified 10 years ago Last modified on Nov 29, 2007, 6:50:55 PM