Alisha  Larkin

Alisha Larkin

1626242280

Let Your HTML Make Sense Using Semantic Elements

Today, web development is in its golden age. The sites that are built are not only informative but also artistic. Ten years ago, no one could even dream about the things now we are able to do using our browsers. However, despite this magnificence, we have compromised on the significance of HTML.

DIV Is An Unlimited Power

Here is a fun fact: apart from barebone setup, you can build a fully functioning website just by using div and span elements. This is totally possible because using CSS, you can turn empty divs and spans into any visually attractive element. By default div and span has no semantic meaning and styling. They’re just boxes holding what you put inside. And I think this is what makes especially div to be used heavily on the recent websites. Unlike semantic HTML elements, it has no meaning. So, you don’t have to think about its place or order amongst others. All of them are equal and will look like however you want. Take a look at this example.

When you see the piece of HTML above, do you get anything about the content or layout at first glance? I know you don’t because what you’ve seen is just a bunch of nested div tags with classes.

To understand the markup, you looked at the classes and tried to visualize them. This is the exact case with browsers. Since there is no semantic meaning in the markup, browsers cannot understand the site and index it easily. That leads to bad SEO and some troubles with users having disabilities and who access the site using virtual screen readers. So, the accessibility of the site decreases dramatically.

The other issue that non-semantic markup causes is the development difficulty. Since we all are humans, we cannot read the written markup as computers do. Let’s assume that we want to add another section right under an existing section. We have to find the existing section, then find the end of the block and start adding the new section. If the markup is non-semantic and looks like something in the picture above, this will be pretty hard because each element is just a div and looks almost the same. In this scenario, finding the closing tag of the existing section is pretty hard if the section has many lines. Because we have to follow indentation without making a mistake.

Communicate With The Way You Write HTML

However, instead of writing endless lines of div elements, fortunately, you have a ton of options to choose one. There is output to show results or time to insert dates into markup.

#html #web-development #javascript #programming #html

What is GEEK

Buddha Community

Let Your HTML Make Sense Using Semantic Elements
Alisha  Larkin

Alisha Larkin

1626242280

Let Your HTML Make Sense Using Semantic Elements

Today, web development is in its golden age. The sites that are built are not only informative but also artistic. Ten years ago, no one could even dream about the things now we are able to do using our browsers. However, despite this magnificence, we have compromised on the significance of HTML.

DIV Is An Unlimited Power

Here is a fun fact: apart from barebone setup, you can build a fully functioning website just by using div and span elements. This is totally possible because using CSS, you can turn empty divs and spans into any visually attractive element. By default div and span has no semantic meaning and styling. They’re just boxes holding what you put inside. And I think this is what makes especially div to be used heavily on the recent websites. Unlike semantic HTML elements, it has no meaning. So, you don’t have to think about its place or order amongst others. All of them are equal and will look like however you want. Take a look at this example.

When you see the piece of HTML above, do you get anything about the content or layout at first glance? I know you don’t because what you’ve seen is just a bunch of nested div tags with classes.

To understand the markup, you looked at the classes and tried to visualize them. This is the exact case with browsers. Since there is no semantic meaning in the markup, browsers cannot understand the site and index it easily. That leads to bad SEO and some troubles with users having disabilities and who access the site using virtual screen readers. So, the accessibility of the site decreases dramatically.

The other issue that non-semantic markup causes is the development difficulty. Since we all are humans, we cannot read the written markup as computers do. Let’s assume that we want to add another section right under an existing section. We have to find the existing section, then find the end of the block and start adding the new section. If the markup is non-semantic and looks like something in the picture above, this will be pretty hard because each element is just a div and looks almost the same. In this scenario, finding the closing tag of the existing section is pretty hard if the section has many lines. Because we have to follow indentation without making a mistake.

Communicate With The Way You Write HTML

However, instead of writing endless lines of div elements, fortunately, you have a ton of options to choose one. There is output to show results or time to insert dates into markup.

#html #web-development #javascript #programming #html

Angela  Dickens

Angela Dickens

1596090180

Commonly Used HTML Tags with Examples

HTML tags are keywords used in HTML to display web-pages with certain properties. They are further used for defining HTML elements. An HTML element consists of a starting tag, some content, and an ending tag. The web browser reads the HTML document from top to bottom, left to right. Each HTML tag defines a new property that helps in rendering the website.

HTML Tags

HTML Tags

The ‘<>’ brackets contain an HTML tag. There are two types of HTML tags- empty tags or singleton tags and container tags. Singleton tags or empty tags do not contain any content such as an image or a paragraph and hence do not need to be closed, whereas container tags should be closed.

Syntax

  1. Some Content

Examples of:

Empty tag: 
,


,etc.

Container tags: 

Paragraph

Link

  1. <!DOCTYPE>
  2. Paragraph

  3. Heading

  4. Bold
  5. Italic
  6. Underline

Output-

HTML Tags example

