Đề xuất đánh dấu ngữ nghĩa

Question

Tôi đang tạo GUI web cho một ứng dụng tôi đang làm việc. Phần cụ thể này sẽ nằm trong một trang lớn hơn có trang điểm ngữ nghĩa tốt. Tuy nhiên, tôi không chắc chắn lựa chọn nào tốt nhất để đánh dấu màn hình dưới đây theo ngữ nghĩa.

Suy nghĩ ban đầu của tôi là tách nửa trên khỏi nửa dưới qua div. Vì vậy, đánh dấu cho đầu là khá dễ dàng. Rời khỏi đáy là nơi tôi cảm thấy bối rối. Câu trả lời dễ nhất là một bảng nhưng nội dung này không dễ dàng phù hợp với các bảng sử dụng duy nhất cho quy tắc dữ liệu bảng. Đặc biệt là xem xét các tiêu đề sẽ trông dễ thấy trong bố cục này. Gợi ý?

Need Semantic Markup for this Image http://img183.imageshack.us/img183/2261/semanticmarkup.png

Answer 1

Tôi sẽ sử dụng một bảng cho phần dưới vì theo ý kiến ​​của tôi đây là dữ liệu dạng bảng. Tôi thấy 4 cột (biểu tượng, tên dự án, mô tả dự án và các nút tác vụ). Tôi không thấy bất kỳ lý do gì để không sử dụng một bảng cho bố cục này (chưa kể rằng bất kỳ cách tiếp cận nào khác có thể làm cho quy mô bố cục này đúng cách sẽ yêu cầu JavaScript và rất nhiều nhức đầu để làm việc đúng).

Answer 2

Tôi không nghĩ rằng đó sẽ là vi phạm nghiêm trọng nhất về đánh dấu ngữ nghĩa nếu bạn đặt nội dung đó vào bảng. Ngoại trừ các nút, nó trông khá bảng cho tôi. Tôi nghĩ rằng các vị thần CSS sẽ tha thứ cho bạn :)

Answer 3

Bạn không vi phạm bất cứ điều gì đặt điều đó dưới dạng bảng. Chắc chắn, một số người sẽ rên rỉ về nó, nhưng nó đủ gần với dữ liệu bảng mà bạn có thể là tốt.

Answer 4

Tôi đồng ý với Andrew. Đây là dữ liệu dạng bảng nên bạn nên sử dụng số <table> nhưng hãy nhớ rằng bạn nên xác định đúng tiêu đề, cột và chân trang của bảng.

Tùy chọn khác của bạn là đi với một bảng không có tiêu đề, nơi bạn sẽ sử dụng một <div> cho đầu trang và chân trang và <table> làm phần thân. Tuy nhiên, tôi không khuyên bạn nên làm điều này. Một lý do sẽ là bạn sẽ muốn tiêu đề cho những thứ như phân loại phía máy khách nếu bạn đang sử dụng JavaScript.