Танд туслахын тулд бид "мэдэх ёстой зүйлээ хэлж өгөх, гацсан үед тань туслах" болон ур чадвараа богино хугацаанд өргөжүүлэхэд тань туслах нөөцүүдийг цуглууллаа.
01. HTML Cheat Sheet
Энэхүү гайхалтай тустай HTML хууран мэхлэх хуудас нь бүх HTML элементүүдийн бүрэн жагсаалтыг, тайлбар, кодын жишээ, шууд урьдчилан үзэхийг агуулдаг. Та шошгуудыг цагаан толгойн дарааллаар эсвэл ангиллаар нь цэгцэлж, дараа нь үзэхийн тулд PDF хэлбэрээр татаж авах боломжтой.
02. CSS Cheat Sheet
Хэрэв та CSS-г дөнгөж эхэлж байгаа бол зөвхөн бүх шошго, техникийн нэр томьёог санах нь асар их айдас төрүүлж болзошгүй. Гэсэн хэдий ч энэ нь таныг хойшлуулахыг бүү зөвшөөр; Хэрэгтэй элементүүдийг хурдан олохын тулд энэ хэрэгтэй хууран мэхлэх хуудсыг хавчуургатай байлга эсвэл зүгээр л хэвлээд аваарай.
03. CSS заль мэх
2007 онд нээлтээ хийхдээ энэ сайт нь CSS-ийн тухай байсан. Одоо энэ нь бага зэрэг өргөжсөн боловч CSS болон HTML-ийн талаар танд хэрэгтэй олон хэрэгтэй мэдээлэл, зааварчилгаа байсаар байна. Энэ нь заавал очиж үзэх нь зүйтэй юм.
04. CSS Wizardry
CSS сурахад хялбар боловч эзэмшихэд хэцүү. Harry Roberts" CSS Wizardry нь BEM аргачлал, рефакторинг (хамгийн хэцүү хэсгүүдийн нэг) гэх мэт өргөтгөх боломжтой, засвар үйлчилгээ хийх боломжтой CSS бичих нарийн ширийн зүйлийн талаархи шилдэг нийтлэлүүдийг агуулдаг.
05. CodePen-ийн жилийн шилдэг үзэг
HTML/CSS-ийг сурах хамгийн сайн аргуудын нэг бол өөрийн олж мэдсэн гайхалтай үзүүлбэрүүдийг задлан үзэх явдал бөгөөд CodePen-ийн жил бүр гаргадаг шилдэг үзэгнүүд нь үүнд маш сайн байдаг. Үзүүлэнгийн загварууд нь "би үүнийг боломжтой гэдгийг ч мэдээгүй" хүртэл маш сайн байдаг. CodePen-ийн код руу ороход зориулсан нэгдсэн UI нь бас тохиромжтой. Үүнтэй адилаар та манай нийтлэлийг үзэж болно.
06. Web Design Weekly
HTML болон CSS хоёулаа байнга хөгжиж байдаг. Хамгийн сүүлийн үеийн арга зүй, онцлогтой байнга холбоотой байхын тулд бид энэхүү имэйл мэдээллийн товхимолыг санал болгож байна. Энэ нь долоо хоногт нэг удаа ирдэг бөгөөд энэ нь та үүнийг уншихад хангалттай юм.
07. Responsive Design Weekly
Responsive нь өнөө үед вэб дизайнерын хэрэгслийн чухал хэсэг бөгөөд таныг шинэчлэхэд тань туслахын тулд Жастин Авери долоо хоног бүр хамгийн сайн мэдрэмжтэй вэб дизайны агуулгыг сонгох, салбарын тэргүүлэгчидтэй ярилцлага хийх цагийг зарцуулж, үүнийгээ өдөр бүр мэдээллийн товхимол болгон илгээдэг. Баасан гараг (Танд мөн манай дээрх нийтлэл таалагдаж магадгүй.)
08. CSS дүрс бүхий тэгш өнцөгт бус байршлыг бий болгох
…Хэдийгээр HTML-ийн синтакс нь сурахад харьцангуй хялбар боловч…тэнд маш олон элемент, шинж чанарууд болон…бусад ойлголтууд байсаар байгаа бөгөөд эдгээрийг сурах, хянах шаардлагатай.…Энэ хичээл нь танилцуулах зорилготой юм. Энэ нь танд HTML-ийн хамгийн чухал зүйлсийн талаар мэдэхийн тулд энэ нь үнэхээр танд боломжит элемент, шинж чанар бүрийг заах зорилготой биш юм.…Тиймээс би танд хэд хэдэн онлайн HTML эх сурвалжийг өгөхийг хүсч байна, ... энэ нь танд үнэхээр тусалж чадна. Та HTML-г сурч эхлэх бөгөөд ... дараа нь та өөрийн хуудсуудыг бичиж байгаа тул үнэ цэнэтэй лавлагаа болж чадна. ... Одоо бид техникийн үзүүлэлтүүдээс эхлэх болно.…
Энэ бол таны заавал хавчуурга хийх ёстой хоёр баримт бичиг юм.…Тиймээс, энэ бол HTML5-ийн W3Cs хувилбар юм.…Тэд хамгийн сүүлийн үеийн нийтлэгчийн хувилбартай байгааг харж болно.…Та Редакторын ноорогтой танилцаж болно,…хэрэв та "Бууж, доошоо бууж буй зүйлийг харахыг хүсч байна.… Тэгээд энэ нь маш том юм. ...Хэрэв би доош гүйлгэж үзвэл, энд зүгээр л Агуулга байгааг харж болно. ... Тэгээд би гүйлгэх ч гэсэнгүй. бүгдээрээ дамжуулан.…
Сийрүүлгийг автоматаар гүйлгэх
Шинэчлэгдсэн
3/30/2017Суллагдсан
3/16/2015HTML бол вэбийг хүчирхэгжүүлдэг програмчлалын хэл юм. Аливаа хэлний нэгэн адил та үүнийг эзэмшсэнийхээ дараа энгийн вэб сайт эсвэл нарийн төвөгтэй вэб программ эсэхээс үл хамааран өөрийн агуулгыг үүсгэж эхлэх боломжтой. Энэ курс нь HTML-ийн синтакс болон шилдэг туршлагуудыг гүнзгийрүүлэн харуулдаг. Ахлах ажилтан зохиолч Жеймс Уильямсон ердийн HTML баримт бичгийн бүтцийг хянаж үзээд, HTML.Plus-ээр хуудсуудыг хэрхэн хуваах, контентоо хэрхэн форматлах, холбоос, жагсаалт хэрхэн үүсгэх, HTML нь CSS болон JavaScript-тэй хэрхэн ажиллаж, баялаг бүтээх талаар олж мэдэх болно. , сонирхолтой хэрэглэгчийн туршлагууд.
Сэдвүүдэд:
- HTML яагаад чухал вэ?
- HTML баримтыг судалж байна
- Агуулгыг форматлаж байна
- Зураг харуулах
- Nav, нийтлэл, div элементүүдийг ашиглах
- Хуудсууд болон татаж авах боломжтой контентуудтай холбох
- Жагсаалт үүсгэх
- Загварыг хянах (фонт, өнгө болон бусад)
- Үндсэн скрипт бичих
Дэлхий дээр хэн бүхнээс илүү амттай, бүгд улайсан, хүсүүштэй байдаг вэ? Бүдүүлэг зүйл гэж битгий бодоорой, би зүгээр л тэмдэглэгээний хэлний шинэ хувилбар болох HTML5 гэсэн үг юм. Хамгийн сүүлийн хувилбаруудОрчин үеийн хөтчүүд HTML5-ийн зарим функцийг аль хэдийн ойлгодог тул үүнийг төслүүддээ ашиглаж эхлэх цаг болжээ.
HTML5 гэж юу вэ?
Эхлээд харахад HTML5 нь зүгээр л юм шинэ хувилбартэмдэглэгээний хэл. Харин одоо энэ нэр томъёо нь өөр утгатай. Ижил CSS3-ийг дурдалгүйгээр HTML5-ийг авч үзэх нь үнэхээр инээдтэй хэрэг, учир нь энэ нь үнэхээр орчин үеийн вэб програмуудыг хөгжүүлэхэд зайлшгүй шаардлагатай юм. Бид JavaScript-ийн талаар мартаж болохгүй. Энэ нь HTML5 стандартад тайлбарласан баялаг API руу дуудлага хийдэг. Дээр дурдсан бүх зүйлийг нэгтгэн дүгнэж үзвэл HTML5 нь вэб програмыг хөгжүүлэхэд ашигладаг орчин үеийн технологи / стандартуудын багц (JS, HTML5, CSS3 гэх мэт) юм.
Түүхийн дусал
HTML5 гэнэт гарч ирээгүй. Түүний хөгжил 2007 онд эхэлсэн. W3C консорциумаас тусгайлан байгуулагдсан бүлэг нь хөгжлийн үйл явцыг хариуцаж байв. Гэхдээ HTML5-ийн олон функцийг Web Application 1.0 стандартын нэг хэсэг болгон зохион бүтээсэн бөгөөд 2004 оноос хойш үүнийг судалж байна. Бодит байдал дээр HTML5 нь анх харахад тийм ч залуу технологи биш юм.
HTML5 тодорхойлолтын анхны ноорог хувилбар 2008 оны 1-р сарын 22-нд бэлэн болсон. Гурван жил өнгөрсөн ч техникийн үзүүлэлтийн эцсийн хувилбар хараахан бэлэн болоогүй байгаа бөгөөд ойрын хоёр жилдээ багтаад гарах магадлал бага байна. Энэхүү гунигтай мөч нь хөгжүүлэгчдэд шинэ боломжуудыг төсөлдөө болгоомжтой ашиглахыг үүрэг болгож байна. Техникийн үзүүлэлтийг бүгдийг нь биш амархан өөрчилж болно орчин үеийн хөтөч(Гал үнэг 4, Гүүгл Кром 10, IE9, Opera 11) шинэ боломжуудыг бүрэн дэмждэг.
Эрүүл жор
Та HTML5-ийн онолын талаар маш удаан ярьж болно, гэхдээ манай rubric нь "Кодчлол" гэж нэрлэгддэг тул стандартын боломжуудыг практик дээр мэдрэхийг зөвлөж байна. Би супер анхны жор бүтээх гэж санаа зовсонгүй, гэхдээ яг одоо өөрийн сайтууд дээр үнэхээр хэрэгтэй, ашиглах ёстой зүйлсийн жишээг өгөхөөр шийдсэн. Ингээд явцгаая.
Жор дугаар 1: Drag & Drop-ийг бүрэн асаана уу
Нэг сайхан зүйл нь (чип гэдэг үг байх ёстой учраас ийм олон энергийн ундаа хэрэглэх ёсгүй байсан байх - ред.) HTML5 нь File API болон Drag and Drop API ашиглах чадвартай байсан.
Тэдгээрийн тусламжтайгаар та хэрэглэгчийн компьютерээс сервер рүү файл дамжуулах ажлыг зохион байгуулж болно. Өмнө нь файл илгээх "Browse" товчлууртай талбар байдгийг санаж байна уу? Үүнийг дарсны дараа стандарт файл сонгох харилцах цонх гарч ирэх бөгөөд үүнд шилжүүлэх файлыг сонгох шаардлагатай байв. Энэ аргыг дуудах нь тохиромжтой хэлээр эргэхгүй байна. Ялангуяа татан авалтын дараалалд олон файл нэмэх үед.
Хэсэг хугацааны дараа гар урчууд програм ачаалагчийг флаш дээр сийлбэрлэж эхэлсэн нь илүү их ажиллагаатай боловч ноцтой сул талтай байсан - суурилуулсан флэш хэрэгтэй. Нэмж дурдахад, энэ хоёр тохиолдолд хэрэглэгч хуудас руу хулганаа чирж, буулгах замаар шилжүүлэхийн тулд файл нэмэх боломжгүй байсан.
Гэхдээ Drag & Drop технологийг системд байнга ашигладаг. Би хувьдаа зөвхөн шаардлагатай файлуудыг сонгоод, хулганыг хөнгөн шударснаар хуудас руу шидэхийг үргэлж хүсдэг байсан. Энэ нь стандарт харилцах цонхыг ашиглан файл хайхаас хамаагүй хялбар юм.
HTML5 өөрийн тохиргоог хийсэн бөгөөд одоо файлыг хуудас руу шилжүүлэхийн тулд бүрэн хэмжээний Drag & Drop зохион байгуулахад юу ч саад болохгүй. Gmail дэх Google-ийн ажилтнууд энэ функцийг анх хэрэгжүүлсэн. Хэрэв та gmyla ашигладаг бол захидалд хавсаргах файлуудыг чирэх боломжтой хэсгийг анзаарсан байх. Би хувьдаа энэ функцийг идэвхтэй ашигладаг бөгөөд одоо би таны төслийг хэрхэн яаж идэвхжүүлэхийг харуулах болно. Манай төсөл sample.html, style.css, scripts.js гэсэн гурван файлаас бүрдэнэ. Мэдээжийн хэрэг, бид өөрсдийгөө нэг html файлаар хязгаарлаж болох байсан, гэхдээ дараа нь код нь унших боломжгүй болсон. HTML-г JS эсвэл CSS-тэй холих шаардлагагүй. Бүх зүйлийг файл болгон хувааж, дараа нь тэдэнтэй тайван ажиллах нь дээр. Юуны өмнө хэрэглээнийхээ бүтцийг бэлдье. sample.html файл үүсгээд дотор нь бичнэ үү:
media="all" href="style.css" />
JavaScript код бичихэд хялбар болгох үүднээс би jQuery номын санг оруулсан. Үүний дараа тэрээр ирээдүйн html баримт бичгийн бүтцийг тайлбарлав. Энэ нь гутаан доромжлоход хялбар байдаг - бид хэрэглэгч файлуудыг чирэх, буулгах ёстой талбарыг тайлбарлах хэрэгтэй. Үүнд зөвхөн нэг div контейнер хэрэгтэй. Хэрэв та одоо хуудсыг хөтөч дээр нээвэл сайн зүйл харагдахгүй. Манай талбарыг нүдэнд харагдахуйц болгохын тулд бид үүнийг CSS-ээр загварчлах хэрэгтэй. style.css файлыг нээж дараах кодыг бичнэ үү.
#хайрцаг(
өргөн: 500px
өндөр: 300px;
хил: 2px тасархай #000000;
дэвсгэр өнгө: #FCFFB2;
текстийг зэрэгцүүлэх: төв;
өнгө: #3D91FF;
үсгийн хэмжээ: 2em
font-family: Verdana, sans-serif;
moz хилийн радиус: 8px;
-webkit-border-radius: 8px;
}
# шошго (
албан тушаал: харьцангуй;
дээд: 2%;
}
"Хайрцаг" танигч нь бидний файл хүлээн авах ирээдүйн сав юм (хэрэглэгч энэ талбарт бичиг баримтыг чирэх ёстой). Хэрэглэгч алдахгүйн тулд би талбайг томруулж, хүрээний сонголтоор тасархай зураасыг сонгоно - тасархай шугам. Тогтмол тасархай шугамууд нь сайн харагдахгүй байгаа тул би шинж чанаруудын утгыг нэн даруй тохируулсан: -moz-border-radius болон -webkitborderradius. Одоо та хөтөч дээр үүсгэсэн хуудсыг нээж, ерөнхий дүр төрхийг үнэлэх боломжтой.
Гэсэн хэдий ч, хэрэв та одоо ямар нэг зүйлийг чирэх гэж оролдвол сонирхолтой зүйл болохгүй. Чирүүлсэн файл зүгээр л вэб хөтөч дээр нээгдэх болно, тэгээд л болоо. JavaScript кодын жижиг хэсэг нь нөхцөл байдлыг засахад тусална:
$(баримт бичиг).бэлэн(функц() (
//Үйл явдал зохицуулагч нэмэх
Var mybox = document.getElementById("хайрцаг")
Mybox.addEventListener("dragent", dragEnter, худал);
Mybox.addEventListener("dragexit", dragExit, худал);
Mybox.addEventListener("dragover", dragOver, худал);
Mybox.addEventListener("дусал", унагах, худал);
});
dragEnter(evt) функц (
Evt.stopPropagation();
Evt.preventDefault();
}
dragExit(evt) функц (
Evt.stopPropagation();
Evt.preventDefault();
}
dragOver(evt) функц (
Evt.stopPropagation();
Evt.preventDefault();
}
функц буурах(evt) (
Evt.stopPropagation();
Evt.preventDefault();
Varfiles = evt.dataTransfer.files;
varcount = files.length;
Хэрэв (тоо > 0)
HandleFiles(файлууд);
}
функцийн бариул Файлууд (файлууд) (
//Эхний файлыг авна уу
//Хэрэв та олонтой ажиллах шаардлагатай бол
//файл, дараа нь энд хайлтыг зохион байгуулах хэрэгтэй
var файл = файлууд;
Document.getElementById("шошго").innerHTML =
"Баригдсан: " + file.name;
varreader = шинэ FileReader();
Reader.onprogress = handleReaderProgress;
Reader.readAsDataURL(файл);
}
function handleReaderProgress(evt) (
If(evt.lengthComputable)(
Хэрэв (evt.loaded = evt.total) (
alert("Ачааж байна...");
}
}
}
Өнгөц харахад код нь төвөгтэй, ойлгомжгүй мэт санагдаж болох ч JavaScript болон jQuery-ийн талаар бага зэрэг мэддэг хүмүүс юу болж байгааг даруй олж мэдэх хэрэгтэй. Хамгийн эхэнд би тохиолдох нь миний сонирхлыг татдаг үйл явдлуудыг тодорхойлдог. Тэд тус бүрийн хувьд би тусдаа функцийг тайлбарладаг. Жишээлбэл, dragExit үйл явдал нь хэрэглэгч хулганын курсорыг чирж буй элементээс гаргах үед үүсдэг. Хэрэв хэрэглэгч файлыг чирсэн бол handleFiles() функц хяналтыг авна.
Үүн дээр би хамгийн анхны файл (файл) руу зориуд хандаж, түүнтэй ажиллаж эхэлдэг. Хэрэглэгч хэд хэдэн файлыг нэг дор чирэх боломжтой гэдгийг анхаарна уу. Хэрэв таны програм ийм нөхцөл байдлыг даван туулах чадвартай бол бид бүхэл бүтэн файлын массивын тооллогыг зохион байгуулах болно. handleFiles() функц нь бүх хөгжилтэй зүйл болдог.
Эхлээд би шошгоны элементэд ("Файлуудаа энд чирнэ үү" гэснийг санаж байна уу?) хэрэглэгчийн халуун цэг рүү чирсэн файлын нэрийг харуулаад дараа нь FileReader () төрлийн объект ашиглан уншиж эхэлдэг. Та энэ нийтлэлээс энэ талаар илүү ихийг уншиж болно: html5rocks.com/tutorials/file/dndfiles . Ямар ч тохиолдолд би FileReader() төрлийн объектод зориулсан onProgress үйл явдлын зохицуулагчийг тодорхойлдог. Хэсэг өгөгдлийг унших бүрт энэ үйл явдал дуудагдах болно. Зохицуулагчийн хувьд би нэг болзол тавьсан: хэрэв татаж авсан өгөгдлийн хэмжээ нь файлын хэмжээтэй тэнцүү бол уншлага амжилттай дууссан бөгөөд та баяртай мессеж харуулах боломжтой.
Жор No2: Шар айраг ууж, видео үзэх, рок сонсох
HTML5 гарч ирэхээс өмнө вэб дээр видео үзэх нь бүх төрлийн флаш тоглуулагч ашиглан хийгддэг. Ийм байдлаар видео үзэх нь тохиромжгүй гэсэн үг биш юм. Аюулгүй байдлын асуудал л байна (сүүлийн үед Flash тоглуулагчзүгээр л сул талуудаар дүүрэн байдаг) мөн залгаасыг өөрөө суулгах хэрэгцээ. HTML5 стандарт нь гоёмсог шийдлийг санал болгодог - видео болон аудио контентыг тоглуулах чадвартай.
Магадгүй олон хүн намайг шошгоны тухай ярьж байна гэж таамагласан байх
Тагийн жишээнд үүнийг анхаарна уу
Энэ нь юунд ашигтай байж болох вэ? Эсвэл та өөрийн компани/төслийн логог ийм зураг болгон оруулж болно. Tag
Жор №3: Та одоо хаана байна (геологийн байршлын API)
Geolocation API - хэрэглэгчийн координатыг тодорхойлох програмчлалын интерфейс. Хүлээн авсан өгөгдөл дээр үндэслэн Google газрын зураг дээр хэрэглэгчийн байршлыг тэмдэглэхэд хялбар байдаг. Энэ функцийг хаана ашиглаж болох вэ? Тийм ээ, маш олон газар! Жишээлбэл, Twitter-ийн алдартай микроблог үйлчилгээний хөгжүүлэгчид Twitter клиентийн вэб интерфэйс дэх Geolocation API-г ашигладаг. Хэрэв хэрэглэгч өөрийн байршлын талаарх мэдээллийг хүлээн авахыг зөвшөөрвөл түүний одоо байгаа хот нь түүний бүх жиргээнд нэмэгдэх болно.
Одоо таныг “GAPI байршлын мэдээллээ хаанаас авдаг вэ?” гэсэн асуултад зовж байгаа гэдэгт би эргэлзэхгүй байна. Энэ хэрэгт тагнуулын хиймэл дагуулууд болон бусад Бондын эд зүйлс оролцсон гэж битгий бодоорой. Бүх зүйл илүү зохимжтой байдаг - дүн шинжилгээ хийх мэдээллийн багц нь IP хаяг, хамгийн ойрын Wi-Fi холболтын цэгүүд, GPS (хэрэв танд төхөөрөмж байгаа бол), GSM үүрний ID гэх мэт өгөгдөл дээр суурилдаг. Хэрэв та дээр дурдсан эх сурвалжаас ойролцоогоор координатыг олж авах онол, практикийг сонирхож байгаа бол би танд ][ файлыг нээж, Степийн энэ сэдвээр онолын хэсгийг сайтар шинжилж, ерөнхий тойм бичсэн нийтлэлийг олохыг зөвлөж байна. холбогдох програм хангамжийн . Одоо GAPI ашиглах жишээг харцгаая. Бүх зүйл маш энгийн бөгөөд ойлгомжтой:
Уртраг: үл мэдэгдэх
Координатыг авахын өмнө хөтөч нь GAPI-г дэмждэг эсэхийг шалгах хэрэгтэй. Хэрэв газарзүйн байршлын арга үнэн бол бүх зүйл хэвийн байгаа бөгөөд та координатыг авахыг оролдож болно. Үүнийг хийхийн тулд бид navigator объектын getGurrentPosition аргыг ашигладаг. Хэрэв амжилттай бол бид шууд баримт бичигт орох координатуудыг авах болно.
Жор №4: Хөтөч дэх мэдээллийн сан
Вэб программыг хөгжүүлэхдээ бид мэдээллийн санг ашиглаж дассан. MySQL, SQLite нь програмист болгонд танил бүтээгдэхүүн юм. HTML-ийн тав дахь хувилбар нь бидэнд өөр нэг бэлэг авчирдаг - бие даасан SQLite мэдээллийн санг ашиглах чадвар. Зогс!
Бүх өгөгдөл хэрэглэгчийн компьютер дээр хадгалагдах болно гэсэн үг үү? Тиймээ яг. Аюулгүй гэж хашгирах шаардлагагүй. Зарим төслүүдийн хувьд энэ функц нь ашигтай байж болох юм. Харамсалтай нь бүх хөтөч энэ мэдээллийн сантай ажиллахыг зөвшөөрдөггүй.
Жишээлбэл, IE9 болон FF4-д ийм боломж хараахан байхгүй байгаа тул та зөвхөн Google Chrome дээр чиптэй танилцах боломжтой. Би бодит кодын жишээг өгөхгүй, зөвхөн үйл ажиллагааны ерөнхий зарчмыг харуулах болно.
this.db = openDatabase("xakep", "1.0", "тест", 8192);
tx.executeSql("хэрэв байхгүй бол mytable үүсгэх" +
"checkins(id бүхэл тоо үндсэн түлхүүрийн нэмэгдэл, талбарын_тоо_нэг мөр)",
, function() ( console.log("Хүсэлт амжилттай дууссан"); ));
);
Дээрх жишээг сайтар ажиглавал ерөнхийдөө суулгагдсан мэдээллийн сантай ажиллах нь ердийн SQLite-тэй яг адилхан гэдгийг та анзаарах болно: бид мэдээллийн санг нээж, асуулгын текстийг бэлтгэж, гүйцэтгэдэг.
HTML5. Унтраах()
Төсөлдөө HTML5 ашиглах эсэх нь танаас хамаарна. Одоо цаг нь болсон гэж бодож байна. Хэрэв та вэбсайт хөгжүүлэх чиглэлээр мэргэжлийн түвшинд ажиллаж байгаа бол яг одоо HTML5 функцуудыг оруулахаас залхуурах хэрэггүй. Мэдээжийн хэрэг, нийцтэй байдалд анхаарал тавихаа бүү мартаарай - орчин үеийн хөтөч болон хуучин хөтчүүдийн аль алинд нь дэмжлэг үзүүлэх. Үүний тулд танд хэрэгтэй бүх зүйл байгаа. Бүү удаашруулж, төслүүдээ бусдаас ялгарахыг хичээ. Амжилт хүсье!
Яаж даатгуулах вэ?
Энэ нийтлэлийн туршид би орчин үеийн хөтчүүд HTML5-ийн янз бүрийн функцуудыг дэмждэг гэж хэлсэн. Ийм учраас та болгоомжтой байж, хэт чамин зүйл хэрэглэхгүй байхыг хичээх хэрэгтэй. Тэр даруй асуулт гарч ирнэ: "Та ямар HTML5 функцийг тухайн хөтөч дэмждэг болохыг яаж мэдэх вэ?". Үүнийг хийх хэд хэдэн арга бий, гэхдээ миний дуртай зүйл бол JavaScript-ийн жижиг номын сан Modernizr (modernizr.com) юм.
Номын сан нь бүрэн үнэ төлбөргүй тараагддаг бөгөөд та үүнийг төсөлдөө холбосноор таны хөтөч дэмждэг HTML5 функцуудын жагсаалтыг шууд харуулах болно. Номын сангийн ажиллагааг шалгахын тулд та үүнийг шууд татаж аваад төсөлдөө холбох шаардлагагүй. Та зүгээр л номын сангийн албан ёсны вэбсайт руу ороход л таны алхагч юу дэмжиж, юу дэмждэггүйг шууд харах болно. Хэзээ сайтад зочилсон дэлгэцийн агшинг үзнэ үү Google-ийн тусламж Chrome болон Internet Explorer 9. Хэдийгээр сайн PR-компани, магтан сайшаасан нийтлэлүүд байгаа ч Microsoft-ын rpg нь Google Chrome-ээс цөөн функцийг дэмждэг нь тодорхой.
HTML5 нь Flash-г зөөнө
Хамгийн сонирхолтой чипс HTML5 нь хөдөлгөөнт дүрс үүсгэх чадвар юм. Энэ нь HTML5 болон CSS3-ийг холих замаар хийгддэг.
Ийм хөдөлгөөнт дүрс нь маш сайхан харагддаг бөгөөд олон тохиолдолд Flash-г орлож чаддаг. Энэ нь удахгүй гарахгүй гэдгийг би итгэлтэйгээр хэлж чадна, учир нь одоо Flash-ийг эзэмших нь ойлгомжгүй HTML5/CSS3 кодыг (IMHO) ойлгохоос илүү хялбар болсон. Гэсэн хэдий ч та ийм шинж чанарын талаар мэдэх ёстой. Доорх линкээр орж анимэйшн хийх боломжтойг харуулсан сайхан үзүүлбэрүүдийг өөрийн нүдээр үзэхийг танд зөвлөж байна.
- Canvas-ийн онцлогуудыг харуулсан сайхан демо: feedtank.com/labs/html_canvas ;
- Google-ийн хайлтын талбар бүхий үзэсгэлэнтэй 3D хайрцаг: ;
- Хулганы нэг товшилтоор хуудас бөмбөгөөр дүүрч эхэлнэ. Илүү олон товшилт - илүү олон бөмбөг. Хуудсыг дуустал нь бөглөхдөө тэдгээрийг огцом чирэхийг хичээ. Маш хөгжилтэй харагдаж байна: mrdoob.com/projects/chromeexperiments/ball_pool ;
- Төрөл бүрийн химийн нэгдлүүдийг харуулсан гайхалтай үзүүлбэр. Мэдээж үзэх нь зүйтэй: alteredqualia.com/canvasmol ;
- Та хэзээ нэгэн цагт эмгэг судлаач шиг санагдаж, хүний биеийн нууцыг судлахыг хүсч байсан уу?
Хэрэв тийм бол энэ холбоос танд зориулагдсан болно. Google WebGL, HTML5, CSS3, Flash технологиудыг хослуулсан гайхалтай демо хийсэн. Коктейлийн үр дүн нь хүний дотоод эрхтний бүтцийг 3 хэмжээст дүрсээр харуулсан интерактив программ юм. Би түүнийг анх хараад сэтгэлээ тавиулж чадсангүй.
Энэ хуудсанд стандарт боловсруулахад оролцсон хүмүүст зориулсан материалууд багтсан болно.
Эдгээр мэдээллийн ихэнх нь нууц үгээр хамгаалагдаагүй. Гэсэн хэдий ч зарим хуудас руу нэвтрэх үед танд нууц үг хэрэгтэй байж магадгүй юм.
Ёс зүйн дүрэм
ОУСБ-ын хороо, Ажлын хэсэг эсвэл Зөвшилцлийн төлөө нэгдсэн байгууллагын гишүүдийг Ёс зүйн дүрмийн зарчмын дагуу ажиллахыг уриалж байна.
Өрсөлдөөнийг дагаж мөрдөх заавар
Стандарт тогтоох үйл явцад хууль тогтоомжийг дагаж мөрдөх нь зах зээлийн үр дүнтэй үйл ажиллагааг хангах, өрсөлдөх чадварыг нэмэгдүүлэх, түүнчлэн стандартад итгэх итгэлийг нэмэгдүүлэхэд чухал ач холбогдолтой юм. ISO нь стандарт боловсруулах үйл явцад оролцож буй бүх хүмүүст хууль эрх зүйн асуудлаар зааварчилгаа өгдөг.
Өрсөлдөөний хуулийн удирдамжтай холбоотой аливаа асуултыг ОУСБ-ын хуулийн баг руу хаягаар хандаж болно.
Зохиогчийн эрх
Стандартчиллын үйл ажиллагаанд оролцогч бүх оролцогчид ОУСБ-ын хэвлэл, төсөл боловсруулах зохиогчийн эрх, түүнчлэн ISO-тай холбоотой аливаа контентыг хүндэтгэх ёстой. Эдгээр дүрмүүд нь тунхаглалд тусгагдсан бөгөөд стандартчиллыг сонирхож буй бүх талууд үүнийг хүлээн зөвшөөрөх ёстой.
Хорооны ажлын гадаад талуудтай харилцах, баримт бичгийг хадгалах чиглэлээр баримтлах бодлого
ISO стандартыг боловсруулах үйл явцад оролцогчдоос асууж болно (жишээлбэл, хэвлэл мэдээллийн хэрэгслээр) эсвэл өөрийн санаачлагатай байж болно (жишээлбэл, Нийгмийн сүлжээ) хорооны ажлын янз бүрийн асуудлаар гадны талуудтай мэдээлэл солилцох. ОУСБ эдгээр гадаад харилцан үйлчлэлийн үйл ажиллагааны бодлогыг боловсруулсан.
Энэ бодлоготой холбоотой аливаа асуултыг хаягаар хандаж болно имэйлТМБ-ын ажлын алба: .
Мэдээлэл хамгаалах бодлого
Стандартчиллын үйл явцад оролцож буй бүх талууд мэдээлэл хамгаалахтай холбоотой эрх, үүрэгтэй. Эдгээрийг ОУСБ-ын гишүүдэд зориулан боловсруулсан Мэдээлэл хамгаалах бодлого, түүнчлэн энэ үйл явцад оролцож буй бүх талууд дагаж мөрдөх ёстой Тунхаглалд тусгагдсан болно. Энэ нь ISO мэдээллийн технологийн үйлчилгээнд хадгалагдсан өгөгдөл болон стандартчиллын ажлын явцад цуглуулсан олон хувийн мэдээлэлд (жишээлбэл ирцийн жагсаалт, минут) хамаарна.
ISO стандартад ашигласан нэр томъёо, хэллэгийн тайлбар
Олон улсын стандарт, худалдаа
ОУСБ-ын эрх зүйн шийтгэлийн төрлүүд
ISO нь хориг арга хэмжээ, стандарт боловсруулах үйл явцтай холбоотой асуудлуудыг нэгтгэсэн баримт бичгийг боловсруулсан.
Оролцогч талуудыг татан оролцуулж, зөвшилцлийг бий болгох
ОУСБ нь стандартуудыг боловсруулахыг эрмэлздэг сонирхогч талууд болон сонирхогч талуудад зориулсанингэснээр зах зээлийн хэрэгцээг илүү үр дүнтэй хангах болно.
Та оролцогч талуудыг хэрхэн татан оролцуулах талаар зааварчилгаа өгөх баримт бичгүүдийг доороос олж болно.
Ачааж байна...