2010-07-30 44 views
10

thể trùng lặp:
Why not use tables for layout in HTML?lợi ích của thiết kế tableless của các trang web?

Những ngày này, tôi đọc rất nhiều điều mà chúng ta nên viết Tableless HTML. Tôi tin rằng đòi hỏi rất nhiều kiến ​​thức về CSS. Câu hỏi của tôi là:

  • Lợi ích của thiết kế không cần thiết là gì?
  • Các điều kiện khi sử dụng bảng?
  • Cách bắt đầu?
+0

"Các điều kiện khi sử dụng bảng là gì?" Khi bạn muốn hiển thị dữ liệu dạng bảng. Mà là để nói, sử dụng bảng để hiển thị các bảng dữ liệu, và sử dụng CSS cho bố trí. Đừng cố tạo lại các bảng không có bảng và không sử dụng các bảng để bố trí. –

+0

trùng lặp: http://stackoverflow.com/questions/83073/why-not-use-tables-for-layout-in-html bất kỳ ai muốn các điểm miễn phí đều có thể sao chép câu trả lời ở đây: p – catchmeifyoutry

+0

Khá chắc chắn câu hỏi này đã được được thực hiện cho đến chết: http://stackoverflow.com/questions/407420/what-is-the-benefit-of-tableless-design-if-you-need-clearing-blocks-everywhere http://stackoverflow.com/questions/1518223/table-vs-css-based-bố trí-cho-trang web http: // stackoverflow.com/questions/30251/tables-instead-of-divs http://stackoverflow.com/questions/96137/divs-vs-tables-a-rebuttal-please http://stackoverflow.com/questions/83073/div- vs-table –

Trả lời

3

Lợi ích của bảng ít hơn thiết kế là gì?

Có rất nhiều, không ít nhất là giảm tải trọng HTML và tính linh hoạt để thay đổi bố cục (qua CSS) mà không thay đổi đánh dấu.

Một cách mà họ giảm tải trọng là, với các kiểu được lưu trữ trong biểu định kiểu bên ngoài và biểu định kiểu thường được chia sẻ giữa các trang, bộ nhớ đệm thực sự chuyển sang giải cứu. Người ta có thể lập luận rằng các bảng định kiểu có thể được sử dụng với các bảng. Yup; tuy nhiên, việc sử dụng các quy tắc kỷ luật cho bố cục có xu hướng quảng bá bảng định kiểu sử dụng.

Bạn có thể đọc trên thiết kế Tối ưu hóa công cụ tìm kiếm (SEO). Một trong những chủ yếu của SEO là để có được nội dung quan trọng của bạn lên phía trên cùng của cây HTML, trên những thứ tương đối không quan trọng như điều hướng. Điều này thực sự là không thể với thiết kế dựa trên bảng.

Các điều kiện khi sử dụng bảng?

Sử dụng bảng để hiển thị dữ liệu dạng bảng. Tránh chúng để bố trí.

Cách bắt đầu?

Tôi là người hâm mộ của w3schools và awsome CSS Zen Garden.Những người đã cho tôi sự khởi đầu của tôi.

+0

xin lỗi nếu điều này nghe có vẻ ngu ngốc? u có thể cho tôi một ví dụ về dữ liệu dạng bảng không? –

+2

Quy tắc chung của tôi là: nó là bảng nếu các hàng và cột có ý nghĩa. Thông thường, mỗi hàng là một thực thể (giống như một nhân viên) và mỗi cột đại diện cho một thuộc tính cụ thể (như 'tên đầu tiên', 'ngày sinh', v.v.). – grossvogel

+0

@grossvogel cảm ơn rất nhiều :-) –

0

bạn nhận được hiệu suất tốt hơn khi hiển thị trang & nó sẽ là tiêu chuẩn dựa trên. Sử dụng các thẻ <div> để đi kèm với thiết kế không cần tab.

+0

Làm cách nào để tôi có được hiệu suất tốt hơn? lý do xin vui lòng .. –

+0

nó không phải phân tích cú pháp thông qua tất cả các thẻ bảng đặc biệt là khi chúng được lồng nhau – SoftwareGeek

+3

Bảng không phải là tiêu chuẩn. – mattmc3

1

