เพื่อเปิด link (a href) ใน browser window ใหม่ คุณต้องเพิ่ม attribute อีกหนึ่งตัวใน HTML anchor element (<a>) นั่นคือ target attribute เหมือนกับ href attribute ที่ต้องการ link path value (URL) target attribute ต้องการค่าเฉพาะเพื่อกระตุ้น browser ให้เปิด tab ใหม่เมื่อคลิก link ค่านั้นคือ _blank

ใน HTML documents คุณสามารถเขียน comments ที่ไม่ถูก interpret โดย web browser วัตถุประสงค์ของ comments ใน HTML files คือ เพื่อ document (อธิบาย) โค้ดสั้นๆ ไม่ว่าจะสำหรับตัวเองหรือสมาชิกในทีม เพื่อเพิ่ม comment ใน HTML document เราใช้ opening และ closing comment tags: <!-- --> พร้อมข้อความภายใน

Link และ URL ต่างกันอย่างไร และมันสำคัญไหม? ความแตกต่างระหว่าง link และ URL ไม่สำคัญหากคุณแค่พูดคุยกันอย่าง casual เกี่ยวกับ direct path ไปยังเนื้อหาบน web page เช่นแชร์บทความดีๆ ให้เพื่อน จากมุมมอง high-level (non-technical) link หมายถึง clickable user interface ที่นำคุณไปยัง specific location loca

เรียนรู้ความแตกต่างระหว่าง Follow และ No Follow links ใน SEO ถ้าคุณใหม่กับ SEO อาจสับสนเกี่ยวกับความแตกต่างระหว่าง follow และ no follow links และว่าสำคัญไหมที่ต้องระบุ type ของ links ที่ใช้บนเว็บไซต์ สรุปสั้นๆ Google และ Search Engines อื่นๆ ใส่ใจสิ่งที่เกิดขึ้นบนเว็บไซต์ของคุณ โดยเฉพาะ link spammin

เรียนรู้ว่าทำไมควรใช้ H1 elements/tags เพียงครั้งเดียวต่อหน้า เพื่อ SEO ที่เหมาะสมที่สุด หนึ่งในสิ่งแรกที่ web developer หรือ designer เรียนรู้คือ 6 ระดับของ HTML5 heading elements จาก H1 ถึง H6 ในฐานะ beginner คุณถูกบอกว่า H1 เป็น element สำคัญที่สุด และควรใช้สำหรับ main titles, headlines — สิ่งสำค

เรียนรู้ Floating Labels คืออะไร ใช้ใน form design ยังไง และทำไมจึงกลายเป็น asset ยอดนิยมใน UI/UX Design Floating Label คืออะไร? นี่คือ Floating Label: เพียงดูภาพประกอบข้างต้น บางคนอาจเข้าใจทันทีว่าทำไม Floating Labels ถึงเป็น UI asset ที่ยอดเยี่ยม แต่ถ้าคุณใหม่กับ concept Floating Labels นี่คือเหต

ฉันมักเห็น UX designers เตือนว่าไม่ควรใช้ placeholder text เป็น input field labels และมีเหตุผลที่ดี ลองพิมพ์ใน input field ด้านล่างดูสิ: Placeholder text จะหายทันทีที่คุณเริ่มพิมพ์ ทำไมถึงเป็นปัญหา? เพราะใน form ที่ใหญ่กว่า form login อีเมลและรหัสผ่านทั่วไป ผู้ใช้ ง่ายมาก ที่จะสับสนว่าพวกเขากรอก for

Strikethrough ใช้กับเนื้อหาที่ไม่ถือว่า relevant แล้ว เช่น price tag เดิมของสินค้าที่ลดราคา: Discounted Product Intel, 2TB SSD Drive $249 $99 ใน HTML4 ที่ deprecated แล้ว เราใช้ tag <strike> สำหรับเนื้อหาที่ไม่ relevant ใน HTML5 สมัยใหม่ เราใช้ tag <s> แทน ซึ่งสั้นกว่า Strikethrough ในตั

เรียนรู้วิธีเปลี่ยนค่า HTML Element Attribute ด้วย JavaScript สมมติคุณมี Anchor Element บนเว็บไซต์ ที่มี URL Link Path ผิดในแอตทริบิวต์ href สถานที่พบบ่อยคือ Menu/Navigation Bar: สถานที่ทั่วไปอีกแห่งคือ Footer ล่างเว็บไซต์ สมมติมีข้อผิดพลาด href เป็น /contact-me แต่ควรเป็น /contact-us และไม่สามารถแ

เรียนรู้วิธีสร้างและเพิ่ม HTML Attribute ด้วย JavaScript สมมติคุณมีปุ่มบนเว็บไซต์ ควร Execute Function เมื่อคลิก แต่ใครบางคนลืมเพิ่ม ID หรือ Class ให้ปุ่ม และคุณไม่มี Access HTML Markup โดยตรงตอนนี้ โชคดี สร้าง Attribute และผูกกับ Button Element ได้ด้วย JavaScript ต้องทำ 3 สิ่ง: สร้าง Attribute ประ

