INSTITUTUL DE EDUCAȚIE DESCHISĂ DE LA MOSCOVA
DEPARTAMENTUL MATERIALELOR ŞI TEHNOLOGII INFORMAŢIEI

Materiale de curs la distanta
„Tehnologia informației și educația”

Polilova Tatiana Alekseevna
[email protected]

Cum se creează o pagină web

Cel mai simplu mod de a crea o pagină web este să folosești instrumentele din suita Microsoft Office. Cele mai recente versiuni ale acestui pachet oferă posibilitatea de a converti un document obișnuit în format HTML cu o calitate bună a codului.

Caracteristicile cuvântului

Un document pregătit într-un editor de text Word poate fi ușor convertit într-o pagină web. Cu toate acestea, nu va arăta atât de atractiv pe cât ne-am dori dacă nu se iau măsuri suplimentare. Să ne uităm la câteva exemple.

Să luăm niște text.

Să transformăm documentul într-o pagină web utilizând operațiunea Salvare ca pagină web ... (numită din meniul principal - elementul Fișier). Apoi, reprezentarea html a documentului va arăta astfel:

Primul lucru care vă atrage atenția este că textul ocupă întregul spațiu pe ecran. Lungimea liniei este prea mare. Pentru o citire confortabilă pe ecran, numărul de caractere pe linie ar trebui să fie în intervalul 50-65.

Folosind masa

În acest caz, puteți face destul de simplu: creați un tabel în documentul sursă și plasați textul necesar în el. Puteți seta un cadru în tabel. Apoi aspectul paginii web va fi mult îmbunătățit și pagina va arăta mai atractiv în browser.

Fundal și stil

Este recomandabil să alegeți un fundal care să nu fie prea luminos, astfel încât textul să fie bine citit pe el. Un astfel de fundal în lista propusă este, de exemplu, hârtie de orez. Aspectul paginii s-a schimbat semnificativ:

Inserați imaginea

Puteți adăuga o fotografie la un document luând-o, de exemplu, dintr-o colecție de clipuri.

Trebuie să faceți clic dreapta pe imagine, să efectuați operația de copiere, apoi să specificați locul pentru imagine în document și să efectuați operația de lipire a obiectului copiat.

Dacă inserați o imagine în interiorul unui paragraf, atunci este mai bine să modificați proprietățile imaginii setând fluxul de text în jurul imaginii (trebuie să selectați elementul din meniul principal Format și apoi Imagine):

Acest lucru nu va crea spațiu alb suplimentar în document.

În cele din urmă, puteți adăuga un cadru și o umbră imaginii folosind butoanele din panoul Desen - Tip de linie și Stil de umbră. Astfel de nuanțe adaugă vizibil expresivitate paginii.

Dacă panoul Desen nu este pe pagină, atunci trebuie să îl instalați selectând elementul din meniul principal Vizualizare și apoi Bare de instrumente și desen.

Ticker

Word vă permite să adăugați alte elemente de design, cum ar fi o linie de accesare cu crawlere, la o pagină web. Pentru a profita de această oportunitate, trebuie să deschideți panoul de componente web pe ecran (din meniul principal - elementul Vizualizare, apoi Bare de instrumente și componente web). Făcând clic pe butonul de operare a liniei glisante se deschide o fereastră suplimentară pentru specificarea textului parametrilor liniei glisante.

Ca de obicei, puteți schimba fontul și atributele din linie: dimensiunea fontului și culoarea simbolurilor. Pagina web va arăta astfel pe ecran:

Am dat un exemplu de doar un set foarte modest de tehnici de proiectare care pot fi folosite pentru a proiecta o pagină web bazată pe un document Word existent.

Utilizarea șabloanelor de design

Dacă începeți să creați o pagină de la zero, atunci puteți utiliza vrăjitorul paginii web, care în dialog vă va ajuta să formați documentul. Alternativ, puteți utiliza un șablon de design de pagină gata făcut, alegându-l dintr-un set destul de reprezentativ. Pentru a face acest lucru, în operațiunea Creare, selectați modul Creare cu șablon și apoi Șabloane generale. Pe ecran va apărea un formular în care trebuie să selectați fila Pagini Web:

