Як стварыць старонку HTML

Калі вы хочаце стварыць уласную вэб-старонку, вы павінны мець разуменне HTML. This article explains how to create an HTML page. Таксама, вы даведаецеся, як стварыць xml карту сайта і як дадаць малюнак і спасылку. Таксама важна стварыць xml карту сайта, якія могуць дапамагчы вам арганізаваць ваш сайт і павялічыць трафік. Наступны крок - выбар шаблону.

Creating a html page

HTML - гэта мова разметкі. Кожны элемент вэб-старонкі прадстаўлены тэгам. Тэг ідэнтыфікуецца вуглавымі дужкамі, і кожны элемент мае адзін або некалькі тэгаў. Некаторыя элементы патрабуюць толькі аднаго тэга; іншым можа спатрэбіцца два. Адкрываючы і зачыняючы тэгі маюць касую рысу (/). Напрыклад, элемент параграфа прадстаўлены тэгам p. Тэкст паміж адкрываючым і зачыняючым тэгамі - гэта тэкст абзаца.

Каб стварыць дакумент HTML, вам трэба будзе выкарыстоўваць тэкставы рэдактар. У большасці камп'ютараў па змаўчанні ёсць тэкставы рэдактар. Карыстальнікі Windows будуць выкарыстоўваць Internet Explorer, у той час як карыстальнікі Mac могуць выкарыстоўваць TextEdit. Вы можаце ўсталяваць шыкоўны тэкставы рэдактар, каб стварыць вэб-старонку прафесійнага выгляду, але для вашай першай старонкі HTML, гэта не трэба. Вы таксама можаце выкарыстоўваць просты тэкставы рэдактар ​​і любы вэб-браўзер. Калі вы не ведаеце, якую праграму выкарыстоўваць, паспрабуйце спампаваць бясплатны рэдактар ​​HTML.

Старонка html мае два асноўныя раздзелы: цела і галава. Асноўны раздзел змяшчае фактычны змест вэб-сайта, у той час як раздзел head выкарыстоўваецца для загалоўка і метаінфармацыі. Цела змяшчае ўсе астатнія элементы, уключаючы малюнкі і іншую графіку. Раздзел загалоўка - гэта месца для навігацыйных спасылак. Пасля таго, як вы скончыце пісаць цела, вы гатовыя ўставіць змесціва дакумента. Пераканайцеся, што вы выкарыстоўваеце элементы цела і галавы, каб гарантаваць, што ваш вэб-сайт будзе даступны ўсім.

Creating a xml sitemap

If you have an HTML page, вы можаце стварыць карту сайта XML, каб дапамагчы пошукавым сістэмам сканаваць ваш сайт. Хоць гэта не паўплывае на ваш пошукавы рэйтынг, гэта дапаможа пошукавым сістэмам зразумець ваш кантэнт і наладзіць хуткасць сканавання. Сюды, ваш вэб-сайт будзе больш прыкметным у выніках пошуку. Вось некалькі простых крокаў, каб пачаць:

Стварэнне HTML карты сайта лёгка зрабіць. Усё, што вам трэба зрабіць, гэта зрабіць простую табліцу старонак вашага сайта, са спасылкамі на кожную старонку. Затым спасылайцеся на гэтую старонку карты сайта ў верхнім або ніжнім калонтытуле. Сюды, незалежна ад таго, колькі старонак мае ваш сайт, людзі могуць лёгка перамяшчацца па іх. Больш за тое, вам не трэба прадстаўляць SEO, каб стварыць карту сайта.

Як толькі ваша HTML-старонка стане актыўнай, адправіць яго ў Google Search Console. Вы можаце выкарыстоўваць любое пашырэнне файла і назваць XML-карту сайта. Вы можаце адправіць XML карту сайта ў Google, але гэта не абавязкова. Сканеры Google, як правіла, даволі добрыя ў выяўленні новага кантэнту, і вам не трэба адпраўляць ім карту сайта. Вы таксама можаце адправіць яго ў іншыя пошукавыя сістэмы, але гэта не гарантуе, што Google знойдзе вас.

Неабавязкова дадаваць XML-карту сайта на вашу вэб-старонку, але гэта павялічыць SEO вашага сайта. Карты сайта выкарыстоўваюцца пошукавымі сістэмамі, каб дапамагчы ім індэксаваць старонкі, на якія вэб-старонкі не спасылаюцца непасрэдна. Карты сайта таксама дапамагаюць палепшыць даступнасць мультымедыйнага кантэнту. Даданне карты сайта на ваш сайт можа дапамагчы зрабіць ваш сайт больш даступным для ботаў пошукавых сістэм.

Adding a picture

In HTML, вы можаце дадаць малюнак на старонку з дапамогай тэга img. Гэты тэг змяшчае толькі малюнак і яго атрыбуты; гэта не патрабуе зачыняе тэг. Гэты тэг малюнка павінен быць устаўлены ў раздзел цела дакумента HTML. Акрамя шырыні і вышыні карціны, вы павінны ўключыць атрыбут alt, які апісвае малюнак. Альт-тэг павінен быць напісаны так, як быццам вы пішаце апісанне для чалавека, які не бачыць яго.

Каб дадаць выяву ў HTML-дакумент, трэба крыху ведаць CSS і HTML. Памер выявы і раздзяленне - два найбольш важныя фактары, якія трэба ўлічваць. Памер выявы будзе вызначаць, наколькі яна ўпісваецца ў змест дакумента. Калі вы аддаеце перавагу выкарыстоўваць іншае раздзяленне або суадносіны бакоў, вы таксама можаце паспрабаваць змяніць памер выявы. Аднак, памятайце, што маштабаванне не заўсёды працуе так, як вы чакаеце.

