Mărimea, culoarea unor elemente importante ale blogului - cum ar fi titlul blogului sau postării, eticheta mai mult și altele asemenea. Am căutat manual codul necesar, experimentând domeniul de testare, pe baza căruia a fost scris ulterior articolul.

Și recent a trebuit să schimb culoarea link-urilor. Cernind o grămadă de literatură pe această temă, mi-am dat seama de un lucru simplu: fiecare dă exemple din propriile șabloane, dar toți avem șabloane diferite și e bine dacă codul din exemplu este măcar puțin asemănător: fără să ne văitam, Îl voi găsi în continuare căutând - folosind metoda poke.

Numărul nu a funcționat cu codul de legătură. Toată lumea a indicat căi complet diferite. M-am întrebat dacă există un instrument simplu și precis, cum să găsiți codul html necesar pe orice site web. Mulți bloggeri, chiar și cu experiență, au dificultăți în a face modificări minore la șablon. Nu este nimic în neregulă cu asta, pentru că fiecare are propriile interese și obiective pentru crearea unui site web.

Dacă doriți să faceți mici modificări șablonului, de ex. modifica orice titlu, titlul articolelor și secțiunilor, culoarea și dimensiunea fonturilor și a linkurilor, De obicei, este suficient să înveți principiul simplu discutat în acest articol. Există însă și cazuri complexe care necesită fie un studiu mai profund al html și css, fie ajutorul unui specialist.

Într-o zi, un cunoscut m-a rugat să găsesc unde să schimb culoarea panoului de categorii din șablonul său. A încărcat un subiect într-un subdomeniu de testare. Setările pentru acest element nu au fost stocate în style.css, ci într-un alt fișier, așa că o persoană nu l-a putut găsi.

Cum să găsiți și să schimbați codul html și css al unui site

Dacă nu vă plac articolele lungi, acesta este pentru dvs la finalul articolului un tutorial video care spune cum puteți vedea codul html al site-ului web folosind Notepad++ și puteți modifica designul oricărui șablon folosind un exemplu despre cum să schimbați culoarea fontului. În videoclip există și alte subtilități ale manipulării unui blog. Iar pentru cei care sunt mai aproape și mai înțeleși de text, mai jos este o analiză detaliată a subiectului cu capturi de ecran.
httpv://youtu.be/uIlVvwCt2ho

Termeni și concepte

Ar fi mai corect să intitulezi articolul „ Cum să găsești codul css„, dar am decis să mă opresc la numele „greșit”, pentru că, practic, răspunsul la această întrebare este căutat în html. CSS și HTML sunt lucruri foarte diferite, chiar dacă sunt două părți ale aceluiași sistem. Există multe articole tehnice pe Internet, aici ne va fi suficient să înțelegem că:

• HTML— este responsabil pentru structura site-ului (ce urmează ce, în ce ordine etc.). Aceasta este baza pe care este creat site-ul. Dacă o comparăm cu o casă, atunci aceasta este amenajarea ei, amenajarea camerelor.
• CSS— este responsabil pentru design (ce fonturi, dimensiuni, culori etc.). Acesta este stilul general al casei și stilul camerelor sale individuale: ce fel de tapet va fi, lămpi, perdele, mobilier. Prin urmare, documentul care precizează coduri css, numită „foaia de stil”

Și dacă vă întrebați cum să schimbați, de exemplu, culoarea titlului site-ului, dimensiunea fontului din texte sau culoarea antetelor din bara laterală, atunci trebuie să căutați toate acestea în foaia de stil CSS. Acesta este singurul lucru care merită înțeles mai întâi pentru a face singur modificări codului.

Îmi place să simplific complexul. Îmi amintesc cu mult timp în urmă, când am avut prima mașină, era foarte veche, cablajul era putrezit, siguranțele se ardeau adesea și de fiecare dată o remorcam la benzinărie. Imaginați-vă câți bani s-au irosit, în ciuda faptului că înlocuirea dvs., după cum se dovedește, costă bănuți.

Într-o zi m-am uitat la ce face exact maestrul. Încă nu știu cum funcționează siguranța. Dar știu unde să-l schimb). Nu aș repara singur motorul și nu este dificil să înlocuiți siguranța. La fel este și cu site-urile web.

Dacă nu vrei să devii programator, atunci nu este nevoie să ai o înțelegere profundă a programării. Este suficient de clar să înțelegeți ce este destinat pentru ce, unde să îl căutați și cum să îl schimbați. Este mai bine să schimbi singur ceea ce poți și să lași totul în seama specialiștilor. Articolul despre are un link util pe acest subiect.