Utilizatorul poate alege soluția de culoare și stil în mod independent, de exemplu, folosind setările Format - Temă.

Crearea de hyperlinkuri și marcaje

Ultima problemă pe care intenționăm să o luăm în considerare în această secțiune este crearea de hyperlinkuri în document.

Dacă dorim să facem legătura într-un document la un alt document sau un alt site de pe Internet, atunci un astfel de hyperlink se poate face astfel: selectați un fragment de text (cuvânt) în document și efectuați operația Insert - Hyperlink ... A va apărea pe ecranul în care este setată adresa hyperlinkului. Puteți introduce adresa în mod explicit sau puteți selecta un fișier în fereastră.

Trebuie amintit aici că adresa fișierului selectat de pe computerul dvs. se poate schimba atunci când vă construiți site-ul. Prin urmare, metoda implicită de specificare a adresei este potrivită doar dacă structura folderului dumneavoastră de pe computer și de pe site-ul de Internet este aceeași.

Dacă hyperlinkul trebuie să facă legătura cu o altă parte a aceluiași document, atunci trebuie mai întâi să inserați un marcaj la începutul fragmentului dorit. Trebuie să efectuați operația Insert - Bookmark, iar în formularul care apare pe ecran, introduceți numele marcajului.

Prezentare web PowerPoint

PowerPoint se concentrează pe crearea de prezentări pe computer. Cu toate acestea, are funcția de a converti o prezentare pregătită într-un format web.

Puteți deschide prezentarea pregătită și efectuați operațiuni (din meniul principal) Fișier - Salvare ca pagină web. Ca de obicei, trebuie să specificați numele prezentării web în fereastra care se deschide. Ca urmare a transformării prezentării, se va crea un fișier cu numele și extensia specificate .htm și un folder cu același nume cu materiale suplimentare.

Dacă apelați acum prezentarea web din browser, puteți vedea rezultatul conversiei pe ecran.

În partea de jos a ecranului este creată o linie specială, unde se află butoanele pentru navigarea la diapozitive și butoanele pentru setarea diferitelor opțiuni pentru vizualizarea prezentărilor.

Prezentarea poate fi vizualizată cu un contur de diapozitiv. Dar dacă această informație nu prezintă interes, atunci câmpul rezervat pentru afișarea structurii pe ecran poate fi eliminat (operația extinde / restrânge structura în linia de jos).

Butonul Prezentare vă permite să vizualizați diapozitivele pe ecran complet.

Crearea de hyperlinkuri

Într-o prezentare, puteți crea hyperlinkuri care leagă obiectele dintr-un diapozitiv, de exemplu, cu alte diapozitive. Astfel, este posibil să se creeze o structură hipermedia care să se potrivească în mod natural cu ideologia Internetului. Să explicăm această tehnică cu un exemplu.

Să presupunem că avem mai multe diapozitive pregătite despre flora lacului Baikal, formate dintr-o colecție de fotografii. Să creăm un nou slide - cuprins de colecție.

Dacă noul diapozitiv nu este primul din secvență, atunci trebuie să mergeți la modul de sortare diapozitive (din meniul principal folosind operațiunile Vizualizare - Sortare diapozitive) și să trageți noul diapozitiv la începutul colecției.

Plasați copii mici ale tuturor fotografiilor pe noul diapozitiv. Cel mai simplu mod de a face acest lucru este cel mai simplu: pe un diapozitiv gol, copiați secvențial toate fotografiile din colecție, reduceți dimensiunea și plasați-le, de exemplu, în două rânduri. Pozele pot fi decorate în continuare cu rame cu umbră. Puteți adăuga titlul prezentării în diapozitivul cuprins. Vizualizarea prezentării în modul Slide Sorter este prezentată mai jos:

Să trecem la modul de prezentare normală (Vizualizare și apoi comenzi Normale). Selectați fotografia de pe slide-ul cuprins și executați comanda Inserare - Hyperlink. În fereastra care se deschide, setați tranziția hyperlink - numărul diapozitivului cu fotografia mare, din care a fost copiat eșantionul mai mic pentru cuprins.

În mod similar, vom lega alte imagini din diapozitivul cuprins cu diapozitivele corespunzătoare cu originalele fotografiilor.

