HTML Riglyne

6

Hierdie is die (opsionele) finale stap in die formateringsproses – STAP 6! Op hierdie bladsy sal u baie bruikbare wenke vind oor hoe om HTML te gebruik en sodoende u inhoud mooier te maak en ander funksies beskikbaar te stel.

Leesplanne het ‘n hele paar dae se inhoud en elke dat het 1 oordenkingstuk. Hierdie oordenking dien verskillende doele; van ‘n oorsig, tot ‘n vertelling, tot ‘n slotgebed — of elkeen van die funksies.

Om die rede mag dit dalk moeilik wees om te weet wat die beste manier is om die oordenking te kodeer en te verseker dat dit so vertoon word soos wat die skrywer dit bedoel het. As u die riglyne en aanbevelings volg wat hier onder gegee word, sal dit u help om seker te maak dat die oordenking se inhoud so verstaanbaar as moontlik en so lank as moontlik geplaas word vir al die gebruikers van YouVersion (iOS, Android, Web, Mobiele Web, ens).


 Aanbevelings

Titel van die Oordenking

Gebruik die h2 as dit nodig sou wees. <h2>, </h2>

Nota: Ons beveel dit sterk aan dat u nie h1 “tags” in u inhoud gebruik nie.

Opskrifte

Gebruik die h3 “tag” vir die hoof opskrifte. <h3>, </h3>

Subopskrifte

Gebruik die h4 “tag” vir subopskrifte. <h4>, </h4>

Let wel: Ons beveel aan dat u nie staatmaak op opskrifte wat kleiner as die h4 “tag” nie, want daar is nie ‘n merkwaardige verskil tussen hierdie opskrifte se lettergroottes nie.

Spasies tussen Paragrawe

Krimp die teks van paragrawe in p “tags”. <p>, </p>

Let wel: Ons beveel sterk aan dat u nie br “tags” gebruik om spasies tussen paragrawe te skep nie, want dit sal nie ‘n eenvormige resultaat gee nie en mag dalk ook nie werk op alle toepassings nie .

Spasies vir afdelings

Indien u baie inhoud het wat duidelik afgebaken moet word en paragrawe is nie die oplossing nie, mag u dele van die teks in afdeling “tags” draai.

Let wel: Ons beveel sterk aan dat u nie br “tags” gebruik om spasies tussen paragrawe te skep nie, want dit word nie altyd ondersteun deur alle toepassings nie.

Duidelike (Swartgedrukte) Teks

Gebruik die “strong tag” vir enige teks in ‘n paragraaf wat duideliker as die res vertoon moet word. <strong>, </strong> OR <b>, </b>

Let wel: Ons beveel aan dat u nie die b “tag” gebruik nie, want dit is afgekeur en sal nie meer vir lank in webblaaie of in ons toepassings gebruik kan word nie.

Beklemtoonde (Skuinsgedrukte) Teks

Geruik die em “tag” vir teks in ‘n paragraaf wat beklemtoon moet word. <em>, </em>

Let wel: Ons beveel aan dat u nie die i “tag” gebruik nie, want dit is afgekeur en sal nie meer vir lank in webblaaie of in ons toepassing kan werk nie.

Lyste

Gebruik die ul merkers vir lyste wat nie georden is nie (<ul>, </ul>), en ol merkers vir geordende lyste (genommerde lyste, <ol>, </ol>) met li merkers vir verskillende items, (<li>, </li>). Ons beveel aan dat u ongeordende lyste gebruik, behalwe as daar ‘n geldige rede is om ‘n genommerde lys te gebruik, want dit gee ‘n beter visule vloei in die meeste toepassings.

Let wel: Ons beveel aan dat u nie die lysie styltipe gebruik nie.

Skakels na webblaaie

Hierdie kodering is veral nuttig as u die gebruiker na ‘n ander webblad toe wil verwys wat nie in die toepassing beskikbaar is nie. ‘n Basiese webblad kode (<a href=”http://(webblad)”>[opskrif vir die skakel]</a>) laat jou toe om jou eie opskrif te kies. Byvoorbeeld: jy kan die URL vertoon as die skakel, of jy kan ‘n woord of frase wat by die inhoud pas kies as ‘n skakel.

Nota: Ons gebruik nie toepassings nie en hoop dat die webtuistes, wat ekstra inligting verskaf aan ons gebruikers, ook nie toepassings gebruik nie. 

Beeldmateriaal

Gebruik die img merker vir beeldmateriaal. Beeldmateriaal beslaan die volle wydte van die inhoud (dit beteken die teks sal nie langs die beeld vertoon nie). Dit geld vir enige gegewe toepassing. Ons beveel dus aan dat ‘n beeld se wydte nie kleiner as 480 “pixels” moet wees nie, want beelde wat kleiner as dit is mag uitgerek lyk.

Let wel: Moet asseblief geen ander eienskappe tot die img merker voeg nie, (soos bv. wydte, hoogte, raam, ens.), want dit sal veroorsaak dat die beeld nie reg vertoon nie.

Videos

Voeg die gewone youtube-video iframe-kode in ‘n bestaande div klas met video-houer.

<div class=”video-container”>
<iframe class=”youtube-player” src=”http://www.youtube.com/embed/VIDEO_ID” frameborder=”0″ allowfullscreen></iframe>
</div>

Nota: Moet asseblief nie ekstra funksies in die iframe-merker invoeg nie (wydte, hoogte, raam, ens), want dit kan veroorsaak dat die video nie reg vertoon word nie.

Die plasing is ook beskikbaar is: Duits Spaans Frans Portugees Roemeens Chinees (Vereenvoudig) Chinees (Traditioneel)