Tại sao nhiều bảng HTML được sử dụng trong đánh dấu trang?


8

Tôi đang cố gắng phát triển web, vì vậy tôi bắt đầu học HTML, CSS và javascript. Tôi đã kết hợp rất tốt với javascript, nhưng tôi vẫn không thể tạo ra bất cứ điều gì với HTML và CSS để cứu mạng tôi. Tôi sẽ hỏi một số địa điểm hoặc mẹo để cải thiện, nhưng tôi biết câu hỏi đã được hỏi vô số lần và sẽ bị xóa, vì vậy tôi đoán rằng tôi sẽ chỉ xem nguồn của một số trang web của người khác.

Những gì tôi tiếp tục nhìn thấy là bảng trái và phải. Có một lý do hợp lệ để sử dụng bảng?



Một lý do chính đáng có thể là bạn trong một nhóm thực sự hấp dẫn nhưng mọi người đều có quyền lực chính trị nhiều hơn bạn và tất cả họ đều thực sự hoang tưởng về những ý tưởng mới sẽ giải thích lý do tại sao họ ủng hộ sơ đồ bố trí ưa thích của năm 1998.
Erik Reppen

Câu trả lời:


16

Để bố trí dữ liệu bảng.

Dưới đây là một vài câu hỏi để tự hỏi khi lựa chọn giữa các bảng và thùng chứa css.

Bảng dành cho dữ liệu dạng bảng. Giai đoạn = Stage.

Các <table>thẻ là không ác. Bất chấp những gì một số người nghĩ và nói, quan điểm của CSS là không bao giờ sử dụng nó. Tuy nhiên, một hệ quả của nguyên tắc Semantic HTML là bạn không bao giờ nên sử dụng các bảng để bố trí . Hãy để tôi nói điều đó một lần nữa, như đoạn văn của riêng nó, để nhấn mạnh:

Không bao giờ sử dụng bảng để bố trí. Không bao giờ.

Nếu bạn không thể quyết định liệu một bảng có phải là lựa chọn đúng hay không, hãy tự hỏi mình những câu hỏi sau:

  • Các hàng hoặc cột thông tin có chung một thuộc tính không?
  • Nếu tôi thay đổi thứ tự của các hàng hoặc cột, nó vẫn có ý nghĩa chứ?
  • Nếu tôi hoán chuyển các trục của bảng (tạo các hàng thành cột và ngược lại) thì nó có còn ý nghĩa không?

Nếu câu trả lời ở trên nói chung là về Hrm ... Tôi đoán là không, thì bạn không nên sử dụng bảng.

Nếu bạn cần thuyết phục hơn, hãy xem "Tại sao các bảng lại tệ (đối với bố cục) so với ngữ nghĩa HTML + CSS" .


2
@WeekendWar Warrior: Không chắc chắn tôi đồng ý. Tại sao tôi muốn hack một giải pháp CSS để hiển thị một ncột dạng bảng theo nlưới hàng, chẳng hạn như, thống kê trong một trò chơi NFL? Đó chính xác là nơi các bảng nên được sử dụng. Có lẽ bố cục lưới CSS sẽ thay thế nó tại một số điểm (một khi trình duyệt chéo được hỗ trợ, ít nhất là cho một vài bản phát hành của mỗi bản), nhưng nó vẫn chưa có.
Demian Brecht

@Dppy Ông nói "bảng để bố trí". Tôi khá chắc chắn rằng anh ta không có ý bao gồm dữ liệu dạng bảng.
Rein Henrichs

Một bảng có thích hợp không, ví dụ như một bản dịch opera opera bên cạnh [sử dụng một hàng trên mỗi dòng]? Một thứ như vậy chính xác sẽ không phải là "dữ liệu dạng bảng", nhưng sử dụng bảng sẽ duy trì sự liên kết giữa các dòng trong ngôn ngữ gốc và bản dịch ngay cả khi văn bản được phóng to đủ để khiến một số dòng bị ngắt.
supercat

9

Giả sử bạn có nghĩa là các bảng được sử dụng làm bố cục trang thay vì chỉ cho dữ liệu dạng bảng ...

Bạn đang nhìn thấy các bảng vì CSS gây khó chịu khi sử dụng (phải thừa nhận ít hơn so với một vài năm trước). Tại một số điểm người ta phải hoàn thành công việc. Để làm điều đó "đúng" bằng cách sử dụng CSS đòi hỏi phải thử nghiệm và thử nghiệm vô tận. Mặt khác, bàn có thể được nắm bắt bằng trực giác.

Nếu bạn muốn làm đúng (bằng cách sử dụng CSS) và bạn không muốn lãng phí cuộc sống của mình cho CSS, thỏa hiệp tốt nhất là giải quyết một vài bố cục khác nhau và loại bỏ một số CSS khỏi các trang web mẫu. Sử dụng các mẫu làm điểm bắt đầu. Bắt đầu từ đầu với CSS là một công thức cho sự thất vọng.


4
+1 cho "hoàn thành công việc". Tôi là một nhà phát triển, không phải là một nhà thiết kế ui. Tôi chắc chắn có thể thiết kế một chức năng, hơi hấp dẫn, nhưng nó sẽ khiến tôi mất nhiều thời gian hơn so với một nhà thiết kế UI. Tôi sẽ tặng gì cho một anh chàng trong nhóm của tôi, người chỉ thiết kế các mẫu và kiểu dáng để tôi không phải lo lắng về điều đó.
AJC

