กลับไปหน้าบทความ

อ่าน 6 นาที

แท็บ (อินเทอร์เฟซ)

ในการออกแบบอินเทอร์เฟ ซ แท็บ เป็น วัตถุอินเทอร์เฟซผู้ใช้แบบกราฟิก ที่อนุญาตให้มี เอกสาร หรือ แผง หลายรายการอยู่ใน หน้าต่าง เดียว โดยใช้แท็บเป็น วิดเจ็ ต นำทาง...

แท็บ (อินเทอร์เฟซ)

ตัวอย่างของอินเทอร์เฟซแบบแท็บที่มีแท็บสองชุด: แท็บแนวนอนด้านบน ช่วยให้สามารถนำทางไปยังหน้าต่างๆ ภายในเว็บไซต์Wiktionary ได้ แท็บแนวตั้งทางด้านซ้าย แสดงถึงภาษาที่มีการสะกดคำนั้นๆ โดยแท็บที่เลือกจะแสดงคำว่าjam ('แล้ว') ในภาษาเอสเปรันโต

ในการออกแบบอินเทอร์เฟซ แท็บเป็นวัตถุอินเทอร์เฟซผู้ใช้แบบกราฟิกที่อนุญาตให้มีเอกสารหรือแผง หลายรายการอยู่ใน หน้าต่าง เดียว โดยใช้แท็บเป็น วิดเจ็ นำทาง สำหรับการสลับระหว่างชุดเอกสาร[ 1 ]เป็นรูปแบบอินเทอร์เฟซที่มักเกี่ยวข้องกับเว็บเบราว์เซอร์ แอปพลิเค ชันเว็บ โปรแกรมแก้ไขข้อความและแผงการตั้งค่า พร้อมด้วยตัวจัดการหน้าต่างและตัวจัดการหน้าต่างแบบเรียงต่อกัน

แท็บได้รับการออกแบบโดยเลียนแบบแท็บการ์ดแบบดั้งเดิมที่ใช้ในแฟ้มเอกสารหรือดัชนีการ์ด (เพื่อให้สอดคล้องกับแนวคิดการใช้งานบนเดสก์ท็อป ) โดยปกติแล้วจะแสดงผลในรูปแบบกราฟิกบนหน้าเว็บหรือแอปพลิเคชันเหมือนกับที่ปรากฏบนกระดาษ

แท็บอาจปรากฏในแถบแนวนอนหรือรายการแนวตั้ง แท็บแนวนอนอาจมีหลายแถว ในบางกรณี แท็บอาจถูกจัดลำดับใหม่หรือจัดระเบียบเป็นหลายแถวผ่านการลากและวาง การใช้งานอาจรองรับการเปิดแท็บที่มีอยู่แล้วในหน้าต่างแยกต่างหาก หรือการเลือกแท็บหลายแท็บเพื่อย้าย ปิด หรือแยกออกจากกัน[ 2 ]

ประวัติศาสตร์

โปรแกรมประมวลผลคำ WordVision [ 3 ]สำหรับIBM PCในปี พ.ศ. 2525 [ 4 ]อาจเป็นผลิตภัณฑ์เชิงพาณิชย์ตัวแรกที่มีอินเทอร์เฟซแบบแท็บ[ 4 ]

เบราว์เซอร์ HyperTIESและเครื่องมือเขียนเอกสาร Emacs ของ Gosling พร้อม เมนูวงกลมบนระบบหน้าต่างNeWS

Don Hopkinsได้พัฒนาและเผยแพร่เฟรมหน้าต่างแบบแท็บหลายเวอร์ชันสำหรับ ระบบหน้าต่าง NeWSในรูปแบบซอฟต์แวร์ฟรี ซึ่งตัวจัดการหน้าต่างจะนำไปใช้กับแอปพลิเคชัน NeWS ทั้งหมด และช่วยให้ผู้ใช้สามารถลากแท็บไปรอบๆ ขอบหน้าต่างได้[ 5 ]