Trebuie să fii un expert în toate?

Există adesea discuții pe blogurile SEO despre dacă un începător trebuie să aibă o înțelegere profundă a HTML, sau chiar mai bine, să învețe cum să scrie site-uri web, astfel încât totul să fie unic.. Ei bine, nu știu - pentru fiecare a lui, și aici ce este mai aproape de cine este mai aproape. Sunt puțin mai interesat, așa că acum învăț mai multe de la Vladimir. În noiembrie a acestui an, Vladimir și-a deschis propriul blog. Blogul lui a fost realizat pe cel mai simplu șablon gratuit, l-a modificat doar puțin pentru a se potrivi.

După 10 zile de existență, blogul a ocupat locul 104 în clasamentul tuturor site-urilor Runet cu un trafic de aproximativ 1,5 mii de persoane pe zi. In 10 zile. Deci care e problema? Vladimir cunoaște bine HTML și poate comanda și cumpăra un șablon unic. Deci trebuie să înțelegi asta Secretul nu constă în șabloane, ci în utilitatea informațiilor.

Unde este ascuns codul html?

Scuze pentru digresiune, să revenim la codurile noastre). Să presupunem că doriți să schimbați culoarea fontului titlului blogului dvs. Să ne uităm la exemplul site-ului meu de testare.

1. Deschideți site-ul în browserul Google Chrome (dacă nu îl utilizați încă, instalați-l - este bine conceput pentru a lucra cu site-uri web, are o mulțime de instrumente încorporate).
2. Mutăm cursorul mouse-ului peste elementul pe care urmează să-l schimbăm . În acest caz - numele blogului. Facem clic dreapta pe el și în fereastra care apare, selectăm VIEW ELEMENT CODE.

IMPORTANT: nu confundați acest lucru cu VIZIUNEA CODUL PAGINII! Nu avem nevoie de întreaga pagină acum, ci doar de un element separat.

Faceți clic pe el - apare o fereastră de vizualizare a codului în partea de jos a browserului:

Linia de cod pe care o modificăm este evidențiată cu roșu.

Însă zona evidențiată cu albastru conține ceea ce căutăm. Aici puteți găsi linia exactă (nu aproximativă) de cod responsabilă pentru fonturi, culoare, dimensiune, evidențiere etc. În acest fel puteți afla ORICE cod al oricărui element al oricărui șablon.

Găsiți linia dorită în blocul evidențiat cu albastru. Există un glisor în partea dreaptă, puteți derula și găsi linia de care aveți nevoie.

Principiul general al unde să cauți lucrurile:

Nume font - în linia FONT FAMILY

Dimensiunea fontului - în linia FONT SIZE

Culoare font - în linia COLOR

Iată trei linii principale în care numele, dimensiunea și culoarea fontului oricărui element se modifică. În dreapta în linia de stil css este dată poziția liniei în document. Dacă trebuie să schimbați un alt element (de exemplu, trebuie să aflați unde este linia unde puteți schimba culoarea barei de meniu sau culoarea linkurilor), totul se face exact la fel.

ATENŢIE:

Linia pe care o vom copia este evidențiată cu roșu în figură,

astfel încât să îl găsiți ulterior în foaia de stil.

4. Copiați linia. Deoarece în acest exemplu dorim să schimbăm culoarea numelui site-ului, copiez linia evidențiată în dreptunghiul roșu din a doua poză. În șablonul meu, este responsabil pentru schimbarea culorii titlului site-ului:

#header h1 a, #header h1 a:vizitat (

Găsiți linia necesară în fișierul „foaia de stil (style.css)”. Acest lucru este deja făcut în panoul de administrare. Cer cu tărie ca, deși nu există încredere și înțelegere completă, toate experimentele să fie efectuate pe un subdomeniu de testare pentru a exclude .

Deci, accesați panoul de administrare: CONSOLĂ - APARIȚIE - EDITOR. În bara laterală din dreapta găsim fișierul STYLE TABLE (STYLE.CSS), deschideți-l.

Acum deschideți linia de căutare folosind tastele CTRL + F: va apărea o fereastră de linie goală în fereastra de sus. Lipim în el linia pe care am copiat-o la pasul 4.

Și veți vedea cum va fi evidențiată această linie în foaia de stil (în portocaliu în imagine):

