เครื่องมือสร้างตาราง HTML ที่เข้าถึงได้
เครื่องมือสร้างตาราง HTML
สร้างตาราง HTML ที่เข้าถึงได้: CSV เป็น HTML พร้อมคำบรรยาย | We.Inc
วาง CSV หรือเริ่มจากแม่แบบรายการราคาและเวลาเปิด ได้ตาราง HTML จริงพร้อมคำบรรยาย ช่องหัวตาราง และ scope ที่ escape อย่างปลอดภัย พร้อม CSS responsive ขนาดเล็กสำหรับคัดลอก
วางแถวข้อมูลจากสเปรดชีตหรือ CSV หรือเริ่มจากแม่แบบรายการราคาบริการหรือเวลาเปิด คุณจะได้ตาราง HTML ที่ถูกต้อง พร้อมคำบรรยาย ช่องหัวตาราง และ scope attributes ที่โปรแกรมอ่านหน้าจอใช้ รวมทั้ง CSS สั้น ๆ ที่ทำให้อ่านง่ายบนโทรศัพท์ ระบบ escape ทุกค่า เพื่อไม่ให้ข้อความที่วางทำให้หน้าเว็บเสีย ทุกอย่างทำงานในเบราว์เซอร์ของคุณ ไม่มีการส่งสิ่งที่คุณพิมพ์ไปยัง We.Inc หรือบุคคลอื่น และข้อมูลจะหายไปเมื่อปิดแท็บ
- เลือกแม่แบบหรือวางแถวข้อมูลของคุณ ใช้จุลภาค แท็บ (จากสเปรดชีต) หรืออัฒภาคได้ และค่าที่ครอบด้วยอัญประกาศซึ่งมีจุลภาคข้างในจะอยู่ด้วยกัน
- เลือกว่าแถวแรกเป็นหัวคอลัมน์หรือไม่ และคอลัมน์แรกใช้กำกับแต่ละแถวหรือไม่ ระบบจะแปลงเป็นเซลล์ th พร้อม scope attributes
- เขียนคำบรรยายเพื่อระบุชื่อตารางให้ผู้ใช้โปรแกรมอ่านหน้าจอ และแสดงไว้เหนือตารางสำหรับทุกคน
- เลือกรูปแบบและดูตัวอย่างบนความกว้างเดสก์ท็อปกับโทรศัพท์ ตารางกว้างจะเลื่อนด้านข้างในกรอบของตัวเองบนจอเล็ก แทนการบีบให้แคบ
- คัดลอก HTML และ CSS หรือดาวน์โหลดรวมเป็นไฟล์เดียว
- ใช้ตารางเฉพาะกับข้อมูลที่มีแถวและคอลัมน์ เช่น ราคาและเวลาเปิด สำหรับการจัดวางหน้าให้ใช้ CSS
- เขียนหัวตารางให้สั้น เพราะจะถูกอ่านซ้ำทุกครั้งที่โปรแกรมอ่านหน้าจอประกาศข้อมูล
- ใส่หน่วยไว้ในหัวตาราง (ราคา, USD) แทนการใส่ซ้ำในทุกช่อง
- หลีกเลี่ยงการรวมเซลล์หากไม่จำเป็น เพราะผู้ใช้โปรแกรมอ่านหน้าจอติดตามได้ยาก
- ตรวจตารางที่ความกว้างหน้าจอโทรศัพท์ หากต้องเลื่อนด้านข้างเกินหนึ่งครั้ง ลองแยกตารางออก
คำถามที่พบบ่อย
อะไรทำให้ตาราง HTML เข้าถึงได้
มีคำบรรยายที่บอกชื่อตาราง เซลล์หัว th สำหรับหัวคอลัมน์และแถว และ scope attributes ที่ระบุว่าหัวข้อกำกับคอลัมน์หรือแถว โปรแกรมอ่านหน้าจอใช้ข้อมูลเหล่านี้เพื่อบอกว่าค่าแต่ละรายการอยู่ใต้หัวข้อใด เครื่องมือนี้เพิ่มให้ครบทั้งสามอย่าง
ทำไมไม่สร้างตารางจาก div
กริด div อาจดูเหมือนตาราง แต่เทคโนโลยีช่วยเหลือไม่ทราบว่าเซลล์ใดอยู่ใต้หัวข้อใด องค์ประกอบ table จริงให้ความหมายนี้มาในตัว
จัดการตาราง Responsive อย่างไร
วางตารางไว้ในกรอบที่เลื่อนด้านข้างบนหน้าจอแคบ กรอบนี้รับโฟกัสได้และมีป้ายชื่อจากคำบรรยาย ผู้ใช้แป้นพิมพ์จึงเลื่อนได้เช่นกัน
ระบบ escape ข้อมูลของฉันไหม
ใช่ เครื่องหมาย ampersand วงเล็บมุม และอัญประกาศในเซลล์จะแปลงเป็น HTML entities ดังนั้นหากเซลล์มี <script> ก็จะแสดงเป็นข้อความแทนการทำงาน
วางข้อมูลจาก Excel หรือ Google Sheets ได้เลยไหม
ได้ เซลล์ที่คัดลอกมาจะคั่นด้วยแท็บ ซึ่งเครื่องมือตรวจพบได้อัตโนมัติ
ใช้ฟรีไหม
ฟรี ไม่ต้องสมัครสมาชิก ใช้งานในเบราว์เซอร์ของคุณ
รายการราคาและเวลาเปิดควรเป็นตาราง
- เว็บไซต์ธุรกิจขนาดเล็กส่วนใหญ่มีตารางอย่างน้อยสองแบบ: ราคาสินค้าหรือบริการ และเวลาเปิด ทั้งคู่เป็นข้อมูลแบบตารางจริง จึงควรทำเครื่องหมายเป็นตาราง โดยผูกราคาแต่ละรายการกับบริการ และเวลาทำการแต่ละช่วงกับวัน
- แม่แบบที่นี่เริ่มต้นด้วยโครงสร้างสองแบบดังกล่าว เปลี่ยนแถวตัวอย่างเป็นข้อมูลของคุณก่อนเผยแพร่ เพราะเป็นเพียงตัวแทน ไม่ใช่ราคาจริง
เริ่มต้นฟรี · ไม่ต้องใช้บัตรเครดิต
Product
Who It's For
Features
Resources
Company
View Sitemap