Basic HTML - Getting Started with Your Website
Početak rada na vašem vebsajtu može biti zastrašujući zadatak. Ovo je naročito tačno ako imate ograničeno iskustvo sa izgradnjom vebsajtova. Da biste započeli, Dynadot pruža besplatni hosting na jednoj stranici sa svakom kupovinom domena. Naše hostovanje na jednoj stranici sadrži "wizard" da pomogne ljudima koji ne znaju HTML u izgradnji svojih vebsajtova. Međutim, naš wizard vam ne dozvoljava da uradite toliko za svoj sajt koliko HTML dozvoljava, tako da evo nekih osnova da započnete*:
<b>bold</b>
<i>italics</i>
<u>underline</u>
Veličina fonta
Najlakši način da promenite veličinu fonta je korišćenjem ovih oznaka:
<big>povećava font za jednu veličinu</big>
<small>smanjuje font za jednu veličinu</small>
Ako trebate da idete još veće ili manje sa vašim fontom, možete koristiti ove specifičnije oznake:
<font size="+2">povećava veličinu fonta za broj u navodnicima</font>
<font size="-2">smanjuje veličinu fonta za broj u navodnicima</font>
Такође можете бити још прецизнији са величином фонта навођењем броја 1-7 као величине фонта, где је 1 најмања величина, а 7 највећа:
<font size="1">najmanji font 8 pt</font>
<font size="7">najveći font 36 pt</font>
Druga opcija sa veličinom fonta je korišćenje naslovnih oznaka 1-6, što takođe dodaje razmak oko teksta:
<h1>највећи заглавље</h1>
<h6>најмање заглавље</h6>
Boja fonta
Pored promene veličine vašeg fonta, možete i prilagoditi boju.
<font color="blue">плава</font>
<font color="red">црвена</font>
Ако желите да користите другачију нијансу црвене или плаве, можете унети шестоцифрени хексадецимални број уместо речи "red" или "blue." Све боје су сачињене од црвене, плаве и зелене и свака боја има свој "code." Прве две цифре (или понекад слова) кода представљају црвену, затим следеће две представљају зелену, а последње две представљају плаву. Можете преузети Color Cop za PC ili Digitalni merač boja za Mac i koristite ove proizvode da pređete preko bilo koje boje na ekranu i daće vam kod koji vam je potreban. Na primer, ako biste koristili kod za plavu boju koju vidite iznad, izgledalo bi ovako:
<font color="#0000FF">isti plavi</font>
<font color="#3DC6EA">i evo primera druge nijanse plave koju možete izabrati koristeći kod</font>
Tip slova fonta
Konačno, možete promeniti tip slova vašeg fonta. Možete koristiti Microsoft Word ako vam trebaju ideje.
<font face="arial">arial font</font>
<font face="comic sans ms">comic sans ms font</font>
<font face="lucida handwriting">lucida handwriting</font>
Sada ćete morati da sve to spojite. Za bilo šta sa rečju "font" možete jednostavno da stavite sve informacije u jednu oznaku. Ako želite da koristite oznake za zaglavlja ili da dodate podebljano, kurziv ili podvlačenje, možete to dodati u njihovoj sopstvenoj oznaci.
<font size="4" color="376E1E" face="calibri">možete sve spojiti zajedno</font>
<b><font size="4" color="376E1E" face="calibri">možete sve podebljati</font></b>
<font size="4" color="376E1E" face="calibri">ili možete podebljati <b>part</b> of it</font>
Razmak
Сада када можете подесити свој фонт, желети ћете да креирате параграфе, прелазе у нови ред, а у неким случајевима можда ћете морати ручно да додате размаке:
<p>korišćenje oznaka paragrafa stavlja vaš tekst u svoj paragraf...</p>
<p>...и на следећем реду</p>
Коришћење прелама реда је као...<br>
...pritiskom na enter da pređete na sledeći red i za razliku od svega ostalog na ovoj stranici, ne treba mu zatvarajuća oznaka (ovo je zatvarajuća oznaka </p>). Možete je jednostavno ponovo uneti...<br>
...да се поново пређе на следећи ред.
Нећете морати да користите код за размаке између текста (као са размакницом) осим ако не желите да додате додатне размаке јер HTML ће препознати само један чак и ако унесете више од једног са вашом размакницом. Да бисте добили размак између текста, можете користити код:
Linkovi
Једна ствар коју ћете вероватно желети да додате на свој веб сајт су везе на друге странице на вашем сајту или чак на друге веб сајтове. Везе су лако додати користећи овај код:
<a href="http://www.dynadot.com">ово води до Dynadot-ове почетне странице</a>
Можда ћете приметити да ако кликнете на горе наведени линк, он се отвара или у засебној картици или прозору у вашем прегледачу, зависно од подешавања прегледача. Ово је лако додати и препоручује се ако повезујете са другог сајта или не желите да изгубите људе на одређеној страници (као што је блог) јер та страница остаје отворена за ваше купце да се врате без потребе да кликну на дугме за назад у свом прегледачу. Све што треба да урадите је да додате target="_blank" након вашег линка:
<a href="http://www.dynadot.com" target="_blank">ово води до Dynadot-ове почетне странице</a>
Slike
Konačno, možda ćete želeti da dodate slike na svoj sajt. Da biste dodali sliku pomoću HTML-a, moraćete da je hostujete negde. Ako nemate mesto gde možete sami da hostujete sliku, možete koristiti uslugu kao što je Tiny Pic.com који вам омогућава да бесплатно отпремите своје слике и генерише HTML ознаку за вас. Ако не желите да направите налог, можете једноставно сачувати HTML који генерише (само не чувајте га у Microsoft Word-у јер Word понекад додаје ствари које чине да код више не ради). Имајте на уму да су неке слике веома велике и можда ћете желети да их оптимизујете како би заузимале мање простора. Постоје неки бесплатни оптимизатори слика које можете користити да смањите величину датотеке ваших слика, као што су Image Optimizer.net. Evo primera osnovne oznake za sliku:
<img src="https://i45.tinypic.com/9bkglk.jpg"> koji izgleda ovako: 
Takođe možete dodati ivice vašoj slici, promeniti veličinu i dodati razmak oko nje:
<img src="https://i45.tinypic.com/9bkglk.jpg" border="2" width="100" height="30" vspace="10" hspace="20" align="left">
Kao što možete videti, slika ima okvir, šira je i kraća, i razmaknuta je oko vrha i dna i desno i levo. Takođe je poravnata levo, tako da se tekst sada pojavljuje pored slike.
Takođe možete dodati link vašoj slici. Samo trebate da stavite link oznake oko slike oznake ovako:
<a href="http://www.dynadot.com" target="_blank"><img src="https://i45.tinypic.com/9bkglk.jpg" border="0"></a>
Sada možete kliknuti na ovu sliku i ona vas vodi na našu početnu stranicu: 
Ово понекад додаје ивицу око слике у плавој боји коју видите на текстуалним линковима. Да бисте је уклонили, једноставно додајте border="0" у вашу ознаку слике. Такође можете приметити да HTML који генерише Tiny Pic.com има alt="Image and video hosting by Tiny Pic" унутар ознаке слике. Можете ово користити да ставите текст уз вашу слику у случају да се не прикаже правилно на нечијем прегледачу. Додавање алтернативног текста такође може помоћи са оптимизацијом за претраживаче (SEO).
Sada kada se nadamo da se osećate bolje u vezi sa HTML-om, možete da stavite svoje veštine na probu na svom vebsajtu. Ali pre nego što sačuvate sa potencijalno nesavršenim HTML-om, predlažemo da testirate svoj HTML besplatnom uslugom kao što je onlinehtmleditor.net. Čak ima neke lako HTML dugmad na vrhu da vam pomognu. Sada samo trebate da dobijete vaš domen ako već nemate jedan i počnite sa svojim veb sajtom danas!
*Молимо имајте на уму да је font таг застарео и можда се неће исправно приказати у свим прегледачима. Најбоље је дефинисати стил фонта у CSS-у, што ћемо покрити у каснијем блог посту.
Objavio Robyn Norgan