Kako podesiti pametne telefone i računare. Informativni portal
  • Dom
  • OS
  • Kako napraviti web stranicu. Kreirajte prvu html stranicu

Kako napraviti web stranicu. Kreirajte prvu html stranicu

: HTML - Hypertxt Markup Language (ili Hypertext Markup Language).

Pa hajde da ga bolje upoznamo.

Prvo, kreirajte datoteku na svom računaru sa bilo kojim imenom i ekstenzijom .html (naslov mora biti na engleskom- na primjer index.html). Da biste kreirali takav fajl - kreirajte običan tekstualni dokument ("Start" - "Svi programi" - "Dodatna oprema" - "Beležnica") i sačuvaj ("Datoteka" - "Sačuvaj kao") bilo gdje unosom imena i ekstenzije (dešava se da kada unesete ekstenziju, notepad je i dalje sprema kao tekstualni fajl, ali nam je potrebna web datoteka. Da biste to uradili, prije snimanja odaberite tip datoteke - "Sve datoteke (*. *)").

Ovo nije preduvjet (pošto možete promijeniti naziv prve stranice u postavkama servera), već pravilo dobre forme. Naziv prve stranice je poželjno index (index.html), pošto server pri pristupu izdaje fajl sa ovim imenom - index.

Ako je ispravno sačuvana, ikona datoteke bi trebalo da se promeni u ikonu pretraživača (Internet Explorer podrazumevano).

Sada otvorite ovu datoteku kroz notepad i kopirajte ovaj kod tamo.

Ovo je prva web stranica!

Sačuvajte i otvorite pomoću pretraživača.

Čestitamo, upravo ste kreirali svoju prvu web stranicu.

Tekst "Ovo je prva web stranica!" možete je promijeniti u bilo koju drugu, na primjer, "Ovo je moja prva web stranica !!!". sačuvajte, ažurirajte pretraživač, divite se rezultatu.

Ali naša stranica nema naslov.

Ovo moramo popraviti - malo ćemo ispraviti kod, odnosno dodati mu "glavu stranice" pomoću oznaka i .</p><p> <html> <head> <title>Prva stranica Ovo je moja prva web stranica !!!

Čuvamo, ažuriramo, divimo se. Naša stranica sada ima zaglavlja.

Opis oznaka.

Prva oznaka je (ova oznaka je uparena, tj. završna oznaka obavezno) - koristi se kao kontejner koji sadrži sav sadržaj stranice (tekst, slike itd.). Iako ova oznaka ( i) nije obavezno, ali njegova upotreba govori o dobroj formi. Stoga vam savjetujem da ga koristite.

Sljedeća oznaka je ... Ovo je također uparena oznaka ( i). Ova oznaka se ne prikazuje na stranici (osim naslova), ali je potrebno specificirati dodatne parametre stranice - opis stranice (koje koriste pretraživači), ključne riječi (koje koriste pretraživači), stilove, skripte, naslov itd.

Tag </b>- uparena oznaka ( <title>i) je potrebno da navedete naslov stranice. Štaviše, ovu oznaku treba postaviti samo unutar oznake. !

I posljednja, u našem kodu, oznaka - ... Također uparena oznaka ( i), unutar kojeg se nalazi cijeli vidljivi dio stranice, tj. tekstove, slike, linkove, opšte informacije koje želite da postavite na sajt.

U sljedećoj lekciji ćemo govoriti o vrstama oznaka i pravilima njihovog pisanja.

Lekcija 2.

Kreiramo prvu html stranicu.

U ovom vodiču kreirat ćete svoju prvu web stranicu prema mojim uputama. Do sada, ne morate da ulazite u to kakve nerazumljive simbole ćete morati da koristite. U ovom tutorijalu pravimo stranicu, au sljedeće dvije lekcije ćemo u potpunosti razumjeti svaki napisani lik.

Prva stvar koju radimo je da kreiramo folder na radnoj površini i nazovemo ga "Site". Sve naše dalje kreiranje odvijat će se u ovom folderu.

Sada pokrenite Notepad ++ koji smo instalirali. (Ako to već niste učinili, onda upute za instalaciju). Program bi se prema zadanim postavkama trebao nalaziti u direktoriju / Program Files / Notepad ++ / ili ga možete pokrenuti putem Start. Otvorili smo program i zalijepili u njega sljedeći tekst:

& lthtml & gt
& lthead & gt
& lttitle & gtMoja prva stranica & lt / title & gt
& lt / glava & gt
& ltbody & gt
Zdravo! Ovo je moja prva web stranica!
& lt / tijelo & gt
& lt / html & gt