Facem o modificare a elementului. În cazul nostru, schimbăm culoarea fontului, așa că în linia COLOR înlocuim o altă valoare - culoarea pe care o dorim. În exemplu, culoarea este neagră, semnificația sa este:

Puteți selecta o culoare în orice serviciu de paletă de culori web: introduceți „Paletă de culori web” într-un motor de căutare și selectați-o pe cea dorită. Selectăm o culoare, copiem valoarea ei digitală și o înlocuim cu grijă cu cea veche. după care facem clic pe UPDATE FILE și mergem să vedem ce s-a întâmplat.

Dacă modificările nu sunt afișate, pentru ultima oră și mergeți din nou la pagină - de data aceasta ar trebui să fie afișat totul.

Este nevoie de mult timp pentru a descrie, dar în practică totul se face rapid, mai ales când apare îndemânarea inițială.

Mai detaliat, cum să schimbați anumite elemente:

Asta e tot pentru azi, nu te mai deranjez cu coduri. Sper că acum tu însuți poți găsi și schimba cu ușurință orice element al codului html, sau mai bine zis, codul css - experții să mă ierte că l-am simplificat. Și dacă nu vă dați seama, vizitați totuși pagina. Nu-ți pierde timpul cu prostii.

Vă sugerez să vizionați videoclipul lui Artem Abramovici despre cum să căutați și să găsiți orice cuvânt sau element în orice temă/șablon, pentru orice motor (wordpress, joomla etc.) și înlocuiți-l cu ceea ce aveți nevoie:

Vă rugăm să distribuiți dacă v-a plăcut:

Ați putea fi, de asemenea, interesat să știți:

Căutând prin nenumărate site-uri de pe Internet, puteți întâlni unele care ne plac foarte mult. Imediat apar o serie de întrebări. Site-ul a fost realizat folosind cod de casă sau un fel de CMS? Ce stiluri CSS are? Care sunt metaetichetele sale? Și așa mai departe.

Există multe instrumente care pot fi folosite pentru a extrage informații despre codul paginii unui site web. Dar avem întotdeauna butonul drept al mouse-ului la îndemână. Acesta este ceea ce vom folosi, folosind site-ul meu ca exemplu.

Cum se vede codul paginii?

Pentru a vizualiza codul sursă al unei pagini de site, trebuie să plasați mouse-ul peste orice zonă a paginii web (cu excepția imaginilor și a linkurilor). După aceasta, faceți clic pe butonul din dreapta al mouse-ului. În fața noastră se va deschide o fereastră cu mai multe opțiuni (ele pot diferi ușor în diferite browsere). În browserul Google Chrome, de exemplu, acestea sunt comenzile:

• spate;
• redirecţiona;
• repornire;
• salvează ca;
• sigiliu;
• traduceți în rusă;
• vizualiza codul paginii;
• vizualiza codul.

Trebuie să facem clic pe vizualiza codul paginii, iar codul html al paginii site-ului se va deschide în fața noastră.

Vizualizarea codului paginii: la ce să acordați atenție?

Deci, codul paginii HTML este o listă numerotată de linii, fiecare dintre ele conținând informații despre modul în care este realizat acest site. Pentru a învăța rapid să înțelegeți acest număr imens de semne și simboluri speciale, trebuie să faceți distincția între diferitele secțiuni ale codului.

De exemplu, liniile de cod din interiorul etichetei head conțin informații pentru motoarele de căutare și webmasteri. Ele nu sunt afișate pe site. Aici puteți vedea pentru ce cuvinte cheie este promovată această pagină, cum sunt scrise titlul și descrierea acesteia. Tot aici găsiți un link, în urma căruia vom afla despre familia de fonturi Google folosite pe site.

Dacă site-ul este realizat pe CMS WordPress sau Joomla, atunci acesta va fi vizibil și aici. De exemplu, această zonă afișează informații despre o temă WordPress sau un șablon de site Joomla. O puteți vedea citind conținutul linkurilor evidențiate cu albastru. Un link arată un șablon de site.

De exemplu:

//fonts.googleapis.com/css?family=Source+Sans+Pro%3A400%2C400italic%2C600&ver=4.5.3

Vom vedea stilurile de font CSS ale paginii. În acest caz, se folosește fontul. Acest lucru poate fi văzut aici - font-family: 'Source Sans Pro'.

Acest site este optimizat folosind plugin-ul Yoast SEO. Acest lucru poate fi văzut din această secțiune de cod comentată:

Acest site este optimizat cu pluginul Yoast SEO v3.4.2 - https://yoast.com/wordpress/plugins/seo/