โปรแกรมแก้ไขข้อความ Gosling Emacs เวอร์ชัน NeWS ของ UniPress เป็นผลิตภัณฑ์รุ่นแรกๆ อีกตัวหนึ่งที่ มีหน้าต่างแท็บหลายหน้าต่างในปี 1988 [ 6 ]มันถูกใช้เพื่อพัฒนาเครื่องมือสร้างเนื้อหาสำหรับเบราว์เซอร์ไฮเปอร์มีเดียHyperTIESของBen Shneiderman (เวอร์ชันเวิร์กสเตชัน NeWS ของ The Interactive Encyclopedia System) ในปี 1988 ที่ ห้องปฏิบัติการปฏิสัมพันธ์ระหว่างมนุษย์กับ คอมพิวเตอร์มหาวิทยาลัยแมริแลนด์[ 7 ] [ 8 ] HyperTIES ยังรองรับเมนูวงกลมสำหรับการจัดการหน้าต่างและการเรียกดูเอกสารไฮเปอร์มีเดียด้วยแอปเพล็PostScript

แม้ว่าBoeing Calcจะใช้แผ่นงานแบบแท็บ (ที่เรียกว่าแผ่นคำ ) มาตั้งแต่ปี 1987 เป็นอย่างน้อย[ 9 ] [ 10 ]แต่ Quattro ProของBorlandก็ทำให้การใช้แท็บในสเปรดชีตเป็นที่นิยมในปี 1992 Microsoft Wordในปี 1993 ก็ใช้แท็บเพื่อทำให้เมนูย่อยง่ายขึ้น[ 4 ]ในปี 1994 BookLink Technologiesได้นำเสนอหน้าต่างแบบแท็บใน เบราว์เซอร์ InternetWorks ของตน ในปีเดียวกันนั้น โปรแกรมแก้ไขข้อความUltraEditก็ปรากฏขึ้นพร้อมกับอินเทอร์เฟซแบบแท็บหลายแถวที่ทันสมัย แนวทางการใช้งานอินเทอร์เฟซแบบแท็บถูกนำมาใช้โดยNetCaptor ซึ่งเป็นเชลล์ของ Internet Explorerในปี 1997 ตามมาด้วยโปรแกรมอื่นๆ อีกหลายตัว เช่นIBrowseในปี 1999 และOperaในปี 2000 (โดยมีการเปิดตัวเวอร์ชัน 4 - แม้ว่าอินเทอร์เฟซ MDI จะได้รับการรองรับก่อนหน้านั้นแล้วก็ตาม) MultiViews ในเดือนตุลาคม 2000 ซึ่งเปลี่ยนชื่อเป็น MultiZilla ในวันที่ 1 เมษายน 2001 (ส่วนขยายสำหรับMozilla Application Suite [ 11 ] ) Galeonในช่วงต้นปี 2001, Mozilla 0.9.5 ในเดือนตุลาคม 2001, Phoenix 0.1 (ปัจจุบันคือMozilla Firefox ) ในเดือนตุลาคม 2002, Konqueror 3.1 ในเดือนมกราคม 2003 และSafariในปี 2003 เมื่อมีการเปิดตัวInternet Explorer 7ในปี 2006 เว็บเบราว์เซอร์หลักทั้งหมดก็มีอินเทอร์เฟซแบบแท็บ

ผู้ใช้ปรับตัวเข้ากับการใช้แท็บในการท่องเว็บและการค้นหาเว็บได้อย่างรวดเร็ว การศึกษาพฤติกรรมการท่องเว็บโดยใช้แท็บในเดือนมิถุนายน พ.ศ. 2552 พบว่าผู้ใช้สลับแท็บใน 57% ของเซสชันแท็บ และ 36% ของผู้ใช้ใช้แท็บใหม่เพื่อเปิด ผล การค้นหาของเครื่องมือค้นหาอย่างน้อยหนึ่งครั้งในช่วงเวลานั้น[ 12 ]