Većina ruskih internet stranica sastoji se od html stranica napisanih u UTF-8 kodiranju. Kako bi naše stranice bile ispravno prikazane u pretraživaču, koristit ćemo i ovo kodiranje.

Sada treba da sačuvamo naš fajl u html formatu.

Ne zaboravite da je Notepad ++ uređivač teksta, što znači da trenutno imamo običnu tekstualnu datoteku sa skupom simbola. Da bi naš pretraživač prikazao tekstualnu stranicu koju smo kreirali kao web stranicu, potrebno je da od nje napravimo datoteku sa html ekstenzijom.

Da biste to uradili, kliknite na dugme "Datoteka" u gornjem meniju, zatim "Sačuvaj kao", izaberite direktorijum (putu) gde će datoteka biti sačuvana, sačuvajte je u fascikli koju smo kreirali: Desktop / Site /, zatim većina što je najvažnije, odaberite željeni tip datoteke, u našem slučaju, ovo je Hyper Text Markup Language (html).


Čestitamo! Upravo ste kreirali svoju prvu web stranicu! Sada možete otići u folder "Site" i pokrenuti kreiranu datoteku. Stranica će se otvoriti pomoću pretraživača i vidjet ćete da umjesto nerazumljivih znakova koje smo ubacili, pretraživač na ekranu prikazuje sasvim razumljive informacije.

Sada nekoliko riječi o oznakama koje smo koristili za izradu ove stranice.

Opis html oznaka iz primjera

1. - ove oznake moraju biti prisutne na svakoj web stranici. Oni govore pretraživačima i pretraživačima da je ovo html stranica.

Svaka html stranica ima sljedeću strukturu:

... Oznake zaglavlja ... ... Tijelo stranice ...

2. - sav vidljivi sadržaj stranice je zatvoren između ovih oznaka.

4. - između ovih oznaka upisuje se naslov stranice, koji se prikazuje na samom vrhu pretraživača. Inače, kada tražite nešto na pretraživačima, prvo što se prikaže je naziv stranice. Tag često se skraćuje kao "naslov". Savjetujem vam da pročitate članak: kako kreirati oznaku </p> <p>Sada pređimo na oznake koje se nalaze u tijelu html stranice (unutra <body>i</body> ).</p> <p>5. <center></center>- ove oznake poravnavaju sve unutar sebe sa središtem. U ovom slučaju, centar će biti centar ekrana. Preporučuje se da ubuduće ne koristite ove oznake.</p> <p>6. <h1></h1>je jedna od klase oznaka naslova <h1>..<h6>, obično je u njemu priložen naslov stranice. Na primjer, ova stranica ima oznaku naslova "Primjer kreiranja html stranice".</p> Bilješka <p>ove oznake imaju veliku težinu u rangiranju sajta, tako da ih treba pažljivo i mudro koristiti.</p> <p>Kada sastavljate html kod, morate se pridržavati jednostavnog pravila: oznaka naslova mora ići prva <h1>, a onda već mogu ići <h2> , <h3>itd. Glavna stvar je da nema prvog <h2>, Onda <h1>, Onda <h3>itd. Trebalo bi da postoji stroga hijerarhija. Zaglavlja <h2> , <h3>itd. možda mnogo.</p> <p>7. <br/>je jedna oznaka i ne zahtijeva završnu oznaku. Prelazi na sljedeći red. U mom primjeru, napisao sam dvije pojedinačne oznake za redom da dvaput pređu na sljedeći red.</p> <p>8. <span><img src='https://i2.wp.com/URL_ИЗОБРАЖЕНИЯ' loading=lazy loading=lazy> </span> je jedna oznaka koja prikazuje sliku.</p> <ul><li>src je obavezan parametar, koji specificira adresu slike (umjesto IMAGE_URL, morate napisati adresu na kojoj je vaša slika pohranjena). <br><u>Bilješka</u>: <ul><li>Ako se slika nalazi u istom folderu sa vašom html-stranicom, onda je dovoljno da napišete naziv slike, u suprotnom trebate napisati apsolutni ili relativni URL;</li> <li>Ne zaboravite uključiti ekstenziju slike. Na primjer, .jpg, .gif, .jpeg.</li> </ul></li> <li>alt ili title - u ovim parametrima možete napisati opis za svoju sliku. Kada zadržite pokazivač iznad slike, pojavit će se ovaj opis. Ovi parametri su važni za promociju web stranice, posebno u pretraživanju slika. Ako se slika ne može učitati, tada će se prikazati ovaj tekst, što je također plus.</li> </ul><p>9. <font></font>- ove oznake su kreirane za promjenu fonta, pozadine, veličine itd. Ukratko, sve što se odnosi na formatiranje teksta može se konfigurirati u jednoj oznaci. Ova oznaka ima dosta atributa, o kojima ću raspravljati u posebnom vodiču.</p> <p>Napomena: - slična oznaka.</p> <p>Postoji i CSS svojstvo fonta gdje možete podesiti sve ove parametre.</p> <p>10. - isticanje podebljano. Sve između <b>i</b>će biti istaknuto podebljanim slovima. Na primjer, ako ga napišete na samom početku sadržaja, a zatvorite na samom kraju, tada će sav tekst na stranici biti istaknut podebljanim slovima. Ovo je prilično uobičajena oznaka, čiji je analog <strong></strong> .</p> <p>Pretraživači obraćaju pažnju na ovaj tag u smislu pojačavanja uticaja ključnih reči. Ali morate biti oprezni, jer svaki put kada podebljate ključne riječi, to će biti percipirano kao neželjena pošta.</p> <p>Instrukcije</p> <p>Kopirajte oznake ispod u notepad jer su potrebne za kreiranje. <br><html><br><head><br><title>



