http://mis.martin-simunek.cz/index.php?action=history&feed=atom&title=N%C3%A1vrh_UI 2026-04-19T00:59:48Z Historie editací této stránky MediaWiki 1.17.0 http://mis.martin-simunek.cz/index.php?title=N%C3%A1vrh_UI&diff=4336&oldid=prev 2021-03-01T22:31:57Z

<p>Testování použitelnosti přesunuto na samostatnou stránku: <a href="/index.php/Testov%C3%A1n%C3%AD_UI" title="Testování UI">Testování UI</a>.</p> <table style="background-color: white; color:black;"> <col class='diff-marker' /> <col class='diff-content' /> <col class='diff-marker' /> <col class='diff-content' /> <tr valign='top'> <td colspan='2' style="background-color: white; color:black;">← Starší verze</td> <td colspan='2' style="background-color: white; color:black;">Verze z 1. 3. 2021, 22:31</td> </tr><tr><td colspan="2" class="diff-lineno">Řádka 29:</td> <td colspan="2" class="diff-lineno">Řádka 29:</td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* Dodržení standardů a&amp;nbsp;strukturování textu</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* Dodržení standardů a&amp;nbsp;strukturování textu</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>** Tak, aby mohly fungovat automatické čtečky.</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>** Tak, aby mohly fungovat automatické čtečky.</div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;"></del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td colspan="2" class="diff-lineno">Řádka 85:</td> <td colspan="2" class="diff-lineno">Řádka 84:</td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* Dodržení standardů</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* Dodržení standardů</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* Dodržení běžných konvencí ovládání</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* Dodržení běžných konvencí ovládání</div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;"></del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;">* Testujte na lidech! (viz [[#Analýza použitelnosti]])</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>; Speciálně pro web</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>; Speciálně pro web</div></td></tr> <tr><td colspan="2" class="diff-lineno">Řádka 94:</td> <td colspan="2" class="diff-lineno">Řádka 91:</td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* dostupnost na portálech, SEO</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* dostupnost na portálech, SEO</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">; Testujte na lidech!</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">* Použitelnost webu je třeba testovat &amp;mdash; viz [[Testování UI]].</ins></div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>==<del class="diffchange diffchange-inline">= Analýza použitelnosti =</del>==</div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>== <ins class="diffchange diffchange-inline">Související stránky </ins>==</div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>&#160;</div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>* <ins class="diffchange diffchange-inline">[[Testování </ins>UI<ins class="diffchange diffchange-inline">]]</ins></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>* <del class="diffchange diffchange-inline">Vytipujte cílové uživatele výrobku/webu.</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del class="diffchange diffchange-inline">** Můžete vytvořit „persony“.</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del class="diffchange diffchange-inline">* Vytipujte úlohy, které budou uživatelé s&amp;nbsp;výrobkem provádět</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del class="diffchange diffchange-inline">* Najděte příklady uživatelů a&amp;nbsp;testujte</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del class="diffchange diffchange-inline">** Najděte konkrétní uživatele z&amp;nbsp;cílových skupin.</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del class="diffchange diffchange-inline">** Zadávejte jim úlohy.</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del class="diffchange diffchange-inline">** Sledujte, jak reagují.</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>&#160;</div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del class="diffchange diffchange-inline">; Na první pohled byste měli identifikovat</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del class="diffchange diffchange-inline">* Součásti webové stránky</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del class="diffchange diffchange-inline">** Logo serveru</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del class="diffchange diffchange-inline">** Název stránky (v rámci serveru)</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del class="diffchange diffchange-inline">** Záložky sekcí</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del class="diffchange diffchange-inline">** Lokální navigace</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del class="diffchange diffchange-inline">** Nástroj pro vyhledávání</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>&#160;</div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del class="diffchange diffchange-inline">* Co web nabízí</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del class="diffchange diffchange-inline">* Čí web to je</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>&#160;</div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del class="diffchange diffchange-inline">* Kudy máte pokračovat &amp;mdash; podle úkolu, který potřebujeme vyřešit.</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>&#160;</div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del class="diffchange diffchange-inline">; Pravidla testování</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del class="diffchange diffchange-inline">* Uživatel nikdy nejedná „špatně“!!! </del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del class="diffchange diffchange-inline">** Pokud uživatel zvolil špatný postup, je to chyba návrhu </del>UI<del class="diffchange diffchange-inline">.</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del class="diffchange diffchange-inline">* Nenapovídejte uživateli!</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>&#160;</div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>&#160;</div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>== Zdroje: ==</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>== Zdroje: ==</div></td></tr> </table>

