Jump to content
Please Use CODE Tags

New to HTML coding

GeorgeKellow
By GeorgeKellow
in Programming
 Share
Posted

I am on a college course and we have started to learn HTML 'semantic elements'

 

Have you got any basic information for me? Complete beginner 

Link to comment
Share on other sites
Link to post
Share on other sites
Posted

You start an HTML document with <html>, end it with </html>. Inside of the <html>, is the entire document. Inside of that you have the <head> (which you end with </head>) which houses extra scripts and other settings and inside the <html> you also have the <body> (which you also end with </body>) which houses all the stuff on the page itself.

HTML is all about just thinking logically, when should what be ended, etc.

 

Semantic elements is just like the lessons on what all the tags mean right? That's pretty simple stuff. If you have any more specific questions, I'm open to answer them.

"We're all in this together, might as well be friends" Tom, Toonami.

 

mini eLiXiVy: my open source 65% mechanical PCB, a build log, PCB anatomy and discussing open source licenses: https://linustechtips.com/topic/1366493-elixivy-a-65-mechanical-keyboard-build-log-pcb-anatomy-and-how-i-open-sourced-this-project/

 

mini_cardboard: a 4% keyboard build log and how keyboards work: https://linustechtips.com/topic/1328547-mini_cardboard-a-4-keyboard-build-log-and-how-keyboards-work/

Link to comment
Share on other sites
Link to post
Share on other sites
Posted
  • Author
Just now, Minibois said:

You start an HTML document with <html>, end it with </html>. Inside of the <html>, is the entire document. Inside of that you have the <head> (which you end with </head>) which houses extra scripts and other settings and inside the <html> you also have the <body> (which you also end with </body>) which houses all the stuff on the page itself.

HTML is all about just thinking logically, when should what be ended, etc.

 

Semantic elements is just like the lessons on what all the tags mean right? That's pretty simple stuff. If you have any more specific questions, I'm open to answer them.

I probably will need help. I find it enjoyable to learn but difficult to understand. Thanks for taking time to answer (And to continue to answer my questions 

Link to comment
Share on other sites
Link to post
Share on other sites
Posted
25 minutes ago, GeorgeKellow said:

I probably will need help. I find it enjoyable to learn but difficult to understand. Thanks for taking time to answer (And to continue to answer my questions 

Use this:

 

http://www.w3schools.com/

CPU: AMD Ryzen 5 5600X | CPU Cooler: Stock AMD Cooler | Motherboard: Asus ROG STRIX B550-F GAMING (WI-FI) | RAM: Corsair Vengeance LPX 16 GB (2 x 8 GB) DDR4-3000 CL16 | GPU: Nvidia GTX 1060 6GB Zotac Mini | Case: K280 Case | PSU: Cooler Master B600 Power supply | SSD: 1TB  | HDDs: 1x 250GB & 1x 1TB WD Blue | Monitors: 24" Acer S240HLBID + 24" Samsung  | OS: Win 10 Pro

 

Audio: Behringer Q802USB Xenyx 8 Input Mixer |  U-PHORIA UMC204HD | Behringer XM8500 Dynamic Cardioid Vocal Microphone | Sound Blaster Audigy Fx PCI-E card.

 

Home Lab:  Lenovo ThinkCenter M82 ESXi 6.7 | Lenovo M93 Tiny Exchange 2019 | TP-LINK TL-SG1024D 24-Port Gigabit | Cisco ASA 5506 firewall  | Cisco Catalyst 3750 Gigabit Switch | Cisco 2960C-LL | HP MicroServer G8 NAS | Custom built SCCM Server.

 

 

Link to comment
Share on other sites
Link to post
Share on other sites
Posted

HTML is actually pretty easy to learn. 

As you probably know HTML stands for Hypertext Markup Language. It's a XML based doctype, commonly used for websites. 

The most elements in HTML are used like <element>Content</element> so every element starts with<elem> and closes with </elem> and everything between those "tags" is a child of this element. In this example, the "Content" is a child of the <element>-element. 

There are also self-closing tags, like the img. The img is used for embedding an image to your site since a image can't get any child elements, the img tag is self-closing and written like <img attrs />. To get an actual image to your site you need to define at least one attribute, the src. This attribute tells the browser where the image can be downloaded. This is a working example of a simple HTML page. ( The text between <!---- text--> is a comment, it's not used by the browser rendering and used for better understanding what is going on) 

<!--- 
This tells the browser which html version you are using, the html is the simplified html5 doctype and the newest standart
-->
<!DOCTYPE html>
<!---
The html element wraps all elements. You can think of it as your "page"
-->
<html>
  <!---
  The head contains some pagedata, you can link stylesheets for html styling or javascript for interaction.
  You can also use <meta> tags for character encoding etc.
  HEAD is a unique element inside html
  -->
  <head>
    <!---
    The title is a child of HEAD. You can use it to show the title of your website in the tab
    and tell for example google what your site is all about
    -->
    <title>This is the title displayed in the browsers tab</title>
  <!--- 
  This is the closing head element
  -->
  </head>
  <!-- 
  This is the body, you can think of it as the visible part of your website.
  -->
  <body>
    <!-- This is an image element used as I explained in the forum -->
    <img src="https://placehold.it/300x300&text=Awesome" />
    
    <!-- 
    This is a paragraph, it contains text and creates a new line as soon as you </p>close it 
    -->
    <p>This is a paragraph, html does not care about
    
    
    
    line breakings in your <br><br> code</p>
  </body>
</html>

I hope it was helpful for you

 

Link to comment
Share on other sites
Link to post
Share on other sites
Posted
On 21.9.2016 at 5:44 PM, MoVo said:

HTML is actually pretty easy to learn. 

As you probably know HTML stands for Hypertext Markup Language. It's a XML based doctype, commonly used for websites. 

The most elements in HTML are used like <element>Content</element> so every element starts with<elem> and closes with </elem> and everything between those "tags" is a child of this element. In this example, the "Content" is a child of the <element>-element. 

There are also self-closing tags, like the img. The img is used for embedding an image to your site since a image can't get any child elements, the img tag is self-closing and written like <img attrs />. To get an actual image to your site you need to define at least one attribute, the src. This attribute tells the browser where the image can be downloaded. This is a working example of a simple HTML page. ( The text between <!---- text--> is a comment, it's not used by the browser rendering and used for better understanding what is going on) 