Dacă acum rulăm prezentarea noastră pentru execuție, atunci va funcționa ca o structură hipermedia: atunci când dați clic pe o fotografie mică, se va face o tranziție la un diapozitiv cu o fotografie la dimensiunea mărită.

Mai rămâne foarte puțin pentru a ne îmbunătăți structura. Adăugați o săgeată la fiecare diapozitiv cu o fotografie în partea din stânga sus (AutoShape pe bara de instrumente Desen) și creați un hyperlink din această săgeată care va merge la diapozitivul cuprins. Acum mișcarea de-a lungul structurii hipermedia pe care am creat-o va deveni „bidirecțională”: din cuprins puteți merge la diapozitivele cu fotografii, iar din orice diapozitiv puteți reveni la cuprins.

După convertirea prezentării în format web, prima noastră pagină va arăta astfel:

Făcând clic pe imaginea din meniu, se va trece la diapozitivul cu fotografia mare, iar făcând clic pe săgeata (din stânga sus a diapozitivului) se va trece la pagina cu cuprinsul colecției.

Salutare dragi cititori de blog. Cu acest articol, vom începe să învățăm elementele de bază ale limbajului HTML.

Probabil că știți deja că limba principală a internetului este Limbajul de marcare hipertext (HTML)... În acest articol, vom învăța conceptele de bază ale HTML și cum să creați cele mai simple pagini WEB.

Să începem cu cel mai important lucru, luați în considerare modul în care funcționează în sine World Wide Web - Internet... Pentru a primi pagini web, creați fișiere scrise în HTML și le puneți pe un server web. După aceea, orice browser instalat pe un dispozitiv cu acces la Internet, fie că este un computer, telefon sau tabletă, vă poate găsi paginile web.

server web Este un computer obișnuit cu software special care are acces la Internet. Așteaptă continuu cereri de la browsere pentru pagini web, imagini, fișiere audio și video. După ce a primit o solicitare pentru una dintre aceste resurse, serverul o caută și o trimite browserului.

Browser Este un program special pentru navigarea pe site-uri web, cum ar fi Internet Explorer. Cu browserul dvs., navigați pe site-uri făcând clic pe linkuri. Orice astfel de clic determină browserul să facă o cerere pentru pagina html către serverul web, să primească un răspuns și să afișeze pagina în fereastra sa. Când pagina este afișată, limbajul HTML începe să funcționeze, îi spune browserului totul despre structura și conținutul paginii web. Folosind comenzile - Etichete, HTML indică browserului unde încep paragrafele de text, ce parte a textului este un titlu și indică unde să insereze tabele și chiar imagini. Și etichetele sunt cuvinte între paranteze unghiulare, de exemplu

,

, .

Este nevoie urgent de un magazin online și nu există timp pentru a învăța HTML, CSS, PHP și alte tehnologii. Apoi puteți închiria pur și simplu un magazin online cu funcționalitate și optimizare complet implementate pentru motoarele de căutare.

Limbajul HTML și etichetele acestuia

Prima versiune a limbajului HTML a apărut în 1992. La momentul anului 2013, specificația noii versiuni de HTML este dezvoltată sub numărul 5. Această specificație este dezvoltată de World Wide Web Consortium, sau pe scurt W3C. W3C dezvoltă și alte standarde web. Vă puteți familiariza cu aceste standarde pe site-ul lor www.w3.org. Apropo, multe browsere Web acceptă deja unele caracteristici HTML 5.

Vă propun să începem să învățați limbajul HTML imediat cu un exemplu. Deci, să creăm prima noastră pagină Web. Orice editor de text este potrivit pentru crearea de pagini WEB. Vă sugerez să începeți să utilizați Windows-ul încorporat Blocnotes(în general, pe viitor, pentru editarea codului html, vă sfătuiesc să utilizați). Îl puteți găsi: „Start-> Toate programele-> Accesorii-> Notepad”. Să creăm o pagină despre mașini. Deci, deschide Notepad și tastați textul în el:

Site despre masini.

Bine ați venit pe site-ul nostru de mașini. Aici veți găsi multe articole interesante și utile despre mașini... Site-ul conține descrieri ale multor mașini importate și autohtone.