Toate informațiile conținute în interiorul etichetei corporale sunt afișate de browser pe ecranul monitorului. Aici vedem codul html al paginii, iar în partea de jos este codul de script Yandex Metrics. Este înconjurat de o etichetă comentată cu textul:

/Yandex.Metrika contor

Să rezumam

După ce am efectuat o analiză destul de superficială a codului paginii principale a site-ului, putem trage o concluzie despre ce instrumente a fost realizată această pagină. Am vazut pe el:

• CMS WordPress;
• Font Google Source Sans Pro;
• Tema WordPress – Sydney;
• pluginuri Yoast;
• Contor de valori Yandex.

Acum principiul analizei codului html al unei pagini de site este destul de clar. Nu este deloc necesar să păstrați pagina pe care o căutați deschisă în browser. Puteți salva codul paginii pe computer folosind combinațiile de taste ctrl+a, ctrl+c, ctrl+v. Lipiți-l în orice editor de text (de preferință Notepad++) și salvați-l cu extensia html. Astfel, în orice moment îl poți studia mai profund și poți găsi mai multe informații utile pentru tine.

Am lansat o nouă carte, Social Media Content Marketing: How to Get Inside Your Followers' Heads and Make them to Love with Your Brand.

Codul sursă al unui site este o colecție de markup HTML, stiluri CSS și scripturi JavaScript pe care browserul le primește de la serverul web.

Mai multe videoclipuri pe canalul nostru - învață marketingul pe internet cu SEMANTICA

Poate fi comparat cu un set de comenzi date soldaților de către un comandant. Imaginați-vă că publicul nu îl vede și nu îl aude pe șeful. Din punctul lor de vedere, militarii desfășoară acțiuni în mod independent. În cazul nostru, comandantul este browserul, comenzile sunt codul sursă, iar soldații în marș sunt rezultatul final.

Site-ul este stocat pe un server web, care trimite pagina la cererea utilizatorului. O solicitare înseamnă introducerea unei adrese URL în bara de adrese, clic pe un link sau clic pe un buton de trimitere dintr-un formular. Nu contează în ce limbă sunt scrise paginile web sau dacă includ o componentă software. Rezultatul final al oricărui algoritm de pe partea serverului este un set de etichete HTML și text.
Codul sursă al paginii este un set de date care include:

• marcaj html;
• foaia de stil sau link la fișier;
• programe scrise în JavaScript sau link-uri către fișiere cu cod.

Aceste trei secțiuni sunt procesate de browser. Pentru server, acesta este pur și simplu textul care trebuie trimis ca răspuns la cerere.

De ce ar putea fi nevoie să studiem codul sursă

Tot ceea ce vedem, putem analiza și aplica pentru a rezolva anumite probleme care apar în timpul lucrului cu site-ul, mai ales la optimizarea acestuia. Privind codul sursă, putem:

• Vedeți metaetichetele site-ului dvs. sau al altcuiva pentru a le analiza.
• Vedeți prezența sau absența anumitor elemente pe site: contoare, coduri de identificare în diverse sisteme, anumite scripturi și alte lucruri.
• Aflați parametrii elementelor: dimensiuni, culori, fonturi.
• Găsiți calea către fotografii și alte elemente aflate pe pagină.
• Explorați linkurile din pagină.
• Găsiți probleme cu codul care interferează cu procesul de optimizare a site-ului: stiluri care nu sunt plasate în fișiere separate, scripturi, cod invalid.

Acestea sunt caracteristicile de bază, dar, de fapt, putând citi codul, puteți afla multe mai multe despre pagină.

Cum să vizualizați codul sursă al unui site

Nu va fi posibil să faceți acest lucru complet în forma în care este postat pe server din browser. Dar puteți vedea toate marcajele făcând clic dreapta pe pagină. Aici și mai jos folosind Google Chrome ca exemplu.

Selectați opțiunea „Vizualizare codul paginii” și obțineți lista completă într-o filă separată.

Este doar un text pe care trebuie să îl analizezi pentru a-l înțelege. Dar puteți obține cod interactiv folosind instrumentele pentru dezvoltatori.

Cum să găsiți codul sursă al unei pagini de site web

Faceți clic pe pictograma meniului din browser. Cel mai adesea este în dreapta și arată ca trei puncte sau dungi.

În secțiunea de instrumente suplimentare, selectați „Instrumente pentru dezvoltatori”.

