Conţinut

• Pași
• Metoda 1 din 1: Scrierea unei pagini HTML
• sfaturi
• Avertizări
• De ce ai nevoie

HTML (Hypertext Markup Language) este limbajul principal de programare pentru dezvoltarea paginilor web. Creat ca un limbaj de programare simplu și convenabil. Majoritatea paginilor de pe Internet au fost dezvoltate folosind una dintre formele acestui limbaj (ColdFusion, XML, XSLT). După ce ați citit acest articol, vă puteți continua instruirea folosind alte resurse de pe Internet. Încercați să căutați pe internet alte articole legate de acest subiect.

Pași

Metoda 1 din 1: Scrierea unei pagini HTML

1. 1 Înainte de a începe să vă familiarizați cu unul dintre pașii prezentați aici, consultați secțiunea „De ce veți avea nevoie”.
2. 2 Ce ar trebui să știți înainte de a începe să înțelegeți această problemă:
3. 3 Cele elementare. Ai auzit vreodată de etichetă? Eticheta este înconjurată de paranteze unghiulare, cu cuvântul în interior. Eticheta de final este scrisă în aceeași formă, dar cu adăugarea unei bare oblice după prima paranteză unghiulară. Un atribut este un cuvânt opțional într-o etichetă care este utilizat pentru a adăuga detalii la o etichetă.
4. 4 Începutul documentului. În orice editor de text pe care îl utilizați, lipiți următoarele:
   html> head> title> wikiHow / title> / head> body> Hello World / body> / html> big> / big>
   Eticheta trebuie închisă cu aceeași etichetă, dar cu o bară după prima paranteză unghiulară. Există excepții, cum ar fi etichetele META sau DOCTIP.
5. 5 DOCTIP
   • De obicei, majoritatea paginilor web sunt setate DOCTYPE ”. Acest lucru ajută la determinarea codificării, precum și la modul în care va fi percepută de browserele web. Majoritatea paginilor vor funcționa fără ea, „dar acest lucru este necesar dacă doriți să se potrivească (ele reglementează tipurile de codificare de pe internet și modul în care sunt utilizate)... DOCTYPE pentru HTML 4.01 este prezentat mai jos :! DOCTYPE html PUBLIC "- // W3C // DTD HTML 4.01 // EN" "http://www.w3.org/TR/html4/strict.dtd"> Acesta este unul dintre cele mai frecvente DOCTYPE utilizat pe pagini de pe internet.În primul rând, indică tipul paginii care descrie „html”, apoi evidențiază tipul de codificare și, în cele din urmă, locația DOCTYPE, care, ca urmare, descrie pagina pentru browserul web.
   • Există diferite tipuri de HTML (diferite versiuni dezvoltate de-a lungul anilor), de exemplu folosind etichete noi sau etichete specifice. Unele etichete sunt învechite (în schimb sunt folosite alte etichete mai utile).
   • b> și eu> - aceasta este ceea ce se impune în prezent etichetelor, deoarece acestea sunt folosite pentru a transforma textul, dar nu și specificațiile, ca urmare, alte etichete vin să le înlocuiască. Etichetă puternic> este un înlocuitor pentru b>, și em>, un înlocuitor pentru eu>.
   • Este important ca etichetele anterioare să fie înlocuite cu etichete care sunt mai mult decât formatarea. Dacă textul este tradus, atunci nu numai formatarea, ci și sensul său rămân aceleași. Acest lucru este corect din punct de vedere semantic.
   • În versiunea XHTML 2.0, b> și eu> nu este folosit, la fel ca în versiunea HTML 3+.
6. 6 HTML "Regula de încapsulare".
   • Să aruncăm o privire asupra etichetelor mai importante utilizate în prezent. În timpul creării paginii, se folosește o structură simplă. Dacă a fost deschisă o etichetă, atunci, ca rezultat, ar trebui să fie închis... Acest lucru se aplică întregii structuri. Iată un exemplu valid al structurii de layout XHTML:
   • ! DOCTYPE html PUBLIC "- // W3C // DTD XHTML 1.0 Strict // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
   • html xmlns = "http://www.w3.org/1999/xhtml">
   • cap>
   • meta http-equiv = "Content-Type" content = "text / html; charset = utf-8" />
   • title> Hello World! / title>
   • / cap>
   • corp>
   • h1> Hello World! / h1>
   • / corp>
   • / html>
   • Exemplu de cod care emite un mesaj Salut Lume... Aceasta se numește test Salut Lume.