Prijeđite na kreiranje kostura stranice. Žičani okvir se kreira pomoću html tabele. Sada ćemo koristiti sljedeći okvir: zaglavlje na vrhu, slična traka na dnu, a glavni list će biti podijeljen na dvije polovine. Kopirajte žičani kod u svoju notepad.


meni sajta

Područje ispod



Zaglavlje stranice
Podnožje stranice

Odredite veličine ćelija. Pokušajte napraviti veličine koje smo naveli, a zatim odlučite koje su vam veličine potrebne. Unesite dimenzije u šifre okvira (ovo su parametri visina - visina i širina - širina).

Odaberite zaglavlja, pozadinu i podnožje stranice, umetnite ih u željene oznake. Slike se ubacuju pomoću oznake ... Sada bi oznake "Slide Header" i "Site Footer" trebale nestati.

Povežite sve umetnute slike zajedno. Da biste to učinili, u oznaci

u glavnu tabelu umetnite cellpadding = 0 i razmak ćelija = 0.

Uklonite razmak između zaglavlja i glavnog prostora stranice. Da biste to učinili, umetnite parametar poravnanja , ovako izgleda 

Ne zaboravite u kodu označiti koji se linkovi nalaze i koji. Ovo će pomoći u povezivanju stranica. Ovako bi trebalo da izgleda
Dom,
Linkovi.

Ne zaboravite dodati oznake
, potrebni su za prelazak na drugu liniju.
Vaša prva web stranica na dvije stranice je spremna!

Povezani video zapisi

Povezani članak

Izvori:

  • gotova web stranica u notepadu

Danas na internetu postoji ogroman broj različitih interneta web stranice... Vjeruje se da je stvaranje web stranice ovo je veoma komplikovan proces, ali nije! Svako može naučiti kako napisati najjednostavniji kod, na primjer, za "Site Business Card" (stranica od 2 - 3 stranice kreirana samo pomoću HTML-a). Svako može kreirati svoju ličnu reprezentaciju na World Wide Webu. Obično za stvaranje web stranice koristite posebne programe, to možete učiniti na uobičajeni način Notepad... U potonjem slučaju biće vam potrebno poznavanje HTML-a (HyperText Markup Language), kao i jezika za opisivanje izgleda dokumenta, CSS (Cascading Style Sheets).

Instrukcije

Kako bi stranica pisala kod za svaku stranicu, Notepad će služiti kao urednik za pisanje ovog koda. Na primjer, želite web stranicu sa samo jednom stranicom. i upišite u njega HTML kod ove stranice, slika prikazuje jednostavan kod.

Da biste ga pripremili, potrebno je da sačuvate napisani tekst u HTML formatu. Naziv datoteke mora biti napisan latiničnim slovima, ne smije sadržavati znakove interpunkcije, razmake, matematičke. Možete koristiti znak "_" i brojeve u nazivu datoteke. Datoteka mora biti sačuvana sa ekstenzijom .html ili .htm, na primjer page.html.Možete je dobiti na bilo kojem Internetu, rezultat je prikazan na slici.
Koristeći notepad, možete kreirati složenije stranice od raznih stranica koristeći posebne programske jezike.

Izvori:

  • izrada web stranica u primjerima notepada