Apoi, să salvăm pagina web creată într-un fișier numit index.html. În acest caz, în caseta de dialog de salvare a fișierului, trebuie să setați codarea UTF-8 și să includeți numele fișierului între ghilimele, altfel Notepad va adăuga extensia txt la acesta, iar fișierul nostru va fi numit index.htm.txt:

Acum rămâne să deschideți fișierul creat în browser și să priviți rezultatul. Pentru a face acest lucru, puteți utiliza browserul Microsoft Internet Explorer furnizat cu Windows sau orice alt browser instalat pe computer, făcând dublu clic pe fișierul index.html sau trăgând fișierul pe pictograma browserului. Deschide-l și vezi ceva de genul acesta:

Astfel, am creat o pagină Web în Notepad, deși puțin nedescriptivă, dar care conține deja un titlu mare și un paragraf de text care este rupt automat în rânduri și conține un fragment cu caractere aldine.

Ce este o etichetă?

Acum să vorbim mai detaliat despre structura paginii. Luați în considerare un fragment:

Site despre mașini

. Aici vedem textul care este afișat pe pagină ca titlu, închis în etichete

și

... Ce este o etichetă în limbajul html?

Etichetă HTML sunt cuvinte și simboluri obișnuite cuprinse între paranteze unghiulare, de exemplu

,

, ... Deci etichetați

este eticheta de deschidere, eticheta

eticheta de închidere, iar textul dintre ele se numește conținutul etichetei. De asemenea, etichetați

și eticheta

se numesc etichete pereche. Împreună, eticheta de început plus conținutul plus eticheta de final formează un element al documentului html. Există, de asemenea, elemente formate dintr-o etichetă de deschidere:

Etichetă așa împerecheată

definește un element de antet de primul nivel. Există șase niveluri de titluri în total, acestea sunt elemente

—

.

Elementele pot fi bloc și inline (text). Elemente de bloc formatarea structurală a paginii. Elementele bloc sunt întotdeauna afișate pe o nouă linie pe pagină și sunt indentate față de elementele adiacente. Elemente în linie efectuați formatarea directă a textului sau formatarea logică. Element

este un element bloc.

Asta e tot pentru mine!!! Ne vedem în postările următoare!

Deci, ce este un site Web și o pagină Web? Pentru a înțelege această problemă, să ne gândim la ce informații conține de fapt site-ul web? Răspunsul este evident - aproape orice. Site-ul poate conține informații despre jocuri pe calculator, mașini, pești de acvariu, creaturi mitice, orașe și țări ale lumii etc. etc. Lista este nesfârșită. Puteți chiar plasa pe site, de exemplu, lucrările marilor clasici ruși. Cum vă place site-ul „Război și pace”? Se dovedește că site-ul este o carte, dar nu una simplă, ci una electronică? Da, un site Web este, în esență, o carte electronică, o revistă sau un manual care poate conține informații care vă sunt utile sau de care nu sunteți interesat în acest moment.

Ca o carte, un site Web este format din pagini numite pagini Web.

Și cum găsim, de fapt, în același manual de informatică, informațiile care ne interesează? Deschidem conținutul care se află la începutul sau la sfârșitul manualului, căutăm paragraful în care se află informațiile necesare, în fața paragrafului ne uităm la numărul paginii, îl deschidem și studiem materialul. Totul este destul de simplu și banal.

După ce ajungem la pagina principală a unui site bine conceput, ar trebui să vedem și ceva asemănător cu conținutul manualului pentru a putea găsi rapid informațiile de care avem nevoie.

Dar cum să ajungem la informațiile necesare aflate pe site, pentru că nu putem răsfoi paginile electronice precum cele obișnuite pe hârtie? Într-adevăr, de obicei folosim mouse-ul.

De fapt, mutarea între paginile de pe un site este chiar mai rapidă decât trecerea între pagini atunci când lucrați cu un tutorial obișnuit. Pentru a vă deplasa între paginile site-ului se folosesc elemente ale paginii Web, când dați clic pe ele, puteți trece la o altă pagină a site-ului. Aceste elemente de pagină se numesc hyperlink-uri și sunt prezente pe toate paginile care alcătuiesc site-ul.

