테스트 사이트 - 개발 중인 베타 버전입니다

반응형 게시판 질문요~~ 채택완료

이미님 10년 전 조회 4,038


부트스트랩 활용한 홈페이지에 도전 중인데요..
게시판을 PC용, 모바일용 따로 스킨을 둘까 하다가
일단 하나로 한번 해볼까나~ 하고 반응형으로 나온 스킨을 찾아봤거든요.
그런데 테이블이 아니라 ul을 써서... span으로 구획 나누는 식이던데요-

 

</p><p><div id="hd">
 <span>번호</span>
 <span>제목</span>
 <span>글쓴이</span>
 <span>조회수</span>
</div>
<div id="list">
 <ul>
  <li><span>3</span><span>제목 3</span><span>이름 3</span><span>3</span></li>
  <li><span>2</span><span>제목 2</span><span>이름 2</span><span>2</span></li>
  <li><span>1</span><span>제목 1</span><span>이름 1</span><span>1</span></li>
 </ul>
</div> </p><p>


웹 접근성 측면에서 봤을 때 문제가 없는건가? 라는 의문이 들어서요.
생각해보니 원하는 모양으로 만들려면 확실히 table 태그로는 무리가 있긴 한데,
그렇다고 줄마다 span에 타이틀 태그를 붙여주기도 애매하고요.
해외 사이트의 경우는 게시판보다 방명록 형태로 거의 사용을 하잖아요...
그런거 생각해보면 역시 한국에서 일반적으로 사용하는 게시판 목록 형태를...
웹 접근성까지 고려해가며 반응형으로 만드는건 무리인가 싶기도 하고....
뭔가 제가 생각하지 못하고 있는 부분이 있다면 알려주세요^^;

 

댓글을 작성하려면 로그인이 필요합니다.

답변 2개

채택된 답변
+20 포인트
p
10년 전

제목과 상반된 질문이라 다시 정리해봅니다.

지금 현재 의문이 가시는 부분이 웹 접근성의 이슈 같은데..

그렇다면 더더욱 반응형이라는 문구를 제외하고 고려해볼만한 문제이죠.

table 과 div 가 반응형이랑은 관계는 있을 수 있어도 그게 배경으로 깔리진 않으니까요.

 

기본적인 생각으로 국내의 게시판 중 목록을 구성한다면 저는 table 이 더 맞다라고 생각하는 편입니다.

뭐 비슷한 부분에 대해서도 검색하면 나오기도 하구요.

 

https://www.wah.or.kr:444/Participation/consultingView.asp?cType=&seq=8721&page=1?cType=&FindTxt=&cMail=">https://www.wah.or.kr:444/Participation/consultingView.asp?cType=&seq=8721&page=1?cType=&FindTxt=&cMail= 

 

http://hyeonseok.com/soojung/webstandards/2009/11/12/554.html">http://hyeonseok.com/soojung/webstandards/2009/11/12/554.html 

 

개인적으로 두 번째 링크인 신현석님의 글을 더 옹호하는 편입니다.

로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

이미님
10년 전
제가 궁금했던 부분이 이거네요^^
반응형 게시판 스킨의 겉 모습이 마음에 들었는데, 과연 코드가 웹 접근성을 고려한 것인가, 그렇게 사용해도 무방한 것인가 궁금했거든요. 모바일 용으로는 스킨을 따로 써야겠네요. 답변 감사합니다.

댓글을 작성하려면 로그인이 필요합니다.

p
10년 전

css 자체가 cascading 이 되지요.

대분류에 포함된 span 을 각각 태그 선언하는게 아니라 

하나의 선언으로 같이 사용할 수 있구요.

그부분은 크게 고려 안하셔도 됩니다.

뭐 표를 위해서 table 을 이용하는거도 무리는 없구요.

단 레이아웃을 위해 table 을 사용하는건 비추천하죠.

 

반응형이라고 하시면 거의 머리 싸매는 부분이 @media 즉 미디어쿼리 부분일것입니다.

사실 그거 빼고는 width:100%; 의 이슈뿐이라 고민할 여지도 없죠

로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

이미님
10년 전
제가 고민하는건 레이아웃이 아니에요. 레이아웃 문제라면 얼마든지 span으로 해결되죠.
알고자 하는건.... 아직 웹 접근성에 대한 이해도가 떨어져서일 수도 있는데,
table을 사용할 경우 th에 scope 속성을 넣거나 해서 시각장애인이 표를 읽을 때 리더가 거기 맞춰서 작동되잖아요.. 그런데 div와 li, span으로 게시판 리스트를 만들었을 때 과연 시각장애인이 지금 읽고 있는게 제목인지 뭔지 알 수 있도록 리더가 작동할 것인가...란 의문인거죠^^a 뭐...... 대충 제목인지 날짜인지 구분이 가긴 하겠지만....

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인