Spravce http://mis.martin-simunek.cz/index.php?title=N%C3%A1vrh_UI&diff=4333&oldid=prev 2021-03-01T22:16:17Z

<p>Upraven seznam kategorií.</p> <table style="background-color: white; color:black;"> <col class='diff-marker' /> <col class='diff-content' /> <col class='diff-marker' /> <col class='diff-content' /> <tr valign='top'> <td colspan='2' style="background-color: white; color:black;">← Starší verze</td> <td colspan='2' style="background-color: white; color:black;">Verze z 1. 3. 2021, 22:16</td> </tr><tr><td colspan="2" class="diff-lineno">Řádka 1:</td> <td colspan="2" class="diff-lineno">Řádka 1:</td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>[[Category:VSE]][[Category:HTML]][[Category:<del class="diffchange diffchange-inline">Softwarové inženýrství</del>]]</div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>[[Category:VSE<ins class="diffchange diffchange-inline">]][[Category:Informatika</ins>]][[Category:HTML]][[Category:<ins class="diffchange diffchange-inline">UI UX</ins>]]</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>== Uživatelské rozhraní ==</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>== Uživatelské rozhraní ==</div></td></tr> </table>

Spravce http://mis.martin-simunek.cz/index.php?title=N%C3%A1vrh_UI&diff=3878&oldid=prev 2020-09-10T13:06:25Z