În cazul „clasic”, o parte a textului (un cuvânt sau mai multe cuvinte) și imaginile grafice (imagini și fotografii) sunt folosite ca hyperlinkuri.

Deoarece în primul caz, textul este folosit pentru a crea hyperlinkuri, un astfel de hyperlink se numește text. Destul de des, un hyperlink text este un text subliniat albastru. Văzând, de exemplu, pe pagina principală a unui site inscripția „Site-uri web și pagini web” concepută în mod similar și făcând clic pe ea cu butonul stâng al mouse-ului, ar trebui să vă aflați pe pagina Web dedicată acestui subiect. Pagina „Site-uri și pagini web” trebuie să aibă, la rândul său, cel puțin un hyperlink pe care îl puteți utiliza pentru a reveni la conținut.

Dacă o imagine grafică, cum ar fi o fotografie, este folosită ca hyperlink, va fi dificil de ghicit că acesta este un hyperlink. Cum, atunci, puteți determina dacă o imagine este un hyperlink sau nu? În acest caz, rețineți următoarea regulă: „Dacă, când mutați cursorul mouse-ului peste un element al unei pagini Web, acesta se transformă într-o mână, atunci acest element este un hyperlink”.

Notă: Există o excepție de la această regulă, de exemplu, în cazul rollover-urilor, care poate să nu fie hiperlinkuri, dar când treceți mouse-ul peste ele, cursorul ia și forma unei mâini. Pe lângă schimbarea aspectului cursorului, atunci când treci cu mouse-ul peste hyperlink, ar trebui să fie afișată și URL-ul (adresa unică a resursei), dar despre asta vom vorbi în lecția despre crearea hyperlink-urilor folosind programul FrontPage.

Întrebări de control:

• Ce este un site web?
• Ce este o pagină web?
• Ce este un hyperlink?
• Ce elemente ale unei pagini web pot fi folosite ca hyperlink-uri?
• Cum pot spune dacă un element de pagină este un hyperlink?
• Pot paginile Web individuale de pe un site să nu conțină hyperlink-uri?

9 voturi

Bun venit la paginile blogului Start-Luck. Astăzi aș dori să vă arăt cum să utilizați codul. Scrierea de site-uri web este o activitate interesantă care poate părea copleșitor de dificilă pentru mulți. De fapt, o pagină simplă poate fi creată în doar 5 minute.

În acest articol, voi vorbi despre crearea unei pagini html. Vom finaliza această sarcină în mai puțin de 10 minute, iar apoi ne vom ocupa de etichetele principale mai detaliat. Ar fi greșit să numim o astfel de publicație o lecție. Mai degrabă, este o sămânță care este concepută pentru a vă arăta ușurința de a lucra și să vă dea dorința de a merge mai departe, de a învăța mai multe, de a face mai bine.

Cum se creează o pagină

Vă sugerez să faceți prima pagină în notepad. Cel mai simplu, care se află în meniul „Start”, folderul „Standard”. Încă nu trebuie să descărcați nimic. Încearcă să folosești ceea ce ai.

Deschideți documentul.

Lipiți acest cod în el.

<html> <cap> <titlu> Prima mea pagină</ titlu> </ cap> <corp> <centru> </ h1> <br /> <centru> „https://pixabay.com/static/uploads/photo/2016/10/14/18/03/workplace-1740807_960_720.jpg”> <br /> <stil font = „culoare: roșu”></ font> <br /> <b></ b> <br /> Am ajuns până la capăt<br /> Acum știi puțin mai multe despre etichete și le poți folosi. Să încercăm să inserăm un link pentru a lega mai multe pagini împreună.<br /> <hr> De exemplu, aici este un link către blogul meu -<a href = "http: // site /"> Start-Norocul</ a>- vorbește pur și simplu despre „dificil”.<br /> <br /> </ corp> </ html>

A face o pagină este mai ușor decât crezi

Mulți li se poate părea că crearea de site-uri web este dificilă, chiar imposibilă. Pentru a face asta, trebuie să înveți multe, să înveți, să faci. De fapt, există aproximativ 100 de etichete pe care nici nu trebuie să le înveți. Este important doar să înțelegeți ce și unde se aplică. Informațiile pot fi spionate în diferite foi de cheat și, în timp, veți începe să vă amintiți etichetele de pe aparat.



