2

私は小さな Web チャット ユーティリティを作成しており、メッセージに使用する要素についてアドバイスを求めています。

現時点で使用を考えているのは以下のとおりです。

<p id="message-1">
    <span class="timestamp" id="2009-03-10T12:04:01+00:00">
        12:04
    </span>
    <cite class="admin">
        Ross
    </cite> 
    Lorem ipsum dolor sit amet.
</p>

ここで CSS を利用して、タイムスタンプや d ユーザーのアイコンなどを括弧で囲みます。メッセージごとにcitea を使用するのはばかげている (そして正しくない) と思いましたが、ユーザーを参照しているので正しいと思います。メッセージを投稿したもの。blockquotecite

これが a) 正確な科学ではなく、b) 完全に必須ではないことはわかっていますが、全体を通して s よりも意味のある要素を使用したいと思いspanます。他に考慮すべき要素はありますか？マイクロフォーマットはありますか？

4

8 に答える 8

5

HTMLは、カスタマイズ可能な方法ではあまり意味的ではありません。それでも、あなたのフォーマットはどのブラウザでも理解できるはずです（あなたが指摘したように、適切なCSSを使用して）。

上記のコード例で見たものは、XMLと非常によく似ています。面倒でやり過ぎかもしれませんが、両方の（X）HTMLの代わりにXSLTでXMLを使用できることを指摘しておきます。このようにして、タグを可能な限りセマンティックにすることができ、HTMLタグの制限に妥協する必要はありません。

w3schoolsにはこのトピックに関する記事があります。XMLで作成されたWebページを見たと断言できましたsun.comが、もう見つかりません。

これがサードパーティのソフトウェアによって解釈または解析されることを意図していない場合でも、この方法に反対し、実績のあるHTMLを使用することをお勧めします。

于 2009-03-10T19:52:49.557 に答える
3

セマンティックHTMLを使用する場合は、 HTML5<cite>が要素の使用が正しいと見なされなくなったことを知りたいと思うでしょう。

人の名前は作品のタイトルではありません—たとえ人々がその人を作品と呼んでも—したがって、その要素を人の名前をマークアップするために使用してはなりません。

于 2009-03-11T16:04:55.397 に答える
3

「id」が無効であることを除いて、私には理にかなっているようです。NAME トークンを数字で開始したり、'+' を含めたりすることはできません。

さらに、2 人が同時に話した場合、ID は一意ではなくなります。おそらく、そのデータは「タイトル」などの別の属性に入れる必要があります（カーソルを合わせると正確なタイムスタンプを確認できます）。

于 2009-03-10T19:45:21.507 に答える
1 
<ol>
    <li class="message" value="1">
        <span class="timestamp" id="2009-03-10T12:04:01+00:00">
            12:04
        </span>
        <cite class="admin">
            <address class="email">
                <a href="mailto:ross@email.com">
                    Ross
                </a>
            </address>
        </cite> 
        Lorem ipsum dolor sit amet.
    </li>
</ol>

上記のようなことを試してみます。コメントは順序付きリストに合わせて直線的に解釈できるため、すべてを順序付きリストに配置したことに注意してください。また、Citeタグ内に、Anchor要素を持つAddressタグを埋め込みました。残念ながら、名前の付いたAddress要素は、実際には作成者の連絡先情報を伝達するためのものであるため、作成者の電子メールアドレスにリンクすることをお勧めします。

于 2009-03-10T19:54:36.260 に答える
0

質問で microformats に言及しているので、すでにmicroformats wikiに精通していることは間違いありません。さまざまな状況の例が多数含まれています。

もう 1 つの可能性は、フォーラムのオントロジーであるSIOCの一部を借りることです。これは、チャットにかなり似ています。

既存のフォーマットを再利用することで、Operatorなどのプラグインやツールを利用して、無料でアプリをさらに活用できます。

于 2009-03-10T20:13:59.863 に答える
0

@bobince が言ったように、id="2009-03-10T12:04:01+00:00"無効です。

これを変更する必要があります：

<span class="timestamp" id="2009-03-10T12:04:01+00:00">
    12:04
</span>

これに：

<time class="timestamp" datetime="2009-03-10T12:04:01+00:00">
    12:04
</time>

timeタグの詳細については、 HTML5 DoctorおよびW3Cで入手できます。

HTML5のtimeタグは、機械の日付と時刻を明確にエンコードしながら、人間が判読できる方法で表示するための新しい要素を提供します。

このtime要素は、24 時間制の時刻または先発グレゴリオ暦の正確な日付のいずれかを表し、オプションで時刻とタイムゾーン オフセットを指定できます。

...

ol@Robotsu によって投稿された順序付きリスト ( ) の解決策に同意します。ただし、投稿したばかりの時間タグとタグaddress内の誤りを除きciteます。

于 2013-01-18T21:25:05.340 に答える
0

XML と XSLT を使用して、データを変換 (スタイル) します。

ここでは意味的に理にかなっていますが、アーカイブに適した形式 (つまり XML) の会話も持っています。何らかのログまたは「履歴」があると思います。

于 2009-03-11T16:39:43.287 に答える
0

あなたが提案したことはすでにとても良いです。さらに一歩進んで、(重い html を犠牲にして) 同じマークアップで多数の異なるプレゼンテーション オプションを許可できるようにしたい場合は、次のようにすることをお勧めします。 

<dl class="message" id="message-1">
    <dt class="datetime">Datetime</dt>
    <dd class="datetime">
        <span class="day">Wed</span>
        <span class="dayOfMonth">11</span>
        <span class="month">Mar</span>
        <span class="year">2009</span>
        <span class="hourMin">17:34</span>
        <span class="sec">33</span>
    </dd>
    <dt class="author">Author</dt>
    <dd class="author">Ross</dd>
    <dt class="message">Message</dt>
    <dd class="message">Lorem ipsum dolor sit amet</dd>
</dl>
于 2009-03-10T19:47:12.627 に答える