นับตั้งแต่นั้นมา ความสามารถเพิ่มเติมมากมายเกี่ยวกับแท็บในเบราว์เซอร์ก็ปรากฏขึ้น ตัวอย่างเช่น การเรียกดูแบบแท็บในOmniWebเวอร์ชัน 5 ซึ่งแสดงภาพตัวอย่างของหน้าเว็บในแถบด้านข้างทางซ้ายหรือขวาของหน้าต่างเบราว์เซอร์หลัก อีกคุณสมบัติหนึ่งคือความสามารถในการจัดเรียงลำดับแท็บใหม่ และการคั่นหน้าเว็บทั้งหมดที่เปิดอยู่ในบานหน้าต่างแท็บในหน้าต่างที่กำหนดไว้ในกลุ่มหรือโฟลเดอร์บุ๊กมาร์ก (รวมถึงความสามารถในการเปิดทั้งหมดพร้อมกัน) Microsoft Internet Explorerจะใช้สีที่แตกต่างกันในการกำหนดกลุ่มแท็บ

การพัฒนา

ลักษณะการทำงานของแท็บในแอปพลิเคชันนั้นถูกกำหนดโดยเฟรมเวิร์กของชุดเครื่องมือวิดเจ็ต พื้นฐาน (ตัวอย่างเช่น Firefox ใช้GTK ) เนื่องจากขาดมาตรฐาน การทำงานจึงอาจแตกต่างกันไปในแต่ละแอปพลิเคชัน ซึ่งอาจส่งผลให้เกิดปัญหาในการใช้งานได้

การสะสมแท็บ

แถบแท็บใน Chromium ของผู้ที่ชอบสะสมแท็บจำนวนมาก

การสะสมแท็บคือ การสะสม แท็บเบราว์เซอร์แบบดิจิทัล ผู้ใช้อาจสะสมแท็บไว้เพื่อเป็นเครื่องเตือนความจำสำหรับงานที่ต้องค้นคว้าหรือทำให้เสร็จ [ 13 ] (แทนที่จะใช้ซอฟต์แวร์เตือนความจำ โดยเฉพาะ ) พวกเขาอาจใช้หน้าต่างเบราว์เซอร์หลายหน้าต่างเพื่อจัดระเบียบแท็บหรือกำหนดจุดสนใจ[ 13 ]อย่างไรก็ตาม การเปิดหน้าต่างหลายหน้าต่างทิ้งไว้สามารถทำให้เกิดความรกของแท็บได้[ 14 ]

การเก็บแท็บไว้จำนวน มากอาจนำไปสู่ความเครียดและการรับข้อมูลมากเกินไป[ 14 ] ทำให้ เสีย สมาธิและลดประสิทธิภาพของคอมพิวเตอร์ นอกจากนี้ยังอาจพัฒนาไปสู่ความผูกพันทางอารมณ์กับชุดแท็บที่เปิดอยู่[ 15 ]รวมถึงความกลัวที่จะสูญเสียแท็บเหล่านั้นเมื่อเครื่องขัดข้องหรือรีบูต เครื่อง [ 13 ]และในทางกลับกันก็รู้สึกโล่งใจเมื่อแท็บถูกกู้คืนอย่างถูกต้อง[ 16 ] ผู้ที่สะสมแท็บ จำนวนมากมักระบุว่าพฤติกรรมนี้เกิดจากความวิตกกังวล [ 17 ]ความกลัวที่จะพลาดโอกาส [ 18 ] การผัดวันประกันพรุ่ง[ 19 ]และการจัดการข้อมูลส่วนบุคคล ที่ไม่ดี [ 20 ] [ 15 ]