Se va deschide o fereastră care arată starea activă a codului. Aceasta înseamnă că atunci când faceți clic pe marcaj, stilul elementului va apărea lângă acesta, iar blocurile selectate vor fi evidențiate pe pagină.

În fila „Sursă” puteți vizualiza conținutul unor fișiere: scripturi, fonturi, imagini.

În fila „Securitate”, puteți verifica certificatul site-ului.

Fila „Audituri” vă va ajuta să verificați resursa postată pe găzduire.

Dacă locația panoului din dreapta este incomod, puteți face clic pe cele trei puncte și îl puteți modifica selectând elementul dorit.

Cum să vizualizați metaetichetele

Fiecare document HTML include etichete de structură. Iată câteva dintre ele:

1. HTML – întregul document.
2. Head – secțiunea antetelor de serviciu.
3. Titlu – titlul paginii (afisat pe fila).
4. Corp – corpul documentului.
5. H1-H6 – titlurile textului paginii.
6. Articol – articol.
7. Sectiune - sectiune.
8. Meniu – meniu.
9. Div – bloc.
10. Span – sfoară.
11. P – paragraful.
12. Masa – masa.

Elementele sunt concepute pentru a delimita logic secțiuni pe o pagină, dacă este necesar, sunt proiectate folosind stiluri; Acestea conțin text care este cumva vizibil pe pagină. Dar eticheta Head conține informații de serviciu. Meta-etichetele sunt folosite pentru a indica acest lucru. Tot ceea ce este scris în ele este destinat serverului și motoarelor de căutare.

Conținutul lor nu poate fi aflat în niciun alt mod.

Să acordăm atenție etichetei Link. Cu ajutorul acestuia, sunt specificate link-uri către fișiere externe incluse. Dacă doriți, puteți vedea conținutul și puteți salva pe disc. Pentru a face acest lucru, mutați indicatorul la adresă și apăsați RMB. Selectați „Deschideți într-o filă nouă”.

Fișierul specificat se va deschide într-o filă nouă, pe care o puteți vizualiza sau salva.

Cum să vizualizați codul sursă al unei pagini pentru a depana un script

În acest caz, cel mai convenabil este să deschideți pagina pe mașina locală. Dacă trebuie doar să corectați marcajul, stilurile și scripturile, atunci acest lucru se poate face direct din folder. Codul HTML este vizualizat în același mod. Dar erorile de cod JavaScript pot fi văzute în fila „Consolă”. Aceasta arată descrierea erorii și numărul rândului în care a apărut.

Sintaxa poate fi văzută direct în cod. Pentru asta este fila „Sursă”.

Cum să vizualizați codul unui anumit element

Pentru paginile mari cu multe elemente, este dificil să găsești codul necesar în toate markupurile. În acest caz, ar trebui să utilizați o comandă specială din meniu contextual. Deplasați mouse-ul peste fragment și apăsați RMB. Selectați comanda „Vizualizare cod”.

Se va deschide aceeași fereastră, dar cu accent pe obiectul selectat.

Relua

V-am spus care este codul sursă al paginii. Este suficient să stăpâniți cunoștințele de bază despre HTML și CSS și, folosind instrumente convenabile pentru dezvoltatori, veți putea să vă depanați propriile documente HTML.

Revizuirea codului de resurse de pe Internet vă va permite să învățați nu numai din propria experiență, ci și să folosiți exemple reale de lucru. Iar pentru specialiștii SEO vor fi utile meta tag-urile, informațiile în care pot spune multe despre site.

Ctrl+U

Cum pot vedea codul sursă al unui element?

Faceți clic dreapta pe elementul de interes al paginii.

Google Chrome: „Vedeți codul elementului”

Operă: „Inspectați elementul”

FireFox: „Analiza element”

În alte browsere, căutați un element de meniu cu un înțeles similar.

Salutare tuturor!

Am expus totul în mod special la începutul articolului, pentru cei care caută un răspuns rapid.

Informația poate fi cunoscută de mulți, dar deoarece scriu pentru bloggeri începători, programatori web și alți prospectori, acest articol de referință este un must-have.

În viitor, veți studia cu siguranță codul sursă al paginilor și elementelor individuale.

Să ne uităm la un exemplu specific despre cum puteți utiliza vizualizarea codului sursă al unei pagini.

De exemplu, vrem să vedem ce cuvinte cheie sunt folosite pentru o anumită pagină. Mergem la pagina web care ne interesează și apăsăm Ctrl+U. Codul sursă al acestei pagini se va deschide într-o fereastră separată sau într-o filă separată. Apăsați Ctrl+F pentru a căuta un fragment de cod. În acest caz, introducem cuvântul „ cuvinte cheie”. Veți fi redirecționat automat către o bucată de cod cu această metaetichetă și cuvântul căutat va fi evidențiat.

