20/08/21 07:35:01.18 .net
role属性ってつけると、ブラウザが解釈して何かUIなどが変わったりするの?
検索エンジンのための意味付けのようなもの?
516:Name_Not_Found
20/08/21 10:34:02 .net
>>515
WAI-ARIAの基本 - ウェブ開発を学ぶ | MDN
URLリンク(developer.mozilla.org)
> WAI-ARIA 属性の重要な点は、ブラウザーのアクセシビリティ API(スクリーンリーダーはここから情報を取得する)によって提供される情報を除いて
> それらはウェブページに何の影響も与えないという点です。
> WAI-ARIA はウェブページの構造や DOM に影響を与えませんが、 CSS の要素選択で利用することが可能です。
517:Name_Not_Found
20/08/21 16:49:37.03 .net
>>516
レスどうも、WAI-ARIA見てみました(全然わからん)
divやspanなど、そのものの意味が無いものに対して付加するのが始まりって感じ?
<header role="banner">とか
<nav role="navigation">とかソース見るとあるけど、「ある」と「無い」でどこに違いが出るの?
cssの要素選択ができるということはclassみたいな扱いができるってことかな。
header.bannerみたいな。
たくさんできた仕様で現在ではあまり使われていないものなのかな。
518:Name_Not_Found
20/08/21 17:43:44 .net
>>517
WAI-ARIAは「Web Accessibility Initiative - Accessible Rich Internet Applications」の略
Webアクセシビリティとかで調べてみるといい
あとは、こういうのとか
WAI-ARIAを活用したフロントエンド実装 - role属性、aria属性の基礎知識 | CodeGrid
URLリンク(app.codegrid.net)
CSSの要素選択は、その例だとセレクタはheader[role="banner"]
519:Name_Not_Found
20/08/21 19:17:33.34 .net
アクセシビリティを外観にまつわる機能として判断してるようじゃ理解できないだろうな
むしろ目が見えない人などのために存在してるんだから
520:Name_Not_Found
20/08/21 23:18:35 .net
アクセシビリティといえば
日系企業ランキングを思い出す…
あの惨劇はもう10年以上前だったろうか
521:Name_Not_Found
20/08/22 12:15:02 .net
>>509
Bootstrap のブレイクポイントの変数定義では、
$grid-breakpoints: (
xs: 0,
sm: 576px,
md: 768px,
lg: 992px,
xl: 1200px
) !default;
522:Name_Not_Found
20/08/22 15:49:36 .net
>>521
今はもっと少なくても良さそうなもんだ
523:Name_Not_Found
20/08/22 16:07:41.99 UFsz4By5.net
URLリンク(www.hook-net.jp)
こちらのサイトのように画像と文字の境界線をなくすためにはjsが必要でしょうか?
524:Name_Not_Found
20/08/22 16:20:43.37 .net
ちょっと何言ってるか分かんない
525:Name_Not_Found
20/08/22 17:47:35 UFsz4By5.net
>>524
すみません画像と文字を一つのボックスに横並べして画像のふちを白でぼかしたいんですが
その場合グラデーションを使えばよいのでしようか?
526:Name_Not_Found
20/08/22 17:59:50.30 .net
手っ取り早いのが縁を白でぼかした画像を作成すること
527:Name_Not_Found
20/08/22 18:04:22.71 .net
だよな。レイアウトはもちろんテーブルタグだ
528:Name_Not_Found
20/08/22 19:46:47 .net
>>520
惨劇ってなんすか?
529:Name_Not_Found
20/08/22 21:30:44 UFsz4By5.net
URLリンク(codepen.io)
グラデーションをつけて片側をすけさせることまでできたのですが同時に画像をぼやけさせることができません。
URLリンク(cruw.co.jp) この場合+を使うと実装できますか?
530:Name_Not_Found
20/08/22 21:40:24 UFsz4By5.net
画像にfilter: blur(5px);を加えると境界線ができグラデーションの意味がなくなってしまいます
グラデーションと画像ぼかしを境界線が見えない形で実装できないのでしょうか…
531:Name_Not_Found
20/08/22 21:41:44 .net
またこのひとか
532:Name_Not_Found
20/08/22 23:00:59 .net
上に透明なdiv重ねてそのdivにbackdropfilter blurかけりゃいいじゃん
533:Name_Not_Found
20/08/22 23:53:26.90 0lfiVAzr.net
すみません、htmlとjava初心者です。
こちらの質問の
URLリンク(teratail.com)
背景の赤い枠を下まで伸ばすにはどうしたらいいか教えてください
534:Name_Not_Found
20/08/23 00:08:29 wdKbLCbE.net
>>533
100vhでどうよ
535:Name_Not_Found
20/08/23 00:10:12 .net
まったく関係ないいんだけど
529を見て知りたかったことあったので
URLリンク(cruw.co.jp)
このページみたいに
画像が出てから色が出てシュッとなるやつって
jQだと思うんだけど説明してるサイトとかってありますか?
これのネーミングなんて言えばいいのかわからなくて
ググってもイメージ通りものにたどり着かなくて
536:Name_Not_Found
20/08/23 00:11:13 .net
↑
画像が先に出てからじゃないや
色がでて画像がでてくる
537:Name_Not_Found
20/08/23 00:13:05.42 1JN6CSRO.net
>>534
.item {
display: inline-block;
width: 30%;
height: 100vh;
margin: 10px;
font-size: 20px;
background: rgba(255, 0, 0, 0.4);
}
としてみたのですが変化なしですね・・
538:Name_Not_Found
20/08/23 00:50:36.54 .net
intersectionobserberで擬似要素と画像をコントロールしとんちゃうか
539:Name_Not_Found
20/08/23 01:56:32.50 .net
さよか
540:Name_Not_Found
20/08/23 05:04:32.52 .net
>>528
審査員のひとりに
富士通のアクセシビリティに一家言ある人がいて
数年後に控えたJIS X 8341-3を
勝手に前倒しで審査項目に導入したので
ほとんどのサイトのランクが
前年と比べて100、200以上変動した
上がったところはいいけど
下がったところは代理店も制作会社もそれなりに
上からお叱りやペナを受けることになって非難轟々
その年を最後に日経企業サイトランキングは消滅した
という昔話です
541:Name_Not_Found
20/08/23 07:45:31.76 .net
この世界じゃよくあることだ
すぐ収まるのもこの世界らしい
542:Name_Not_Found
20/08/23 09:36:05 obkittuk.net
Web系に転職したく勉強をしています
モバイル用にハンバーガーメニューを設置したいのですが、
HTMLにPC用とモバイル用で別のnavを2つ設置してメディアクエリで
それらの表示を切り替えるのはありでしょうか
それとも重複的な記述はHTML的にはよろしくないのでしょうか
543:Name_Not_Found
20/08/23 10:00:48 .net
HTMLとしてはわりとどうでもいいというか
そこまで気にするもんでもないと思うが
運用する上で同じものが二つあるのは厄介だな
片方忘れられたりするリスクがある
544:Name_Not_Found
20/08/23 11:59:10.13 .net
サーバサイドで書き換え