- PSPad
- Notepad++
- Textmate (OSX)
- Sublime Text
- nebo jakýkoli jiný, který máte rádi
Stačí, když vaše stránky budou podporovat tyto hlavní prohlížeče:
- Internet Explorer
- verze 10 a 11
- Mozilla Firefox
- budeme používat na cvičeních, má firebug plugin (něco podobného má chrome rovnou v sobě)
- aktuální verze
- Google Chrome
- doporučuji kvůli rychlosti
- aktuální verze
- Edge
- dostupný pouze v MS Windows 10, nové zobrazovací jádro
Ostatní (minoritní, nebudu kontrolovat funkčnost):
- Opera
- malý podíl na trhu, stejné zobrazovací jádro jako Chrome
- Safari
- na Macu
- ostatní jsou minor (nedůležité)
Zdroj: http://www.w3.org/WhatIs.html
What is HyperTextHypertext is text which is not constrained to be linear.
Hypertext is text which contains links to other texts. The term was coined by Ted Nelson around 1965 (see History ).
HyperMedia is a term used for hypertext which is not constrained to be text: it can include graphics, video and sound , for example. Apparently Ted Nelson was the first to use this term too.
Hypertext and HyperMedia are concepts, not products.
See also:
- A list of terms used in hypertext litterature.
- Conferences
- Commercial (and academic) products
- A newsgroup on hypertext, "alt.hypertext" .
- WorldWideWeb is a project which uses hypertext concepts.
- určuje typ dokumentu, instrukce prohlížeči, jak a co má zobrazit
- nejedná se o HTML tag
- musí být jako první v dokumentu
XHTML 1.0 Strict
XHTML 1.0 Transitional
XHTML 1.0 Frameset
XHTML 1.1
HTML5
- tagy jsou ukončené, i jednoduché tagy musí být napsány např. jako <br/>
- tagy a atributy malými písmeny
- styly a scripty jsou externí soubory
- stránka je validní XML
- nepoužívat, otrava
- sémantika
- canvas
- lepší formy
- email, colorpicker, search form
- všechny funkce nepodporují všechny browsery, nutno zkusit
- kniha Dive Into HTML5
- http://kniha.html5.cz
- DOCTYPE (na cvičení používáme HTML 5, pokud odevzdáte na cvičení XHTML, je to jedno, vyvarovat se HTML 4)
- html
- head
- body
- párové
- jednoduché (nepárové)
- header, hlavička
- nadpisy
- měly by jít po úrovních, každá stránka by měla mít jen 1 h1 a postupně jít dolů
- podle toho indexují roboti
- v HTML5 už nemusí být 1 pro celou stránku, ale i pro část stránky (tag article, atd., viz kniha)
- division = sekce, blok
- kontejner, seskupuje elementy
- obdélník, obaluje elementy
- hlavně kvůli formátování pomocí CSS
- default se za ním zalomí řádek
- paragraph = odstavec
- základ formátování pro text
- bloková citace / citace z jiného zdroje
- do parametru cite se uvádí URL adresa zdroj
- browser provede default odsazení
- preformatted text = předformátovaný text
- zachovává všechny mezery a zalamování řádků
- typicky ukázka zdrojového kódu nebo kus textu odjinud, ve kterém nechceme ztratit formátování
- horizontal rule = horizontální oddělovač
- nepárová značka
- vykreslí na stránce horizontální čáru
- break = ruční zalomení řádky
- neměli bychom jich používat víc za sebou, špatně se s tím pak pracuje a je to nepřehledné
- Používat místo toho div, p a mezery řešit v CSS
- tabulka, budeme brát 2. cvičení za týden
- seznamy, budeme brát 2. cvičení za týden
- formuláře
- budeme brát na 10. cvičení
- anchor [ˈæŋkə]
- párová značka
- uvnitř může být text, obrázek
- hypertextový odkaz
- href = odkaz kam, pokud je na začátku #, pak je to odkaz na místo v tom samém dokumentu
- target _blank, _top, _parent, _self (default)
- v HTML 4 také name pro quote v documentu, ale v HTML 5 je používáno už jen id
- default je odkaz podtržený a barevný (modrý), rozlišuje se barva navštíveného a nenavštíveného odkazu, lze změnit pomocí CSS
<a href="http://google.com" target="_blank">Google</a>- image, obrázek
- budeme brát na 2. cvičení za týden
- = rozpětí
- jen inline kontejner, seskupuje prvky, nereprezentuje nic konkrétního
- jako div, ale řádkový
- zejména kvůli formátování
- krátká citace, kterou chceme uvést v textu
- “title of work”
- název knihy, skladby, díla
- v HTML 4 je to citace, v HTML 5 title of work
- browsery obyčejně zobrazují kurzívou
- quote = řádková citace
- inline citace, krátká
- browser neprovede zalomení řádku
- dolní a horní index
- sub-index, super-index
- moc se nepoužívá, indexy však nejde zapsat jinak
- strong importance = vysoká důležitost
- zvýraznění
- dříve b (bold), teď používat tohle, protože to má i sémantický význam
- zvýraznění nemusí být tučné, je to default zobrazení browseru
- lze změnit pomocí CSS
- logický stav
- hlavně kvůli spiderům
- silná sémantická váha
- bold
- chápu, proč se může zdát b lepší = je to kratší
- b se dle HTML5 může používat jako last resort, pokud prostě nevyhovuje h1, h2..h6, ani em, ani strong
- není to výslovně zakázáno, jen to postrádá sémantický význam
- Google inženýr: je to úplně stejný
- https://www.seroundtable.com/google-strong-bold-tag-17552.html
- emphasize = zdůraznění
- browsery to default zobrazují kurzívou
- italic
- alternate voice or mood
- technický termín, cizí jazyk
- prostě se to nějak liší od okolního textu
- podobné jako b, mělo by to být last resort, pokud nejde použít strong, em, atd.
- zdůraznění části textu
- vykreslováno zpravidla kurzívou.
- zápis zkratek, vhodné pro možnost jejich doplňkového vysvětlení
- význam zkratky se zapisuje do atributu title
- <!-- text komentáře -->
- nevýhoda komentářů: je to vidět ve zdrojácích. V praxi jsem viděl, jak programátoři cpali do zdrojáků citlivé nebo hanlivé texty.
- pozor na to
- Ukázat: zobrazení zdrojáku v browseru.
- Jak schovat komentáře: udělat třeba jako PHP komentář, PHP generuje HTML a PHP komentáře do výsledeného dokumentu vynechává.
- HTML cesta, jak utajit? Obfuskátory. Zkuste si sami najit, koho to zajímá. Často je to ale jenom komplikace, pokud máte HTML kod, který se musí schovat, tak je něco špatně.
- není podporován Chrome, viz seznam, kdo to podporuje: http://caniuse.com/#feat=mathml
- http://www.mathjax.org/
- etalon, umí toho nejvíc
- dost pomalý
- bere to TeX i MathML
- majoritní browsery s ním nemají problém
- https://khan.github.io/KaTeX/
- umí jen Texovou syntaxi
- mnohem menší a rychlejší než MathJax