ページタイトルに関する達成方法G88とH25の違い

Webアクセシビリティ
2022.07.04
スポンサーリンク

G88: ウェブページに説明的なタイトルを提供する

と、

H25: title 要素を用いて、ページタイトルを提供する

の違い。

 

ぱっと見同じっぽく見えるが、以下の違いがある

 

  • G88・・・ページのタイトル
  • H25・・・ページのタイトルおよび、<frameset>の中の、個々の<frame>のページタイトル

 

H25は、<frameset>の中の、個々の<frame>だけじゃなくて、通常のページのページタイトルも含む

 

H25を見ると以下の様に記載がある。

この達成方法の目的は、フレームセットの個々のフレームに含まれるものを含む全ての HTML及び XHTML ドキュメントにおいて、head 要素のセクション内で title 要素を用いてドキュメントの目的を簡単な文言で定義することである。

 

また、手順も以下のようになっており、frame 内に限定している記述は無い。

HTML 又は XHTML ドキュメントのソースコードを調べ、head 要素内に空でない title 要素があることを確認する。

 

html5以降では、<frameset>要素および<frame>要素は廃止されているため、

実質、G88とH25は全く同じということなる。

 

そのため、G88が適用になる場合、H25も適用になる。

 

AIの回答。G88はページタイトルの内容で、H25はページタイトルの技術的な実装

リートン＞GTPターボ先生によると、以下の回答だったお。こっちのほうがしっくり来るね。

