Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

HTML – програмиране и валидиране

1,016 views

Published on

HTML – програмиране и валидиране

Published in: Education
  • Be the first to comment

  • Be the first to like this

HTML – програмиране и валидиране

  1. 1. HTML-програмиране и валидиране Дизайн и публикуване в Интернет Екатерина Мицева http://sdkteachers.wordpress.com/
  2. 2. Hypertext Markup Language HTML - HyperText Markup Language "език за маркиране на хипертекст" Версии на HTML Края на 80-те години на XX век –ТимБърнърс-Лий – метод за обмяна на информация с учени от ЦЕРН 1991 – HTML first mentioned – Tim Berners-Lee – HTML tags 1993 – HTML (first public version, published at IETF) 1993 – HTML 2 draft 1995 – HTML 2 – W3C
  3. 3. Hypertext Markup Language 1995 – HTML 3 - Качване на файлове с формуляри 1997 – HTML 3.2 – “Wilbur” 1997 – HTML 4 – ”Cougar” – CSS 1999 – HTML 4.01 (final) 2000 – XHTML 2001 – XHTML (final) 2008 – HTML5 / XHTML5 –HTML5 е представен като работен проект от W3C 2011 – версия 5 е в процес на развитие на техническите спецификации. Пълната спецификация се очаква до 2014 г.
  4. 4. Създаване на HTML страница HTML документ трябва да бъде с файлово разширение .htm или .html HTML файловете се създават с text editors: NotePad, NotePad ++, PSPad, Sublime text и др. Или с HTML editors (IDEs): MS Visual Studio MS Visual Web Developer Adobe DreamWeaver Eclipse Aptana JetBrains WebStorm и др.
  5. 5. Създаване на HTML страница Browser Tools ● Firebug ● WebInspector ● WebDeveloper Toolbar ● F12 (IE) ● Inspect ● Console ● Bookmarklets Drawing and Slicing Tools Gimp, Paint.NET, Pixlr.com, Adobe Photoshop и др.
  6. 6. HTML - Tags Концепции в HTML ● Tags - тагове HTML таговете са най-малката съставна част на един HTML документ. Те, заедно със своите атрибути (като цвят, размер и т.н), съставят т.нар. HTML елементи. Таговете са ключови думи, заградени в ъглови скоби. Обикновено са по двойки: ● таг за начало < – маркира началото на един HTML елемент; ● таг за край /> - маркира края на HTML елемента. За разлика от началния таг, крайният има наклонена надясно черта пред името си
  7. 7. HTML - Tags <html> <body> <h1> текст </h> </body> </html> Таговете се влагат един в друг, като първият отворен таг се затваря последен.
  8. 8. HTML - Attributes ● Attributes - атрибути Повечето атрибути на елементи са двойки име- стойност, разделени със знак за равенство и записвани в рамките на отварящият таг след името на елемента. Името може да е с единични или двойни кавички. Оставянето на стойности на атрибути без кавички се смята за несигурно. Има няколко често срещани атрибута, които може да се появят в много елементи: Id, class, name, style, title
  9. 9. HTML - Attributes hyperlink <a href="http://www.w3schools.com">This is a link</a> хоризонтална линия - няма затварящ таг <hr width="95%" size="3px"/> таг за снимка - няма затварящ таг <img src="images/Снимка.png"/>
  10. 10. HTML - Elements ● Elements - Елементи HTML елемент е комбинация между таг и атрибути Основни елементи html, head, body, doctype <!DOCTYPE html> <html> <head> <meta charset="windows-1251"> <title>Заглавие на документа</title> </head> <body> <p>Здравей, свят!!</p> <p>Validate <a href="http://validator.w3.org/check/referer">XHTML Basic 1.0</a></p>
  11. 11. HTML - Elements <p> <a href="http://validator.w3.org/check?uri=referer"><img src="http://validator.w3.org/images/vxhtml-basic10" alt="Valid XHTML Basic 1.0!" height="31" width="88" /></a> </p> </body> </html>
  12. 12. HTML - Структура Основни елементи <html> елемент Указва на браузъра, че това е HTML документ. Отбелязва началото и края на документа и съдържа всичи други негови елементи(с изключение на <!DOCTYPE> елемента). <html> ... </html>
  13. 13. HTML - Структура <head> елемент Съдържа заглавието на документа, и може да съдържа стилове (CSS), скриптове(JS), енкодинг, meta тагове <html> <head> <title>Заглавие на документа</title> </head> … </html>
  14. 14. HTML - Структура <body> елемент Съдържа форматиране видимо за потребителя - текст, хиперлинк, картинки, таблици, бутони, параграфи, форми и т.н. <html> <head> <title>Заглавие на документа</title> </head> <body> Съдържание на документа... </body> </html>
  15. 15. HTML - Структура <!DOCTYPE> елемент Декларира се първи, още преди <html> тага. Валидира документа. <!DOCTYPE> не е HTML таг. Той е инструкция за уеб браузъра - указва HTML версията, на която е написана страницата: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www. w3.org/TR/html4/strict.dtd"> <!DOCTYPE html> <html> <head> <title>Заглавие на документа</title> </head> <body> <h1>Моето първо заглавие. </h1> Съдържание на документа...... </body> </html>
  16. 16. Текст форматиращи тагове <b> </b> bold - Удебелява текста <u></u> underlined - Подчертава текста <i></i> italicized - Задава курсив/наклон <sup></sup> текстsuperscript <sub></sub> текстsubscript <strong></strong> Указва важен текст <em></em> наклонен подобно на тага <i> <pre></pre> текста точно както сте го написали <del></del> изтрит текст <blockquote></blockquote> Указва част от текста, който е цитат <code></code> шрифт като на пишеща машина
  17. 17. Tags <br> tags - нов ред. Няма таг за край ! Този текст съдържа <br> нов ред. Този текст съдържа нов ред. Hyperlink Tags - Указва линк към друга страница. Най-важният атрибут на този таг е href. Той посочва URL адреса, към който сочи линка: <a href="https://sdktheachers.wordpress.com" title=” SDKteachers”>SDK theachers</a>
  18. 18. Tags Image Tags - Дефинира картинка. Има два задължителни атрибута: src и alt. Атрибутът src указва URL адреса на картинката, alt - указва алтернативен текст на картинката, а hight и width - указват съответно височината и ширината на картинката в пиксели. <img src="smiley.gif" alt="Smiley face" height="42" width="42"> <hr> tag - Таг за хоризонтална линия.Няма таг за край! Атрибути на тага за хоризонтална линия: width задава дължината на хоризонталната линия; задаване на местоположение е align и може да приема стойности left, right и center;
  19. 19. Tags цвят на линията се използва атрибута color; дебелина на хоризонталната линия се използва атрибута size. <hr width="250" align="center" color="#ff0000" size="10" /> Коментари в HTML <!-- TEКСТ -->
  20. 20. Headings and Paragraphs Заглавия и Параграф Headings tags (h1-h6)-Заглавия <h1> дефинира най-важното заглавие <h6> дефинира най-маловажното заглавие <h1>Заглавие 1</h1> <h2>Подзаглавие 2</h2> <h3>Подзаглавие 3</h3> <h4>Подзаглавие 4</h4> <h5>Подзаглавие 5</h5> <h6>Подзаглавие 6</h6>
  21. 21. Headings and Paragraphs Paragraphs tags - Параграф Браузърите автоматично добавят по един празен ред преди и след текста, маркиран като параграф. <p>Това е параграф.</p> <p>Това е друг параграф.</p> Това е параграф. Това е друг параграф.
  22. 22. Списъци в HTML (Lists) Списъците могат да се влагат един в друг. Ordered List - подредени сисъци <ol></ol> Подредените списъци започват с тага <ol>, а всеки елемент на списъка – с тага <li>: <ol> <li>Кола</li> <li>Още една кола</li> </ol> 1. Кола 2. Още една кола <ol reversed> <li>Едно</li> <li>Две</li> </ol> 1. Едно 2. Две Атрибутът reversed указва, че подреждането ще е в низходящ ред, а присвоената му стойност - показва началото на номерацията
  23. 23. Списъци в HTML (Lists) Ordered List - подредени сисъци <ol start="4"> <li>Едно</li> <li>Две</li> <li>Три</li> </ol> <ol reversed start="5"> <li>Едно</li> <li>Две</li> <li>Три</li> </ol> Атрибутът start задава началото на номерацията 4. Едно 5. Две 6. Три 5. Едно 4. Две 3. Три
  24. 24. Списъци в HTML (Lists) Ordered List - подредени сисъци I. Едно II. Две III. Три Атрибутът type задава вида на маркерите (букви или цифри), например 1, a, A, i, I: <ol type="I"> <li>Едно</li> <li>Две</li> <li>Три</li> </ol> <ol type="a"> <li>Едно</li> <li>Две</li> <li>Три</li> </ol> <ol type="i"> <li>Едно</li> <li>Две</li> <li>Три</li> </ol> <ol type="A"> <li>Едно</li> <li>Две</li> <li>Три</li> </ol> a. Едно b. Две c. Три i. Едно ii. Две iii. Три A. Едно B. Две C. Три
  25. 25. Списъци в HTML (Lists) Unordered List - неподредени сисъци <ul> </ul> При тези списъци номерацията не е с цифри или букви, а с кръгли точки. Всеки списък започва с тага <ul>, а всеки елемент на списъка – с тага <li>: ● Едно ● Две ● Три <ul type="disc"> <li>Едно</li> <li>Две<li> <li>Три</li> </ul> <ul type="squer"> <li>Едно</li> <li>Две</li> <li>Три</li> </ul> ★ Едно ★ Две ★ Три ❏ Едно ❏ Две ❏ Три <ul type="star"> <li>Едно</li> <li>Две<li> <li>Три</li> </ul>
  26. 26. Списъци в HTML (Lists) Definition List - Описателни сисъци <dl> Това са списъци от термини/имена с описание на всеки термин/име. Такъв списък се указва с тага <dl> в съчетание с таговете: <dt> - за всеки термин/име <dd> - за всяко описание на термина/името <dl> <dt>Биричка</dt> <dd>- студена напитка</dd> <dt>Шкембе</dt> <dd>- освежаващо, сутрешно ястие</dd> </dl> Биричка - студена напитка Шкембе - освежаващо, сутрешно ястие
  27. 27. Section Elements: div / span Block and Inline Elements Block Elements - Блокови елементи ● формират блок от съдържание ● блоковите елементи винаги започват на нов ред ● блоковите елементи винаги заемат 100% от ширината на родителския елемент(“родителския елемент” е този, който съдържа в себе си други елементи, които директно произлизат от него) <div>, <p>, <h1>, <ul>, <table> и др. са блокови елементи
  28. 28. Section Elements: div / span Inline Elements - Инлайн елементи На текстов параграф - искаш да удебелиш определено изречение от този параграф. Или искаш дадена дума да служи като линк към друга уеб страница-постигне се с инлайн елементите. ● не променят структурата на уеб страницата, а следват нейното съдържание ● винаги започват и завършват на един и същи ред ● ширината им е равна на съдържанието, което ги изпълва <strong>, <span>, <img>, <a>, <td>, <b> и др.
  29. 29. Section Elements: div / span DIV tags Div тагът се използва за разделяне на страницата на секции. Блоков елемент, може да съдържа както блокови така и инлайн елементи. Позволява на автора да отдели част от съдържанието на страницата и с употребата на CSS. Най често се употребява в комбинация с атрибутите class или id. id, class, width, height, title, style, dir, lang, xml:lang
  30. 30. Section Elements: div / span Span tags <span> се използва за предаване на определени свойства на няколко думи или символи. Инлайн елемент. Не създавайте отделна област (параграф) в документа. Има смисъл само с някои CSS. <div style="font-size:24px; color:red">DIV</div> <p>This one is <span style="color:red; font-weight: bold">only a test</span>.</p>
  31. 31. HTML таблици Таблици <table></table> Таблицата е разделена на редове, чрез тага <tr> („table row“), а всеки ред е разделен на клетки с данни (чрез тага <td>, “table data”). Всяка клетка може да съдържа текст, линкове, картинки, списъци, форми, други таблици и т.н. Атрибутът border задава рамка на таблицата.
  32. 32. HTML таблици <table border="1"> <tr> <td>ред 1, колона 1</td> <td>ред 1, колона 2</td> <td>ред 1, колона 3</td> </tr> <tr> <td>ред 2, колона 1</td> <td>ред 2, колона 2</td> <td>ред 2, колона 3</td> </tr> </table> ред 1, колона 1 ред 1, колона 2 ред 1, колона 3 ред 2, колона 1 ред 2, колона 2 ред 2, колона 3
  33. 33. HTML таблици <table border="1"> <tr> <th>Колона 1</th> <th>Колона 2</th> </tr> <tr> <td>ред 1, колона 1</td> <td>ред 1, колона 2</td> </tr> <tr> <td>ред 2, колона 1</td> <td>ред 2, колона 2</td> </tr> </table> Колона 1 Колона 2 ред 1, колона 1 ред 1, колона 2 ред 2, колона 1 ред 2, колона 2
  34. 34. HTML5 таблици Редове се разделят на три семантични секции: header, body ,footer <thead> table header съдържанието <th> елемент, вместо <td> елемент <tbody> тяло на таблица, колекция от редове от таблицата, които съдържат самите данни <tfoot> table footer в кода се пише ПРЕДИ <tbody> <colgroup> и <col> колони (използва се за да настроите ширината на колоните)
  35. 35. HTML5 таблици <table> <thead> <tr> <th>Month</th> <th>Savings</th> </tr> </thead> <tfoot> <tr> <td>Sum</td> <td>$180</td> </tr> </tfoot> <tbody> <tr> <td>January</td> <td>$100</td> </tr> <tr> <td>February</td> <td>$80</td> </tr> </tbody> </table> Month Savings January $100 February $80 Sum $180
  36. 36. HTML5 таблици <table> <colgroup> <col span="2" style="background-color: red"> <col style="background-color:yellow"> </colgroup> <tr> <th>ISBN</th> <th>Title</th> <th>Price</th> </tr> <tr> <td>3476896</td> <td>My first HTML</td> <td>$53</td> </tr> <tr> <td>5869207</td> <td>My first CSS</td> <td>$49</td> </tr> </table> ISBN Title Price 3476896 My first HTML $53 5869207 My first CSS $49
  37. 37. Nested Table - Вложени таблици Вложени таблици Табличните клетки cells могат да да приемат почти всякакъв вид данни в това число дори и втора таблица. Когато поставите една таблица вътре в друга, се казва че я влагате. <table> <tr> <td>Contact:</td> <td> <table> <tr> <td>First Name</td> <td>Last Name</td> </tr> </table> </td> </tr> </table>
  38. 38. Complex Table - Комплексни таблици Complex Tables - Комплексни таблици Cell Spacing and Padding Табличните клетки cells имат два атрибута за отстояние cellspacing - Определя празното пространство между клетките cellpadding - Определя празното пространство около съдържанието на клетка
  39. 39. Complex Table - Комплексни таблици Cell Spacing and Padding <html> <head><title>Table Cells</title></head> <body> <table cellspacing="15" cellpadding="0"> <tr><td>First</td> <td>Second</td></tr> </table> <br/> <table cellspacing="0" cellpadding="10"> <tr><td>First</td> <td>Second</td></tr> </table> </body> </html>
  40. 40. HTML таблици - Row and Column Span Row and Column Span Клетките имат две атрибута, свързани с обединяване (merging) colspan-Определя колко колони клетката заема rowspan-Определя колко реда клетката заема
  41. 41. HTML таблици - Row and Column Span ROWSPAN
  42. 42. HTML FORMS - Frames HTML Forms - Форми ● Form Fields and Fieldsets ● Text boxes ● Buttons ● Checkboxes and Radio Buttons ● Select fields ● Hidden fields ● Sliders and Spinboxes ● Validation fields
  43. 43. HTML FORMS - Frames Форми <form></form> <form name="myForm" method="post" action=" path/to/some-script.php"> </form> Атрибутът "method" разказва как трябва да бъдат изпратени данните от формуляра - чрез GET или POST заявка Атрибутът "action" казва къде трябва да бъдат изпратени данните от формуляра
  44. 44. HTML FORMS - Frames Text Fields Single-line text input fields: <input type="text" name="FirstName" value="This is a text field" /> Multi-line text input fields (textarea): <textarea name="Comments">This is a multi-line text field</textarea> Password input – текстово поле, където въведения текст е с * признаци <input type="password" name="pass" /> Buttons Reset button-носи формата на първоначалното си състояние <input type="reset" name="resetBtn" value="Reset the form" />
  45. 45. HTML FORMS - Frames Submit button <input type="submit" value="Apply Now" /> Image button <input type="image" src="submit.gif" name="submitBtn" alt=" Submit" /> Ordinary button – no default action, used with JS <input type="button" value="click me" /> Checkboxes and Radio Buttons Checkboxes <input type="checkbox" name="fruit" value="apple" /> Radio buttons <input type="radio" name="title" value="Mr." />
  46. 46. HTML FORMS - Frames Radio buttons - могат да бъдат групирани, което позволява само един да бъде избран от група: <input type="radio" name="city" value="Lom" /> <input type="radio" name="city" value="Ruse" /> Select Fields Dropdown menus <select name="gender"> <option value="Value 1" selected="selected">Male</option> <option value="Value 2">Female</option> <option value="Value 3">Other</option> </select>
  47. 47. HTML FORMS - Frames Multiple-choice menus <select name="products" multiple="multiple"> <option value="Value 1" selected="selected">keyboard</option> <option value="Value 2">mouse</option> </select> Hidden Fields - Скрити полета съдържат невидими данни <input type="hidden" name="Account" value="This is a hidden text field" /> Не е показано на потребителя Използва се от JavaScript и от страна на сървъра код ViewState, SessionState и др.
  48. 48. HTML FORMS - Frames Labels Етикетите се използват, за да се свърже с обяснителен текст към поле за форма чрез използването на ID на полето. <label for="fn">First Name</label> <input type="text" id="fn"/> Кликвайки върху етикет фокусира своята свързано поле ( отметки се превключват , радио бутони се провери) Етикетите са едновременно използваемост и достъпност функции и са необходими , за да премине валидация достъпност.
  49. 49. HTML FORMS - Frames Fieldsets-са използвани, за да приложат група свързани полета на формуляра. <legend> е заглавието на Fieldset <form> <fieldset> <legend>Personalia:</legend> Name: <input type="text"><br> Email: <input type="text"><br> Date of birth: <input type="text"> </fieldset> </form>
  50. 50. HTML FORMS - Frames Range and Spinbox HTML5 Ограничава потребителите да въвеждат само цифри Допълнителни атрибути мин , макс и стъпка и стойност Може да стане Spinbox или Slider , в зависимост от типа вход <input type="range" min="0" max="100" /> <input type="number" min="0" max="100" /> Има някои различия в различните браузъри
  51. 51. HTML FORMS - Frames Атрибути от HTML 5 Autocomplete Браузърът съхранява по-рано въведените стойности, връща обратно по-късно посещение на същата страница Autofocus Полето се превръща в акцент на страница натоварване Required Полето се изисква да бъде попълнено / избрано
  52. 52. HTML FORMS - Frames Input Fields with Validation Email – осигурява прост валидиране на имейл Може да бъде приет модел за валидиране На мобилно устройство носи имейл клавиатурата <input type="email" required="true" pattern="[^ @]*@[^ @].[^ @]"/> URL – има валидиране на URL На мобилно устройство носи URL клавиатурата <input type="url" required="true" /> Telephone <input type="tel" required="true" />
  53. 53. TML FORMS - Frames TabIndex Tabindex атрибут контролира реда, в който полета на формуляри и хипервръзки са фокусирани когато многократно натискане на клавиша TAB tabindex="0" (zero) - "естествен " ред Ако X < Y, тогава елементи с tabindex="X" се повтори преди елементи tabindex="Y" Елементи с отрицателна Клавиш се отстраняват , обаче , това не е дефинирано в стандарта <input type="text" tabindex="10"/>
  54. 54. HTML FORMS - Frames HTML Frames ● Frame и noframe tags ● iframe tag HTML Frames: <iframe> Рамки осигуряват начин да покаже множество HTML документи в един единствен уеб страница Страницата може да бъде разделена на отделни екрани (рамки) хоризонтално и вертикално Рамки бяха популярни в ранните векове на HTML развитие, но сега тяхното използване се отхвърля Frames не се поддържат от всички потребителски агенти (браузъри, търсачки и т.н.) A <noframes> елемент се използва за предоставяне на съдържание за не-съвместими агенти.
  55. 55. HTML FORMS - Frames HTML Frames <html> <head> <title>Пример за фрейм</title> </head> <frameset cols="30%,*"> <frame src="left.html" name="left" /> <frame src="right.html" name="right" /> </frameset> </html>
  56. 56. HTML FORMS - Frames Inline Frames: <iframe> Inline frames осигурява начин да се покаже един сайт в друг сайт: <iframe name="iframeGoogle" width="600" height=" 400" src="http://www.google.com" frameborder="yes" scrolling="yes"></iframe>
  57. 57. Semantic HTML Семантичен HTML е: По-лесно да се чете от разработчиците По-лесно да се направи от браузърите Начин да се покаже на търсенето ? Двигатели на правилното съдържание Как да пишем Semantic HTML? Използвайте HTML5 семантични тагове <header> , <nav> , <section> , <article> , <aside> , <footer> Използвайте заглавия, когато имате нужда ? За структуриране на съдържанието в подзаглавия Във възходящ ред, взирайки се с <h1> Не използвайте празни тагове Подобно на <div>
  58. 58. Semantic HTML HTML5 въвежда семантичната структура тагове Това може да бъде създаден с помощта на ? Всички видове HTML с елементи<div>, <span> дори <p>. Правилният начин : да се използват HTML 5 семантични тагове <header> </header> <section> </section> <aside> </aside> <footer> </footer>
  59. 59. Semantic HTML <header> Заглавна страница или секция горен или статия заглавна <footer> Букмейкър на сайта (по някое време може да бъде раздел букмейкър) <nav> Навигация на сайта (обикновено в горния ) <section> Раздел на сайта (например новини , коментари , линкове) <article> Член в раздел (напр. новина)
  60. 60. Semantic HTML <aside> Лента (обикновено в ляво или дясно) <figure> Фигура(фигура, например вътре в една статия) <figcaption> Надписът на фигурата (вътре етикет <figure> ) <audio> / <video> Аудио / видео елемент (използва вградения плейър) <details> + <summary> Акордеон - като джаджа (може да бъде отворен / затворен) <hgroup> Група статия заглавна+подзаглавката(<h1> + <h2>)
  61. 61. Semantic HTML <time> Задава дата / час (за пост / статия / новини) Headings Винаги използвайте заглавия (<h1> - <h6>), когато имате нужда от заглавие. Google го използва, за да маркирате важно съдържание. Силна <strong> срещу Bold <b>. <b> не означава нищо Той просто прави текста одебелен <strong> текста е " по-силен ", отколкото на другия околен текст
  62. 62. Semantic HTML Emphasis <em> срещу Italic <i> Emphasis не винаги означава, че кодът трябва да бъде наклонен.(може да бъде bolder, italic и underlined) Стиловете за текст акцент трябва да се дават с CSS Не чрез HTML! Стари браузъри ( като IE6) ? Използвайте Modernizr или HTML5shiv
  63. 63. Валидиране HTML Какво е валидация? Валидацията е един от критериите за качествена уеб страница, но има ощемного други. Валидна уеб страница означава, че създателя ѝ следва и прилага успешно установените стандарти. Понякога страниците, които създаваш няма да бъдат сто процента валидни. Голяма част от световно популярните уеб сайтове имат грешки в своя код, но това не е пречка на милиони потребители да ги използват ежедневно.
  64. 64. Валидиране HTML Предимства на валидирането ● Лесен за поддръжка код ● Добра съвместимост с бъдещи технологии (нови стандарти/браузъри/програми) ● Признак на професионализъм ● Достъпност от голям кръг от потребители ● Страницата зарежда по-бързо ● Инструмент за откриване на грешки
  65. 65. Валидиране HTML W3C(World Wide Web Consortium)е основната организация по стандартизация, установяваща международни стандарти за технологии като HTML, xHTML, CSS и много други. Какво е валидатор? Валидатора е онлайн инструмент (програма), който ни служи за да проверим дали кода на нашата страница е написан според установените стандарти. http://validator.w3.org/
  66. 66. Валидиране HTML Какво е валидация? Това е процес, през който преминаваме, за да проверим дали страницата е написана според установените стандарти за езика, който използваме (точно както в час по български ни проверяваха дали изреченията са ни вярни). Когато кода на нашата страница “премине” успешно валидацията казваме, че той е валиден. И обратно, когато кода не премине валидацията успешно казваме, че той не е написан според стандартите.
  67. 67. Валидиране HTML Как да валидираме нашата страница? ● Валидиране чрез URI; ● Валидиране чрез качване на файл; ● Валидиране чрез директно въвеждане; Знак за валидност -когато страницата премине успешно валидация получаваме като награда една специална иконка, която можем да добавим в страницата като знак за добре свършена работа.
  68. 68. Полезни линкове http://www.w3schools.com/ http://validator.w3.org/ http://bg.wikipedia.org/wiki/HTML http://www.w3.org/html/ http://html.net/ http://uroci.net/ http://www.youtube.com/watch?v=aED7jRgvIKg http://www.youtube.com/watch?v=8eJvYvCy-bA ……... https://www.google.bg ……...
  69. 69. HTML-програмиране и валидиране Дизайн и публикуване в Интернет Екатерина Мицева http://sdkteachers.wordpress.com/

×