Codul simplu face textul roșu

A scrie cu caractere aldine nu este mult mai greu

Am ajuns până la capăt

Acum știi puțin mai multe despre etichete și le poți folosi. Să încercăm să inserăm un link pentru a lega mai multe pagini împreună..

OK, totul sa terminat acum. Prima pagină este gata

Fișierul trebuie să fie numit index.html... Final „.Html” indică extensia fișierului. Dacă introduceți doar numele indexului, atunci documentul va fi salvat ca fișier text și nu se va deschide într-un browser.

Am salvat documentul pe desktop. Acum trebuie să îl găsiți, să faceți clic dreapta și să îl deschideți folosind orice browser. Voi alege Google Chrome.

Așa arată pagina pe care tocmai am creat-o. Al tău nu va fi diferit. Totul este exact la fel: cu imagini și font colorat.

Acum voi intra în mai multe detalii despre etichete, dar deocamdată să eliminăm din titlu „ centru „Și introduceți o linie care conține cuvântul” Culoare". Apropo, am scris deja. Este foarte simplu, recomand să-l citiți.

Salvați din nou documentul, de data aceasta puteți utiliza doar comanda rapidă de la tastatură Ctrl + S, apoi reîmprospătați pagina în browser folosind butonul F5

Amintiți-vă, aproape orice etichetă trebuie să se deschidă și să se închidă. Adică trebuie să existe un cod slash pe undeva. În acest caz, arată astfel: .

Vedeți, titlul a devenit roșu. De asemenea, puteți da nuanța dorită oricărei părți a textului.

Ei bine, asta e tot, un exemplu este gata și ar trebui să fii mândru de tine. Desigur, încă nu este online, pentru asta trebuie să puneți pagina web, care este furnizată de hosting. De asemenea, trebuie să vă conectați domeniul, astfel încât alte persoane să vă poată vedea creația.

Până acum, doar tu poți vedea pagina. Dar trebuie să recunoașteți că un astfel de site nu poate decât să surprindă o persoană din epoca fierului. Dar aceasta este prima experiență, să o facem și mai de succes prin înțelegerea etichetelor pe care le-am folosit. Acest lucru vă va ajuta să învățați cum să vă creați propriile proiecte, fără ajutorul nimănui altcuiva.

Etichete

Cu permisiunea dumneavoastră, voi trece la NotePad ++. Are o serie de avantaje față de un notebook obișnuit. Deocamdată, evidențierea etichetelor este foarte utilă pentru a vă arăta elementele despre care voi vorbi. În general, dacă aveți de gând să învățați html, atunci vă recomand cu căldură să instalați acest program gratuit.

Nu este singurul și vă pot oferi încă câteva dacă cineva este interesat de alternative. Vom trece la partea teoretică.

Principalul

Pagina începe și se termină cu etichete ... Acestea arată browserului că acesta este un document web generat folosind html.

Urmează sau rubrica. Conține cele mai importante informații despre pagină, în cazul nostru -. Dacă nu ați găsit încă expresia „Prima mea pagină”, care este prezentă în cod, fiți atenți la fila în sine, deasupra liniei de căutare.

Și anume etichete sunt responsabili pentru începutul și sfârșitul informațiilor principale despre pagină.

Etichetă

indică faptul că fraza este un antet. În mod implicit, este puțin mai mare decât textul corpului și este aldine. Dacă tu și cu mine am scrie acum nu numai în html, ci și să creăm un fișier CSS cu care fișierul nostru a ecou, ​​am putea controla dimensiunea, fontul și chiar culoarea tuturor antetelor din pagină fără a prescrie stilul fontului așa cum am făcut în exemplu. Deși și asta este puțin devreme.

Apropo, Title și H1 își au efectul atunci când atribuiți site-ul dvs. la rezultatele căutării. Trebuie să le tratați cu mare atenție și să nu scrieți în interiorul ce anume. Ele sunt legate de. Pe lângă h1, există și h2, h3, h4.

În aceeași linie există o deschidere și o închidere