<p>Poopravena struktura.</p> <table style="background-color: white; color:black;"> <col class='diff-marker' /> <col class='diff-content' /> <col class='diff-marker' /> <col class='diff-content' /> <tr valign='top'> <td colspan='2' style="background-color: white; color:black;">← Starší verze</td> <td colspan='2' style="background-color: white; color:black;">Verze z 10. 9. 2020, 13:06</td> </tr><tr><td colspan="2" class="diff-lineno">Řádka 14:</td> <td colspan="2" class="diff-lineno">Řádka 14:</td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>== Dostupnost ==</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>== Dostupnost ==</div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>* Availability</div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>* <ins class="diffchange diffchange-inline">''</ins>Availability<ins class="diffchange diffchange-inline">''</ins></div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* Výrobek musí být schopen ovládat i&amp;nbsp;uživatel s&amp;nbsp;omezeními.</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* Výrobek musí být schopen ovládat i&amp;nbsp;uživatel s&amp;nbsp;omezeními.</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* Zdravotní handicap</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* Zdravotní handicap</div></td></tr> <tr><td colspan="2" class="diff-lineno">Řádka 20:</td> <td colspan="2" class="diff-lineno">Řádka 20:</td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>; Doporučení</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>; Doporučení</div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>* Dostatečný kontrast</div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>* Dostatečný kontrast <ins class="diffchange diffchange-inline">mezi pozadím a&amp;nbsp;popředím</ins></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>* Možnost <del class="diffchange diffchange-inline">ovládat </del>jednou rukou</div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>* Možnost <ins class="diffchange diffchange-inline">ovládání </ins>jednou rukou<ins class="diffchange diffchange-inline">, možnost ovládání myší</ins></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>* <del class="diffchange diffchange-inline">Velikost </del>ovládacích prvků</div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>* <ins class="diffchange diffchange-inline">Přiměřená velikost </ins>ovládacích prvků</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* Vzdálenost mezi ovládacími prvky</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* Vzdálenost mezi ovládacími prvky</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* ...</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* ...</div></td></tr> <tr><td colspan="2" class="diff-lineno">Řádka 34:</td> <td colspan="2" class="diff-lineno">Řádka 34:</td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>== Použitelnost ==</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>== Použitelnost ==</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>&#160;</div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">* ''Usability''</ins></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del class="diffchange diffchange-inline">=== Cíle ===</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>* Uživatel na první pohled <ins class="diffchange diffchange-inline">pozná</ins>, k&amp;nbsp;čemu výrobek slouží.</div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>* Uživatel na první pohled <del class="diffchange diffchange-inline">ví</del>, k&amp;nbsp;čemu výrobek slouží.</div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>* Uživatel <ins class="diffchange diffchange-inline">na první pokus vyřeší </ins>svůj úkol.</div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>* Uživatel <del class="diffchange diffchange-inline">ví, jak vyřešit </del>svůj úkol.</div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>** přehlednost, snadná orientace</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>** přehlednost, snadná orientace</div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>* Uživatel považuje ovládání za snadné.</div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>* Uživatel považuje ovládání za snadné<ins class="diffchange diffchange-inline">, baví ho to</ins>.</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>=== <del class="diffchange diffchange-inline">Negativa </del>===</div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>=== <ins class="diffchange diffchange-inline">Časté problémy </ins>===</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>Viz: Adaptic.cz</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>Viz: Adaptic.cz</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* přílišná originalita, především v ovládání webu, ale i při návrhu layoutu nebo vzhledu</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* přílišná originalita, především v ovládání webu, ale i při návrhu layoutu nebo vzhledu</div></td></tr> <tr><td colspan="2" class="diff-lineno">Řádka 59:</td> <td colspan="2" class="diff-lineno">Řádka 58:</td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>== Chování uživatele na webu ==</div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">=</ins>== Chování uživatele na webu <ins class="diffchange diffchange-inline">=</ins>==</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>Viz: KRUG</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>Viz: KRUG</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td colspan="2" class="diff-lineno">Řádka 69:</td> <td colspan="2" class="diff-lineno">Řádka 68:</td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>**V době vyhledávačů může uživatel na váš server vstoupit kteroukoli stránkou, nejen úvodní.</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>**V době vyhledávačů může uživatel na váš server vstoupit kteroukoli stránkou, nejen úvodní.</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>=== Postupy k dosažení použitelnosti ===</div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>=== Postupy k<ins class="diffchange diffchange-inline">&amp;nbsp;</ins>dosažení použitelnosti ===</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>Viz: KRUG</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>Viz: KRUG</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td colspan="2" class="diff-lineno">Řádka 77:</td> <td colspan="2" class="diff-lineno">Řádka 76:</td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>** tlačítka se zvýrazněnými okraji</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>** tlačítka se zvýrazněnými okraji</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>** jednotlivé bloky stránky graficky oddělené</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>** jednotlivé bloky stránky graficky oddělené</div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>* „Vynechte polovinu <del class="diffchange diffchange-inline">slov“</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>* <ins class="diffchange diffchange-inline">Zredukujte text &amp;mdash; </ins>„Vynechte polovinu <ins class="diffchange diffchange-inline">slov!“</ins></div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>** žádné uvítací prology</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>** žádné uvítací prology</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>** žádné dlouhé odstavce textu</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>** žádné dlouhé odstavce textu</div></td></tr> <tr><td colspan="2" class="diff-lineno">Řádka 83:</td> <td colspan="2" class="diff-lineno">Řádka 82:</td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* Dejte stránkám jasnou strukturu</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* Dejte stránkám jasnou strukturu</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;">=== Jak dosáhnout použitelnosti ===</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* Nejprve kreslete a&amp;nbsp;testujte, pak až kódujte!</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* Nejprve kreslete a&amp;nbsp;testujte, pak až kódujte!</div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;">* Nepřehlcení informacemi</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* Dodržení standardů</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* Dodržení standardů</div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>* Dodržení běžných konvencí</div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>* Dodržení běžných konvencí <ins class="diffchange diffchange-inline">ovládání</ins></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del class="diffchange diffchange-inline">* Vizuální přitažlivost</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>&#160;</div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>* Testujte na lidech! (viz <del class="diffchange diffchange-inline">(</del>#Analýza použitelnosti]])</div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>* Testujte na lidech! (viz <ins class="diffchange diffchange-inline">[[</ins>#Analýza použitelnosti]])</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>; Speciálně pro web</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>; Speciálně pro web</div></td></tr> <tr><td colspan="2" class="diff-lineno">Řádka 99:</td> <td colspan="2" class="diff-lineno">Řádka 96:</td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>=== Analýza použitelnosti ===</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>=== Analýza použitelnosti ===</div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;">Viz: KRUG</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* Vytipujte cílové uživatele výrobku/webu.</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* Vytipujte cílové uživatele výrobku/webu.</div></td></tr> <tr><td colspan="2" class="diff-lineno">Řádka 109:</td> <td colspan="2" class="diff-lineno">Řádka 105:</td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>** Sledujte, jak reagují.</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>** Sledujte, jak reagují.</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>; Pravidla</div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">; Na první pohled byste měli identifikovat</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">* Součásti webové stránky</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">** Logo serveru</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">** Název stránky (v rámci serveru)</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">** Záložky sekcí</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">** Lokální navigace</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">** Nástroj pro vyhledávání</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>&#160;</div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">* Co web nabízí</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">* Čí web to je</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>&#160;</div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">* Kudy máte pokračovat &amp;mdash; podle úkolu, který potřebujeme vyřešit.</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>&#160;</div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>; Pravidla <ins class="diffchange diffchange-inline">testování</ins></div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* Uživatel nikdy nejedná „špatně“!!! &#160;</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* Uživatel nikdy nejedná „špatně“!!! &#160;</div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>** Pokud zvolil špatný postup, je to <del class="diffchange diffchange-inline">asi </del>chyba návrhu UI.</div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>** Pokud <ins class="diffchange diffchange-inline">uživatel </ins>zvolil špatný postup, je to chyba návrhu UI.</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* Nenapovídejte uživateli!</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* Nenapovídejte uživateli!</div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;"></del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;">*Na první pohled byste měli identifikovat:</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;">**Logo serveru</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;">**Název stránky (v rámci serveru)</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;">**Záložky sekcí</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;">**Lokální navigace</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;">**Nástroj pro vyhledávání</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;">*Při pohledu na stránku máte vědět</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;">**Co web nabízí</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;">***Název</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;">***Logo</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;">***Slogan</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;">**Kudy máte pokračovat</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;">***Pro jednotlivé kategorie uživatelů</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;">*Testujte na lidech!!!</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> </table>

