<meta http-equiv='pics-label' content='(pics-1.1 "http://www.icra.org/ratingsv02.html" comment "ICRAonline EN v2.0" l gen true for "http://interval.cz" r (nz 1 vz 1 lz 1 oz 1 cz 1) "http://www.rsac.org/ratingsv01.html" l gen true for "http://interval.cz" r (n 0 s 0 v 0 l 0))' />
<p id='prepend'>Webovß prezentace by m∞la b²t v e-komerci doprovßzena alternativou WAP verze. V²hoda je jasnß - dostupnost kdekoli pomocφ mobilnφho telefonu. Tedy zprost°edkovßnφ informacφ nßvÜt∞vnφk∙m, kte°φ jsou v terΘnu a nemajφ p°φstup k PC ani jinΘmu za°φzenφ pro Φtenφ b∞₧n²ch WWW strßnek, mohou si vÜak zßkladnφ informace (sortiment firmy, cenφky, kontakty) pohodln∞ p°eΦφst pomocφ mobilnφho telefonu, kter² podporuje WAP technologii. P°enΘst tyto informace na mobil p°ibli₧n∞ v takovΘm podßnφ, jakΘ znßme z klasick²ch internetov²ch strßnek, umo₧≥uje protokol WAP 2.0 pomocφ k≤du napsanΘho v jazyce XHTML (XHTML-MP). Tentokrßt se podφvßme, jak pomoci CSS formßtovat text a vyu₧φt takΘ element blockquote i address.</p>
<h3>WML neumφ vÜechno</h3>
<p>Zßkladnφ textovΘ informace, kterΘ jsou zve°ejn∞ny na klasickΘ internetovΘ strßnce (prezentace e-komerce, zpravodajstvφ, p°φstup k bankovnφmu ·Φtu, nßkup∙m a podobn∞), musφ webdesigner napsat tak, aby se co nejlΘpe veÜly na displej mobilu. ProblΘm je ovÜem v tom, ₧e v∞tÜina tv∙rc∙ jeÜt∞ pφÜe WAP (Wireless Application Protocol) strßnky v jazyce WML (Wireless Markup Language), kter² nedßvß vφce mo₧nostφ pro formßtovßnφ textu. Je to vid∞t na mnoh²ch wapov²ch strßnkßch, kde je pφsmo zbyteΦn∞ velikΘ, takΘ formßtovßnφ odstavc∙ by mohlo b²t pest°ejÜφ. Nap°φklad na WAP strßnce <a href='http://www.ceskywap.cz/smith/go.php3?url=http://freewap.cz/wap/chloupek&device=nokia7110'>Kovo d∙m Chloupek</a>. Rovn∞₧ prezentace WAP strßnek <a href='http://www.ceskywap.cz/smith/go.php3?url=http://freewap.cz/wap/agshop&device=nokia7110'>AG Shop</a> by mohla mφt v∞tÜφ v²b∞r menÜφho pφsma. Jak by WAP strßnky m∞ly vypadat, ukazuje nap°φklad wapovß strßnka <a href='http://www.ceskywap.cz/smith/go.php3?url=http://wap.agentura-n59.cz&device=nokia7110'>Agentura N-59.cz</a>. ╪eÜenφm je p°ejφt v publikovßnφ ve WAP, kter² dlouhou dobu vyu₧φval znaΦkovacφ jazyk WML, k mnohem zdatn∞jÜφmu a v²konn∞jÜφmu pokraΦovateli.</p>
<h3>XHTML je d∙sledn∞jÜφ</h3>
<p>V²razn∞ v²hodn∞jÜφ je vyu₧φvat p°i tvorb∞ strßnek pro mobily technologii WAP 2.0 postavenou na znaΦkovacφm jazyce XHTML, p°esn∞ji XHTML-MP (XHTML - Mobile Profile). Oproti WML je toti₧ d∙sledn∞jÜφ a p°esn∞jÜφ obdobou jazyka internetov²ch strßnek. WAP 2.0 podporujφ vÜechny nejnov∞jÜφ mobilnφ telefony. Podstatn∞ ubylo mobilnφch telefon∙ pou₧φvajφcφch starou verzi WAP 1.1, modely od roku 2001 majφ u₧ verzi 1.2 a nabφzφ vyu₧itφ kaskßdov²ch styl∙ CSS (Cascade Style Sheets). Ty zajiÜ¥ujφ vedle dokonalΘ sprßvy barev i v²teΦnΘ formßtovßnφ WAP strßnek a dokß₧φ se p°izp∙sobit rozdφlnΘ velikosti a rozliÜenφ displej∙ mobilnφch telefon∙. V prvnφm p°φkladu si ukß₧eme, jak zm∞nit pomoci CSS velikost pφsma. Pro toho, kdo pracuje p°i tvorb∞ klasick²ch internetov²ch strßnek s klasick²m CSS, to bude velmi jednoduchΘ.</p>
<ol>
<li>Velikost titulk∙, tedy elementu <code>h2</code>, je urΦena ve stylopisu dokumentu, a to selektorem <samp>h2</samp>, kter² nßm zajistφ pot°ebnou velikost pφsma.</li>
<li>O zm∞nu velikosti b∞₧nΘho textu se postarß t°φda <samp>.pismov</samp>, kterß je ulo₧ena rovn∞₧ ve stylopisu dokumentu.</li>
<li>Zarovnßnφ dalÜφho textu v odstavci je provedeno takzvan²m p°φm²m stylem u stylovanΘho elementu, a to prost°ednictvφm atributu <samp>style</samp> s hodnotou deklarace stylu <samp>text-align:right</samp>.</li>
</ol>
<div class='sample'>
<?xml version="1.0" encoding="utf-8"?>
<br /><!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN"
<br /> <span class="pismov"> na vetsi velikost</span>
<br /> a zde puvodni velikosti
<br /> </p>
<br /><hr />
<br /> <h2>Zmensene pismo...</h2>
<br /><div style="text-align:right; color:red;">
<br /> <p>Text zarovnßn v pravo...</p>
<br /> </div>
<br /> <hr />
<br /> <h2>Zmensene pismo...</h2>
<br /><div style="text-align:left; color:red;">
<br /> <p>Text zarovnan vlevo...</p>
<br /> </div>
<br /> </body>
<br /></html>
</div>
<div class='image'>
<img src='podklady/vicha/1155/css1.png' alt='Ukßzka formßtovßnφ textu v emulßtoru Nokia' title='Ukßzka formßtovßnφ textu v emulßtoru Nokia' />
<br /><span class='comment'>Formßtovßnφ textu pomoci CSS</span>
</div>
<h3>Blockquote, address</h3>
<p>XHTML nßm umo₧≥uje, na rozdφl od WML, pou₧φvat blokov² sΘmantick² element <code>blockquote</code>, za nφm₧ se automaticky zalamuje °ßdka. Slou₧φ k uzavφrßnφ citacφ. Lze tak jednoduÜe vytvß°et oddφl textu a odstavce, co₧ m∙₧e b²t na displeji mobilu p∙sobivΘ, ani₧ pou₧ijeme ke stejnΘmu efektu CSS styl. V poslednφ dob∞ jej webdesignΘ°i pou₧φvajφ k vyznaΦovßnφ jmen osob, organizacφ a podobn∞. Element <code>blockquote</code> je v²hodn² jako specißlnφ odstavec s v∞tÜφm lev²m a prav²m odsazenφm (voln²m mφstem od okraje).</p>
<p>SouΦasnß specifikace <a href='http://www1.wapforum.org/tech/terms.asp?doc=Technical_WAP2_0-20021106.zip'>WAPforum Technical WAP 2.0</a> doporuΦuje rad∞ji pou₧itφ normßlnφho odstavce <code>;p</code> nebo oddφlu <code>div</code> s deklaracφ stylu <code>margin</code> nebo <code>margin-left</code>, podobn∞ jako v XHTML, element <code>blockquote</code> vÜak nezavrhuje. TotΘ₧ platφ o dalÜφm blokovΘm elementu <code>address</code>, kter² vytvo°φ blok s pφsmeny zobrazen²mi v kurzφv∞ - o zalomenφ °ßdk∙ se vÜak musφme postarat pomocφ elementu <code><br /></code>.</p>
<div class='sample'>
<?xml version="1.0" encoding="utf-8"?>
<br /><!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN"
