Web Coding Tutorials // HMTL -Part 1 / Why Web Coding?

Dolyetyus

Co Admin
21 Nis 2020
1,207
670
Delft


GyUig8.gif


Welcome Dear Turk Hack Team Members, Today, I will be introducing my web coding narrative to transfer all my knowledge that I know and can acquire with this article. I hope you all find it useful. :))

tJoGV2.gif


Friends, why should we choose the web first? So while there are so many options, I want to start with answering your questions such as why did you choose the web, why do we choose the web, and give information about these questions as much as I can. Throughout my web coding lessons, I will give importance to the level of friends who have little knowledge and little knowledge so that we can shed a good light on them.

tJoGV2.gif


Why Should One Choose Web Coding?

I think it is perfect for starting web languages, especially frontend languages ​​such as Html and Css. Believe that learning is very easy and fun language, one of the best things about Html and Css is that you are completely free. Freedom is possible in web coding, you can give a large length to a separate design; You divide it into two separate parts, separate design, in short, we do not have a limit.

xcyCxK.png


In addition to such facilities, I don't think it will be very difficult for a web developer to find a job. Why? There are dozens of companies and sites of these companies for every business and sector. Consequently, people are required to code these sites. This is where web developers come into play.

tJoGV2.gif


What Kind of Environment is Needed for Web Coding?

First of all, I can easily say that you can do web coding even with the lowest and system devices. It is a mandatory application, there are no high system requirements to be required. In other words, you can open a notepad application and make software for web coding even from there. In fact, these are the main features to start web coding. During my lecture to you esteemed forum members, we will talk not only about coding but also about external issues. We will also talk with the description & comment sections, editors and editor shortcuts that I am currently writing, I will try to cover not only web coding, but also all topics including web coding.

tJoGV2.gif


Why If Only Notepad Is Sufficient Why Do We Use Editors?

Mates, I am saying it again, "You can open a notepad application and even make software for web coding from there." but why do we need an editor? Because the editors make small warnings about the language tags, to correct minor mistakes that might go unnoticed. These make the job of a web coder a lot easier. During the process I am trying to tell you, I will use the editor named "Sublime Text", you can use any editor you want. Let's start with setting up our editor and explain a few little things in our first lesson.

tJoGV2.gif


Installing The Sublime Text Editor