Spravce http://mis.martin-simunek.cz/index.php?title=N%C3%A1vrh_UI&diff=3877&oldid=prev 2020-09-10T08:46:49Z

<p>Doplnění testování použitelnosti.</p> <table style="background-color: white; color:black;"> <col class='diff-marker' /> <col class='diff-content' /> <col class='diff-marker' /> <col class='diff-content' /> <tr valign='top'> <td colspan='2' style="background-color: white; color:black;">← Starší verze</td> <td colspan='2' style="background-color: white; color:black;">Verze z 10. 9. 2020, 08:46</td> </tr><tr><td colspan="2" class="diff-lineno">Řádka 7:</td> <td colspan="2" class="diff-lineno">Řádka 7:</td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* Jedná se o jednu z&amp;nbsp;oblastí ''softwarového inženýrství'' (SI).</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* Jedná se o jednu z&amp;nbsp;oblastí ''softwarového inženýrství'' (SI).</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">; Požadavky</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">* atraktivní vzhled (design, grafika,...)</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">* dostupnost</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">* použitelnost</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;"></ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;"></ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">== Dostupnost ==</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">* Availability</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">* Výrobek musí být schopen ovládat i&amp;nbsp;uživatel s&amp;nbsp;omezeními.</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">* Zdravotní handicap</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">* Zrakové omezení</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;"></ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">; Doporučení</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">* Dostatečný kontrast</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">* Možnost ovládat jednou rukou</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">* Velikost ovládacích prvků</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">* Vzdálenost mezi ovládacími prvky</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">* ...</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;"></ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">; Web</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">* Dodržení standardů a&amp;nbsp;strukturování textu</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">** Tak, aby mohly fungovat automatické čtečky.</ins></div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;">== Dostupnost (availability) ==</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td colspan="2" class="diff-lineno">Řádka 15:</td> <td colspan="2" class="diff-lineno">Řádka 36:</td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>=== Cíle ===</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>=== Cíle ===</div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>* <del class="diffchange diffchange-inline">přehlednost</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>* <ins class="diffchange diffchange-inline">Uživatel na první pohled ví, k&amp;nbsp</ins>;<ins class="diffchange diffchange-inline">čemu výrobek slouží.</ins></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del class="diffchange diffchange-inline">** snadná orientace</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>* <ins class="diffchange diffchange-inline">Uživatel ví, jak vyřešit svůj úkol.</ins></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del class="diffchange diffchange-inline">** nepřehlcení informacemi</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>** <ins class="diffchange diffchange-inline">přehlednost, snadná orientace</ins></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del class="diffchange diffchange-inline">* dodržení standardů</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>* <ins class="diffchange diffchange-inline">Uživatel považuje ovládání za snadné.</ins></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del class="diffchange diffchange-inline">* dodržení běžných konvencí</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del class="diffchange diffchange-inline">* vizuální přitažlivost</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>; <del class="diffchange diffchange-inline">Speciálně pro web</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>* <del class="diffchange diffchange-inline">aktuálnost</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>** <del class="diffchange diffchange-inline">snadnost doplňování</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>*<del class="diffchange diffchange-inline">* možnost přidělení rubrik editorům</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del class="diffchange diffchange-inline">* dostupnost na portálech, SEO</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>=== Negativa ===</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>=== Negativa ===</div></td></tr> <tr><td colspan="2" class="diff-lineno">Řádka 43:</td> <td colspan="2" class="diff-lineno">Řádka 57:</td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* nefungující chybová stránka 404, &#160;</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* nefungující chybová stránka 404, &#160;</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* neexistující fulltextové vyhledávání</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* neexistující fulltextové vyhledávání</div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;"></ins></div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>== Chování uživatele na webu ==</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>== Chování uživatele na webu ==</div></td></tr> <tr><td colspan="2" class="diff-lineno">Řádka 67:</td> <td colspan="2" class="diff-lineno">Řádka 82:</td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>**: (s vyjímkou novinových článků a literárních statí či knih)</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>**: (s vyjímkou novinových článků a literárních statí či knih)</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* Dejte stránkám jasnou strukturu</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* Dejte stránkám jasnou strukturu</div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;"></ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">=== Jak dosáhnout použitelnosti ===</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">* Nejprve kreslete a&amp;nbsp;testujte, pak až kódujte!</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">* Nepřehlcení informacemi</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">* Dodržení standardů</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">* Dodržení běžných konvencí</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">* Vizuální přitažlivost</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">* Testujte na lidech! (viz (#Analýza použitelnosti]])</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;"></ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">; Speciálně pro web</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">* aktuálnost</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">** snadnost doplňování</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">** možnost přidělení rubrik editorům</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">* dostupnost na portálech, SEO</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;"></ins></div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>=== Analýza použitelnosti ===</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>=== Analýza použitelnosti ===</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>Viz: KRUG</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>Viz: KRUG</div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;"></ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">* Vytipujte cílové uživatele výrobku/webu.</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">** Můžete vytvořit „persony“.</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">* Vytipujte úlohy, které budou uživatelé s&amp;nbsp;výrobkem provádět</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">* Najděte příklady uživatelů a&amp;nbsp;testujte</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">** Najděte konkrétní uživatele z&amp;nbsp;cílových skupin.</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">** Zadávejte jim úlohy.</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">** Sledujte, jak reagují.</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;"></ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">; Pravidla</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">* Uživatel nikdy nejedná „špatně“!!! </ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">** Pokud zvolil špatný postup, je to asi chyba návrhu UI.</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">* Nenapovídejte uživateli!</ins></div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>*Na první pohled byste měli identifikovat:</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>*Na první pohled byste měli identifikovat:</div></td></tr> <tr><td colspan="2" class="diff-lineno">Řádka 85:</td> <td colspan="2" class="diff-lineno">Řádka 128:</td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>***Pro jednotlivé kategorie uživatelů</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>***Pro jednotlivé kategorie uživatelů</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>*Testujte na lidech!!!</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>*Testujte na lidech!!!</div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;"></ins></div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> </table>

Spravce http://mis.martin-simunek.cz/index.php?title=N%C3%A1vrh_UI&diff=3876&oldid=prev 2020-09-10T08:09:09Z

<p>Přidána dostupnost</p> <table style="background-color: white; color:black;"> <col class='diff-marker' /> <col class='diff-content' /> <col class='diff-marker' /> <col class='diff-content' /> <tr valign='top'> <td colspan='2' style="background-color: white; color:black;">← Starší verze</td> <td colspan='2' style="background-color: white; color:black;">Verze z 10. 9. 2020, 08:09</td> </tr><tr><td colspan="2" class="diff-lineno">Řádka 8:</td> <td colspan="2" class="diff-lineno">Řádka 8:</td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>== <del class="diffchange diffchange-inline">Kritéria použitelnosti </del>==</div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>== <ins class="diffchange diffchange-inline">Dostupnost (availability) </ins>==</div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del class="diffchange diffchange-inline">Viz: Adaptic.cz</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;">*aktuálnost</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;">**snadnost doplňování</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;">**možnost přidělení rubrik editorům</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;">*přehlednost</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;">**snadná orientace</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;">*dodržení standardů</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;">*grafická přitažlivost</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;">*dostupnost na portálech, SEO</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>== <del class="diffchange diffchange-inline">Negativa </del>==</div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>== <ins class="diffchange diffchange-inline">Použitelnost </ins>==</div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del class="diffchange diffchange-inline">Viz: Adaptic.cz</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div></div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;"></ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">=== Cíle ===</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">* přehlednost</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">** snadná orientace</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">** nepřehlcení informacemi</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">* dodržení standardů</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">* dodržení běžných konvencí</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">* vizuální přitažlivost</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">; Speciálně pro web</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">* aktuálnost</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">** snadnost doplňování</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">** možnost přidělení rubrik editorům</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">* dostupnost na portálech, SEO</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;"></ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">=== Negativa ===</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;">Viz: Adaptic.cz</ins></div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* přílišná originalita, především v ovládání webu, ale i při návrhu layoutu nebo vzhledu</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* přílišná originalita, především v ovládání webu, ale i při návrhu layoutu nebo vzhledu</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* nekonzistence hlavních prvků a jejich funkčnosti</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* nekonzistence hlavních prvků a jejich funkčnosti</div></td></tr> <tr><td colspan="2" class="diff-lineno">Řádka 48:</td> <td colspan="2" class="diff-lineno">Řádka 54:</td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>**V době vyhledávačů může uživatel na váš server vstoupit kteroukoli stránkou, nejen úvodní.</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>**V době vyhledávačů může uživatel na váš server vstoupit kteroukoli stránkou, nejen úvodní.</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>== Postupy k dosažení použitelnosti ==</div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">=</ins>== Postupy k dosažení použitelnosti <ins class="diffchange diffchange-inline">=</ins>==</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>Viz: KRUG</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>Viz: KRUG</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td colspan="2" class="diff-lineno">Řádka 62:</td> <td colspan="2" class="diff-lineno">Řádka 68:</td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* Dejte stránkám jasnou strukturu</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* Dejte stránkám jasnou strukturu</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>== Analýza použitelnosti ==</div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">=</ins>== Analýza použitelnosti <ins class="diffchange diffchange-inline">=</ins>==</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>Viz: KRUG</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>Viz: KRUG</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td colspan="2" class="diff-lineno">Řádka 79:</td> <td colspan="2" class="diff-lineno">Řádka 85:</td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>***Pro jednotlivé kategorie uživatelů</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>***Pro jednotlivé kategorie uživatelů</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>*Testujte na lidech!!!</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>*Testujte na lidech!!!</div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins style="color: red; font-weight: bold; text-decoration: none;"></ins></div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>== Zdroje: ==</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>== Zdroje: ==</div></td></tr> </table>

Spravce http://mis.martin-simunek.cz/index.php?title=N%C3%A1vrh_UI&diff=3875&oldid=prev 2020-09-10T07:52:55Z

<p>Přidán pojem Uživatelské rozhraní.</p> <table style="background-color: white; color:black;"> <col class='diff-marker' /> <col class='diff-content' /> <col class='diff-marker' /> <col class='diff-content' /> <tr valign='top'> <td colspan='2' style="background-color: white; color:black;">← Starší verze</td> <td colspan='2' style="background-color: white; color:black;">Verze z 10. 9. 2020, 07:52</td> </tr><tr><td colspan="2" class="diff-lineno">Řádka 1:</td> <td colspan="2" class="diff-lineno">Řádka 1:</td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del class="diffchange diffchange-inline">Nadřazené kategorie:</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>[[Category:VSE]][[Category:<ins class="diffchange diffchange-inline">HTML</ins>]][[Category:<ins class="diffchange diffchange-inline">Softwarové inženýrství</ins>]]</div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>[[Category:VSE]]</div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>&#160;</div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>[[Category:<del class="diffchange diffchange-inline">CRI</del>]] <del class="diffchange diffchange-inline">[[CRI]]</del></div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">== Uživatelské rozhraní ==</ins></div></td></tr> <tr><td class='diff-marker'>&minus;</td><td style="background: #ffa; color:black; font-size: smaller;"><div>[[Category:<del class="diffchange diffchange-inline">HTML</del>]]</div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">* UI... User Interface</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">* Zařízení či software, které slouží uživateli k&amp;nbsp;ovládání výrobku/služby/počítače...</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">* Nemusí být nutně vztaženo k IT.</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">* Jedná se o jednu z&amp;nbsp;oblastí ''softwarového inženýrství'' (SI).</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>&#160;</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>== Kritéria použitelnosti ==</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>== Kritéria použitelnosti ==</div></td></tr> </table>

Spravce http://mis.martin-simunek.cz/index.php?title=N%C3%A1vrh_UI&diff=3872&oldid=prev 2020-09-10T07:49:06Z

<p>Stránka <a href="/index.php/Pou%C5%BEitelnost_webu" class="mw-redirect" title="Použitelnost webu">Použitelnost webu</a> přemístěna na stránku <a href="/index.php/N%C3%A1vrh_UI" title="Návrh UI">Návrh UI</a>: Zobecnění obsahu stránky</p> <table style="background-color: white; color:black;"> <tr valign='top'> <td colspan='1' style="background-color: white; color:black;">← Starší verze</td> <td colspan='1' style="background-color: white; color:black;">Verze z 10. 9. 2020, 07:49</td> </tr></table>

Spravce http://mis.martin-simunek.cz/index.php?title=N%C3%A1vrh_UI&diff=45&oldid=prev 2010-11-07T01:45:17Z

<p>1 revizi: Převod z Wiuky</p> <table style="background-color: white; color:black;"> <tr valign='top'> <td colspan='1' style="background-color: white; color:black;">← Starší verze</td> <td colspan='1' style="background-color: white; color:black;">Verze z 7. 11. 2010, 01:45</td> </tr></table>

Spravce http://mis.martin-simunek.cz/index.php?title=N%C3%A1vrh_UI&diff=44&oldid=prev 2010-10-10T09:18:39Z

<p>Vytvoření stránky</p> <p><b>Nová stránka</b></p><div>Nadřazené kategorie:<br /> [[Category:VSE]]<br /> [[Category:CRI]] [[CRI]]<br /> [[Category:HTML]]<br /> <br /> == Kritéria použitelnosti ==<br /> Viz: Adaptic.cz<br /> <br /> *aktuálnost<br /> **snadnost doplňování<br /> **možnost přidělení rubrik editorům<br /> *přehlednost<br /> **snadná orientace<br /> *dodržení standardů<br /> *grafická přitažlivost<br /> *dostupnost na portálech, SEO<br /> <br /> == Negativa ==<br /> Viz: Adaptic.cz<br /> <br /> * přílišná originalita, především v ovládání webu, ale i při návrhu layoutu nebo vzhledu<br /> * nekonzistence hlavních prvků a jejich funkčnosti<br /> * malá rychlost načítání a vykreslování stránky v prohlížeči<br /> * nefungující či nedostatečná navigace<br /> * špatná informační architektura – především nelogické uspořádání, rozmístění a malá strukturovanost informací<br /> * zasahování do uživatelského prostředí prohlížeče, např. obarvené lišty, otvírání odkazů do nového okna<br /> * neexistence tiskové verze<br /> * chybějící zpětná vazba<br /> * nepřívětivý tvar URL<br /> <br /> ; U větších webů také: <br /> * chybějící mapa stránek, <br /> * nefungující chybová stránka 404, <br /> * neexistující fulltextové vyhledávání<br /> <br /> == Chování uživatele na webu ==<br /> Viz: KRUG<br /> <br /> * Prohlížíme, nečteme<br /> * Volíme první „rozumnou“ volbu<br /> * Máme-li řešení, nehledáme další<br /> <br /> *Pozor!<br /> **V době vyhledávačů může uživatel na váš server vstoupit kteroukoli stránkou, nejen úvodní.<br /> <br /> == Postupy k dosažení použitelnosti ==<br /> Viz: KRUG<br /> <br /> ; Motto: ''„Nenuťte uživatele přemýšlet“''<br /> * Prvkům ponechte tradiční vzhled<br /> ** odkazy podtržené<br /> ** tlačítka se zvýrazněnými okraji<br /> ** jednotlivé bloky stránky graficky oddělené<br /> * „Vynechte polovinu slov“<br /> ** žádné uvítací prology<br /> ** žádné dlouhé odstavce textu<br /> **: (s vyjímkou novinových článků a literárních statí či knih)<br /> * Dejte stránkám jasnou strukturu<br /> <br /> == Analýza použitelnosti ==<br /> Viz: KRUG<br /> <br /> *Na první pohled byste měli identifikovat:<br /> **Logo serveru<br /> **Název stránky (v rámci serveru)<br /> **Záložky sekcí<br /> **Lokální navigace<br /> **Nástroj pro vyhledávání<br /> *Při pohledu na stránku máte vědět<br /> **Co web nabízí<br /> ***Název<br /> ***Logo<br /> ***Slogan<br /> **Kudy máte pokračovat<br /> ***Pro jednotlivé kategorie uživatelů<br /> *Testujte na lidech!!!<br /> <br /> == Zdroje: ==<br /> * KRUG, Steve. ''Webdesign : Nenuťte uživatele přemýšlet''. 2. aktualizované. Brno : Computer Press, 2007. 164 s. ISBN 80-251-1291-8.<br /> ** Anglický originál: Steve Krug. Don't Make Me Think: A Common Sense Approach to Web Usability<br /> * [http://www.adaptic.cz/znalosti/efektivni-web/pouzitelnost-webu/ Adaptic.cz &gt; Použitelnost webu]<br /> * [http://data.businessworld.cz/file/etime/prezentace/nadvornik.pdf Prezentace z Data.businessworld.cz]</div>

Spravce