U sistemima upravljanja relacionim bazama podataka, sve pohranjene informacije su predstavljene u različitim tabelama. Ovo osigurava da se eliminira redundantnost podataka. Odabir i rad sa potrebnim informacijama u takvoj bazi podataka ostvaruje se, između ostalog, korištenjem mehanizma povezivanja tabela. Veza između dvije tabele se vrši zajedničkim poljem u obje i specificirana je u šemi podataka trenutne baze podataka. Štaviše, potrebno je postaviti određeni tip podataka za polja povezanih tabela. U suprotnom, stvaranje veze između tabela će biti pogrešnog tipa ili se neće dogoditi.

Trebaće ti

  • Microsoft Access DBMS

Instrukcije

Popunite polja u tabelama podacima. Međutim, imajte na umu da za povezivanje ovih polja tabele moraju imati sličan tip podataka. Kada kreirate jedan prema više, polje može biti tipa Count. U ovom slučaju, odgovarajuće polje drugog stolovi mora biti numerički. Postavite polje sa tipom brojača kao ključ.

Otvorite šemu podataka baze podataka. Da biste to učinili, odaberite stavke "Alati" - "Šema podataka ..." u meniju Access DBMS. Na ekranu će se pojaviti oblast koja sadrži sve povezane osnovne elemente. Ako je oblast, automatski će se otvoriti prozor za dodavanje tabela. U suprotnom, poziva se iz kontekstnog menija date oblasti.

U ovom prozoru, u padajućim listama, navedite tražene nazive polja, ako ih ne možete tačno podesiti pomeranjem miša. Označite potvrdne okvire za sve stavke kako biste osigurali integritet podataka i kaskadne promjene podataka u povezanim tabelama.

Zadati tip odnosa će biti prikazan na dnu prozora. Ukupno postoje tri tipa odnosa: jedan-prema-jedan, jedan-prema-više i više-prema-više. Ako vam je za povezane tabele potreban odnos drugačije vrste nego što je prikazano u prozoru, onda ste pogrešno postavili tipove podataka polja vaših tabela.

Da biste uspostavili vezu, kliknite na dugme "Kreiraj" u prozoru. U području šeme podataka pojavljuje se veza između dvije tabele od jednog polja do drugog. Tip veze će biti šematski prikazan u prozoru na liniji sa brojem 1 i znakom beskonačnosti, koji označava odnos "prema mnogima". Sačuvajte bazu podataka. Sada dva stolovi spojeni u naznačenom omjeru.

Povezani video zapisi

Izgradnja vlastite web stranice ne izgleda tako zastrašujuće kao što se čini na prvi pogled, kada shvatite osnove HTML jezika i napravite najjednostavniji mogući web sajt. stranicu u običnom notepad to je na svakom kompjuteru. To je od kreiranja HTML stranica u notepad svi web programeri počeli su učiti izradu web stranica, a i vi možete savladati ovu jednostavnu nauku.

Instrukcije

Sačuvajte tekstualni dokument, ali ne u tekstualnom, već u html formatu - prilikom snimanja preimenujte datoteku u index.html. Otvorite rezultirajući fajl koristeći bilo koji pretraživač - vidjet ćete prazno stranicu, na kojoj će biti odštampan naslov sajta koji ste uneli u prethodnom koraku.

Sada možete otvoriti kreiranu datoteku u bilo kojem trenutku i nastaviti uređivati ​​njen kod za daljnje popunjavanje. Naučite osnovne html oznake za formatiranje stranica. Tag
koristite za umotavanje teksta u liniju ispod i oznaku i koristite za definiranje naslova stranice. Važna oznaka je - mora sadržavati tijelo dokumenta.

Dakle, nakon što ste kreirali bazu stranice, počnite je ispunjavati tekstom. Uzmite sve što želite da ugradite na web lokaciju, kopirajte i zalijepite odmah nakon oznake u dokument. Sačuvajte fajl.

Sada formatirajte tekst - razbijte ga na pasuse pomoću oznake

I poravnajte ga sa parametrom poravnanja sa vrijednostima lijevo, centar, desno, poravnajte. Po defaultu, sve u HTML-u je lijevo poravnato. Istaknite neke posebno važne tačke i naslove podebljanim slovima, stavite dio teksta u oznake. Da bi tekst bio kurziv, stavite ga u oznake .