Let's proceed to install Sublime Text editor's official site by typing "sublime text" in the address bar of our browser. (I give the site for you for simplicity; https://www.sublimetext.com/3)

xvC3Wo.png


Let's choose the one suitable for our operating system and start the download process.

xcyCxK.png


Foot Note; In order to give more information in my lessons and because I already have Sublime Text Editor installed in my system, I am passing the installation phase. But since I said that I will start to explain without any knowledge at the beginning of my article, I suggest you take a look at this video called How to set up Sublime Text Editor that I found on the Youtube.

[ame="https://www.youtube.com/watch?v=TGk0wzpKr4s"]https://www.youtube.com/watch?v=TGk0wzpKr4s[/ame]

xcyCxK.png


Yes, we have done the necessary installation and setup. Now let's open our editor and do our little codes and explanations. My advice to you is to open the folder and file before each work so that your encodings and files do not get mixed up. After opening the folder where we will study our lessons, let's start by opening a new text documént by right clicking with the mouse.

xvCFvA.png


When the renaming section of our file comes up, let's select the whole text and change it to "lesson.html".

xvCtYH.png


In this way, a warning will come. The reason for this is that when we create a new text documént , the extension is "txt", so it warns us when we want to convert it to "html" extension. We close this window with the "yes" option.

xcyCxK.png


Alright, our folder and file are ready. We will now open them in our editor. Let's open our file by using our "Ctrl + o" shortcut or using the "file/open file" path in our Sublime Text Editor.

xvC4sf.png


Now it's time to start coding :))

tJoGV2.gif


General Features of Html Codes

=> Each tag begins with a "<" (less than) sign and ends with a ">" (greater than) sign.

xcyCxK.png


=> Almost all tags (some exceptions exist) start with <html> and end with </html>. So we add "/" when finishing or closing our tag.

xcyCxK.png


=> The tags we write are written in lowercases, we do not write tags with capital letters.


tJoGV2.gif


All the codes we wrote are uploaded to the websites and opened by our browser, allowing us to use the sites. The first code of Html is the "html" tag, which we stated that we started coding Html and finished our codes. It starts as <html> and ends as </html>. It means that we started and finished, it is fix. We have to use it in our coding.

xcyCxK.png


Our second tag is the "head" tag. The head tag is the invisible part of our Html encoding. We write expressions such as the imports in which we use characters, the language of our coding.
The tags we have written in this section are not visible on the site!

xcyCxK.png


There are many tags we use in the head tag, but we will only see the "title" tag, which is our next tag. As the name suggests, it is a tag used to indicate the site title. It is used between head tags when coding. It is a tag we should use. Starts with <title> and ends with </title>.

xcyCxK.png


Body tag; You can think of our body tag as a head tag. We can say that the invisible parts of the head tag and the visible parts of the body tag are generally 90% of our codes. It is a tag we should use. It starts with <body> and ends with </body>.

tJoGV2.gif


Before finishing the tutorial today, I would like to leave a little coding with the writing of the small codes I mentioned. At least something is formed in your mind.

xcyCxK.png


As Written;
Kod:
<![COLOR="Red"]DOCTYPE[/COLOR] [COLOR="DarkOrchid"]html[/COLOR]>
 <[COLOR="red"]html[/COLOR]>
 <[COLOR="red"]head[/COLOR]>
 	<[COLOR="red"]title[/COLOR]>Our website header</[COLOR="red"]title[/COLOR]>
 </[COLOR="red"]head[/COLOR]>
 <[COLOR="red"]body[/COLOR]>
 
 </[COLOR="red"]body[/COLOR]>
 </[COLOR="red"]html[/COLOR]>

Illustrated;

xvxotP.png


tJoGV2.gif


My Opinion About the Lessons and What I Want to Say;

I would like to say that my lessons will not last as three lessons. If you do not understand much in the codes part of this lesson, you do not need to think much, I will talk about them again in the future topics. My main purpose in these subjects is not to go to an advanced level, but to have a little idea and information for those who are confused, who are not sure where to start, and to get people used to coding and then to web coding. That's why I will try to explain it very finely and in detail.

tJoGV2.gif


I would like to thank you for reading and sparing your precious time for me and for the tutorial. Forgive me if I had any mistakes. I will always try to keep this topic open in a tab, friends, if you have a suggestion, complaint or question, I will make the necessary answer if you talk about it.

Finally, I would like to express my respects and thanks to our Ƴαĸαмoz1Յ1Գ admin for his invaluable suggestions and ideas.

Take Care.. :))


Next Tutorial; I'll let you know when it's ready.




Source: https://www.turkhackteam.org/web-programlama/1942008-web-kodlama-dersleri-html-ders1-neden-web-kodlama.html
Translator: Dolyetyus

 
Son düzenleme:
Üst

Turkhackteam.org internet sitesi 5651 sayılı kanun’un 2. maddesinin 1. fıkrasının m) bendi ile aynı kanunun 5. maddesi kapsamında "Yer Sağlayıcı" konumundadır. İçerikler ön onay olmaksızın tamamen kullanıcılar tarafından oluşturulmaktadır. Turkhackteam.org; Yer sağlayıcı olarak, kullanıcılar tarafından oluşturulan içeriği ya da hukuka aykırı paylaşımı kontrol etmekle ya da araştırmakla yükümlü değildir. Türkhackteam saldırı timleri Türk sitelerine hiçbir zararlı faaliyette bulunmaz. Türkhackteam üyelerinin yaptığı bireysel hack faaliyetlerinden Türkhackteam sorumlu değildir. Sitelerinize Türkhackteam ismi kullanılarak hack faaliyetinde bulunulursa, site-sunucu erişim loglarından bu faaliyeti gerçekleştiren ip adresini tespit edip diğer kanıtlarla birlikte savcılığa suç duyurusunda bulununuz.