Với thiết kế bảng-less nó dễ dàng hơn để thay đổi bố cục trang và bạn viết ít html. Bảng chỉ nên sử dụng cho dữ liệu dạng bảng.

+0

không tạo ra một hình thức qualfies cho các bảng sẽ được sử dụng? –

+0

Không, bạn có thể đạt được điều tương tự với phao và vị trí. Bảng chỉ dành cho dữ liệu dạng bảng, mà chúng rất tốt. – Pat

+0

Xem [câu hỏi này] (http://stackoverflow.com/questions/1395514/is-it-acceptable-to-use-tables-for-forms-or-is-it-still-more-correct-to-use -divs) để sử dụng các biểu mẫu cho các biểu mẫu – Eric

0

Có thảo luận phổ biến rộng rãi về các bảng so với tất cả các div trên internet.

Tôi là người đề xuất lớn về việc sử dụng các bảng biểu diễn dữ liệu dạng bảng. Tuy nhiên, đó là mức độ sử dụng của họ. Đối với cấu trúc trang và bố cục, bạn nên sử dụng divs và css.

Đọc chi tiết này smashing magazine article về bảng so với div.

+0

Không tạo biểu mẫu. Đủ điều kiện cho các bảng được sử dụng. ? –

+0

Cá nhân tôi sẽ không. Sử dụng 'ul' với' nhãn' và tạo kiểu cho chúng bằng css. Ví dụ: http://woork.blogspot.com/2008/06/form-elements-design-using-css-and-list.html – advait

+0

Một UL với nhãn là phương pháp tiếp cận đúng để đọc điều này: http: // green- beast.com/blog/?p=259 –

1

Bảng nên được sử dụng để hiển thị dữ liệu dạng bảng chứ không phải cho bố cục.

Bạn sẽ nhận được hiệu suất tốt hơn với các tệp css tách ra vì trình duyệt có thể lưu vào bộ nhớ cache chi tiết bản trình bày giữa các trang trong trang web của bạn.

Sử dụng css tách ra cũng giúp dễ dàng trao đổi lượt xem dựa trên trình duyệt đang được sử dụng (ví dụ: tôi muốn hiển thị nội dung nào đó khác với người dùng iPhone so với người dùng IE).

Điều này cũng giúp bạn dễ dàng thay đổi giao diện trang & mà không thay đổi mã tạo nội dung (ví dụ: nếu bạn đang tạo html bằng PHP).

1

thiết kế web Tableless mang đến cho bạn những điều sau:

Ít Markup

Bàn cần rất nhiều mã để thực sự tạo ra các tế bào bảng và các hàng, nơi như một div chỉ là một thẻ mở và đóng đơn giản . Điều này có nghĩa là ít người dùng của bạn tải xuống khi họ tải trang.

bảo trì dễ dàng hơn

Kể từ khi có ít đánh dấu với thiết kế Tableless, mã này là dễ dàng hơn để duy trì (ít mã để lội qua). Nó cũng dễ dàng hơn để thêm các phần tử vào một thiết kế không cần thiết bởi vì bạn không phải đi qua một bảng và xác định nơi tất cả các hàng và colspans cần phải được thêm vào các hàng và cột hiện có của bạn.

Nội dung và trình bày là riêng

một Đây là chìa khóa. Với thiết kế tableless, nó dễ dàng hơn nhiều để swap the CSS và hoàn toàn thay đổi giao diện của trang web mà không cần chạm vào đánh dấu.

Bàn là dành cho dữ liệu

Bàn nên được sử dụng khi bạn đang hiển thị dữ liệu dạng bảng. Cấu trúc của chúng làm cho chúng rất tốt trong việc xác định mối quan hệ giữa các tiêu đề và dữ liệu. Kết quả là chúng tuyệt vời cho khả năng truy cập khi nói đến dữ liệu dạng bảng.

Các Catch

Mặc dù không có nhiều điều để học hỏi trong CSS, nó sẽ mất một thời gian tốt để làm quen với tất cả các mâu thuẫn duyệt render (tôi nhìn bạn IE .. .). Nếu bạn muốn bắt đầu, tôi khuyên bạn nên tập trung vào việc tìm hiểu về cách floats and position behave. Một khi bạn đã sắp xếp xong, nó trở nên dễ dàng hơn nhiều.

Các vấn đề liên quan