font-family: 'Trebuchet MS', Arial, Helvetica, sans-serif;
na úvodní stranu font-size: 0.75em; color: #000; ... background: #d1d6da url('../images/bg.jpg') repeat-x; line-height: 1.4; }
CSS: kaskádové styly
a { color: #009edf; } a:hover { color: #009edf; text-decoration: none; } 5
Důsledky chyb v XHTML
chyba v parsování neuzavřený tag (značka) nebo chyba v CSS
důsledek: rozsypaný layout (rozvržení) stránky
chyba v jazykovém kódování
6
Problémy s cache: načítání staré verze stránek
Načíst znovu / Refresh / F5 / CTRL+F5 / CTRL+R (reload) restart prohlížeče, zadat adresu webu vymazat cache prohlížeče (dočasné soubory) Chyba na naší straně:
někdy je to naše chyba, je nutné při změnách v kódu aktualizovat i databázi (lib. údaj v Aktualitách, Plných stránkách, nebo přímo v Nastavení, kde je cílový parametr sledující aktuálnost webu: „POSL. AKTUALIZACE“ – nutno změnit alespoň 1 znak, jinak se časové razítko neaktualizuje) někdy můžou být rozbité tzv. triggery v databázi, které registrují změny v Aktualitách,.... a aktualizují toto časové razítko. To musím vždy ověřit já přímo nad db. Dá se to ověřit dobře v IE, FF je mnohem agresivnější, často si rovnou vyžádá novou verzi stránek.
7
Programovací jazyk JavaScript
obsah souboru /styles/common.js:
$(document).ready(function(){ $("a[rel='lightbox']").colorbox(); $(".button").button(); }); function target_blank(url){ var wasOpen = false; ....
důsledek chyby v programovém (js) kódu: 8
Ladící nástroj pro každého do FF Nástroje > Správce doplňků > Získat nové doplňky
Web Developer Firebug: ukázka: zjišťování zda se načetla stránka z cache nebo jako nová
Status: 304 Not Modified (cache) vs. 200 OK (načteno ze serveru)
9
CKeditor
vkládání vč. XHTML formátování lepší wysiwyg (napojení stylů) zakázány někt. transitional atributy (target) kontrola pravopisu (zatím bez čj) více šablon
TODO - dotáhnout: dialogy (titulek na úvodní záložce) formátování kódu chyby v FF, IE9 (patche) 10
Plné stránky
validace: při dokončení a aktivaci hromadná validace: opatrně, nepřetížit w3c web (zablokování IP na 1 – 2 dny)
11
Aktuality
nové parametry Rubrik
přihlašování:
rubrika pouze pro přihlášené
připojení výpisu (fotog., soubory) formátované newslettery
12
Fotogalerie
automatická rotace při uloadu jpg s údajem v EXIF: Rotation (prosím reportujte selhání této funkce!) lepší řazení (při filtrování dle kategorie): řadit pomocí miniatur edit in place: přímá editace titulků (širší univerzální využití v budoucnu)
13
Další novinky
Překlady:
Centra
výchozí nastavení: pouze fráze z FO skrytí přeložených frází (v plánu) načítání GPS pomocí API beta.mapy.cz zadání kliknutím
manipulace s objekty, efekty
pomocí knihovny JQUERY (http://jqueryui.com/ demos, theming,...) předdefinované: lightbox efekt na lib. odkazu:
zobrazit
předdefinované: styl tlačítko - přidej class="button"
14
Nejčastější chyby
TITLE (a, img, ... core atrib), ALT (img) SOUBORY – zamčení PDF, pojmenování SEO-like formou, vč. klíčových slov OBRÁZKY – kvalita, velikost, korekce, ... Plné stránky:
TITULEK vs. KRÁTKÝ TITULEK: TITULEK by měl obsahovat hlavní klíčová slova
chybějící META DESCRIPTION
Struktura:
prázdné úvodní stránky sekcí aktivní a dokončené testovací stránky (vs. parametr Skrytá: skrývá pouze odkaz, vyhledávače ji mohou zaindexovat !) 15
inline CSS: style=”text-align:center;color:#00f”
využijte raději více tříd: class=”center gray”
HTML5:
http://www.rgraph.net/ http://www.1stwebdesigner.com/freebies/example s-html5-javascript-uses/ ..google 16
Hromadný export obrázků z MS Office
Starší verze: Uložit jako webovou stránku + Možnosti webu.. : obrázky na max velikost (obrázky najdete v podsložce)
2007, 2010: formáty docx, pptx, ..:
přejmenovat na ZIP rozbalit podsložku /media samostatný obrázek ve verzi 2010: Uložit jako obrázek / původní ..
17
Ořez (s perspektivou), korekce Photoshop: ořez => celkový dojem portrétu! C + volba Perspektiva zvětšení, zmenšení: CTRL+„+“, „-“ celý obrázek na celou plochu: CTRL+0, posun: MEZERNÍK Korekce fotografie (Obraz > Přizpůsobení)
nejlépe na pův., nezmenšené verzi Úrovně: CTRL+L ... úprava histogramu Křivky: CTRL+M ... zde úprava barevnosti alternativně Jas a kontrast Tón / kontrast / barvy AUTOMATICKY
JPG logo s artefakty, krajinky
NĚKDY nevhodné (ukázka: odběry.jpg) zvolíme Tón automaticky (SHIFT+CTRL+L)
Další úpravy: Obraz > Natočení obrazu, ... 18
Doostření
Originál
Přeostřeno funkcí Doostřit
Filtr > Zostřit > Doostřit... Objekty: použijeme Chytré zostření... Lepší postup:
Požadovaný výsledek
zvětšíme na 200%, 2x Doostřit (přeostříme) zmenšíme zpět na 50% 19
Zabezpečení PDF šifrou AES
Nastavení: kompatibilita verze Acrobat 7 a vyšší
128bitové šifrování RC-4 (od verze Acrobat 5 šifra AES (od verze 7) silné heslo Nejčastější nastavení:
Omezit úpravy a tisk dokumentu (přidáním hesla); sdílené heslo v rámci pracoviště
20
Poděkování
Konání kurzu financováno z Operačního programu Vzdělávání pro konkurenceschopnost „ZVYŠOVÁNÍ IT GRAMOTNOSTI ZAMĚSTNANCŮ VYBRANÝCH FAKULT MU“ Registrační číslo: CZ.1.07/2.2.00/15.0224
21
