Accessibility
HTML Accessibility Always write HTML code with accessibility in mind! Provide the user a good way to navigate and interact with your site. Make your HTML code as semantic as possible Semantic HTML Semantic HTML means using correct HTML elements for their correct purpose as much as possible. Semantic elements are elements with a meaning; if you need […]
SEO Basics in HTML
HTML <meta> Tag Definition and Usage The <meta> tag defines metadata about an HTML document. Metadata is data (information) about data. <meta> tags always go inside the <head> element, and are typically used to specify character set, page description, keywords, author of the document, and viewport settings. Metadata will not be displayed on the page, but is machine parsable. Metadata […]
HTML Entities
HTML Entities Reserved characters in HTML must be replaced with entities: < (less than) = < > (greater than) = > HTML Character Entities Some characters are reserved in HTML. If you use the less than (<) or greater than (>) signs in your HTML text, the browser might mix them with tags. Entity names or entity numbers […]
HTML5 APIs
HTML Geolocation API Using HTML Geolocation API The Geolocation API is accessed via a call to navigator.geolocation. This will cause the browser to ask the user for permission to access their location data. If the user accept, the browser will search for the best available functionality on the device to access this information (for example GPS). The getCurrentPosition() method […]
Forms
The HTML <form> Elements The HTML <form> element can contain one or more of the following form elements: Go to Forms (Core Concept) <input> <label> <textarea> <button> → View Forms Core Concepts (input, label, textarea, button) Details of the following tags are on this page. For details of the above tags, go to Form(core concept). <select> […]
Iframes & Embeds
HTML<iframe> Tag Playing a YouTube Video in HTML To play your video on a web page, do the following: Upload the video to YouTube Take a note of the video id Define an <iframe> element in your web page Let the src attribute point to the video URL Use the width and height attributes to specify the dimension of the player Add any […]
Block vs Inline Elements
HTML Block and Inline Elements Block-level Elements A block-level element always starts on a new line, and the browsers automatically add some space (a margin) before and after the element. A block-level element always takes up the full width available (stretches out to the left and right as far as it can). Two commonly used block […]
HTML Attributes
HTML id Attribute The id Attribute The id attribute specifies a unique id for an HTML element. The value of the id attribute must be unique within the HTML document. The id attribute is used to point to a specific style declaration in a style sheet. It is also used by JavaScript to access and manipulate the element with the specific id. […]
Multimedia
What is Multimedia? Multimedia comes in many different formats. It can be almost anything you can hear or see, like images, music, sound, videos, records, films, animations, and more. Web pages often contain multimedia elements of different types and formats. Common Video Formats There are many video formats out there. The MP4, WebM, and […]
Semantic HTML
HTML <header> Tag Definition and Usage The <header> element represents a container for introductory content or a set of navigational links. A <header> element typically contains: one or more heading elements (<h1> – <h6>) logo or icon authorship information Example
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
<!DOCTYPE html> <html> <body> <article> <header> <h3>A heading here</h3> <p>Posted by John Doe</p> <p>Some additional information here</p> </header> <p>Lorem Ipsum dolor set amet....</p> </article> </body> </html> |
Result A heading here Posted by John Doe Some additional information here Lorem Ipsum dolor set amet. CSS Navigation […]