Web Development basics with HTML,CSS, Js

 What is html ?
• HTML (Hypertext Markup Language) is the standard language to create and design
webpages . It structures the content on the web (text, images, links, etc.) using tags.

TABLE OF CONTENT
 DOM manipulation
 Semantic elements
 Embedding external content
 Meta tags and SEO
 Accessibility

1. DOM MANIPULTATION
 DOM manipulation is the process of using JavaScript or other languages to
change, add, or remove elements from a website's Document Object Mode.
 The Document Object Model (DOM) is an application programming interface
(API) for HTML and XML documents. It defines the logical structure of documents
and the way a document is accessed and manipulated.

2. SEMANTIC ELEMENTS
What Are Semantic Elements?
 Semantic elements clearly define their content's purpose and structure.
 Examples include <header>, <footer>, <main>, <article>, <nav>, and <section>.
 These elements improve SEO, accessibility, and make code easier to read and maintain.
 tags that describe the structure and meaning of web content in a way that's
both human
and machine-readable

3. EMBEDDING EXTERNAL CONTENT
 What is Embedding External Content in HTML?
 Embedding external content means displaying content from another source (like a video, map, or social
media post) within your web page. It allows you to enrich your website with interactive or dynamic
elements without hosting or creating them yourself.
 Examples of Embedded External Content
 Common examples include:
• Videos (YouTube,Vimeo)
• Maps (Google Maps)
• Social media posts (Tweets, Instagram posts)
• PDFs or documents
• iFrames for websites or applications

4. META TAGS AND SEO
 What Are Meta Tags in HTML?
 Meta tags are HTML elements that provide metadata (information about the webpage) to search engines
and web browsers.They help improve SEO (Search Engine Optimization) and define how the website is
displayed in search results or social media.
 purpose of Meta Tags
 Provide information about the page (author, description, keywords, etc.).
 Improve visibility in search engines.
 Help control how content is displayed when shared on social media.
 Define how the browser should render the page (e.g., viewport settings).
 search engine optimization (SEO) is the practice of orienting your website to rank higher on a search
engine results page (SERP) so that you receive more traffic. The aim is typically to rank on the first page
of Google results for search terms that mean the most to your target audience.

5. ACCESSIBILITY IN SEO
 What is Accessibility in SEO?
 Accessibility in web development ensures that websites are usable by people of all abilities, including
those with disabilities. Accessible websites also contribute to better SEO (Search Engine
Optimization) because search engines, like users, rely on clear, structured, and descriptive content to
understand web pages.
• Key Accessibility Features for SEO
• Alt Text for Images
• Semantic HTML (e.g., <header>, <main>, <article>)
• Keyboard Navigation Support
• ARIA (Accessible Rich Internet Applications) Attributes
• Readable Fonts and Contrasts
• Proper use of headings (<h1> to <h6>)

Web Development basics with HTML,CSS, Js

More Related Content

Similar to Web Development basics with HTML,CSS, Js (20)

Recently uploaded (20)

Web Development basics with HTML,CSS, Js