Kako bi izgledao svjetlije i privlačnije, dodajte bilo koju sliku u tekst. Odaberite odgovarajuću ili fotografiju, smanjite je u bilo kojem uređivaču i spremite u mapu s datotekama za buduću stranicu. Unesite oznaku na mjesto u kodu gdje bi se ilustracija trebala nalaziti. Zamijenite sliku punim imenom vaše sačuvane slike. Ako želite, poravnajte sliku koristeći prethodno opisani parametar poravnanja. Sačuvajte dokument i otvorite ga kako biste bili sigurni da su slika i tekst na stranici.

Izvori:

  • kako napraviti web stranicu koristeći notepad

Za kreiranje jednostavne web stranice nisu potrebni posebni alati ili vještine. Dovoljno je nabaviti standardni program Notepad, koji je obično instaliran na svim Windows računarima.

Gospodo, dobro raspoloženje svima) Danas sam odlučio napisati članak na temu - Kako napraviti svoju web stranicu. Ovu temu su mi gurnuli čitatelji i prijatelji koji iz nekog razloga još uvijek ne razlikuju tipove stranica i stranica na internetu. Vrlo rijetko nešto nazivam web stranicom))) Međutim, mnogi moji prijatelji to često kažu. Posebno za njih, odlučio sam opisati glavne vrste web stranica koje možete kreirati za sebe kako biste imali neku vrstu reprezentacije sebe na mreži.

Prije kreiranja web stranice, svakako biste trebali kreirati email ili email adresu. Opisao sam opcije za kreiranje u ovom članku -. A ako imate adresu e-pošte, mi ćemo pratiti opcije za kreiranje vaše lične web stranice. Čitajte dalje za načine koji će vam pomoći da kreirate svoju web stranicu.

Stranica na jednoj stranici

Najstariji način))) Za to morate naučiti osnove HTML jezika. Raditi to u naše vrijeme uopće nije potrebno, postoji milion usluga, o čemu će biti riječi u nastavku. Međutim, ako želite razumjeti kako funkcionira stranica i, dijelom, internet, pokušajte sami kreirati jednostrano mjesto. Opisao sam kako to učiniti u članku -. Postoje opcije za izradu web stranice na jednoj stranici pomoću alata za izradu web stranica i besplatnih platformi.

Stranica na društvenoj mreži Vkontakte

Mislim da se u naše vrijeme fraza: "Napravio sam sebi stranicu na Internetu" najviše se odnosi na društvenu mrežu Vkontakte. VK je najpopularnija društvena mreža u ZND. Za kreiranje vlastite stranice ovdje je potrebna 1 minuta. Osim toga, postoji na desetine korisnih funkcija za korištenje Interneta.
Puno sam pisao o Vkontakteu i planiram pisati još više)) Sa ovom društvenom mrežom možete i.

Vkontakte vam takođe omogućava da kreirate pogodan URL za svoju web stranicu, umjesto standardnog URL-a prilikom registracije http://vk.com/id8032931. Onda ga možete promijeniti u prelijepu - http://vk.com/vasheimya.vashafamiliya.

Facebook stranica

Ako je Vkontakte najpopularnija društvena mreža u ZND, onda je Facebook društvena mreža broj 1 u cijelom svijetu. Smatra se da je Facebook za napredne korisnike koji govore ruski))) Ali lično, mislim da je to sve zbog činjenice da je Facebook veoma popularan i zgodan.

Baš kao iu Vkontakteu, možete sebi dodijeliti lijepu adresu za svoju web stranicu. Kompletan priručnik - kako napraviti web stranicu na Facebooku, opisao sam u članku -.

Blog

Blog je najpreporučljivija opcija za mene da kreiram svoju web stranicu. Blog pruža hiljade mogućnosti za samospoznaju i vrlo je jednostavan za korištenje. Često besplatno kao i web stranice društvenih medija.
Evo izbora članaka o kreiranju web stranice pomoću bloga:

  • - brzo, ali uz cijenu hostinga i zasebnog domena.
  • To je Google platforma za blogovanje. Integrisan sa mnogim Google uslugama. Veoma zgodno ako ste Google fan))
  • To je najbrže rastuća blogerska platforma. Pročitao sam statistiku u jednoj od američkih publikacija da je Tumblr popularniji među djecom u SAD 12-13 godina od Facebooka !!! Mislim da je ovo pokazatelj pogodnosti i razvoja ove platforme.
  • - evo priručnika za skoro sve poznate platforme za blogovanje, uključujući i gore navedene.

Dnevnik

Ovdje su sve osnovne opcije za kreiranje vaše web stranice ili, drugim riječima, vaše web prisutnosti. Bukvalno 1 minut i već uranjate u prostor World Wide Weba. Sretan razvoj web stranice!

Top srodni članci