... Datorită acestui element, puteți alinia textul în mijloc. Dacă această etichetă este eliminată, textul va fi aliniat la dreapta.

Este una dintre puținele etichete simple. Adică funcționează de la sine. Datorită acestui fapt, elementele sari de la o linie la alta. În termeni simpli, indent. Am scris-o o dată, ceea ce înseamnă că ne-am mutat în jos o dată, de două ori, ca a mea, iar indentarea s-a dovedit a fi puțin mai mult.

Imagine

Urmează eticheta img , adică imagine, imagine. Paranteza pătrată este deschisă, toate informațiile de bază despre imagine sunt introduse în ea, numai după aceea este închisă. Trebuie remarcat faptul că img Este o etichetă și toate celelalte elemente de cod care se potrivesc în interior sunt atributele acesteia.

Primul lucru este alt , adică o descriere. Acest lucru este necesar și pentru optimizare. Uneori se adaugă și titlu ... Când treceți cu mouse-ul peste imagine, lângă cursor apare un sfat explicativ când pagina este deja deschisă în browser.

Era posibil să încarc o imagine în folderul site-ului și să scriu o cale către ea, dar am mers pe calea ușoară. Am găsit o imagine pe Pixabay, am deschis-o într-o fereastră nouă și am lipit linkul.

În etichetă src se scrie calea către imagine. El este cel care spune browserului ce să se deplaseze în continuare pentru a găsi imaginea dorită și în ce direcție să se uite - scrii singur.

Formatarea textului

este responsabil pentru a da unei părți a textului un stil special, de exemplu, ca în cazul nostru, o culoare diferită. stil = „culoare: roșu” indică faptul că culoarea va fi roșie. Dacă vrei galben, scrie galben, verde - verde. Puteți folosi codurile de culoare din Photoshop.

ajută textul să fie aldine.

---

trasează o linie orizontală. Este unică și se folosește numai când este închisă. Daca scrii

---

de mai multe ori, veți obține exact același număr de dungi orizontale atunci când deschideți pagina într-un browser.

Legături

spune browserului că linkul va fi următorul. Doriți să redirecționați cititorul către o altă adresă. Această etichetă vine cu un atribut obligatoriu href = „adresă” ... Citatele includ calea în care browserul ar trebui să conducă vizitatorul la pagină. După înregistrarea acestei etichete, se inserează o descriere, un cuvânt sau mai multe, făcând clic pe care cititorul va fi transferat în continuare. După îndeplinirea acestor condiții, puteți introduce o a doua etichetă de închidere .

După ce este scris corpul principal al paginii, închideți eticheta corp întrucât corpul este complet. Și indicați că nu mai utilizați pentru astăzi html .

Dacă doriți să aflați mai multe despre etichetele html și să învățați cum să inserați nu numai imagini, ci și videoclipuri, să creați butoane, diverse forme, liste, paragrafe, atunci vă pot oferi un curs gratuit de la Evgeny Popov " Bazele HTML ". Doar 33 de lecții te vor ajuta să ajungi la următorul nivel.

De asemenea, aș dori să vă recomand un curs video care vă spune cum sunt alcătuite site-urile. Întregul proces este prezentat cu exemple reale, ceea ce este deosebit de bun. Cursul este destinat atât începătorilor care nici măcar nu cunosc HTML încă, cât și celor care cunosc deja bine atât HTML, cât și CSS, însă nu se pricep la site-uri de codare. Puteți obține informații mai complete făcând clic pe link-ul: www.srs.myrusakov.ru/makeup

În plus, luați Carte gratuită pentru construirea site-ului web ! Această carte este concepută pentru începători și aici este creat un site OT și DO. Adică, designul este pregătit, apoi paginile sunt alcătuite, partea de software este scrisă și apoi site-ul este plasat pe Internet. Autorul comentează temeinic totul, iar cartea conține o mulțime de capturi de ecran și ilustrații. Mai mult, particularitatea cărții este că nu este un site abstract care se creează, ci unul complet real care există pe Internet.

Astăzi ai făcut multe, pentru că primul pas este cel mai greu.

Abonați-vă la newsletter și Grupul VKontakte și aflați mai multe: cum și de ce aveți nevoie de un motor de site, ce este un aspect bloc și o grilă modulară, cum să scrieți corect site-urile și multe altele.