違いと補完関係
・G88はページタイトルの内容に焦点を当てています。つまり、タイトルが説明的かつ意味のあるものであることを重視しています。
・H25はページタイトルの技術的な実装に焦点を当てています。具体的には、要素を正しく使用することを求めています。<br /> 補完関係:</p> <p> ・G88とH25は相互に補完的な技法です。G88で説明的なタイトルを決定し、それをH25で正しく実装することで、達成基準2.4.2を完全に満たすことができます。<br /> ・したがって、両方の技法を組み合わせて使用することで、ページタイトルが内容を適切に説明し、技術的にも正しく実装されていることを保証できます。 </p></blockquote> </div> <footer class="article-footer entry-footer"> <div class="entry-categories-tags ctdt-one-row"> <div class="entry-categories"><a class="cat-link cat-link-127" href="https://it-afi.com/category/web%e3%82%a2%e3%82%af%e3%82%bb%e3%82%b7%e3%83%93%e3%83%aa%e3%83%86%e3%82%a3/"><span class="fa fa-folder cat-icon tax-icon" aria-hidden="true"></span>Webアクセシビリティ</a></div> </div> <div class="ad-area no-icon ad-content-bottom ad-rectangle ad-label-visible cf" itemscope itemtype="https://schema.org/WPAdBlock"> <div class="ad-label" itemprop="name" data-nosnippet>スポンサーリンク</div> <div class="ad-wrap"> <div class="ad-responsive ad-usual"><amp-ad width="100vw" height="320" type="adsense" data-ad-client="ca-pub-4895059887263926" data-ad-slot="6752884896" data-auto-format="rspv" data-full-width> <div overflow></div> </amp-ad></div> </div> </div> <div class="sns-share ss-col-3 bc-brand-color sbc-hide ss-bottom"> <div class="sns-share-message">シェアする</div> <div class="sns-share-buttons sns-buttons"> <a href="https://twitter.com/intent/tweet?text=%E3%83%9A%E3%83%BC%E3%82%B8%E3%82%BF%E3%82%A4%E3%83%88%E3%83%AB%E3%81%AB%E9%96%A2%E3%81%99%E3%82%8B%E9%81%94%E6%88%90%E6%96%B9%E6%B3%95G88%E3%81%A8H25%E3%81%AE%E9%81%95%E3%81%84&url=https%3A%2F%2Fit-afi.com%2Fweb%25e3%2582%25a2%25e3%2582%25af%25e3%2582%25bb%25e3%2582%25b7%25e3%2583%2593%25e3%2583%25aa%25e3%2583%2586%25e3%2582%25a3%2F%25e3%2583%259a%25e3%2583%25bc%25e3%2582%25b8%25e3%2582%25bf%25e3%2582%25a4%25e3%2583%2588%25e3%2583%25ab%25e3%2581%25ab%25e9%2596%25a2%25e3%2581%2599%25e3%2582%258b%25e9%2581%2594%25e6%2588%2590%25e6%2596%25b9%25e6%25b3%2595g88%25e3%2581%25a8h25%25e3%2581%25ae%25e9%2581%2595%25e3%2581%2584%2F" class="sns-button share-button twitter-button twitter-share-button-sq" target="_blank"><span class="social-icon icon-twitter"></span><span class="button-caption">Twitter</span><span class="share-count twitter-share-count"></span></a> <a href="//www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fit-afi.com%2Fweb%25e3%2582%25a2%25e3%2582%25af%25e3%2582%25bb%25e3%2582%25b7%25e3%2583%2593%25e3%2583%25aa%25e3%2583%2586%25e3%2582%25a3%2F%25e3%2583%259a%25e3%2583%25bc%25e3%2582%25b8%25e3%2582%25bf%25e3%2582%25a4%25e3%2583%2588%25e3%2583%25ab%25e3%2581%25ab%25e9%2596%25a2%25e3%2581%2599%25e3%2582%258b%25e9%2581%2594%25e6%2588%2590%25e6%2596%25b9%25e6%25b3%2595g88%25e3%2581%25a8h25%25e3%2581%25ae%25e9%2581%2595%25e3%2581%2584%2F&t=%E3%83%9A%E3%83%BC%E3%82%B8%E3%82%BF%E3%82%A4%E3%83%88%E3%83%AB%E3%81%AB%E9%96%A2%E3%81%99%E3%82%8B%E9%81%94%E6%88%90%E6%96%B9%E6%B3%95G88%E3%81%A8H25%E3%81%AE%E9%81%95%E3%81%84" class="sns-button share-button facebook-button facebook-share-button-sq" target="_blank"><span class="social-icon icon-facebook"></span><span class="button-caption">Facebook</span><span class="share-count facebook-share-count"></span></a> <a href="//b.hatena.ne.jp/entry/s/it-afi.com/web%e3%82%a2%e3%82%af%e3%82%bb%e3%82%b7%e3%83%93%e3%83%aa%e3%83%86%e3%82%a3/%e3%83%9a%e3%83%bc%e3%82%b8%e3%82%bf%e3%82%a4%e3%83%88%e3%83%ab%e3%81%ab%e9%96%a2%e3%81%99%e3%82%8b%e9%81%94%e6%88%90%e6%96%b9%e6%b3%95g88%e3%81%a8h25%e3%81%ae%e9%81%95%e3%81%84/" class="sns-button share-button hatebu-button hatena-bookmark-button hatebu-share-button-sq" data-hatena-bookmark-layout="simple" title="ページタイトルに関する達成方法G88とH25の違い" target="_blank"><span class="social-icon icon-hatena"></span><span class="button-caption">はてブ</span><span class="share-count hatebu-share-count"></span></a> <a href="//getpocket.com/edit?url=https://it-afi.com/web%e3%82%a2%e3%82%af%e3%82%bb%e3%82%b7%e3%83%93%e3%83%aa%e3%83%86%e3%82%a3/%e3%83%9a%e3%83%bc%e3%82%b8%e3%82%bf%e3%82%a4%e3%83%88%e3%83%ab%e3%81%ab%e9%96%a2%e3%81%99%e3%82%8b%e9%81%94%e6%88%90%e6%96%b9%e6%b3%95g88%e3%81%a8h25%e3%81%ae%e9%81%95%e3%81%84/" class="sns-button share-button pocket-button pocket-share-button-sq" target="_blank"><span class="social-icon icon-pocket"></span><span class="button-caption">Pocket</span><span class="share-count pocket-share-count"></span></a> <a href="//timeline.line.me/social-plugin/share?url=https%3A%2F%2Fit-afi.com%2Fweb%25e3%2582%25a2%25e3%2582%25af%25e3%2582%25bb%25e3%2582%25b7%25e3%2583%2593%25e3%2583%25aa%25e3%2583%2586%25e3%2582%25a3%2F%25e3%2583%259a%25e3%2583%25bc%25e3%2582%25b8%25e3%2582%25bf%25e3%2582%25a4%25e3%2583%2588%25e3%2583%25ab%25e3%2581%25ab%25e9%2596%25a2%25e3%2581%2599%25e3%2582%258b%25e9%2581%2594%25e6%2588%2590%25e6%2596%25b9%25e6%25b3%2595g88%25e3%2581%25a8h25%25e3%2581%25ae%25e9%2581%2595%25e3%2581%2584%2F" class="sns-button share-button line-button line-share-button-sq" target="_blank"><span class="social-icon icon-line"></span><span class="button-caption">LINE</span><span class="share-count line-share-count"></span></a> <a role="button" tabindex="0" class="sns-button share-button copy-button copy-share-button-sq" target="_blank" data-clipboard-text="ページタイトルに関する達成方法G88とH25の違い https://it-afi.com/web%e3%82%a2%e3%82%af%e3%82%bb%e3%82%b7%e3%83%93%e3%83%aa%e3%83%86%e3%82%a3/%e3%83%9a%e3%83%bc%e3%82%b8%e3%82%bf%e3%82%a4%e3%83%88%e3%83%ab%e3%81%ab%e9%96%a2%e3%81%99%e3%82%8b%e9%81%94%e6%88%90%e6%96%b9%e6%b3%95g88%e3%81%a8h25%e3%81%ae%e9%81%95%e3%81%84/"><span class="social-icon icon-copy"></span><span class="button-caption">コピー</span><span class="share-count copy-share-count"></span></a> </div><!-- /.sns-share-buttons --> </div><!-- /.sns-share --> <!-- SNSページ --> <div class="sns-follow bc-brand-color fbc-hide sf-bottom"> <div class="sns-follow-message">クズリーマンをフォローする</div> <div class="sns-follow-buttons sns-buttons"> <a href="//feedly.com/i/discover/sources/search/feed/https%3A%2F%2Fit-afi.com" class="sns-button follow-button feedly-button feedly-follow-button-sq" target="_blank" title="feedlyで更新情報を購読"><span class="icon-feedly-logo"></span><span class="follow-count feedly-follow-count"></span></a> <a href="https://it-afi.com/feed/" class="sns-button follow-button rss-button rss-follow-button-sq" target="_blank" title="RSSで更新情報をフォロー"><span class="icon-rss-logo"></span></a> </div><!-- /.sns-follow-buttons --> </div><!-- /.sns-follow --> <div class="footer-meta"> <div class="author-info"> <span class="fa fa-pencil" aria-hidden="true"></span> <a href="https://it-afi.com/author/gariafi/" class="author-link"> <span class="post-author vcard author" itemprop="editor author creator copyrightHolder" itemscope itemtype="https://schema.org/Person"> <meta itemprop="url" content="https://it-afi.com/author/gariafi/"> <span class="author-name fn" itemprop="name">クズリーマン</span> </span> </a> </div> </div> <!-- publisher設定 --> <div class="publisher" itemprop="publisher" itemscope itemtype="https://schema.org/Organization"> <div itemprop="logo" itemscope itemtype="https://schema.org/ImageObject"> <amp-img src="https://it-afi.com/wp-content/themes/cocoon-master/images/no-amp-logo.png" width="206" height="60" alt="" sizes="(max-width: 206px) 100vw, 206px"></amp-img> <meta itemprop="url" content="https://it-afi.com/wp-content/themes/cocoon-master/images/no-amp-logo.png"> <meta itemprop="width" content="206"> <meta itemprop="height" content="60"> </div> <div itemprop="name">クズリーマンのカス備忘録</div> </div> </footer> </article> <div class="under-entry-content"> <aside id="related-entries" class="related-entries rect-entry-card"> <h2 class="related-entry-heading"> <span class="related-entry-main-heading main-caption"> 関連記事 </span> </h2> <div class="related-list"> <a href="https://it-afi.com/web%e3%82%a2%e3%82%af%e3%82%bb%e3%82%b7%e3%83%93%e3%83%aa%e3%83%86%e3%82%a3/web%e3%82%a2%e3%82%af%e3%82%bb%e3%82%b7%e3%83%93%e3%83%aa%e3%83%86%e3%82%a3%e3%81%a7excel%e3%82%84%e3%82%89word%e3%82%84%e3%82%89%e3%81%aeoffice%e6%96%87%e6%9b%b8%e3%81%af%e5%af%be%e8%b1%a1%e3%81%ab/" class="related-entry-card-wrap a-wrap border-element cf" title="WebアクセシビリティでExcelやらWordやらのOffice文書は対象になるか"> <article class="post-2898 related-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-web-post"> <figure class="related-entry-card-thumb card-thumb e-card-thumb"> <amp-img src="https://it-afi.com/wp-content/uploads/2022/05/accessibility-logo-160x90.png" class="related-entry-card-thumb-image card-thumb-image wp-post-image" width="160" height="90" alt="" sizes="(max-width: 160px) 100vw, 160px"></amp-img> <span class="cat-label cat-label-127">Webアクセシビリティ</span> </figure><!-- /.related-entry-thumb --> <div class="related-entry-card-content card-content e-card-content"> <h3 class="related-entry-card-title card-title e-card-title"> WebアクセシビリティでExcelやらWordやらのOffice文書は対象になるか </h3> <div class="related-entry-card-snippet card-snippet e-card-snippet"> 結論 対象になる場合 対象にならない場合 両方がある。 Webコンテンツ扱いにすると対象 WAICのFAQを見ると、 Office系の文書ファイルが、ユーザエージェント（ブラウザ）によって閲覧されることを意図して公開されてい... </div> </div><!-- /.related-entry-card-content --> </article><!-- /.related-entry-card --> </a><!-- /.related-entry-card-wrap --> <a href="https://it-afi.com/web%e3%82%a2%e3%82%af%e3%82%bb%e3%82%b7%e3%83%93%e3%83%aa%e3%83%86%e3%82%a3/h73-table-%e8%a6%81%e7%b4%a0%e3%81%ae-summary%e5%b1%9e%e6%80%a7%e3%81%af%e5%bb%83%e6%ad%a2%e3%81%95%e3%82%8c%e3%81%9f%e3%81%ae%e3%81%a7%e9%81%a9%e7%94%a8%e3%81%ab%e3%81%aa%e3%82%89%e3%81%aa%e3%81%84/" class="related-entry-card-wrap a-wrap border-element cf" title="H73 table 要素の summary属性は廃止されたので適用にならない"> <article class="post-4640 related-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-web-post"> <figure class="related-entry-card-thumb card-thumb e-card-thumb"> <amp-img src="https://it-afi.com/wp-content/uploads/2022/05/accessibility-logo-160x90.png" class="related-entry-card-thumb-image card-thumb-image wp-post-image" width="160" height="90" alt="" sizes="(max-width: 160px) 100vw, 160px"></amp-img> <span class="cat-label cat-label-127">Webアクセシビリティ</span> </figure><!-- /.related-entry-thumb --> <div class="related-entry-card-content card-content e-card-content"> <h3 class="related-entry-card-title card-title e-card-title"> H73 table 要素の summary属性は廃止されたので適用にならない </h3> <div class="related-entry-card-snippet card-snippet e-card-snippet"> 結論HTML5以降（HTML Living Standard）など⇒以下の宣言があれば。<!DOCTYPE html>では、table 要素の summary属性は廃止されてて使えないので、アクセシビリティ試験としては、H73は適用にならな... </div> </div><!-- /.related-entry-card-content --> </article><!-- /.related-entry-card --> </a><!-- /.related-entry-card-wrap --> <a href="https://it-afi.com/web%e3%82%a2%e3%82%af%e3%82%bb%e3%82%b7%e3%83%93%e3%83%aa%e3%83%86%e3%82%a3/h34-%e3%82%a4%e3%83%b3%e3%83%a9%e3%82%a4%e3%83%b3%e3%81%a7%e3%83%86%e3%82%ad%e3%82%b9%e3%83%88%e3%81%ae%e6%96%b9%e5%90%91%e3%82%92%e6%b7%b7%e5%9c%a8%e3%81%95%e3%81%9b%e3%82%8b%e3%81%9f%e3%82%81/" class="related-entry-card-wrap a-wrap border-element cf" title="H34: インラインでテキストの方向を混在させるために、Unicode の right-to-left mark (RLM) 又は left-to-right mark (LRM) を使用する 適用基準"> <article class="post-2947 related-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-web-post"> <figure class="related-entry-card-thumb card-thumb e-card-thumb"> <amp-img src="https://it-afi.com/wp-content/uploads/2022/05/accessibility-logo-160x90.png" class="related-entry-card-thumb-image card-thumb-image wp-post-image" width="160" height="90" alt="" sizes="(max-width: 160px) 100vw, 160px"></amp-img> <span class="cat-label cat-label-127">Webアクセシビリティ</span> </figure><!-- /.related-entry-thumb --> <div class="related-entry-card-content card-content e-card-content"> <h3 class="related-entry-card-title card-title e-card-title"> H34: インラインでテキストの方向を混在させるために、Unicode の right-to-left mark (RLM) 又は left-to-right mark (LRM) を使用する 適用基準 </h3> <div class="related-entry-card-snippet card-snippet e-card-snippet"> YouTubeの埋め込み動画を含むページをチェックしてるんだが、HTMLコードの中に dir="rtl" や、 dir="ltr"  の属性があったため、これがあると適用になるのか？とちょっと思ったが、違うみたい。 ⇒dir属性は... </div> </div><!-- /.related-entry-card-content --> </article><!-- /.related-entry-card --> </a><!-- /.related-entry-card-wrap --> <a href="https://it-afi.com/web%e3%82%a2%e3%82%af%e3%82%bb%e3%82%b7%e3%83%93%e3%83%aa%e3%83%86%e3%82%a3/%e8%a6%96%e8%a6%9a%e7%9a%84%e3%81%ab%e3%83%aa%e3%83%b3%e3%82%af%e3%82%92%e8%a6%8b%e3%81%88%e3%81%aa%e3%81%8f%e3%81%99%e3%82%8b%e3%80%81c7-%e3%83%aa%e3%83%b3%e3%82%af%e3%83%86%e3%82%ad%e3%82%b9/" class="related-entry-card-wrap a-wrap border-element cf" title="視覚的にリンクを見えなくする、C7: リンクテキストの一部を非表示にするために、CSS を使用する"> <article class="post-3065 related-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-web-post"> <figure class="related-entry-card-thumb card-thumb e-card-thumb"> <amp-img src="https://it-afi.com/wp-content/uploads/2022/05/accessibility-logo-160x90.png" class="related-entry-card-thumb-image card-thumb-image wp-post-image" width="160" height="90" alt="" sizes="(max-width: 160px) 100vw, 160px"></amp-img> <span class="cat-label cat-label-127">Webアクセシビリティ</span> </figure><!-- /.related-entry-thumb --> <div class="related-entry-card-content card-content e-card-content"> <h3 class="related-entry-card-title card-title e-card-title"> 視覚的にリンクを見えなくする、C7: リンクテキストの一部を非表示にするために、CSS を使用する </h3> <div class="related-entry-card-snippet card-snippet e-card-snippet"> C7: リンクテキストの一部を非表示にするために、CSS を使用する では、視覚的にはリンクを見えなくし、スクリーンリーダーや音声ブラウザにのみリンクの情報（テキスト）を伝えることができる。 </div> </div><!-- /.related-entry-card-content --> </article><!-- /.related-entry-card --> </a><!-- /.related-entry-card-wrap --> <a href="https://it-afi.com/web%e3%82%a2%e3%82%af%e3%82%bb%e3%82%b7%e3%83%93%e3%83%aa%e3%83%86%e3%82%a3/g178-%e3%81%ae%e6%89%8b%e9%a0%86%e3%81%a7%e5%87%ba%e3%81%a6%e3%81%8f%e3%82%8b%e3%80%81%e3%83%93%e3%83%a5%e3%83%bc%e3%83%9d%e3%83%bc%e3%83%88%e3%81%a3%e3%81%a6%e3%81%aa%e3%81%ab%ef%bc%9f/" class="related-entry-card-wrap a-wrap border-element cf" title="G178 の手順で出てくる、ビューポートってなに？"> <article class="post-2999 related-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-web-post"> <figure class="related-entry-card-thumb card-thumb e-card-thumb"> <amp-img src="https://it-afi.com/wp-content/uploads/2022/05/accessibility-logo-160x90.png" class="related-entry-card-thumb-image card-thumb-image wp-post-image" width="160" height="90" alt="" sizes="(max-width: 160px) 100vw, 160px"></amp-img> <span class="cat-label cat-label-127">Webアクセシビリティ</span> </figure><!-- /.related-entry-thumb --> <div class="related-entry-card-content card-content e-card-content"> <h3 class="related-entry-card-title card-title e-card-title"> G178 の手順で出てくる、ビューポートってなに？ </h3> <div class="related-entry-card-snippet card-snippet e-card-snippet"> G178: 利用者がウェブページ上のすべてのテキストを 200％まで徐々に変更できるコントロールをウェブページ上で提供する について。 ちなみに、 「すべてのテキスト」 というのがミソで、一部でも（第三者による埋込コンテンツなど）変更で... </div> </div><!-- /.related-entry-card-content --> </article><!-- /.related-entry-card --> </a><!-- /.related-entry-card-wrap --> <a href="https://it-afi.com/web%e3%82%a2%e3%82%af%e3%82%bb%e3%82%b7%e3%83%93%e3%83%aa%e3%83%86%e3%82%a3/h39-%e3%83%86%e3%83%bc%e3%83%96%e3%83%ab%e3%81%abcaption-%e8%a6%81%e7%b4%a0%e3%82%92%e4%bd%bf%e7%94%a8%e3%81%99%e3%82%8b%e3%81%af%e3%80%81%e5%bf%85%e3%81%9a%e3%81%97%e3%82%82%e9%81%a9%e7%94%a8/" class="related-entry-card-wrap a-wrap border-element cf" title="H39: テーブルにcaption 要素を使用するは、必ずしも適用しなくてもいい"> <article class="post-3124 related-entry-card e-card cf post type-post status-publish format-standard hentry category-web-post"> <figure class="related-entry-card-thumb card-thumb e-card-thumb"> <amp-img src="https://it-afi.com/wp-content/themes/cocoon-master/images/no-image-160.png" class="no-image related-entry-card-no-image" width="160" height="90" alt="" sizes="(max-width: 160px) 100vw, 160px"></amp-img> <span class="cat-label cat-label-127">Webアクセシビリティ</span> </figure><!-- /.related-entry-thumb --> <div class="related-entry-card-content card-content e-card-content"> <h3 class="related-entry-card-title card-title e-card-title"> H39: テーブルにcaption 要素を使用するは、必ずしも適用しなくてもいい </h3> <div class="related-entry-card-snippet card-snippet e-card-snippet"> caption要素とは caption要素とはtableに対して視認できる（目で見える）見出し。 H39の適用判断基準 caption要素が使われていれば、適用。 caption要素は必ず使う必要があるか？ これについては、必ずしも使う必要... </div> </div><!-- /.related-entry-card-content --> </article><!-- /.related-entry-card --> </a><!-- /.related-entry-card-wrap --> </div> </aside> <div class="ad-area no-icon ad-below-related-posts ad-rectangle ad-label-visible cf" itemscope itemtype="https://schema.org/WPAdBlock"> <div class="ad-label" itemprop="name" data-nosnippet>スポンサーリンク</div> <div class="ad-wrap"> <div class="ad-responsive ad-usual"><amp-ad width="100vw" height="320" type="adsense" data-ad-client="ca-pub-4895059887263926" data-ad-slot="6752884896" data-auto-format="rspv" data-full-width> <div overflow></div> </amp-ad></div> </div> </div> <div id="pager-post-navi" class="pager-post-navi post-navi-default cf"> <a href="https://it-afi.com/web%e3%82%a2%e3%82%af%e3%82%bb%e3%82%b7%e3%83%93%e3%83%aa%e3%83%86%e3%82%a3/scr28-%e3%81%af%e3%80%81%e3%83%8f%e3%83%b3%e3%83%90%e3%83%bc%e3%82%ac%e3%83%bc%e3%83%a1%e3%83%8b%e3%83%a5%e3%83%bc%e3%81%a8%e3%81%8b%e3%80%81%e7%9b%ae%e6%ac%a1%e3%81%a8%e3%81%8b%ef%bc%88%e3%81%93/" title="SCR28 は、ハンバーガーメニューとか、目次とか（このブログでも使用している）" class="prev-post a-wrap border-element cf"> <div class="fa fa-chevron-left iconfont" aria-hidden="true"></div> <figure class="prev-post-thumb card-thumb"><amp-img src="https://it-afi.com/wp-content/uploads/2022/05/accessibility-logo-120x68.png" class="attachment-thumb120 size-thumb120 wp-post-image" width="120" height="68" alt="" sizes="(max-width: 120px) 100vw, 120px"></amp-img></figure> <div class="prev-post-title">SCR28 は、ハンバーガーメニューとか、目次とか（このブログでも使用している）</div></a><a href="https://it-afi.com/web%e3%82%a2%e3%82%af%e3%82%bb%e3%82%b7%e3%83%93%e3%83%aa%e3%83%86%e3%82%a3/g59%e3%81%ae%e3%80%81%e3%80%8c%e3%82%a4%e3%83%b3%e3%82%bf%e3%83%a9%e3%82%af%e3%83%86%e3%82%a3%e3%83%96%e3%81%aa%e8%a6%81%e7%b4%a0%e3%80%8d%e3%81%af%e3%80%81%e5%8d%98%e3%81%aa%e3%82%8b%e3%83%aa/" title="G59の、「インタラクティブな要素」は、単なるリンクも含む。" class="next-post a-wrap cf"> <div class="fa fa-chevron-right iconfont" aria-hidden="true"></div> <figure class="next-post-thumb card-thumb"> <amp-img src="https://it-afi.com/wp-content/uploads/2022/05/accessibility-logo-120x68.png" class="attachment-thumb120 size-thumb120 wp-post-image" width="120" height="68" alt="" sizes="(max-width: 120px) 100vw, 120px"></amp-img></figure> <div class="next-post-title">G59の、「インタラクティブな要素」は、単なるリンクも含む。</div></a></div><!-- /.pager-post-navi --> <!-- comment area --> <div id="comment-area" class="comment-area"> <section class="comment-list"> <h2 id="comments" class="comment-title"> コメント </h2> </section> <aside class="comment-form"> <h3 id="reply-title" class="comment-reply-title">コメントをどうぞ</h3> <a class="comment-btn" href="https://it-afi.com/web%e3%82%a2%e3%82%af%e3%82%bb%e3%82%b7%e3%83%93%e3%83%aa%e3%83%86%e3%82%a3/%e3%83%9a%e3%83%bc%e3%82%b8%e3%82%bf%e3%82%a4%e3%83%88%e3%83%ab%e3%81%ab%e9%96%a2%e3%81%99%e3%82%8b%e9%81%94%e6%88%90%e6%96%b9%e6%b3%95g88%e3%81%a8h25%e3%81%ae%e9%81%95%e3%81%84/#comment-area">コメントを書き込む</a> </aside></div><!-- /.comment area --> </div> <div id="breadcrumb" class="breadcrumb breadcrumb-category sbp-main-bottom" itemscope itemtype="https://schema.org/BreadcrumbList"><div class="breadcrumb-home" itemscope itemtype="https://schema.org/ListItem" itemprop="itemListElement"><span class="fa fa-home fa-fw" aria-hidden="true"></span><a href="https://it-afi.com" itemprop="item"><span itemprop="name" class="breadcrumb-caption">ホーム</span></a><meta itemprop="position" content="1" /><span class="sp"><span class="fa fa-angle-right" aria-hidden="true"></span></span></div><div class="breadcrumb-item" itemscope itemtype="https://schema.org/ListItem" itemprop="itemListElement"><span class="fa fa-folder fa-fw" aria-hidden="true"></span><a href="https://it-afi.com/category/web%e3%82%a2%e3%82%af%e3%82%bb%e3%82%b7%e3%83%93%e3%83%aa%e3%83%86%e3%82%a3/" itemprop="item"><span itemprop="name" class="breadcrumb-caption">Webアクセシビリティ</span></a><meta itemprop="position" content="2" /></div></div><!-- /#breadcrumb --> </main> <div id="sidebar" class="sidebar nwa cf" role="complementary"> <div class="ad-area no-icon ad-sidebar-top ad-auto ad-label-invisible cf" itemscope itemtype="https://schema.org/WPAdBlock"> <div class="ad-label" itemprop="name" data-nosnippet>スポンサーリンク</div> <div class="ad-wrap"> <div class="ad-responsive ad-usual"><amp-ad width="100vw" height="320" type="adsense" data-ad-client="ca-pub-4895059887263926" data-ad-slot="6752884896" data-auto-format="rspv" data-full-width> <div overflow></div> </amp-ad></div> </div> </div> <aside id="search-4" class="widget widget-sidebar widget-sidebar-standard widget_search"><form class="amp-form search-box" target="_top" method="get" action="https://it-afi.com/"> <input type="text" placeholder="サイト内を検索" name="s" class="search-edit" aria-label="input" value=""> <button type="submit" class="search-submit" aria-label="button"><span class="fa fa-search" aria-hidden="true"></span></button> </form> </aside><aside id="popular_entries-3" class="widget widget-sidebar widget-sidebar-standard widget_popular_entries"><h3 class="widget-sidebar-title widget-title">週間アクセスランキング</h3> <div class="popular-entry-cards widget-entry-cards no-icon cf ranking-visible"> <a href="https://it-afi.com/excel/post-1666/" class="popular-entry-card-link widget-entry-card-link a-wrap no-1" title="ExcelなどでNASを信頼できる場所に追加するには名前でアクセスするしかない"> <div class="post-1666 popular-entry-card widget-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-excel-post"> <figure class="popular-entry-card-thumb widget-entry-card-thumb card-thumb"> <amp-img src="https://it-afi.com/wp-content/uploads/2021/02/greenx-logo.png" class="attachment-thumb120 size-thumb120 wp-post-image" width="76" height="68" alt="" sizes="(max-width: 76px) 100vw, 76px"></amp-img> </figure><!-- /.popular-entry-card-thumb --> <div class="popular-entry-card-content widget-entry-card-content card-content"> <span class="popular-entry-card-title widget-entry-card-title card-title">ExcelなどでNASを信頼できる場所に追加するには名前でアクセスするしかない</span> <div class="popular-entry-card-date widget-entry-card-date display-none"> <span class="popular-entry-card-post-date widget-entry-card-post-date post-date">2021.02.03</span><span class="popular-entry-card-update-date widget-entry-card-update-date post-update">2022.06.24</span></div> </div><!-- /.popular-entry-content --> </div><!-- /.popular-entry-card --> </a><!-- /.popular-entry-card-link --> <a href="https://it-afi.com/vscode/vscode%e3%81%a7%e4%bf%9d%e5%ad%98%e3%81%97%e3%81%9f%e3%81%a8%e3%81%8d%e3%81%ae%e6%94%b9%e8%a1%8c%e3%82%b3%e3%83%bc%e3%83%89%e3%82%92lf%e3%81%ab%e8%a8%ad%e5%ae%9a%e3%81%99%e3%82%8b/" class="popular-entry-card-link widget-entry-card-link a-wrap no-2" title="VSCodeで保存したときの改行コードをLFに設定する"> <div class="post-2681 popular-entry-card widget-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-vscode-post"> <figure class="popular-entry-card-thumb widget-entry-card-thumb card-thumb"> <amp-img src="https://it-afi.com/wp-content/uploads/2020/08/vs.gif" class="attachment-thumb120 size-thumb120 wp-post-image" width="102" height="68" alt="" sizes="(max-width: 102px) 100vw, 102px"></amp-img> </figure><!-- /.popular-entry-card-thumb --> <div class="popular-entry-card-content widget-entry-card-content card-content"> <span class="popular-entry-card-title widget-entry-card-title card-title">VSCodeで保存したときの改行コードをLFに設定する</span> <div class="popular-entry-card-date widget-entry-card-date display-none"> <span class="popular-entry-card-post-date widget-entry-card-post-date post-date">2022.04.21</span></div> </div><!-- /.popular-entry-content --> </div><!-- /.popular-entry-card --> </a><!-- /.popular-entry-card-link --> <a href="https://it-afi.com/git/github-project%e3%81%a8%e3%81%af%ef%bc%9f-repository%e3%81%a8%e4%bd%95%e3%81%8c%e9%81%95%e3%81%86%ef%bc%9f/" class="popular-entry-card-link widget-entry-card-link a-wrap no-3" title="github projectとは？ repositoryと何が違う？"> <div class="post-3612 popular-entry-card widget-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-git-post"> <figure class="popular-entry-card-thumb widget-entry-card-thumb card-thumb"> <amp-img src="https://it-afi.com/wp-content/uploads/2020/07/Git-Icon-1788C.png" class="attachment-thumb120 size-thumb120 wp-post-image" width="68" height="68" alt="" sizes="(max-width: 68px) 100vw, 68px"></amp-img> </figure><!-- /.popular-entry-card-thumb --> <div class="popular-entry-card-content widget-entry-card-content card-content"> <span class="popular-entry-card-title widget-entry-card-title card-title">github projectとは？ repositoryと何が違う？</span> <div class="popular-entry-card-date widget-entry-card-date display-none"> <span class="popular-entry-card-post-date widget-entry-card-post-date post-date">2023.01.13</span></div> </div><!-- /.popular-entry-content --> </div><!-- /.popular-entry-card --> </a><!-- /.popular-entry-card-link --> <a href="https://it-afi.com/windows/winmerge-%e6%96%87%e5%ad%97%e3%82%b3%e3%83%bc%e3%83%89%e7%84%a1%e8%a6%96-%e3%81%97%e3%81%a6%e3%83%95%e3%82%a1%e3%82%a4%e3%83%ab%e3%82%92%e6%af%94%e8%bc%83%e3%81%99%e3%82%8b/" class="popular-entry-card-link widget-entry-card-link a-wrap no-4" title="Winmerge 文字コード無視 してファイルを比較する"> <div class="post-2577 popular-entry-card widget-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-windows-post"> <figure class="popular-entry-card-thumb widget-entry-card-thumb card-thumb"> <amp-img src="https://it-afi.com/wp-content/uploads/2022/03/windows-logo-120x68.png" class="attachment-thumb120 size-thumb120 wp-post-image" width="120" height="68" alt="" sizes="(max-width: 120px) 100vw, 120px"></amp-img> </figure><!-- /.popular-entry-card-thumb --> <div class="popular-entry-card-content widget-entry-card-content card-content"> <span class="popular-entry-card-title widget-entry-card-title card-title">Winmerge 文字コード無視 してファイルを比較する</span> <div class="popular-entry-card-date widget-entry-card-date display-none"> <span class="popular-entry-card-post-date widget-entry-card-post-date post-date">2022.03.25</span></div> </div><!-- /.popular-entry-content --> </div><!-- /.popular-entry-card --> </a><!-- /.popular-entry-card-link --> <a href="https://it-afi.com/linux/failed-to-start-mysql-service-unit-mysql-service-not-found-%e2%86%92-mysql-server-%e3%82%a4%e3%83%b3%e3%82%b9%e3%83%88%e3%83%bc%e3%83%ab%e5%bf%98%e3%82%8c/" class="popular-entry-card-link widget-entry-card-link a-wrap no-5" title="Failed to start mysql.service: Unit mysql.service not found. → mysql-server インストール忘れ"> <div class="post-2156 popular-entry-card widget-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-linux-post"> <figure class="popular-entry-card-thumb widget-entry-card-thumb card-thumb"> <amp-img src="https://it-afi.com/wp-content/uploads/2020/08/tux.png" class="attachment-thumb120 size-thumb120 wp-post-image" width="57" height="68" alt="" sizes="(max-width: 57px) 100vw, 57px"></amp-img> </figure><!-- /.popular-entry-card-thumb --> <div class="popular-entry-card-content widget-entry-card-content card-content"> <span class="popular-entry-card-title widget-entry-card-title card-title">Failed to start mysql.service: Unit mysql.service not found. → mysql-server インストール忘れ</span> <div class="popular-entry-card-date widget-entry-card-date display-none"> <span class="popular-entry-card-post-date widget-entry-card-post-date post-date">2021.12.06</span></div> </div><!-- /.popular-entry-content --> </div><!-- /.popular-entry-card --> </a><!-- /.popular-entry-card-link --> </div> </aside> <aside id="popular_entries-2" class="widget widget-sidebar widget-sidebar-standard widget_popular_entries"><h3 class="widget-sidebar-title widget-title">総アクセスランキング</h3> <div class="popular-entry-cards widget-entry-cards no-icon cf ranking-visible"> <a href="https://it-afi.com/excel/post-1666/" class="popular-entry-card-link widget-entry-card-link a-wrap no-1" title="ExcelなどでNASを信頼できる場所に追加するには名前でアクセスするしかない"> <div class="post-1666 popular-entry-card widget-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-excel-post"> <figure class="popular-entry-card-thumb widget-entry-card-thumb card-thumb"> <amp-img src="https://it-afi.com/wp-content/uploads/2021/02/greenx-logo.png" class="attachment-thumb120 size-thumb120 wp-post-image" width="76" height="68" alt="" sizes="(max-width: 76px) 100vw, 76px"></amp-img> </figure><!-- /.popular-entry-card-thumb --> <div class="popular-entry-card-content widget-entry-card-content card-content"> <span class="popular-entry-card-title widget-entry-card-title card-title">ExcelなどでNASを信頼できる場所に追加するには名前でアクセスするしかない</span> <div class="popular-entry-card-date widget-entry-card-date display-none"> <span class="popular-entry-card-post-date widget-entry-card-post-date post-date">2021.02.03</span><span class="popular-entry-card-update-date widget-entry-card-update-date post-update">2022.06.24</span></div> </div><!-- /.popular-entry-content --> </div><!-- /.popular-entry-card --> </a><!-- /.popular-entry-card-link --> <a href="https://it-afi.com/teams/teams-%e3%83%a1%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%b3%e3%81%a7%e3%81%8d%e3%81%aa%e3%81%84%ef%bc%88%e4%b8%80%e9%83%a8%e3%81%ae%e4%ba%ba%e3%81%a0%e3%81%91%e5%80%99%e8%a3%9c%e3%81%ab%e5%87%ba%e3%81%a6/" class="popular-entry-card-link widget-entry-card-link a-wrap no-2" title="Teams メンションできない（一部の人だけ候補に出てこない）"> <div class="post-2055 popular-entry-card widget-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-teams-post"> <figure class="popular-entry-card-thumb widget-entry-card-thumb card-thumb"> <amp-img src="https://it-afi.com/wp-content/uploads/2021/09/teams-logo-120x68.png" class="attachment-thumb120 size-thumb120 wp-post-image" width="120" height="68" alt="" sizes="(max-width: 120px) 100vw, 120px"></amp-img> </figure><!-- /.popular-entry-card-thumb --> <div class="popular-entry-card-content widget-entry-card-content card-content"> <span class="popular-entry-card-title widget-entry-card-title card-title">Teams メンションできない（一部の人だけ候補に出てこない）</span> <div class="popular-entry-card-date widget-entry-card-date display-none"> <span class="popular-entry-card-post-date widget-entry-card-post-date post-date">2021.09.14</span><span class="popular-entry-card-update-date widget-entry-card-update-date post-update">2021.09.27</span></div> </div><!-- /.popular-entry-content --> </div><!-- /.popular-entry-card --> </a><!-- /.popular-entry-card-link --> <a href="https://it-afi.com/chrome/chrome-%e6%a4%9c%e8%a8%bc%e3%81%a7%e9%96%8b%e3%81%84%e3%81%9felements%e3%81%ae%e5%86%85%e5%ae%b9%e3%82%92%e5%85%a8%e3%82%b3%e3%83%94%e3%83%bc%e3%81%99%e3%82%8b%e3%82%84%e3%82%8a%e6%96%b9/" class="popular-entry-card-link widget-entry-card-link a-wrap no-3" title="chrome 検証で開いたElementsの内容を全コピーするやり方"> <div class="post-2537 popular-entry-card widget-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-chrome-post"> <figure class="popular-entry-card-thumb widget-entry-card-thumb card-thumb"> <amp-img src="https://it-afi.com/wp-content/uploads/2022/03/chrome-like-logo-120x68.png" class="attachment-thumb120 size-thumb120 wp-post-image" width="120" height="68" alt="" sizes="(max-width: 120px) 100vw, 120px"></amp-img> </figure><!-- /.popular-entry-card-thumb --> <div class="popular-entry-card-content widget-entry-card-content card-content"> <span class="popular-entry-card-title widget-entry-card-title card-title">chrome 検証で開いたElementsの内容を全コピーするやり方</span> <div class="popular-entry-card-date widget-entry-card-date display-none"> <span class="popular-entry-card-post-date widget-entry-card-post-date post-date">2022.03.16</span></div> </div><!-- /.popular-entry-content --> </div><!-- /.popular-entry-card --> </a><!-- /.popular-entry-card-link --> <a href="https://it-afi.com/chrome/uncaught-in-promise-error-a-listener-indicated-an-asynchronous-response-by-returning-true-but-the-message-channel-closed-before-a-response-was-received/" class="popular-entry-card-link widget-entry-card-link a-wrap no-4" title="Uncaught (in promise) Error: A listener indicated an asynchronous response by returning true, but the message channel closed before a response was received"> <div class="post-3741 popular-entry-card widget-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-chrome-post"> <figure class="popular-entry-card-thumb widget-entry-card-thumb card-thumb"> <amp-img src="https://it-afi.com/wp-content/uploads/2022/03/chrome-like-logo-120x68.png" class="attachment-thumb120 size-thumb120 wp-post-image" width="120" height="68" alt="" sizes="(max-width: 120px) 100vw, 120px"></amp-img> </figure><!-- /.popular-entry-card-thumb --> <div class="popular-entry-card-content widget-entry-card-content card-content"> <span class="popular-entry-card-title widget-entry-card-title card-title">Uncaught (in promise) Error: A listener indicated an asynchronous response by returning true, but the message channel closed before a response was received</span> <div class="popular-entry-card-date widget-entry-card-date display-none"> <span class="popular-entry-card-post-date widget-entry-card-post-date post-date">2023.02.10</span></div> </div><!-- /.popular-entry-content --> </div><!-- /.popular-entry-card --> </a><!-- /.popular-entry-card-link --> <a href="https://it-afi.com/mac/post-245/" class="popular-entry-card-link widget-entry-card-link a-wrap no-5" title="MacにiPhone充電できない。ポンポン鳴って接続と未接続を繰り返す→ファミコンの技で解決→やっぱダメでした"> <div class="post-245 popular-entry-card widget-entry-card e-card cf post type-post status-publish format-standard has-post-thumbnail hentry category-mac-post"> <figure class="popular-entry-card-thumb widget-entry-card-thumb card-thumb"> <amp-img src="https://it-afi.com/wp-content/uploads/2023/02/mac-photo-120x68.jpg" class="attachment-thumb120 size-thumb120 wp-post-image" width="120" height="68" alt="" sizes="(max-width: 120px) 100vw, 120px"></amp-img> </figure><!-- /.popular-entry-card-thumb --> <div class="popular-entry-card-content widget-entry-card-content card-content"> <span class="popular-entry-card-title widget-entry-card-title card-title">MacにiPhone充電できない。ポンポン鳴って接続と未接続を繰り返す→ファミコンの技で解決→やっぱダメでした</span> <div class="popular-entry-card-date widget-entry-card-date display-none"> <span class="popular-entry-card-post-date widget-entry-card-post-date post-date">2019.11.15</span><span class="popular-entry-card-update-date widget-entry-card-update-date post-update">2023.02.10</span></div> </div><!-- /.popular-entry-content --> </div><!-- /.popular-entry-card --> </a><!-- /.popular-entry-card-link --> </div> </aside> <div id="sidebar-scroll" class="sidebar-scroll"> <aside id="toc-2" class="widget widget-sidebar widget-sidebar-scroll widget_toc"> <div class="toc-widget-box"> <div class="toc tnt-number toc-center tnt-number border-element"><input type="checkbox" class="toc-checkbox" id="toc-checkbox-5" checked><label class="toc-title" for="toc-checkbox-5">目次</label> <div class="toc-content"> <ol class="toc-list open"><li><a href="#toc1" tabindex="0">H25は、<frameset>の中の、個々の<frame>だけじゃなくて、通常のページのページタイトルも含む</a></li><li><a href="#toc2" tabindex="0">AIの回答。G88はページタイトルの内容で、H25はページタイトルの技術的な実装</a></li></ol> </div> </div> </div> </aside> <aside id="text-3" class="widget widget-sidebar widget-sidebar-scroll widget_text"><h3 class="widget-sidebar-scroll-title widget-title">Googleアドセンスレスポンシブ</h3> <div class="textwidget"> <!-- it-afi_最初の広告 --> <ins class="adsbygoogle" data-ad-client="ca-pub-4895059887263926" data-ad-slot="6752884896" data-ad-format="auto"></ins> </div> </aside> </div> </div> </div> </div> <footer id="footer" class="footer footer-container nwa" itemscope itemtype="https://schema.org/WPFooter"> <div id="footer-in" class="footer-in wrap cf"> <div class="footer-bottom fdt-logo fnm-text-width cf"> <div class="footer-bottom-logo"> <div class="logo logo-footer logo-text"><a href="https://it-afi.com/" class="site-name site-name-text-link" itemprop="url"><span class="site-name-text" itemprop="name about">クズリーマンのカス備忘録</span></a></div> </div> <div class="footer-bottom-content"> <nav id="navi-footer" class="navi-footer"> <div id="navi-footer-in" class="navi-footer-in"> </div> </nav> <div class="source-org copyright">© 2016 クズリーマンのカス備忘録.</div> </div> </div> </div> </footer> <div id="go-to-top" class="go-to-top"> <button class="go-to-top-button go-to-top-common go-to-top-hide go-to-top-button-icon-font" on="tap:header.scrollTo('duration'=375)" aria-label="トップへ戻る"><span class="fa fa-angle-double-up"></span></button> </div> <div class="go-to-top-trigger"> <amp-position-observer on="enter:hide-page-top.start; exit:show-page-top.start" layout="nodisplay" aria-label="トップへ戻る"></amp-position-observer> </div> </div><!-- #container --> <style amp-keyframes>@keyframes shine{0%{transform:scale(0) rotate(45deg);opacity:0}80%{transform:scale(0) rotate(45deg);opacity:.5}81%{transform:scale(4) rotate(45deg);opacity:1}100%{transform:scale(50) rotate(45deg);opacity:0}}</style> </body> </html>