เรียนรู้ความแตกต่างระหว่าง HTML, CSS, และ JavaScript เริ่มเรียน Web Development โดยเฉพาะ Front-end HTML, CSS, และ JavaScript ถือเป็น 3 องค์ประกอบพื้นฐานที่สำคัญที่สุดของ Skill Stack HTML, CSS, และ JavaScript เป็นส่วนของ Ecosystem Web Development เดียวกัน และต้องทำงานร่วมกันเพื่อเพิ่มศักยภาพเว็บสมัยใ

คุณมักได้ยิน Developer พูดถึง Static vs Dynamic Websites แต่นี่หมายถึงอะไรพอดี? มาหาหลักกัน! Pure Static Site หมายถึงเว็บไซต์ที่เขียนด้วย HTML, CSS และ JavaScript แบบธรรมดา (โดยปกติ) ไม่มี Server-side Scripting Languages เช่น PHP, Python, หรือ Node.js Static Sites ไม่มี Backend แบบดั้งเดิม ต่างจาก D

มีความคิดหลายอย่างเกี่ยวกับการจัดสไตล์ Anchor Links ด้าน Design วันนี้โฟกัสที่สำคัญกว่า: การตั้งชื่อ Anchor Text และเหตุผล เว็บไซต์จำนวนมากทำผิด ผมก็ผิดเหมือนกัน เพื่อสร้างลิงก์ที่คลิกได้ เราห่อ Link Path ด้วย Anchor Tag HTML: <a></a> Anchor Tags มี Attribute หลายอย่าง: URL (Link Path) C

วันนี้เรียนรู้การสร้างลิงก์อีเมลที่คลิกได้ด้วย HTML ทักษะมีค่าที่ลืมง่าย จริงไหม? สร้าง Email Link ด้วย HTML? ปี 1998 ล่ะ? ไม่คิดว่าเป็นแบบนั้น แต่มันจริง Mail Links เรียบง่ายมากในรูปแบบพื้นฐาน จนลืมวิธีเขียนง่ายๆ (Guilty!) แม้ Developer ที่มีประสบการณ์ Mailto Link คืออะไร? นี่คือ Mailto Link คลิกแล

หากใช้ Viewport Meta Settings ทั่วไป การคลิก Input Element จะ Trigger Auto Zoom บน iOS อัตโนมัติ อย่างน้อยบน Smartphone ทดสอบบน iPhone 4, 5, 6 ด้วย Safari และ Chrome เหมือนกันทุก iOS โค้ด HTML นี้ทำให้ Auto Zoom เกิดขึ้น: แต่ Auto Zoom ไม่ได้เหมาะสมเสมอไป บางครั้งทำให้ Usability แย่ลง ขึ้นกับบริบท

ผมทำงานบน App Training Logger เป็น Side-project 6 เดือนที่ผ่านมา ตามคาด ต้องการ Numeric Inputs เวลาใช้ Autocomplete ใน Code Editor ค่า Default ของ Input Element คือ Text: HTML Input Element ที่ Type เป็น Number รับเฉพาะตัวเลข ลองพิมพ์ตัวอักษรในช่องนี้: ไม่ได้ HTML Input Element Type Text รับทั้งตัว

ในบทเรียน 초단기 นี้ คุณจะเรียนรู้วิธีแสดงข้อความอธิบายสั้นๆ (Like a Tooltip) เมื่อผู้ใช้ Hover บน Element เช่น รูปภาพหรือลิงก์ วิธีเพิ่ม Tooltip ใช้ไม่กี่วินาที แค่ใช้ HTML Title Attribute: title แสดงข้อความเมื่อ Hover (Mouse Over Element) ตัวอย่างพื้นฐานรูปภาพ Rubiks Cube เลื่อนเมาส์ไปที่รูป ภายในไม่

วันนี้จะสอนฝังวิดีโอ MP4 ใน HTML ด้วย Element <video> ครอบคลุม: ปรับขนาด Video Player Autoplay วิดีโอ Loop วิดีโอแบบไม่มีที่สิ้นสุด บทความส่วนใหญ่ใช้ GIF สำหรับวิดีโอสั้น ผมพบว่า MP4 คุณภาพดีกว่า และขนาดเล็กกว่า MP4 ทำงานในเบราว์เซอร์สมัยใหม่ทุกตัว และอัปโหลดไป YouTube ได้ ฝังวิดีโอด้วย HTML

เรียนรู้ความแตกต่างระหว่าง HTML Tags และ HTML Elements Developer หลายคนใช้คำว่า HTML Tags และ HTML Elements สลับกัน แต่มันเหมือนกันไหม? ไม่ใช่ Tags ใช้กำหนด HTML Elements โดยการมาร์ก (ห่อ) เนื้อหาด้วย Tag Name เปิดและปิดที่ตรงกับประเภทเนื้อหา เช่น <p>Content</p> HTML Element คือผลลัพธ์ขอ

HTML บางครั้งเรียกว่า HTML5 แต่มันเหมือนกันไหม? ใช่และไม่ใช่ HTML (Hypertext Markup Language) เป็นภาษามาตรฐานสร้างเว็บไซต์ เปิดตัวช่วงต้นทศวรรษ 1990 HTML Version 1 เปิดตัว 1993 HTML 2 ปี 1995 HTML 3 มกราคม 1997 HTML 4 ธันวาคม 1997 17+ ปีถัดมา HTML4 เป็นมาตรฐาน จนถึง ตุลาคม 2014 HTML5 เปิดตัว และกล