Welcome, Guest: Register On Nairaland / LOGIN! / Trending / Recent / New
Stats: 3,153,133 members, 7,818,403 topics. Date: Sunday, 05 May 2024 at 02:35 PM

Learn HTML5,CSS3, Javascript And Php On Nairaland. - Webmasters - Nairaland

Nairaland Forum / Science/Technology / Webmasters / Learn HTML5,CSS3, Javascript And Php On Nairaland. (638 Views)

Start learning Website development(HTML5,CSS3,JavaScript and PHP) on Nairaland. / Learn HTML5 Semantics Element Now! / Angular, Node And PHP Developer Wanted- Remuneration Up To ₦250,000 Monthly (2) (3) (4)

(1) (Reply)

Learn HTML5,CSS3, Javascript And Php On Nairaland. by Lovecoding: 10:53pm On May 03, 2017
HTML5,CSS3, JavaScript and Php are web development Ianguages. Tutorials on the aforementioned languages will be provided on this thread. I will begin with HTML5.
You can join the whatsapp group for this thread via this link https:///LqtMX2zrbYi62xUjJkjpIK. You can also drop your contact to get added to the group.
HTML is an acronym for HyperText Markup Language (HTML). The language was created by a physicist named Tim Berners-Lee in 1989. He was working at European center for Nuclear research also known as CERN when he created the language. He is the founder and director of Worldwide web consortium(W3c). He used HTML to create the web.
The major uses of HTML is for creating web pages and applications. Different versions of HTML has been released and the latest version is HTML 5.1 but there is still ongoing work on it thus encouraging developers to use the previous version (HTML 5.0) more frequently. HTML is maintained and regulated by the W3c. Below is the list of all HTML versions and their creation dates.
HTML 2.0- November 24, 1995.
HTML 3.2- January 14, 1997.
HTML 4.0- December 18, 1997.
HTML 4.01- December 24, 1999.
HTML 5.0 - October 28, 2014.
HTML 5.1- November 1, 2016.
What is HTML
The full meaning of HTML is HyperText Markup Language. HyperText means a text that can be read and understood by a machine. Markup means to layout a text in a specific or definite format.
It is a language of the web. The primary purpose of creating HTML is to create structure web pages and also create web applications.
HTML is called a Markup Language because it is a language for processing, presentation, structuring, organizing and improving/adjusting text and link text. The HTML tutorial that will be provided on this thread is based on HTML5 which is the stable and most used version of HTML
Importance of HTML5
1 Creation of web pages: HTML is used along with CSS and Javascript to create beautiful web pages. Lots of web pages on the Internet are written in HTML.
2 Creation of web application. According to Wikipedia, web application or web app is a client-server software application in which the client (or user interface) runs in a web browser. A web application is browser-based. It is a client-server software application.
3 Structuring of content: The major purpose of creating HTML is to structure web content. HTML is used for structuring contents on the Internet. It can be used to give paragraph to a text and layout a text.
4 Styling: HTML can be used to add style to a text such as making a text bold, giving color to a text, underlining a text etc.
HTML editors
HTML editors are tools that are used to write, edit and run HTML codes. You also need web browsers like Chrome, Mozilla Firefox, Opera Mini or Safari to view the results of your code. Any of the aforementioned web browser can be used.
HTML editors can be classified into online HTML editors and HTML software editors which are available for Windows operating system, Linux and Mac OS X. You can also get get editors for Android but they are few and may not be free. They are also less efficient. Below is a list of online HTML editors and software editors.
Online HTML editors
Htmledit.squarefree.com
Jsbin.com
Thimble.mozilla.org
Jsfiddle.net
I often use Htmledit.squarefree.com when coding HTML online but it's major disadvantage is that it's impossible to save your codes. Jsbin.com is a preferable one, perhaps you don't encounter difficulty in registering an account. You can use thimble.mozilla.org if you are unable to register an account on jsbin.com. Jsfiddle.net is also an option or you can google search for other online HTML editors.
HTML software editors
All platforms
Brackets. Download at brackets.io
LightTable Download at lighttable.com
Bluefish Download at bluefish.openoffice.nl/index.html
Atom Download at atom.io
Windows operating system
Codelobster download at Codelobster.com
Notepad ++ download at notepad-plus-plus.org
Mac operating system
Textwrangler download at barebones.com/products/textwrangler/
Linux operating system
Geany download at geany.org
gedit download at wiki.gnome.org/Apps/Gedit
HTML terms
(1)Opening tag( <> ) : The symbol of HTML has opening tag is <>. This always precedes all HTML codes. HTML codes cannot function effectively without the opening tag.
(2)Closing tag ( < /> ) : The symbol of HTML closing tag is < />. This always end HTML codes. It is not compulsory for ending all HTML elements e.g <link> tag does not require a closing tag.
(3)<! DOCTYPE html> : This is referred to as document type declaration. It is the first line of document for all HTML5 codings. It's major importance is that it tells your browser that the HTML version is 5.0. This HTML tutorial is wholely based on HTML5 because it is the most used and the best HTML version. Therefore <!DOCTYPE html> will begin all the HTML document in this tutorial.
<html> :This must come after the document type declaration (DTD). It is the parent element of all HTML documents.
</html> :This ends all HTML document.
<head>:This can be written immediately after the <html> tag. It is used for nesting <title>, <style>,<link> and <meta>. It's closing tag precedes </html>.
<body> :This represent the body of HTML document. <p>, <img>, <a> etc can be nested inside it. It's closing tag </body> precedes </html>
HTML element: An HTML element consist of an opening tag, texts and a closing tag e.g <p>William is handsome</p>
<i>I love Google<i>
Note that HTML tags can be nested in each other. Example <p>I love <i>Microsoft</i></p>
<p>Google Chrome is a <b>good</b>browser</p>
Don't be bothered if you don't understand the above codes,you will understand it as we progress because I will start explaining html elements one after the other in the next chapter.
HTML5 STRUCTURE
<! DOCTYPE html>
<html>
<head>
</head>
<body>
</body>
</html>
The above codes is the structure of all HTML documents. The <style>, <meta>, <link>and <title> can be written in between <head></head>.The body tag houses a lot of HTML elements because it represents the body of HTML document. You will understand better as we progress in this tutorial.
Note that the above codes will not produce any result when viewed through your editor or web browser because it is an empty HTML document.
HTML elements are categorised into two which are inline element and block level element.
Inline elements are elements that doesn't appear on a new line while block level elements are elements that appear on a new line.
Inline elements
Paragraph element
<p>:This is used to create a Paragraph element. The p in between the two angle brackets represent paragraph.<p> is used to create a paragraph.<p> is the opening tag while </p> is the closing tag. Type the HTML document below in your preferred HTML editor and notice the output.
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<p>I love coding</p>
</body>
</html>
You will notice that the above HTML document create a paragraph for the text-I love coding.
<b>: This tag is used to make a text bold. Its opening tag is <b> while its closing tag is </b>. Input the following in your HTML editor.
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<b>Worldwide web consortium</b>
</body>
</html>
<em>: This shows emphasis on texts. The opening tag is <em> while the closing tag is </em>. It has the same output as <i> but different semantics. Try the codes below.
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<em>HTML5 is interesting</em>
</body>
</html>
<i>:- This is used to italicise a text. Its opening tag is <i> and its closing tag is </i>.Try this HTML codes in your HTML editor.
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<i>HTML5 is awesome </i>
</body>
</html>
<quote>: This is used to quote a text.<quote> is the opening tag while </quote> is the closing tag. Try the following codes.
<!DOCTYPE html>
<html>.
<head>
</head>
<body>
<quote>This HTML tutorial is based on HTML5.</quote>
</body>
</html>
<strong> : This has the same output as <b> but different semantics. It indicates that a text is. important. Try the following codes.
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<strong> HTML editor</strong>
</body>
</html>
You are allowed to ask questions on any area that proves difficult.
Tutorial will resume by tomorrow at 9am.

Re: Learn HTML5,CSS3, Javascript And Php On Nairaland. by generalbush(m): 11:31pm On May 03, 2017
Who will have time to read all these here?

Chai!!

People learn more by seeing!! not reading!!

(1) (Reply)

Where To Buy Working And Cheap SMTP / Honest Review Of A Forum / Learn 6 Ways To Speeds Your Slow Android Device

(Go Up)

Sections: politics (1) business autos (1) jobs (1) career education (1) romance computers phones travel sports fashion health
religion celebs tv-movies music-radio literature webmasters programming techmarket

Links: (1) (2) (3) (4) (5) (6) (7) (8) (9) (10)

Nairaland - Copyright © 2005 - 2024 Oluwaseun Osewa. All rights reserved. See How To Advertise. 31
Disclaimer: Every Nairaland member is solely responsible for anything that he/she posts or uploads on Nairaland.