Prin analogie, puteți căuta și studia alte fragmente de cod.

Vizualizarea întregului cod sursă al unei pagini nu este în cele mai multe cazuri foarte convenabilă, astfel încât în ​​toate browserele este posibil să vizualizați codul unui element sau fragment individual.

Să folosim un exemplu specific de vizualizare a codului unui element. De exemplu, să vedem dacă linkul are un atribut nofollow. Faceți clic dreapta pe linkul care ne interesează și în meniul contextual derulant, faceți clic stânga pe element „Vedeți codul elementului” sau similar (în funcție de browser). Mai jos, într-o fereastră specială pentru analiza codului, obținem ceva similar.

Vedem că codul de link conține rel="nofollow” . Aceasta înseamnă că PR nu va „scurge” prin acest link. Vom vorbi despre asta mai detaliat în articolele următoare. Acum, lucrul important este că acum știți cum să vizualizați codul sursă al paginii și codul sursă al unui element individual.

Multă vreme, opțiunea „show page source” a fost inutilă și neinteresantă pentru mine. Până acum, învățarea HTML pe Codecademy și proiectarea propriilor site-uri web nu au devenit noul meu hobby. Aici a apărut întrebarea: unde să găsești cazuri reale și să împrumuți soluții interesante pentru „pușculița” ta? Răspunsul a fost neașteptat de simplu, ca toate lucrurile ingenioase: uită-te la codul sursă al paginii în Google Chrome! Împărtășesc cu voi descoperirile mele modeste.

Care este codul sursă al paginii

Dacă tu, ca mine, abia faci primii pași în programarea HTML, ar fi o idee bună să afli care este codul sursă al unei pagini.

Codul sursă, cunoscut și sub numele de cod de pagină HTML, este text în limbajul de marcare hipertext (HTML). Include conținutul real al paginii (text, tabele) și etichete. Acestea din urmă acționează ca instrucțiuni pentru browser: cum să afișați conținutul, ce tip de formatare să utilizați, unde să introduceți un hyperlink sau un fișier media. Ei bine, pentru noi, programatorii începători, codul sursă este cel mai bun teren de antrenament: găsim un site interesant și îl spionăm, îl salvăm și folosim fragmente de succes. Cum?

Cum să vizualizați codul sursă în pagina browserului Google Chrome

Găsiți pagina care vă place. De exemplu, m-a interesat designul meniului site-ului. Există trei moduri de a deschide codul sursă în browserul Google Chrome:

1. Faceți clic pe pictogramă meniuîn colțul din dreapta sus al browserului și selectați „Mai multe instrumente”. Printre altele, există opțiunea „Vedeți codul sursă”. Sincer, folosesc rar această metodă: există o mulțime de mișcări inutile. Se poate face și mai simplu.
2. Apăsați combinația de taste Ctrl+U– se deschide o nouă fereastră cu codul sursă;
3. Pentru fanii meniului contextual: faceți clic dreapta pe pagină și selectați opțiunea „Vizualizare codul paginii”.

Ne-am descurcat sarcinii de a vizualiza codul HTML al paginii în browser. Să trecem la cea mai interesantă etapă.

Cum să editați și să salvați codul sursă

Pentru a învăța cum să creați site-uri web, nu este suficient să citiți codul HTML al altcuiva. Trebuie să te joci cu el, să experimentezi, să faci modificări și să verifici rezultatul. Puteți chiar să începeți prin a compila câteva mostre de succes. Cum editați și salvați codul sursă?

Opțiunea 1. „Manual”

După ce am deschis codul sursă al paginii, apelați meniul contextual și selectați opțiunea „Salvare ca” și salvați fișierul pe hard disk. Edităm fișierul în Notepad sau Notepad, salvăm modificările și îl deschidem prin browser. Rezultatele modificărilor noastre (reușite și nu atât de reușite) se vor reflecta în fereastra browserului.

Opțiunea 2. Pentru profesioniști

Când „te joci” cu codul sursă în fiecare zi, procesul „salvare – deschidere – schimbare – salvare – verificare” devine obositor. Pentru mine, am găsit o soluție sub forma instalării unui plugin pentru Google Chrome - Firebug Lite. Vă permite să editați și să salvați codul sursă fără a părăsi fereastra browserului.