ผู้ผลิตเบราว์เซอร์อย่างMozilla ตระหนักถึงปัญหาการกักตุนแท็บ และได้เป็นแรงบันดาลใจให้เกิดฟีเจอร์การจัดการหน่วยความจำ และแท็บในเบราว์เซอร์และ ส่วนขยาย [ 16 ] ฟีเจอร์ดังกล่าวรวมถึงการจัดกลุ่มแท็บ ซึ่งช่วยให้แท็บที่เกี่ยวข้องสามารถจัดระเบียบ และยุบแท็บได้ [ 21 ]การแปลงแท็บเป็นรายการไฮเปอร์ลิงก์[ 20 ]และ รูปแบบ อินเทอร์เฟซ ทางเลือก เช่น การจัดกรอบงาน ระดับสูง เป็นวัตถุระดับแรกแทนที่จะเป็นแท็บ[ 22 ] [ 15 ]การศึกษาในปี 2021 ได้พัฒนา ข้อควรพิจารณาใน การออกแบบ UIซึ่งอาจช่วยให้มีเครื่องมือที่ดีขึ้นและการเปลี่ยนแปลงโค้ดของเว็บเบราว์เซอร์ที่ช่วยให้ผู้ทำงานด้านความรู้และผู้ใช้รายอื่นสามารถจัดการและใช้แท็บเบราว์เซอร์ของตนได้ดียิ่งขึ้น[ 15 ] [ 23 ]

การนำไปใช้

เฟรมเวิ ร์ก CSSที่มีแท็บ ได้แก่Bootstrap [ 24 ] Tailwind CSS [ 25 ]และFoundation [ 26 ]

ชุดเครื่องมือวิดเจ็ตที่มีแท็บ ได้แก่GTKที่ใช้ วิดเจ็ต Notebook [ 27 ]รวมถึงไลบรารี Adwaita ที่ใช้วิดเจ็ตTabBar [ 28 ] และ Qtที่ใช้วิดเจ็ตQTabWidget [ 29 ]

ดูเพิ่มเติม

  • วิดเจ็ตแท็บพาเนล
  • ชุดเครื่องมือควบคุม AJAX สำหรับ ASP.NET
  • แท็บ AJAX ของ Scriptaculous ถูกเก็บถาวรเมื่อวันที่ 22 มีนาคม 2010 ที่Wayback Machine
  • Tab Window Demo deDevelopmentmo of the Pie Menu Tab Window Manager for The NeWS Toolkit 2.0 (1991).
ดึงข้อมูลมาจาก " https://en.wikipedia.org/w/index.php?title=Tab_(interface)&oldid=1342770363 "

สรุปเนื้อหา

ข้อมูลสำคัญจากบทความ

ข้อมูลสำคัญเกี่ยวกับ แท็บ (อินเทอร์เฟซ)

ในการออกแบบอินเทอร์เฟ ซ แท็บ เป็น วัตถุอินเทอร์เฟซผู้ใช้แบบกราฟิก ที่อนุญาตให้มี เอกสาร หรือ แผง หลายรายการอยู่ใน หน้าต่าง เดียว โดยใช้แท็บเป็น วิดเจ็ ต นำทาง...

ประวัติศาสตร์

โปรแกรมประมวลผลคำ WordVision [ 3 ] สำหรับ IBM PC ในปี พ.ศ. 2525 [ 4 ] อาจเป็นผลิตภัณฑ์เชิงพาณิชย์ตัวแรกที่มีอินเทอร์เฟซแบบแท็บ [ 4 ]

การพัฒนา

ลักษณะการทำงานของแท็บในแอปพลิเคชันนั้นถูกกำหนดโดย เฟรมเวิร์กของชุดเครื่องมือวิดเจ็ต พื้นฐาน (ตัวอย่างเช่น Firefox ใช้ GTK ) เนื่องจากขาดมาตรฐาน การทำงานจึงอาจแตกต่างกันไปในแต่ละแอปพลิเคชัน ซึ่งอาจส่งผลให้เกิดปัญหาในการใช้งานได้

การสะสมแท็บ

การสะสมแท็บ คือ การสะสม แท็บเบราว์เซอร์ แบบดิจิทัล ผู้ใช้อาจสะสมแท็บไว้เพื่อเป็นเครื่องเตือนความจำสำหรับงานที่ต้องค้นคว้าหรือทำให้เสร็จ [ 13 ] (แทนที่จะใช้ ซอฟต์แวร์เตือนความจำ โดยเฉพาะ )...