<!--- 
This tells the browser which html version you are using, the html is the simplified html5 doctype and the newest standart
-->
<!DOCTYPE html>
<!---
The html element wraps all elements. You can think of it as your "page"
-->
<html>
  <!---
  The head contains some pagedata, you can link stylesheets for html styling or javascript for interaction.
  You can also use <meta> tags for character encoding etc.
  HEAD is a unique element inside html
  -->
  <head>
    <!---
    The title is a child of HEAD. You can use it to show the title of your website in the tab
    and tell for example google what your site is all about
    -->
    <title>This is the title displayed in the browsers tab</title>
  <!--- 
  This is the closing head element
  -->
  </head>
  <!-- 
  This is the body, you can think of it as the visible part of your website.
  -->
  <body>
    <!-- This is an image element used as I explained in the forum -->
    <img src="https://placehold.it/300x300&text=Awesome" />
    
    <!-- 
    This is a paragraph, it contains text and creates a new line as soon as you </p>close it 
    -->
    <p>This is a paragraph, html does not care about
    
    
    
    line breakings in your <br><br> code</p>
  </body>
</html>

I hope it was helpful for you

 

Please god, do not load Js in before the body, load ALL js (especially frameworks) in the footer so you dont slow down the page load by a slow cdn or complex js

Link to comment
Share on other sites
Link to post
Share on other sites
Posted
On 9/21/2016 at 11:56 AM, Minibois said:

You start an HTML document with <html>, end it with </html>. Inside of the <html>, is the entire document. Inside of that you have the <head> (which you end with </head>) which houses extra scripts and other settings and inside the <html> you also have the <body> (which you also end with </body>) which houses all the stuff on the page itself.

HTML is all about just thinking logically, when should what be ended, etc.

 

Semantic elements is just like the lessons on what all the tags mean right? That's pretty simple stuff. If you have any more specific questions, I'm open to answer them.

Depends, if your using html than its that, if your using html5 its different

 

Honestly OP if your looking to code very fast, i HIGHLY suggest getting something like Sublime Text 3 and installing Emmet as it is MUCH easier

Link to comment
Share on other sites
Link to post
Share on other sites
Posted
3 hours ago, probE466 said:

Please god, do not load Js in before the body, load ALL js (especially frameworks) in the footer so you dont slow down the page load by a slow cdn or complex js

 

what about bootstrap, angularJS and the like? They need to loads before the page in order to function.

                     ¸„»°'´¸„»°'´ Vorticalbox `'°«„¸`'°«„¸
`'°«„¸¸„»°'´¸„»°'´`'°«„¸Scientia Potentia est  ¸„»°'´`'°«„¸`'°«„¸¸„»°'´

Link to comment
Share on other sites
Link to post
Share on other sites
Posted
1 hour ago, vorticalbox said:

what about bootstrap, angularJS and the like? They need to loads before the page in order to function.

no clue about angular, but im fairly certain bootstrap is loaded in the footer

Link to comment
Share on other sites
Link to post
Share on other sites
Posted

If your website requires multi-kilobyte javascripts to function, you're doing it wrong.

Write in C.

Link to comment
Share on other sites
Link to post
Share on other sites
Posted
14 hours ago, probE466 said:

no clue about angular, but im fairly certain bootstrap is loaded in the footer

the angular framework is loaded in the header but your controllers are loaded in the footer.

                     ¸„»°'´¸„»°'´ Vorticalbox `'°«„¸`'°«„¸
`'°«„¸¸„»°'´¸„»°'´`'°«„¸Scientia Potentia est  ¸„»°'´`'°«„¸`'°«„¸¸„»°'´

Link to comment
Share on other sites
Link to post
Share on other sites
Posted
20 hours ago, probE466 said:

Please god, do not load Js in before the body, load ALL js (especially frameworks) in the footer so you dont slow down the page load by a slow cdn or complex js

yes, it was a failure of myself, usually, you're loading libraries like jQuery Bootstrap etc. before the closing body. But for single page frameworks like angular, it makes sense to load them in the head. 

Link to comment
Share on other sites
Link to post
Share on other sites
Posted

An extremely useful site for learning any coding language (including HTML) is http://codecademy.com. They do have a paid option but I use the free option and I think its fine.

*mildly autistic*

CPU: Intel Core i7-5820K @ 4.2 GHz | Motherboard: x99 Rampage | RAM: 16GB DDR4 | GPU: Nvidia 980 Ti | SSD: Looking for one |

Link to comment
Share on other sites
Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share
Go to topic listing Programming

×