7. 7 Titlu
   • Titlul paginii web este conținutul dintre etichetă cap>... Acest conținut nu poate fi vizualizat de utilizator (doar titlul care este afișat în titlul paginii). Informații între etichete cap>, poate include alte etichete, cum ar fi:
     
     
     • Eticheta META este utilizată pentru informații utile motoarelor de căutare și altor utilități.
     • Etichetă LINK care creează o legătură între documente, de exemplu pentru Stiluri (CSS).
     • Etichetă SCRIPT, aceasta include aproape orice codare web, cu posibilitatea de a accesa de la distanță (dintr-un alt document).
     • Eticheta STYLE, care este în esență un stil care poate fi aplicat unei pagini.
     • Eticheta TITLE este titlul care apare ca titlul unei pagini în browserul dvs. web.
   • Să vedem o demonstrație a unora dintre acestea într-un exemplu de antet preluat de pe acest site web (a fost scurtat):
     • cap>
     • titlu> ... / titlu>
     • meta name = "description" content = "..." />
     • link rel = "styleheet" type = "text / css" href = "..." />
     • meta http-equiv = "content-type" content = "text / html; charset = UTF-8" />
     • style type = "text / css" media = "all"> ... / style>
     • script type = "text / javascript" src = "..."> / script>
     • / cap>
       
       În cazul în care nu ați observat, etichetele individuale au fost evidențiate, cu informațiile reale eliminate. Exemplul este destul de scurt, arătând aproape fiecare etichetă care poate fi găsită în cap>cu excepția comentariului HTML (Vom vorbi despre asta în etichete simple).
8. 8 Etichete simple peste tot
   • Să mergem mai departe și să vedem alte etichete. Aveți grijă la etichetare și amintiți-vă regula generală, „Incapsulare”.
     
     
     • puternic> Subliniază textul important.
     • mic> Mărește textul. Dimensiunea fontului este măsurată în unități standard de la 1 la 7, 3 este dimensiunea implicită a textului. ...
     • pre> Definește un bloc de text îmbogățit. Deoarece este corect, un astfel de text este tastat într-un font de aceeași dimensiune și cu toate spațiile dintre cuvinte.
     • em> Afișează textul ca o frază.
     • del> elimină textul.
     • ins> Definește textul care a fost inserat în document.
     • h1> Una dintre multele etichete de titlu. Etichetele de acest fel încep cu „h”, cu o diferență de număr. Asigurați-vă că închideți eticheta cu același număr.
     • p> Definește un paragraf.
     • ! --- ... ---> Spre deosebire de alte etichete, comentariul trebuie să fie în interiorul etichetei în sine. Aceste informații sunt vizibile numai atunci când codul este vizualizat.
     • blockquote> Afișează o ofertă, poate fi utilizat cu eticheta cite>.
     • Cele câteva exemple de mai sus nu sunt o listă completă a etichetelor existente. Pentru a afla despre alții, vizitați.
9. 9 Crearea unei structuri clare
   • Paginile sunt concepute pentru a conține date în seturi simple de etichete, astfel încât să putem analiza informațiile în paragrafe. Computerul recunoaște datele; nu știe despre context sau conexiunea conceptuală. Trebuie să creăm pagini HTML compatibile cu computerul. Acest lucru se realizează utilizând eticheta div. Ajută la crearea unui număr mare de pagini. Poate fi stilizat cu CSS și este mai ușor decât crearea tabelelor de coduri mari pentru aspect.
     • div> Această etichetă este specială, deoarece poate fi stilizată și poate utiliza blocuri separate de informații pe care atât utilizatorul, cât și computerul le pot înțelege.
   • Să aruncăm o privire la un aspect HTML simplu care utilizează o etichetă div.
     • ! DOCTYPE html PUBLIC "- // W3C // DTD XHTML 1.0 Strict // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
     • html xmlns = "http://www.w3.org/1999/xhtml">
     • cap>
     • meta http-equiv = "Content-Type" content = "text / html; charset = utf-8" />
     • title> Hello World! / title>
     • / cap>
     • corp>
     • h1> Hello World! / h1>
     • div id = "contentOne">
     • p> Acesta este un text din div # contentOne. / p>
     • div>
     • p> Un paragraf dintr-o subsecțiune din div # contentOne / p>
     • / div>
     • / div>
     • / corp>
     • / html>
   • Utilizarea etichetelor div> ajută la găsirea și modificarea stilurilor în timp ce lucrați cu CSS și Javascript. HTML va utiliza diferite codificări pentru a lucra cu stiluri CSS și Javascript pentru a crea o experiență de utilizator mai bună și mai receptivă.

sfaturi

• După ce ai citit acest articol, nu te opri și gândește-te că ai învățat tot ce trebuie să știi. Există întotdeauna ceva de învățat, mai ales în această tehnologie.
• Aflați, înțelegeți și scrieți cod.
• Rețineți că unele etichete folosesc doar>. Para și br sunt câteva exemple. Alte etichete deschise cu> trebuie închise în continuare. De exemplu, "div> / div>".
• Oamenii așteaptă noi descoperiri, așa că reinventează, proiectează sau codifică.
• După ce ați învățat multe, încercați să învățați programarea serverului.
• Învață să lucrezi cu CSS, precum și cu Javascript.

Avertizări

• Amintiți-vă, HTML se referă la editarea conținutului. Aceasta înseamnă că HTML este utilizat numai pentru a stoca conținut într-un format recunoscut. Alte modificări trebuie făcute folosind alte tehnologii, cum ar fi CSS. Înseamnă și a face „Semantic corectchiar dacă alții nu recunosc. Alte limbaje de programare ajută la construirea paginilor web (CSS, Javascript și XML). HTML este un constructor de conținut.

De ce ai nevoie

• Un editor de text care acceptă codificarea ANSI
• Un browser web precum Internet Explorer sau Mozilla Firefox
• (Opțional) editor wysiwyg sau wykiwyg HTML, cum ar fi Adobe Dreamweaver, Aptana Studio sau Microsoft Expression Web