Pana data viitoare si mult succes!

Un site web, adesea numit pe scurt un site, nu este altceva decât o colecție de pagini web legate logic sau doar o singură pagină. Paginile site-ului sunt accesibile pe Internet folosind protocoalele HTTP sau HTTPS. Site-ul web își are locul pe Internet, care este determinat de o adresă personală pentru fiecare site, care se numește de obicei URL. Orice site web are proprietarul său, proprietarul poate fi fie o persoană fizică, fie o entitate juridică.

Site-ul web este format din pagini

Un site web este format din pagini unite printr-o adresă URL rădăcină comună și, de regulă, printr-o structură logică comună, temă, aspect (design) și dispozitiv tehnic. La rândul său, World Wide Web nu este altceva decât o colecție a tuturor site-urilor web. Paginile web sunt fișiere text scrise în limbajul de marcare hipertext HTML sau XHTML.

Când o pagină web este vizualizată într-un program special numit browser, fișierele HTML sunt descărcate pe computerul utilizatorului. După încărcare, browserul afișează pagini web pe ecranul utilizatorului. Diverse dispozitive pot fi folosite ca hardware pentru accesarea Internetului pentru a naviga prin conținutul paginilor web: un computer personal, PDA, unele modele de console de jocuri și alte dispozitive, toate aceste dispozitive acceptă standardele de limbaj HTML/XHTML și paginile web sunt afișate pe ele în același mod...

Limbajul HTML / XHTML face posibilă formatarea paginilor, plasarea textului, hyperlink-urilor, tabelelor, imaginilor și altor obiecte pe acestea. O foaie de stil CSS care poate fi utilizată în documentele HTML oferă opțiuni suplimentare pentru crearea aspectului paginilor web.

JavaScript și alte limbaje de scripting

Pe paginile web, puteți utiliza, de asemenea, JavaScript și alte limbaje de scripting acceptate de browser și puteți oferi interactivitate unui document web. Pentru comunicarea între paginile web din cadrul site-ului și comunicarea între diferite site-uri web ale World Wide Web, sunt utilizate link-uri hypertext sau hyperlink-uri pe scurt. Dacă un hyperlink este folosit pentru a lega pagini dintr-un site, acesta se numește intern, iar dacă leagă site-uri diferite, se numește extern.

Paginile site-ului

Paginile de pe site pot fi statice, adică sunt stocate pe serverul web sub formă de fișiere imuabile, sau pot fi dinamice, adică sunt generate direct pe server de un program special, care se mai numește motorul site-ului. Motorul site-ului poate oferi o gamă largă de posibilități pentru modificarea conținutului paginilor web, adăugarea de noi pagini web și efectuarea altor acțiuni pentru configurarea unui site web și editarea informațiilor despre acesta printr-o interfață de administrare web, care se numește sistem de management al conținutului sau CMS .

Crearea site-ului este un proces laborios care reunește munca diferiților specialiști: web designeri, programatori, codificatori HTML, optimizatori, manageri, jurnaliști pentru a umple site-ul cu informații etc. Timpul și costul creării unui site web depind de gradul de complexitate al proiectului, de structura acestuia și de calitatea designului.

Un pic din istoria dezvoltării site-ului web

Primul site din lume a fost creat pe 6 august 1991 de americanul Tim Berners-Lee, acesta a postat pe site o publicație despre tehnologia World Wide Web. Tehnologia World Wide Web se bazează pe protocolul de transfer de date HTTP, limbajul de marcare hipertext HTML și sistemul de adresare URL. Site-ul a descris și alte principii de bază ale Internetului, precum funcționarea serverelor, browserelor web etc. Site-ul, creat de Tim Berners-Lee, a devenit și primul director de internet din lume, deoarece mai târziu a postat link-uri către alte resurse ale internetului de atunci.

Instrumentele necesare site-ului au fost pregătite chiar mai devreme, la sfârșitul anului 1990 a apărut primul browser, care s-a numit WorldWideWeb, incluzând în plus și funcția de editor de hipertext. Tim Berners-Lee a construit și primul server web bazat pe NeXTcube.