Добрае эмпірычнае правіла рэгулявання памеру выявы - павялічыць яе шырыню. Шырыня павінна быць як мінімум на адзін піксель меншай за вышыню. Калі малюнак занадта малы для адлюстравання, вы можаце дадаць мяжу, а затым адрэгулюйце яго ў адпаведнасці з памерам выявы. Вы таксама можаце наладзіць мяжу выявы, дадаўшы яе да атрыбуту border. Таўшчыня мяжы - значэнне па змаўчанні, але вы можаце ўсталяваць любое значэнне. Пераканайцеся, што малюнак мае атрыбут src.

Adding a link

You can add a link in HTML to your document using an a> тэг з атрыбутам href. Гэта створыць закладку для дакумента і адкрые яго ў новай укладцы. Вы таксама можаце выкарыстоўваць атрыбут href, каб уставіць малюнак у дакумент. Вы таксама можаце выкарыстоўваць спасылку з кодам JavaScript, каб пераўтварыць кнопку HTML у спасылку. Пасля таго, як вы зрабілі гэта, вы можаце стылізаваць сваю спасылку з дапамогай кода CSS або JavaScript.

Спасылка - гэта злучэнне ад аднаго вэб-рэсурсу да іншага. Ён складаецца з двух канцоў, якар крыніцы і якар прызначэння. Спасылкай можа быць што заўгодна, ад выявы да тэкставага файла. Большасць сацыяльных сетак і вэб-сайтаў выкарыстоўваюць спасылкі, каб накіроўваць карыстальнікаў на пэўны URL. HTML таксама можна выкарыстоўваць для ўказання месцазнаходжання спасылкі. Гэта «а’ атрыбут дазваляе звязваць элементы кода з URL.

Пры распрацоўцы спасылкі, не забудзьцеся ўлічваць, як вашыя наведвальнікі будуць выкарыстоўваць кантэнт. Тэкст спасылкі павінен быць апісальным, каб яны дакладна ведалі, чаго ім чакаць. Паўтарэнне аднаго і таго ж URL - гэта непрыгожа для праграм чытання з экрана, і гэта не дае ім ніякай карыснай інфармацыі. Праграмы чытання з экрана таксама паведамляюць карыстальнікам, калі спасылкі існуюць, робячы іх розным стылем або падкрэсліваннем. Такім чынам, яны могуць лёгка знайсці патрэбную інфармацыю.

Adding a table

Adding a table to an HTML page is simple, але ёсць некалькі рэчаў, якія вы павінны прыняць да ўвагі, перш чым гэта зрабіць. Колер фону вашага стала мае вырашальнае значэнне для таго, каб прыцягнуць увагу наведвальніка і прыцягнуць увагу да важнай інфармацыі. Вы можаце задаць іншы колер для элемента загалоўка табліцы і элемента дадзеных, выкарыстоўваючы шаснаццатковыя коды колераў або назвы колераў. У любым выпадку, ваш стол будзе лёгка бачны.

Вы можаце дадаць загаловак табліцы і даныя табліцы з дапамогай элемента td, які вызначае індывід “скрынкі” за змест. Даданне загалоўка табліцы - гэта першы крок да адлюстравання даных на вэб-старонцы, і вы павінны дадаць першы, калі хочаце. Табліца таксама павінна мець тры загалоўкі радкоў. Адзін загаловак павінен быць пустым. Калі ў вашай табліцы ёсць слупкі, вы таксама павінны стварыць загалоўкі радкоў для кожнага слупка.

Вы таксама можаце дадаць подпісы да табліцы. Подпіс - неабавязковы элемент, які апісвае прызначэнне табліцы. Подпісы таксама карысныя для даступнасці. Табліца таксама можа ўтрымліваць вочкі, якія апісваюць групы дадзеных. Нарэшце, вы можаце дадаць элемент thead, каб вызначыць набор радкоў і слупкоў. Вы можаце выкарыстоўваць абодва элемента разам або паасобку. Вы нават можаце выкарыстоўваць іх у камбінацыі, але надпіс самы важны.

Adding a div

Adding a div to an HTML file allows you to add a section of your webpage without re-writing the whole page. Элемент div - гэта спецыяльны кантэйнер для тэксту, выявы, і іншыя элементы. Вы можаце назваць яго як заўгодна і змяніць яго атрыбуты ў адпаведнасці са сваімі патрэбамі. Вы таксама можаце дадаць клас або поле, каб стварыць прастору паміж div і іншымі элементамі на вашай старонцы.

Вы таксама можаце выкарыстоўваць атрыбут innerHTML, каб уставіць код у div. Гэты метад прымае код, заключаны ў радок, і калі гэта не ў div, змест будзе выдалены. Варта пазбягаць устаўкі кода ў div такім чынам, бо гэта можа падвергнуць ваш сайт уразлівасцям міжсайтавага сцэнарыя. Калі вы выкарыстоўваеце мову сцэнарыяў, напрыклад JavaScript, вы можаце выкарыстоўваць атрыбут innerHTML.

Div - гэта асноўны тэг HTML, які выкарыстоўваецца для групавання кода ў дакуменце. Ён можа ўтрымліваць абзац, блок цытаты, малюнак, аўдыё, ці нават загаловак. Яго становішча дазваляе прымяняць адзіны стыль і мову да розных раздзелаў старонкі. Div лепш за ўсё выкарыстоўваць для разметкі семантыкі, агульнай для груп паслядоўных элементаў. Div варта выкарыстоўваць, калі вы хочаце дадаць стыль раздзелу без неабходнасці перапісваць усю старонку.