1
Tôi không thể không nghĩ rằng CSS có thể đơn giản hơn nhiều. IMHO sự phức tạp không cần thiết này và việc thiếu triển khai tham chiếu "pixel perfect" đã dẫn đến việc triển khai kém / không nhất quán của các nhà cung cấp trình duyệt, dẫn đến cả một thế hệ các nhà phát triển web "không hiểu được".
Angelo

1
Đã từng có những "diễn giải" về mô hình hộp trong đó các bảng là cách duy nhất. Ví dụ, phần tử FORM không thể được tạo kiểu nhưng vẫn tạo một hộp (với lề / phần đệm mặc định) trong IE. Cách duy nhất để thoát khỏi không gian thừa là ép FORM giữa BẢNG và TR. Hoàn toàn chống lại tiêu chuẩn, nhưng cách duy nhất mà làm việc.
SF.

@Angelo: Vấn đề không chỉ là CSS "bực bội"; Về mặt lịch sử, nó không có khả năng thực hiện nhiều việc khá dễ dàng với các bảng. Một cái gì đó đơn giản như bố cục văn bản chính cộng với thanh bên, trong đó thanh bên sẽ là 10% chiều rộng có sẵn, nhưng rộng tối thiểu 140px (chiều rộng của đồ họa logo cụ thể), sẽ dễ dàng với bảng [IIRC, được đặt chiều rộng của bảng là 100%, không xác định chiều rộng cột chính và đặt chiều rộng của cột thanh bên là 10%; chiều rộng cột sẽ vượt quá 10% nếu cần để chứa đồ họa 140px]). Khi nào CSS có thể làm điều đó lần đầu tiên?
supercat

8

Bố cục dựa trên bảng theo một số cách, dễ học hơn so với bố cục CSS thuần cho những người mới bắt đầu học HTML. Ngoài ra, vào thời trước, bạn không thể sử dụng CSS một cách đáng tin cậy và nó hoạt động trên tất cả các trình duyệt. Vì vậy, hầu như tất cả các hướng dẫn HTML cho đến năm 2000 hoặc hơn các bảng được sử dụng dành riêng cho bố cục. Rất nhiều mã HTML đó đã được chuyển qua các trang web khác (thông qua Nguồn xem) và rất nhiều người đã học được từ các hướng dẫn đó và không bận tâm đến việc học bố cục CSS.

Tôi sẽ đề nghị bản thân được bùng cháy ở đây và nói rằng bạn sẽ ổn nếu bạn bắt đầu thực hiện bố cục của mình trong các bảng trước khi học CSS. Sự khác biệt ở cấp độ mới bắt đầu là nhỏ nhất. Bạn sẽ không thể thực hiện các bố cục thực sự phức tạp trong EITHER cho đến khi bạn có một hoặc hai năm kinh nghiệm, vì vậy thực sự không có nhiều khác biệt. Bắt đầu với các bảng để có được một số nội dung trên màn hình và để giữ sự quan tâm của bạn, và từ từ tiếp tục đọc CSS (điều này rõ ràng là vượt trội trong thời gian dài). Tôi đã từng là một CSS-Zealot trở lại vào thời "Thiết kế với các tiêu chuẩn web" nhưng đó chỉ là vì nó rất thú vị khi tự lập và vượt trội.


6
Tôi không đồng ý, mặc dù tôi sẽ không kích động bạn. Học cách bố trí với các bảng không nhất thiết phải dễ dàng hơn (nó không dành cho tôi). Quan trọng hơn, việc chuyển đổi từ "cách bảng" sang cách CSS khó hơn so với việc học đúng cách ngay lần đầu tiên.
MattBelanger

1

Trình duyệt là vấn đề. Bất chấp những gì là thực tiễn tốt nhất và những gì mọi người đồng ý, thật khó để làm cho các trang web trông ổn định trong các trình duyệt mà không có bảng, mặc dù nó được mã hóa sai. Nó phải làm với ngữ nghĩa. Đó là điều quan trọng nhất để học với HTML, là ý nghĩa ngữ nghĩa của các thẻ. Nơi tốt nhất để tìm hiểu là trong năm hoặc nhiều video đầu tiên mà Giáo dục.com có ​​trên các video HTML, tất cả đều được thực hiện với HTML5 và giải thích ngữ nghĩa là gì và tại sao nó quan trọng.


Tôi quên đề cập, trình duyệt đã bắt kịp. Không ai sử dụng IE6 nữa, vì vậy bây giờ các bảng gặp nhiều rắc rối hơn giá trị của chúng, thực sự dễ dàng hơn để thực hiện mọi thứ theo cách hiện tại. Vì vậy, hãy quên các bảng trừ khi bạn làm việc với "dữ liệu dạng bảng". Xem video tôi đã đề cập nếu bạn không hiểu ý của tôi về "dữ liệu dạng bảng".
Phillip James

Thật không may trong thế giới doanh nghiệp và chăm sóc sức khỏe, có một số lượng lớn người đáng ngạc nhiên vẫn đang sử dụng IE6
CdMnky

"Điều quan trọng nhất để học với HTML" là chủ quan. Tôi đang ở trong thế giới phát triển ứng dụng web, vì vậy phần lớn ngữ nghĩa HTML thực sự khá vô nghĩa đối với tôi. Không như vậy nếu tôi đang xây dựng các trang web cần các tính năng SEO.
Graham
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.