Faqja është në fakt një koleksion skedarësh nga kodi në disa gjuhë. Dhe kodi mund të shkruhet në çdo redaktues teksti normal, madje edhe në bllokun e shënimeve. Sigurisht, është më mirë të përdorni softuer më të avancuar si Notepad ++ ose programe zhvillimi të plota. Epo, mirë, le të shohim se si të krijojmë një faqe interneti në notepad duke përdorur html dhe css.
Si të krijoni një faqe interneti nga e para në html në bllokun e shënimeve - udhëzime hap pas hapi
Dhe këtu është dhe fjala jonë kyçe - HTML. Është nga kjo gjuhë që fillon krijimi i faqes. Është e pamundur të imagjinohet zhvillimi i uebit pa të. Është si të përpiqesh të gatuash supë pa ujë. Mos nxitoni të mbyllni faqen nëse jeni zero absolute në html. Në këtë tutorial hap pas hapi, ne do të krijojmë së bashku një faqe interneti të thjeshtë dhe do të përpiqem të shpjegoj pjesët e kodit që do të shtojmë në notepad.
Hapi 1. Krijo skedarë
Për të krijuar një sajt html në notepad, duhet të filloni duke krijuar dy dokumente teksti në një dosje boshe. Njëra duhet të marrë shtesën .html dhe e dyta .css. Emrat mund të jenë çdo gjë. Vini re, jo site.html.txt, por site.html.
Për ta bërë këtë, ndërsa ruani dokumentin manualisht, shtoni një shtrirje pikë në të. Ne bëjmë të njëjtin manipulim me skedarët e dytë, por i japim shtesën .css. Oh po, mos harroni të zgjidhni kodimin UTF-8.
Hapi 2. Vendosja e strukturës
Skedarët janë krijuar dhe ju mund të filloni të punoni. Hapni dokumentin html. Puna kryesore do të zhvillohet në të. Blloku i ndërtimit në këtë gjuhë janë etiketat - fjalë të veçanta në kllapa këndore që i tregojnë shfletuesit se çfarë të shfaqë në një faqe interneti.
Le të dhe ne do të fusim diçka në dokumentin tonë, përndryshe ai është plotësisht bosh.
Pra, ne futëm një mori etiketash menjëherë dhe ndoshta nuk kuptoni asgjë. Provoni të hapni faqen në një shfletues. Aty do të shihni fjalët "Përshendetje Botë" nëse bëhet si duhet. Kjo është, në fakt, faqja më e thjeshtë në internet.
html është një kontejner për të gjitha etiketat e tjera. Ai përmban të gjithë faqen e internetit.
Në krye, ne kemi treguar llojin e dokumentit. Etiketa e kokës është informacioni i shërbimit në lidhje me faqen. Këtu po përdorim etiketën
Siç mund ta shihni, ka etiketa të çiftuara dhe ka etiketa të vetme. Tani nuk do të ndalem në këtë në detaje, varet nga cilat funksione kryen komanda.
Hapi 3. Planifikimi
Tani për tani, le ta lëmë kodin vetëm për një moment dhe të mendojmë. Cili mendoni se është një burim tipik ueb? Sigurisht, ka shumë prej tyre në rrjet dhe të gjithë janë të ndryshëm, por ka disa elementë identikë të strukturës, apo jo? Për shembull, menutë vertikale dhe horizontale, kolonat anësore, titujt (në pjesën e sipërme ku ndodhet logoja) dhe fundi (fundi i faqes).
Pra, le të shkojmë dhe ne do të planifikojmë se si të krijojmë faqen tonë të parë të thjeshtë. Në këtë biznes, gjithçka duhet të fillojë me planifikim. Është e nevojshme të theksohen pjesët strukturore të shabllonit të ardhshëm, nga i cili do të përbëhet. Le të themi se shablloni ynë i thjeshtë ka një kokë, një pjesë kryesore të përmbajtjes, një kolonë anësore dhe një fund ose fund (e njëjta gjë).
Hapi 4. Le të fillojmë!
Kjo do të thotë se na duhen 4 blloqe kryesore. Në html, është e mundur të futni një numër të pakufizuar etiketash të tjera në një etiketë të çiftuar, kështu që unë sugjeroj metodën e mëposhtme:
Krijoni një enë të përbashkët në të cilën do të vendosen të 4 blloqet tona kryesore.
Pra, kthehu te kodi. Do ta shkruajmë në etiketën e trupit, pasi është faqja e ardhshme. Ju mund ta hiqni me siguri mbishkrimin "Përshendetje Botë", dhe shkruani këtë:
Kështu, krijuam një bllok të madh, në të cilin vendosëm 4 tjetrin. Blloku në html krijohet nga një palë etiketa div, e cila nuk ka atributet e kërkuara, por menjëherë i shtova secilit një id (identifikues) unik. në mënyrë që të stiloni më vonë pamjen përmes CSS.
Kopjojeni këtë kod për veten tuaj dhe rifreskoni faqen në shfletues. Për sa kohë që shihni vetëm 4 rreshta teksti para jush, por asgjë, tani ne do t'i kthejmë ato në një faqe interneti!
Hapi 5. CSS do të na ndihmojë
Tani le të fillojmë të stilojmë blloqet tona. Sigurisht, duhet të filloni me enën më të madhe. Ne krijuam një skedar css që në fillim, por nuk i kemi shkruar kurrë asgjë. Tani është koha për ta rregulluar atë. Le të shtojmë kodin e mëposhtëm atje:
* (madhësia e kutisë: kutia kufitare) #main (gjerësia: 810 px; diferenca: 0 automatike; kufiri: 5 px e zezë e fortë)
Rregulli i parë e vendos këtë sjellje për kutitë në mënyrë që mbushja dhe kufijtë të mos rrisin gjerësinë e tyre. Më tej në kod, i referohemi bllokut me identifikuesin kryesor, për këtë mjafton të vendosni një hash dhe të shtoni emrin e identifikuesit. Kllapat kaçurrelë ndiqen menjëherë, duke renditur rregullat e paraqitjes që do të zbatohen në element.
Ne vendosëm gjerësinë e përgjithshme të kontejnerit në 810 piksele, marzhi i rregullit: 0 automatikisht vendos kutinë në qendër, domethënë, faqja jonë do të shfaqet bukur në qendër dhe jo e shtypur në të majtë. Vetia e fundit, kufiri, shton një kufi të zi, të fortë në secilën anë të kutisë.
Epo, ne kemi bërë stilimin e kontejnerit kryesor. Në faqen e internetit, ne ende shfaqim 4 rreshta teksti, por në një kornizë të zezë. Leviz.
Tani është koha për të personalizuar pamjen e katër blloqeve kryesore të ndërtimit të faqes sonë. Do të jap menjëherë kodin dhe më poshtë do ta komentoj.
#header (lartësia: 100 pikselë; fundi i kufirit: 5 pikselë i zi i fortë) #bari anësor (gjerësia: 200 pikselë; lartësia: 500 pikselë; float: majtas; kufiri-djathtas: 5 px e zezë e fortë) #content (gjerësia: 600 px; notimi: djathtas; lartësia : 500 pikselë) #footer (lartësia: 75 pikselë; e qartë: të dyja; kufiri i sipërm: 5 px e zezë e fortë;)
Siç mund ta imagjinoni, unë thjesht i referohem elementeve me ID të ndryshme, duke i përshkruar ato nga lart poshtë. Koka është stiluar së pari - vendosa lartësinë në 100 px dhe një kufi në fund për ta ndarë atë nga pjesa tjetër e kutive.
Por më pas gjithçka bëhet më interesante. Fakti është se, si parazgjedhje, blloqet shfaqen nga lart poshtë, nëse thjesht i shkruani në kodin html dhe nuk vendosni ndonjë rregull shtesë. Por kolona anësore është për atë dhe anën, për t'u shfaqur në anën e pjesës kryesore të faqes. Por si ta bëjmë atë? Shikoni, ne vendosëm lartësinë, gjerësinë, kufirin dhe një veçori të shiritit anësor (lundrues: majtas).
Ky rregull do të thotë që elementi do të ngjitet në skajin e majtë të prindit (d.m.th., elementi prind - blloku #main). E shkëlqyeshme, tani do të vendosim të njëjtën veti në bllokun e përmbajtjes dhe do të shtypet gjithashtu në skajin e majtë, por pas kolonës anësore.
Sigurisht, përmbajtja merr më shumë gjerësi, sepse duhet të jetë, por ne vendosim të njëjtën lartësi. Në një sajt të vërtetë, zakonisht do të ketë shumë informacione në bllokun kryesor, kështu që nuk keni nevojë të vendosni fare lartësinë. Është e njëjta gjë me shiritin anësor nëse informacioni i shtohet vazhdimisht. Por për shembull, ne kemi përshkruar në mënyrë eksplicite lartësinë në mënyrë që madhësitë e blloqeve të mund të shihen qartë.
Më në fund, mbetet për të përshkruar bllokun e fundit - fundi i faqes... Ai merr një lartësi të vogël, një kornizë me lartësi dhe një pronë më shumë që është e re për ne. Kjo pronë është e qartë me vlerën e të dyjave. Pse ta shkruani? Ne shtypëm dy blloqet e mëparshme në skajin e majtë. Ato janë bërë të ashtuquajturat blloqe lundruese, por si parazgjedhje, blloqet e rregullta mund të mos vërejnë blloqe lundruese dhe t'i kalojnë mbi to.
Për të parandaluar që kjo të ndodhë, bodrumi ynë mori pikërisht një komandë të tillë - ata thonë, shikoni, një bllok i zakonshëm, dy lundrues janë vendosur sipër jush. Vini re ato dhe pozicionojeni veten më poshtë se ata. Kjo është komanda, në fakt, jepet nga e qartë: të dyja pronat, e cila detyron një bllok të rregullt të pozicionohet poshtë të gjithë atyre lundrues.
E shkëlqyeshme, tani rifresko faqen në shfletuesin tuaj. Epo, tashmë duket shumë më tepër si një faqe, të paktën në strukturë.
Hapi 6. Ngjyrosja e faqes
Faza tjetër, shumë interesante - le të shtojmë disa ngjyra në faqen tonë. Le të mos ketë një sfond të bardhë të fortë, por diçka më interesante. Ka dy mënyra për të vendosur sfondin:
- Sfondi i përgjithshëm për të gjithë sitin menjëherë, duke e caktuar atë në kontejnerin e përgjithshëm #main
- Nëse secili prej blloqeve kryesore duhet të ketë hijen e vet të ngjyrës, atëherë duhet të vendosni një ngjyrë për secilin veç e veç. Por është më mirë të mos tërhiqesh shumë - kapela e kuqe, përmbajtja jeshile dhe fundi i verdhë nuk do të duken shumë të mira, do t'ju them menjëherë
Unë propozoj ta bëj atë sipas metodës së parë. Këtu gjeta një nuancë të bukur blu të çelur në një shërbim në internet, të cilën unë propozoj të bëj sfondin e faqes. Shtoni veçorinë e mëposhtme në stilet e kontejnerit të përbashkët:
#kryesore (sfondi: # B3C1E6)
Ne përditësojmë faqen dhe sigurohemi që faqja jonë të ketë marrë një skemë të këndshme me ngjyra blu të lehta. Tani unë propozoj që të avancohet paksa niveli i dizajnit - le të jetë sfondi i kokës dhe futbollit më të errët se ai i pjesës tjetër të blloqeve. Ju mund të shtoni linjat e mëposhtme të kodit:
#header, #footer (sfondi: # 9091DA)
Këtu kemi aplikuar një teknikë të re - kemi shkruar dy blloqe të ndara me presje dhe sfondi i ri do të aplikohet për të dy.
Hapi 7. Puna në kokë
Puna e mëtejshme do të jetë projektimi i blloqeve individuale në një gjendje më tërheqëse. Le të fillojmë me kapak. Çfarë veshim zakonisht një kapele? Është e drejtë, një emër dhe logo e bukur e faqes. Kjo është ajo që do të shtojmë.
Unë sugjeroj të filloni me logon. Meqenëse po krijojmë faqen duke përdorur html, logon e kësaj gjuhe do ta vendosim në këndin e majtë të kokës. Gjeta një logo kaq të lezetshme në internet.
Duhet ta shkarkoni dhe ta vendosni në të njëjtën dosje ku ruhet dokumenti html.
Tani shikojmë:
#header (sfondi: # 9091DA url (html.jpeg) pa përsëritje 5% në qendër)
Unë e quajta foton html, dhe formati i saj është jpeg, prandaj një rekord i tillë. Më tej, ne treguam gjithashtu komandat e mëposhtme: imazhi i sfondit nuk duhet të përsëritet, por duhet të pozicionohet me një zhvendosje prej 5% horizontalisht nga fillimi i bllokut dhe në qendër vertikalisht. Pozicioni horizontal regjistrohet gjithmonë i pari, i ndjekur nga pozicioni vertikal.
Natyrisht, nëse fotografia juaj emërtohet ndryshe ose ka një format tjetër, atëherë duhet të ndryshoni pak kodin e dhënë. E shkëlqyeshme, ne kemi një logo. Është koha për të hequr titullin - ky është titulli i faqes dhe zëvendësohet me një titull të bukur. Hiqni tekstin nga kreu dhe futni një element të ri atje:
Tani ju duhet ta rregulloni atë:
#title (madhësia e shkronjave: 32 px; float: majtas; margjina-majtas: 200 px; font-familja: Tahoma; ngjyra: e verdhë; mbushja e sipërme: 20 px; teksti-hije: 0 0 5px portokalli;)
Ne kemi vendosur një sasi të mirë stilesh: madhësia e shkronjave, familja e shkronjave, drejtimi majtas, mbushja majtas, ngjyra, mbushja e sipërme dhe hija e tekstit. Nuk ka kuptim të shpjegojmë se si funksionon çdo pronë tani, kështu që thjesht kopjoni kodin dhe ngjisni atë në fletën tuaj të stilit (skedari css).
Kjo është ajo, një kapelë e thjeshtë është gati. Natyrisht, në një faqe reale, mund të përmbajë disa lidhje të tjera, adresa, etj. Epo, le të shtojmë diçka për realizëm. Ky kod html duhet të futet në përmbajtjen e kokës së faqes.
- Rreth Nesh
- Blog
- Feedback
Ai formon një listë të tre lidhjeve të tyre. Në fakt, ata duhet të çojnë diku, por këtu janë thjesht hallka boshe. Ne gjithashtu do të rregullojmë listën dhe lidhjet në të.
#about (float: djathtas; stili i listës: asnjë; margjina-djathtas: 50 px) #about a (ngjyra: e verdhë;)
Hapi 8. Krijimi i një menuje të shiritit anësor
Zakonisht shiriti anësor përmban menunë e faqes dhe shumë pajisje të tjera. Le të bëjmë një menu të thjeshtë atje. Përsëri, lista do të na ndihmojë për këtë, me ndihmën e së cilës ne kemi shfaqur tashmë lidhje në kokë, por meqenëse menyja kryesore është në teori më voluminoze, do të ketë më shumë lidhje.
Menyja (stili i listës: asnjë)
Në fakt, këtu kam shkruar vetëm një rregull - hoqa shënuesit nga artikujt e listës, gjithçka tjetër është në rregull. Ju gjithashtu mund të shtoni një titull përpara menysë dhe ta stiloni atë disi. Ju mund ta bëni vetë. Titujt janë shkruar në etiketa të çiftuara
- , ku i pari është më i madhi (titulli i artikullit) dhe i fundit është më i vogli, shpesh nuk zbatohet fare. Për titullin e menysë në kolonën anësore, është optimale të merret .Hapi 9. Dizajnoni bllokun e përmbajtjes
.Hapi 9. Dizajnoni bllokun e përmbajtjes
Epo, çfarë është ajo për të hartuar atje? Duhet të shtoni pak tekst për ta bërë atë të duket si një faqe e vërtetë me një artikull.
Titulli i artikullit
Dhe këtu do të jetë një artikull ...
Përmbajtja në artikull është e ndarë në paragrafë dhe nëntituj ...
Nëntitulli i artikullit
Çdo përmbajtje mund të futet në një bllok përmbajtjeje. Paragrafët në të formojnë përmbajtjen kryesore, dhe etiketat h1-h2 formojnë titujt dhe nëntitujt. Etiketë h1 duhet të jetë i vetmi në faqe.
Dizajni në këtë rast është të përcaktojë ngjyrën e tekstit. Për shembull, mund të vendosni ngjyrë kafe. Titujt mund të theksohen me një nuancë paksa të ndryshme. Këtu nuk do të jap asnjë kod, ju vetë mund ta mendoni vetë.
Hapi 10. Dekorimi i bodrumit
Për të qenë i sinqertë, nuk kam dëshirë të fus diçka në bodrum tani. Në sajtet reale, ai pret informacione për të drejtat e autorit, ndonjëherë ai pret menutë dhe lidhjet me sajte të tjera. Unë thjesht do të shkruaj fjalën e autorit atje dhe do ta përqendroj kështu:
#footer (lidhja e tekstit: në qendër)
Hapi 11. Jo, nuk ka më hapa
Kjo, në fakt, është e gjitha. Procesi i krijimit të shabllonit më të thjeshtë html mund të konsiderohet i përfunduar. Ne kemi një logo, një emër faqeje, një menu, një artikull, një fund. Në përgjithësi, ky është një sit shumë primitiv, por ende një vend.
Sigurisht, faqja duket sikur nuk dëshironi ta shikoni më kurrë, por kjo nuk e ndryshon thelbin. Pamja e bukur është puna e një projektuesi të internetit.
Dhe çfarë të bëni me të më pas?
Qëllimi i këtij artikulli ishte thjesht t'ju tregojë se si të krijoni një faqe interneti të thjeshtë duke përdorur html dhe css. Mund të punoni në dizajnin e tij dhe mund të përfundoni me diçka tërheqëse. Por ju ende duhet të mbani mend se kjo është një faqe statike. Nëse shtoni faqe të reja në të, atëherë kjo bëhet me dorë, duke krijuar dokumente të reja html.
Kjo metodë e menaxhimit të faqeve të internetit është një gjë e së kaluarës, megjithëse ka avantazhet e saj. Për të vendosur një sajt në rrjet, duhet të ngarkoni të gjithë skedarët html, fletën e stilit dhe imazhet e nevojshme në disa hoste, me pagesë ose falas. Ju gjithashtu duhet të regjistroni emrin e sajtit që ajo të emërtohet disi. Një domen i nivelit të tretë mund të merret falas nga shumë kompani, por ju do të duhet të paguani për një domen të nivelit të dytë (.ru, .com, .ua, etj.)
Ajo që bëmë me ju gjatë këtij artikulli quhet faqosja e faqes. Nëse dëshironi të menaxhoni faqen tuaj duke përdorur një redaktues të përshtatshëm vizual, atëherë faqosja e bërë tashmë do të duhet të integrohet me ndonjë nga motorët e njohur. Më e mira me WordPress.
Kjo është një temë më vete - integrimi është shumë më i ndërlikuar sesa vetë faqosja. Për të mësuar se si të krijoni faqe për motorin, duhet të kaloni një kurs të mirë trajnimi. Informacioni falas në internet mund të mos jetë i mjaftueshëm për ju. Unë përshkrova procesin e krijimit të një siti në wordpress, por atje nuk do të gjeni informacione se si të integroni një shabllon html me motorin.
Artikulli prezantoi të ashtuquajturën metodë të paraqitjes së bllokut, domethënë ne vendosëm të gjithë përmbajtjen në blloqe. Kjo është ende metoda më e popullarizuar sot. Në përgjithësi, në këtë proces, është e dëshirueshme të përdoren etiketat HTML5, dhe jo vetëm blloqe, por për hir të thjeshtësisë, opsioni më i thjeshtë u aplikua në këtë artikull.
Shpresoj se keni të paktën një ide minimale se si të krijoni një faqe html në notepad ose në ndonjë redaktues tjetër teksti.
Zotërinj, humor i mirë për të gjithë) Sot vendosa të shkruaj një artikull me temën - Si të krijoni faqen tuaj të internetit. Kjo temë më është shtyrë nga lexues dhe miq të cilët, për disa arsye, ende nuk bëjnë dallimin midis llojeve të faqeve dhe faqeve në internet. Unë shumë rrallë e quaj diçka një faqe interneti))) Megjithatë, shumë nga miqtë e mi e thonë shpesh këtë. Sidomos për ta, vendosa të përshkruaj llojet kryesore të faqeve në internet që mund të krijoni për veten tuaj në mënyrë që të keni një lloj përfaqësimi të vetes tuaj në internet.
Para se të krijoni një faqe në internet, duhet patjetër të krijoni një adresë emaili ose emaili. Unë përshkrova opsionet për krijimin në këtë artikull -. Dhe nëse keni një adresë emaili, atëherë ne do të ndjekim opsionet për krijimin e faqes tuaj personale të internetit. Lexoni për mënyrat për t'ju ndihmuar të krijoni faqen tuaj të internetit.
Faqe me një faqe
Mënyra më e lashtë))) Për të ju duhet të mësoni bazat e gjuhës HTML. Të bësh këtë në kohën tonë nuk është aspak e nevojshme, ka një milion shërbime, të cilat do të diskutohen më poshtë. Megjithatë, nëse doni të kuptoni se si funksionon faqja dhe, pjesërisht, interneti, atëherë përpiquni të krijoni vetë një faqe me një faqe. Unë përshkrova se si ta bëj këtë në artikull -. Ekzistojnë opsione për ndërtimin e një faqe interneti me një faqe duke përdorur ndërtuesit e faqeve të internetit dhe platformat falas.
Faqe në rrjetin social Vkontakte
Unë mendoj se në kohën tonë fraza: "Kam krijuar një faqe për veten time në internet" i referohet mbi të gjitha rrjetit social Vkontakte. VK është rrjeti social më i popullarizuar në CIS. Duhet 1 minutë për të krijuar faqen tuaj këtu. Për më tepër, ka dhjetëra funksione të dobishme për ju që të përdorni internetin.
Kam shkruar shumë për Vkontakte dhe kam në plan të shkruaj edhe më shumë)) Me këtë rrjet social, ju mund dhe.
Vkontakte gjithashtu ju lejon të krijoni një URL të përshtatshme në faqen tuaj të internetit, në vend të URL-së standarde kur regjistroheni http://vk.com/id8032931. Atëherë mund ta ndryshoni në një të bukur - http://vk.com/vasheimya.vashafamiliya.
Faqja në Facebook
Nëse Vkontakte është rrjeti social më i popullarizuar në CIS, atëherë Facebook është rrjeti social numër 1 në të gjithë botën. Facebook, konsiderohet, duket se është për përdoruesit e avancuar që flasin rusisht))) Por personalisht, unë mendoj se kjo është e gjitha për faktin se Facebook është shumë i popullarizuar dhe i përshtatshëm.
Ashtu si në Vkontakte, ju mund t'i caktoni vetes një adresë të bukur për faqen tuaj të internetit. Një manual i plotë - si të krijoni një faqe në internet në Facebook, përshkrova në artikull -.
Blog
Blog është opsioni më i rekomanduar për mua për të krijuar faqen tuaj të internetit. Blogu ofron mijëra mundësi për vetë-realizim dhe është shumë i lehtë për t'u përdorur. Shpesh aq falas sa faqet e internetit të mediave sociale.
Këtu është një përzgjedhje e artikujve për krijimin e një faqe në internet duke përdorur një blog:
- - i shpejtë, por me koston e pritjes dhe një domen të veçantë.
- Është një platformë blogimi nga Google. I integruar me shumë shërbime të Google. Shumë i dobishëm nëse jeni adhurues i Google))
- Është platforma e blogimit me rritje më të shpejtë. Kam lexuar statistika në një nga botimet amerikane se Tumblr është më i popullarizuar në mesin e fëmijëve amerikanë 12-13 vjeç sesa Facebook !!! Mendoj se ky është një tregues i komoditetit dhe zhvillimit të kësaj platforme.
- - këtu janë manualet për pothuajse të gjitha platformat e njohura të blogjeve, përfshirë ato të mësipërme.
Ditari
Këtu janë të gjitha opsionet bazë për krijimin e faqes tuaj të internetit, ose, me fjalë të tjera, praninë tuaj në ueb. Fjalë për fjalë 1 minutë dhe ju tashmë jeni duke u zhytur në hapësirën e World Wide Web. Gëzuar zhvillimin e faqes në internet!
Përshëndetje të gjithëve, të dashur miq dhe të ftuar të blogut tim! Oh. Sapo vura re që Yandex më dha TIC 20, megjithëse dje ishte 0. E kuptoj që TIC nuk do të thotë asgjë, por është ende shumë e këndshme dhe e gëzueshme. Epo, në përgjithësi, doja të vazhdoja ciklin e artikujve të filluar së fundmi për ndërtimin e faqes. Dhe gjëja e parë me të cilën do të doja të filloja është me bazat e gjuhës së shënjimit të hipertekstit (jo programimit!) HTML.
HTML është ende baza e gjithçkaje, dhe edhe nëse nuk jeni një zhvillues i lezetshëm i uebit, por do t'i bëni faqet tuaja në motorë, atëherë njohja e gjuhës HTML do të jetë një plus i madh dhe i guximshëm. Prandaj, në artikullin tim sot, dua t'ju tregoj se si të krijoni një faqe html duke përdorur bllokun e shënimeve.
Sigurisht, ajo që do të bëjmë sot do të jetë e vështirë për ta quajtur një faqe, kështu që unë them menjëherë se sot nuk do të krijojmë një faqe të lezetshme, por do t'ju tregoj strukturën se si ndodh gjithçka me këtë metodë të krijimit të ueb-it tuaj. burim. Unë mendoj se nuk duhet të keni ndonjë vështirësi. Si rezultat, ne do të krijojmë faqen më të thjeshtë të internetit për të filluar. Dhe nëse jeni gati, le të shkojmë!
Së pari, krijoni një dokument me tekst të thjeshtë ose hapni bllokun e shënimeve. Për të hapur një bllok shënimesh, mund të telefononi linjën "Run" dhe të futni bllokun e shënimeve atje. E keni hapur? Te lumte!
Çdo dokument html ose sajt shënohet duke përdorur etiketa speciale. Një etiketë është një shenjë e veçantë që i jep një komandë faqes se si të shfaqë saktë një pjesë të caktuar të përmbajtjes të mbyllur në të. Tani nuk do të ndalem në këtë në detaje, pasi do t'ju tregoj për etiketat në faqen time.
Thjesht do të them që shumica e etiketave janë të çiftëzuara, d.m.th., së pari vendoset etiketa hapëse dhe pasi të kemi shkruar informacionin, duhet të mbyllim etiketën. Mbyllet në të njëjtën mënyrë si hapet, vetëm para mbylljes është e nevojshme të vendosni një shenjë "/".
Në përgjithësi, për të funksionuar, duhet të vendosim disa etiketa të nevojshme. Le të shohim se çfarë janë ato.
- - kjo është etiketa kryesore, falë së cilës i tregojmë faqes se tani do të shkruajmë këtu në HTML, kështu që mos u shqetësoni. Faqja duhet të fillojë me të dhe të mbyllet me të.
- - informacioni i shërbimit futet këtu, për shembull, emri i dokumentit, përshkrimi dhe shumë të tjera. Vendoset menjëherë pas etiketës së hapur .
- Midis këtyre vlerave ne shkruajmë titullin e faqes, domethënë, ky titull do të shfaqet jo në përmbajtjen e vetë faqes, por në skedën e shfletuesit. Ky lloj vendoset ndërmjet dhe .- - kjo etiketë është përgjegjëse për shfaqjen e përmbajtjes në faqe. Kjo do të thotë, gjithçka që shkruani midis këtyre etiketave do të shfaqet në faqen e internetit.
Ndjej se jo të gjithë kanë kuptuar gjithçka, dhe disa kanë një rrëmujë në kokën e tyre, kështu që unë do t'ju tregoj gjithçka me një shembull të drejtpërdrejtë.
Shembull i gjallë
Pra, ne krijojmë një dokument teksti dhe shkruajmë përmbajtjen e mëposhtme atje:
a keni shkruar? Te lumte! Këtu ju dhashë informacion specifikisht në formën e një fotoje, dhe jo në formë teksti, kështu që ju nuk do ta kopjoni atë. Këtu unë jam një i poshtër, apo jo?)) A e keni vënë re që etiketat janë të ngulitura në njëra-tjetrën si kukulla fole? Kështu duhet të jetë.
Këshilla! Mundohuni të mos e kopjoni përmbajtjen, por ta rishkruani vetë. Kështu, ju do të mësoni të gjithë materialin shumë më mirë dhe më shpejt.
Pastaj ruani dokumentin tuaj në formatin html. Për ta bërë këtë, kur ruani, pasi të keni emërtuar dokumentin tuaj, vendosni një pikë dhe shkruani html. Kjo është, ju duhet të keni index.html. Pastaj dokumenti juaj do të ruhet automatikisht jo si një dokument teksti, por si një faqe interneti. Dhe kur ruani dokumentin, ndryshoni kodimin në UTF-8. Ju mund ta hapni këtë skedar duke përdorur çdo shfletues. Le ta bëjmë atë dhe të shohim se çfarë do të marrim.
Shikoni sa kemi shkruar gjithsej dhe në dokumentin përfundimtar ka mbetur vetëm teksti ynë i mirëseardhjes. Pse? Po, sepse vetë etiketat nuk shfaqen në versionin përfundimtar dhe informacioni i shfaqur shfaqet vetëm midis etiketave trupi... Prandaj, gjithçka ndodhi. Por shikoni, ajo që kemi shkruar në kokë, më saktë në titull, tani shfaqet në skedën e shfletuesit.
Nëse dëshironi të redaktoni diçka përsëri këtu, atëherë thjesht duhet ta hapni këtë dokument tashmë të ruajtur përsëri në bllokun e shënimeve. Në përgjithësi, shikoni, në këtë mënyrë, me ndihmën e një blloku shënimesh, ne bëmë faqen tonë të parë të internetit. Po ... është e vështirë ta quash një faqe, por në fakt është kështu. Ne bëmë bazën (kornizën) dhe nëse e ngarkojmë në host, atëherë ajo tashmë do të shfaqet në internet.
Por provoni të vendosni disa hapësira dhe të shkruani më shumë tekst, ose thjesht shkruani disa rreshta teksti dhe ruajeni në të njëjtin dokument.
Tani futni këtë dokument duke përdorur shfletuesin tuaj. Çfarë shohim? Dhe fakti që hapësirat tuaja dhe ndërprerjet e linjës nuk ndikuan në dokument dhe gjithçka shkon në një rresht. E shëmtuar, apo jo? Kjo është për shkak se vetë html nuk e kupton hapësirën tuaj të bardhë (përveç njërës) ose vijën ndarëse. Për të mbështjellë linjat, gjithçka duhet të shënohet me etiketa të tjera, për të cilat do të flasim në artikuj të tjerë.
Shumë njerëz ndoshta do të mendojnë diçka si: "Dhe ky është faqja juaj? U shemb me një lis”. Po të dashurit e mi. Kjo faqe interneti primitive mund të quhet edhe faqe. Dhe do të përsëris edhe një herë se qëllimi i këtij artikulli nuk ishte krijimi i një faqeje mega-cool, por për t'ju treguar bazën e çdo faqeje, si duket, si ndodh gjithçka.
Por mos u shqetësoni. Të gjitha këto janë mësime hyrëse. Pastaj do të zhytemi thellë e më thellë në shënimin html dhe do të jemi në gjendje të formatojmë dhe rregullojmë gjithçka në mënyrë korrekte. Në përgjithësi, gjithçka do të jetë e lezetshme dhe ne do të bëjmë një burim të plotë në internet. Vetëm se e gjithë kjo nuk do të futet në një artikull dhe as unë nuk do ta thërrmoj e shkurtoj, përndryshe do të rezultojë plehra.
Fletore e dedikuar për zhvillues të uebit
Por megjithatë, ne nuk do ta përdorim më këtë mjet parahistorik, pasi ekziston një bllok shënimesh më i përshtatshëm dhe i sofistikuar për zhvilluesit, dhe absolutisht falas. Shkarkoni atë nga këtu dhe instaloni në mënyrën më të zakonshme.
Në të ardhmen, do të punoj përmes redaktorit të Notepad ++. Instaloni atë dhe do të kuptoni pse është i përshtatshëm. Nuk ka cilësime të mençura atje, por nëse papritmas keni instaluar versionin anglisht, atëherë shkoni te menyja "Preferenca" dhe zgjidhni Rusisht në kolonën "Lokalizimi".
Po, dhe gjithashtu shkoni te menyja "Encoding" dhe zgjidhni "UTF-8". Epo, ruajeni menjëherë këtë skedar në formatin html. Për ta bërë këtë, zgjidhni menunë "File" - "Save As" dhe telefononi dokumentin e indeksit, duke zgjedhur formatin "html" nga lista rënëse. Kjo bëhet në mënyrë që programi të kuptojë se çfarë po bëjmë dhe të nxjerrë në pah etiketat dhe komandat që na duhen.
Pse po e quaj fare indeksin e faqes? Fakti është se kur vizitoni ndonjë sajt, si parazgjedhje ai kërkon faqen index.html ose index.php. Janë këto skedarë që përgjithësisht pranohen si kryesore, por në përgjithësi kjo mund të ndryshohet në server.
Sigurisht, nëse doni të mësoni gjithçka shpejt, ju rekomandoj të shikoni versionin e lëshuar së fundmi Kursi HTML5 dhe CSS3... Gjithçka përshkruhet në detaje atje dhe tregohet në një shembull të drejtpërdrejtë, përveç kësaj, do të mësoni se si të krijoni disa lloje faqesh. Në përgjithësi, mësime shumë interesante dhe informuese.
Epo, ju rekomandoj që të regjistroheni në përditësimet e blogut tim, në mënyrë që të mos humbisni mësimet e ardhshme, si dhe gjëra të tjera interesante. Gjithashtu, sigurohuni që të shikoni artikujt e tjerë në blogun tim. Jam i sigurt se shumë prej tyre do t'i gjeni të dobishme. Në përgjithësi, ju uroj fat të mirë. Shihemi në artikuj të tjerë. Mirupafshim!
Përshëndetje, Dmitry Kostin.
Përshëndetje të dashur lexues të blogut. Me këtë artikull, ne do të fillojmë të mësojmë bazat e gjuhës HTML.
Ju ndoshta e dini tashmë se gjuha kryesore e internetit është Gjuha e shënjimit të hipertekstit (HTML)... Në këtë artikull, ne do të mësojmë konceptet bazë të HTML dhe si të krijojmë faqet më të thjeshta WEB.
Le të fillojmë me gjënë më të rëndësishme, të shqyrtojmë se si funksionon vetë rrjeti botëror - Interneti... Për të marrë faqe në internet, ju krijoni skedarë të shkruar në HTML dhe i vendosni ato në një server në internet. Pas kësaj, çdo shfletues i instaluar në një pajisje me akses në internet, qoftë kompjuter, telefon apo tablet, mund të gjejë faqet tuaja të internetit.
Web serverËshtë një kompjuter i zakonshëm me softuer të veçantë që ka akses në internet. Ai vazhdimisht pret kërkesa nga shfletuesit për faqet e internetit, imazhet, skedarët audio dhe video. Pasi ka marrë një kërkesë për një nga këto burime, serveri e kërkon atë dhe e dërgon atë në shfletues.
ShfletuesiËshtë një program i veçantë për shfletimin e faqeve të internetit, siç është Internet Explorer. Me shfletuesin tuaj, ju shfletoni faqet duke klikuar në lidhje. Çdo klikim i tillë bën që shfletuesi të bëjë një kërkesë për faqen html në serverin e uebit, të marrë një përgjigje dhe të shfaqë faqen në dritaren e tij. Pikërisht kur shfaqet faqja, gjuha HTML fillon të funksionojë, ajo i tregon shfletuesit gjithçka për strukturën dhe përmbajtjen e faqes së internetit. Duke përdorur komandat - etiketa, HTML i tregon shfletuesit se ku fillojnë paragrafët e tekstit, cila pjesë e tekstit është një titull dhe tregon se ku të futen tabelat, madje edhe fotografitë. Dhe etiketat janë fjalë në kllapa këndore, për shembull
,