Problémy se styly vyřešeny

Včera jsem psal o problému se styly a dnes jsem problém již vyřešil. Chyba byla samozřejmě mezi židlí a klávesnicí.

Problém spočíval v tom, že JavaScript, který styly přepíná, se odkazuje na pojmenování stylu ve formátu "Styl#", kde znak # je nahrazen číslem stylu od 1 do n (podle počtu stylů). Tím, že jsem v deklaraci stylu použil u atributu title něco jiného, než skript očekával, dosáhl jsem toho, že to fungovalo jen v Opeře (která má na přepínání stylů vlastní mechanismy) a v MSIE a ve Firefoxu to fungovat nemohlo, protože nebyl nalezen styl se správným jménem. Pokud bych chtěl, aby to fungovalo, tak bych buď musel upravit zmíněný JavaScript nebo bych musel upravit deklaraci stylu. Rozhodl jsem se pro ten druhý krok.

Navíc jsem při té příležitosti udělal ještě jednu věc a sice tu, že jsem si vytvořil dalších 6 souborů se styly (soubory styl1.css až styl5.css a soubor stylp.css) a upravil jsem příslušné deklarace stylů z <link href="styl_#.css" ... /> na <link href="styl#.css" ... />. Do zmíněných souborů jsem uvedl jen jedno jedinné pravidlo: @import "styl_1.css"; (@import "styl_2.css"; atd.) čímž se odstřihnou od stylů starší verze některých prohlížečů.

Má to jen jednu nevýhodu a sice tu, že se trošku zvýší počet http požadavků, čímž se může teoreticky o něco snížit rychlost načítání stránek. Vzhledem k velikosti souborů si ale myslím, že to není až tak velký prohřešek.

Problémy se styly

Narazil jsem dnes na nějaké problémy s přiřazením stylů k HTML stránce. Konkrétně šlo o následující situaci.

Zkoušel jsem experimentovat se styly u mých stránek a taky jsem stránky testoval v různých prohlížečích. Při testování v Opeře jsem narazil na skutečnost, že se mi styly nepoužily tak, jak bych předpokládal.

Styly mám definované následovně:

<style type="text/css" title="Styl1" media="all">@import "styl_1.css"/**/;</style>
<style type="text/css" title="Styl2" media="all">@import "styl_2.css"/**/;</style>
<style type="text/css" title="Styl3" media="all">@import "styl_3.css"/**/;</style>
<style type="text/css" title="Styl4" media="all">@import "styl_4.css"/**/;</style>
<style type="text/css" title="Styl5" media="all">@import "styl_5.css"/**/;</style>
<style type="text/css" media="print">@import "styl_p.css"/**/;</style>

Problém je v tom, že v MSIE i ve Firefoxu se mi styly zobrazí dobře, ale v Opeře se použije jen Styl 5 (protože je poslední) a vůbec se mi nenabídnou ty ostatní styly.

Když jsem se pokusil použít tohle:

  <link href="styl_1.css" rel="stylesheet" type="text/css" media="all" title="Základní styl" />
  <link href="styl_2.css" rel="alternate stylesheet" type="text/css" media="all" title="1. alternativní styl" />
  <link href="styl_3.css" rel="alternate stylesheet" type="text/css" media="all" title="2. alternativní styl" />
  <link href="styl_4.css" rel="alternate stylesheet" type="text/css" media="all" title="3. alternativní styl" />
  <link href="styl_5.css" rel="alternate stylesheet" type="text/css" media="all" title="4. alternativní styl" />
  <link href="styl_p.css" rel="stylesheet" type="text/css" media="print" title="Styl pro tisk" />

tak to v Opeře fungovalo správně, ale MSIE i Firefox si ani neškrtly a stránku oba zobrazily tak, jako by styly neobsahovala. Mohl by mi někdo poradit, kde jsem udělal chybu?

Jen malé doplnění. Soubory styl_4.css a styl_5.css jsou sice na serveru přítomny, ale oba jsou v podstatě stejné a zatím nemám vytvořenu barevnou verzi pro jejich použití, nicméně na tom chci ještě pracovat.

Kosmetiské úpravy blogu

Rozhodl jsem se provést nějaké kosmetické úpravy na mém blogu. Konkrétně se jedná o následující věci:

  • Změnil jsem styl nadpisu článku z nadpisu úrovně 3 (tag h3) na nadpis úrovně 2 (tag h2).
  • V souvislosti s předchozím bodem jsem zrušil zobrazování nadpisu úrovně dvě s informací o datu publikování a s odkazem na kategorii. Zobrazovalo se to jen jednou za den a pokud jsem toho v jeden den napsal víc, tak to bylo nepřehledné. Datum a čas publikování se stejně vypisuje v seznamu pod článkem.
  • V souvislosti s předchozím bodem jsem přidal odkaz na kategorii do seznamu pod článkem.