Head tags:

,<style>,<script>,<link>,<meta> and <base>. <p>Text-formatting tags:</p> <p><h>,<b>,<strong>,<small>,<pre>,<i>,<em>,<sub>,<sup>,<ins>,<dfn>,<del>,<div> and <span>.</p> <p>Link tags:</p> <p><a>, <base>.</p> <p>List tags:</p> <ul>, <ol>, <li>, <dl>, <dd> <p>Table tags:</p> <table> ,<tr> , <td>, <th>, <thead>, <tbody>, <tfoot>. <p>Form tags:</p> <form>, <input>, <select>, <option>, <button>, <label>, <fieldset>, <textarea>. <p>Scripting tags:</p> <script>, <noscript> Image and Object tags: <img>, <figure>, <figcaption>, <area>, <map>, <object>. Here is an alphabetical list of tags used in HTML.

#html tutorials #html image tags #html link tags #html list tags #html tags #html

Ava Watson

Ava Watson

1595318322

Know Everything About HTML With HTML Experts

HTML stands for a hypertext markup language. For the designs to be displayed in web browser HTML is the markup language. Technologies like Cascading style sheets (CSS) and scripting languages such as JavaScript assist HTML. With the help of HTML websites and the web, designs are created. Html has a wide range of academic applications. HTML has a series of elements. HTML helps to display web content. Its elements tell the web how to display the contents.

The document component of HTML is known as an HTML element. HTML element helps in displaying the web pages. An HTML document is a mixture of text nodes and HTML elements.

Basics of HTML are-

The simple fundamental components oh HTML is

  1. Head- the setup information for the program and web pages is carried in the head
  2. Body- the actual substance that is to be shown on the web page is carried in the body
  3. HTML- information starts and ends with and labels.
  4. Comments- come up in between

Html versions timeline

  1. HTML was created in 1990. Html is a program that is updated regularly. the timeline for the HTML versions is
  2. HTML 2- November, 1995
  3. HTML 3- January, 1997
  4. HTML 4- December, 1997; April, 1998; December, 1999; May, 2000
  5. HTML 5- October, 2014; November, 2016; December, 2017

HTML draft version timelines are

  1. October 1991
  2. June 1992
  3. November 1992
  4. June 1993
  5. November 1993
  6. November 1994
  7. April 1995
  8. January 2008
  9. HTML 5-
    2011, last call
    2012 candidate recommendation
    2014 proposed recommendation and recommendation

HTML helps in creating web pages. In web pages, there are texts, pictures, colouring schemes, tables, and a variety of other things. HTML allows all these on a web page.
There are a lot of attributes in HTML. It may get difficult to memorize these attributes. HTML is a tricky concept. Sometimes it gets difficult to find a single mistake that doesn’t let the web page function properly.

Many minor things are to be kept in mind in HTML. To complete an HTML assignment, it is always advisable to seek help from online experts. These experts are well trained and acknowledged with the subject. They provide quality content within the prescribed deadline. With several positive reviews, the online expert help for HTML assignment is highly recommended.

#html assignment help #html assignment writing help #online html assignment writing help #html assignment help service online #what is html #about html

Syu Swiy

Syu Swiy

1643124624

List Useful list of Codes for HTML Symbols or Special Characters

List of useful lists of Codes for HTML Symbols or Special Characters - For those of you who have hobbies as blog writers or admins as well as website creators, you may be familiar with Codes for HTML Symbols or Characters, the combination of the code is written in the html script writing section and when run on a browser will display a certain symbol or character. Its function is to add symbols or special characters in existing posts on web pages or blogs. The way it works is that the symbols or special characters are converted into certain character combination codes, which will later be translated by the browser into certain symbols or characters. Read more in ☞ https://artinfo.my.id/en/translate/MTM0NE1LNA==/list-daftar-berguna-kode-untuk-simbol-atau-karakter-khusus-html

#html_code #symbols_or_special_characters_html #html_character_code #html_character #html_code_symbol #list_html_symbol_code_list

Alisha  Larkin

Alisha Larkin

1617789060

HTML Tutorial For Beginners

The prospect of learning HTML can seem confusing at first: where to begin, what to learn, the best ways to learn — it can be difficult to get started. In this article, we’ll explore the best ways for learning HTML to assist you on your programming journey.

What is HTML?

Hypertext Markup Language (HTML) is the standard markup language for documents meant to be displayed in a web browser. Along with Cascading Style Sheets (CSS) and JavaScript, HTML completes the trio of essential tools used in creating modern web documents.

HTML provides the structure of a webpage, from the header and footer sections to paragraphs of text, videos, and images. CSS allows you to set the visual properties of different HTML elements, like changing colors, setting the order of blocks on the screen, and defining which elements to display. JavaScript automates changes to HTML and CSS, for example, making the font larger in a paragraph when a user clicks a button on the page.

#html #html-css #html-fundamentals #learning-html #html-css-basics #html-templates