Teď by mělo být čtení mého blogu o něco přehlednější a stále by měla být zachována správná sémantika.

Moderní web

Miloslav Lešetický alias Plaváček dnes napsal článek Moderní web. Možná to bude vypadat, že jsem Plaváčkem posedlý, ale nemůžu si pomoct. Zatím všechno, co jsem od něho viděl, bylo naprosto úžasné.

Stejně tak si myslím, že projekt Moderní web si najde své uplatnění a že se v něm budou objevovat weby, na kterých se my, méně zkušení a začínající, budeme mít co učit. V tuto chvíli tam jsou první čtyři vlaštovky, ale věřím tomu, že se bude portfolio webů, které se do Moderního webu zařadí, stále rozšiřovat.

Chtěl bych se jednoho dne dostat na takovou úrověň, že by se i některý mnou vytvářený web do Moderního webu zařadil, ale obávám se, že moje grafické nadání je na tak nízké úrovni, že se toho asi nedožiju.

Redesign stránek 3

Dnes jsem se rozhodl přizpůsobit vzhled mého blogu vzhledu mých stránek.

Původně jsem si myslel, že to nechám na jindy, ale nakonec to vypadá, že to nebylo až tak složité a že se to povedlo. Ještě musím do stylů přidat jednu deklaraci (pro prvek texarea) a mělo by to být vše hotové.

Je pravda, že jsem si upravil šablonu blogu trošku víc, než by bylo zdrávo (ne vše si nechám generovat systémem), ale důležité je to, jestli to funguje. No a vypadá to, že to funguje, takže jsem spokojený. Uvidíme, jestli se čase projeví nějaká chybka.

UPDATE: Přidal jsem do stylů deklaraci pro prvek textarea, takže už bude správně nastylován.

Redesign stránek 2

Dnes jsem dokončil redesign mých stránek. Jestli Vás to zajímá, tak se na výsledek mého snažení můžete podívat na adrese http://www.bobocop.cz.

Nakonec jsem upustil od záměru, že bych použil jen jeden DIV a jeden SPAN (viz CLASSické weby), ale mám v plánu zmíněný postup použít při tvorbě některého z nových webů nebo při úpravě některého stávajícího.

Vzhled mého blogu zatím zůstává nezměněn, ale mám v plánu jej přizpůsobit vzhledu mých stránek. Zatím k tomu nemám dostatek času, nicméně budu na tom pracovat.

CLASSické weby

Miloslav Lešetický alias Plaváček dnes vydal článek CLASSické weby, který dle mého názoru ukazuje revoluční řešení v oblasti webdesignu.

Předvedl perfektní dvousloupcový (tím druhým sloupcem je menu) beztabulkový layout s použitím jen jediného DIVu a jediného SPANu (viz CSS layout). Úžasné na tom není jen to, že je použit jen jeden DIV a jeden SPAN a na vše ostatní jsou použity prostředky HTML (XHTML), ale výborné je i to, že se zmíněná stránka zobrazuje korektně i v JESPRu (alias MS IE).

Ale abych nepěl jen chválu, tak musím říct, že jedna věc mi na tom řešení vadí a sice ta, že je ve struktuře dokumentu nabídka před hlavním textem. Nicméně si myslím, že i s tím by se dalo něco dělat. Určitě se z toho příkladu mám co učit a asi s vypuštěním nové verze designu mých stránek (viz předchozí článek) ještě chvilku počkám a pokusím se je předělat podle Plaváčkova vzoru. Doufám, že budu úspěšný.

Redesign stránek 1

Přestal se mi líbit vzhled mých stránek a proto jsem se rozhodl, že jej změním.

V současné době pracuju na jeho grafické podobě (inspiroval jsem se na internetu) a v podstatě ji mám už skoro hotovou, takže mi zbývá už jen doladit soubor se styly a pár dalších věcí a myslím, že budu brzy schopen můj nový vzhled vypustit do světa.

Pokud by Vás zajímalo, jak to bude asi vypadat, tak by se tady někdy pod tím textem měl nacházet menší obrázek, který přibližně ukazuje nový vzhled.

SkreenShot nového vzhledu webu

Není to ještě konečná verze, ale zhruba nějak takhle bych si představoval, aby to vypadalo.

Nejhledanější slova na Seznamu

Ivo Lukačovič dnes na svém blogu zveřejnil odkazy na seznam nejhledanějších slov na portálu seznam.cz. Konkrétně se jedná o článek Nejhledanější slova na Seznamu v roce 2004, podle jednotlivých oborů.

Myslím si, že když je to rozděleno do oborů, tak jsou to mnohem zajímavější informace, než když je to jen globální seznam nejhledanějších slov. No a pokud byste nechtěli chodit na ten článek a zajímají Vás ty konkrétní odkazy, tak tady jsou:


Přeskočit na obsah