Chaos Sanctuary

na sitepoint.com. Bude k dispozici už jen 28 dní. Jedná se o knížku zaměřenou na webdesign a Photoshop a je tam spousta užitečných tipů nejen pro začátečníky.

Vyžadují tam váš mail, na který vám pošlou odkaz na download, nabízí odběr newslettrů ale lze se tomu vyhnout. Download má asi 67MB.

Chcete-li vědět, do čeho jdete, obsah knížky je popsán třeba tady, část kapitoly o výrobě tlačítek je tady

Možná jste si všimli, že se tu občas objeví zmínka o Honor Harringtonové a Honorverse, jak se nazývá vesmír, který stvořil david Weber pro svou military sci-fi. Kromě toho, že to čtu, taky jsem před pár lety spáchala web o Honor Harrington, který v poslední době trochu stagnoval, protže D.Weber momentálně píše knížky z jiných sérií a na zoufalé fanoušky HH nemyslí, ale fanoušci na Mantichorské království myslí stále.

Situace Mantichory po poslední bitvě je vážná a probíhá stálý nábor nových posádek. I vy se můžete stát členy posádky kosmické lodi Phantom, znáte-li aspoň trochu vesmír HH, neváhejte, je to pro dobrou věc. Za královnu!

bitevní křižník třídy Reliant

V tomto tématu ve foru k hh se můžete seznámit s myšlenkou - jde o fandovskou stránku, kde se vytvoří posádka, každý si o sobě něco vymyslí a pak začnou bojové mise .. možná, zatím to na velkou bojovou morálku posádky nevypadá. Land vyrobil stránky o lodi Phantom, je tam pro posádku připraveno rovněž forum, takže hlásit se můžete přímo tam :-)

Dnes jsme se docela zlikvidovali třicetikilometrovým pěším výletem, a tak jsem večer relaxovala u Hellgate:London a můj drahý u televize.
"Hele nalij něco, zasloužíme si to", pojal On skvělou ideu. Samozřejmě mě do toho potřeboval zaangažovat, aby nevypadal jako osamělý alkoholik, a navíc tu flašku Napoleona jsem dostala já ...
"Teď nemůžu", zamumlala jsem nepřítomně a soustředěně jsem likvidovala nabíhající tlupy Blade minionů.
"Tak já počkám, až tě zabijou", řekl ON.

Inu, tolerance a láska, po všech těch letech :-)

Schválně, jestli poznáte, co je na obrázku (jde zvětšit, jen si klikněte, jestli myslíte, že to pomůže), já bych to teda neuhodla ale já opravdu nejsem opravdový muž.

Dokonce i hospodský na kopci mi to tuhle dal najevo. Začalo to tím, že jsem si objednala černého Kozla (jj všechny ženské tam měly tohle "babské pití"), a když nám pak přinesl objednané jídlo, se širokým úsměvem naservíroval talíř mému chlapovi - "tak tady je ten srnčí gulášek" a pak se s despektem obrátil na mě - "a vy máte to smažené mléko .." a mleskl na stůl talíř se smaženým sýrem. Njn, teď si budu muset aspoň pětkrát dát normální pivo a možná zavináč, abych byla přijata na milost :-)

Když jsem ten článek viděla, zajásala jsem a požádala autora o souhlas s překladem, protože to vypadalo, a skutečně to tak je, jako typický návod pro lamy. Návod se týká sIFR (náhrada textu fonty z flashového souboru) verze 3 a bohužel potřebujete Macromedia Flash, protože žádné z free řešení pro vytvoření .swf pro tuto verzi zatím nefunguje. Takže nemáte-li Flash, ani to nečtěte, a počkejte si na článek o sIFR 2 pro socky :-)

Jak přimějete sIFR k práci

Autor: David Yeiser
Přeloženo z This is how you get sifr to work s laskavým svolením autora.

Cílem tohoto tutoriálu je uspořádat informace z oficiálního webu sIFR do jednoduchého "krok-po-kroku" návodu jak implementovat na váš web sIFR

Když si návod přečtete, porozumíte základům fungování sIFR a můžete začít zkoumat i složitější oblasti sIFR.

Návod je rozdělen do šesti sekcí:

1. Stažení všech potřebných souborů
2. nastavení Flashového souboru pro požadované písmo
3. nahrání potřebných souborů
4. nahrazení ‘normálního’ textu textem ze ’sIFR’
5. nastylování nového textu (budete překvapení, kde se to dělá!)
6. provedení finálních úprav
7. Závěr a další zdroje

Než začneme, uvědomte si tohle:

• Nebudete muset modifikovat jiné soubory než ty, které stáhnete z webu sIFR. Nemusíte se starat o editaci již existujících stylů
• sIFR degraduje velmi dobře, takže se nemusíte obávat o uživatele bez Flashe a / nebo Javascriptu.
• Není to náročné na přenosy (v porovnání s typickými Flashovými soubory.

Začínáme!

1. Stažení sIFR

První krok je stáhnout zip soubor sIFR. List of nightly builds je asi jediné místo (pokud vím), kde získáte nejnovější verzi sIFR. Tak běžte a nejnovější verzi si stáhněte.

Když otevřete ten zip soubor, uvidíte čtyři složky a textový soubor. Pro začátek můžete ignorovat složku demo; ty tři ostatní složky —css, flash a js— obsahují ty soubory, které potřebujete.

2. Vytvoření YourTypeface.swf

Než nahrajete soubory pro sIFR na web, musíte vytvořit soubor SWF se svým písmem ze souboru FLA. V složce flash je soubor s názvem sifr.fla, otevřte ho.

Když soubor sifr.fla otevřete, měli byste vidět bílý box (viz Obr 2a).

Obr 2a: Screenshot úvodní Flashové obrazovky.

Zaktivujte tento rámec dvojklikem. Měl by tam být vidět šedý text Bold Italic Normal” (viz Obr 2b).

Obr 2b: Screenshot flashové obrazovky po dvojkliku.

Abyste aktivovali svoje písmo, vyberte text, změňte ho na požadovaný druh písma (normální, tučný, kurzivu)) a pak napište jeden znak. Jeden znak v a nebo n, cokoli si vyberete. Chcete-li mít možnost psát svůj text v kurzivě nebo tučně, musíte mít jeden znak pro každou možnost.

Např. jestliže jsem chtěl mít normální text a možnost psát kurzivu nebo tučně, napsal jsem ‘n n n‘ (viz Obr 2c). Velikost souboru pro můj zvolený font se změnila asi o 30KB - rozdíl mezi jen normálním (70 KB) a všemi třemi (100 KB). Můžete experimentovat, abyste viděli, jak velikost závisí na fontu, který si zvolíte.

Obr 2c: Screenshot flashové obrazovky po napsání znaků

Nakonec vyberte požadovaný druh písma. Pro tenhle příklad jsem zvolil Arno Pro (viz Obr 2d).

Obr 2d: Screenshot dialogu typografie pro Flash

Když to máte hotové, a máte vybrán požadovaný druh písma, jděte na File > Publish Settings. V tomto dialogovém boxu se ujistěte, že následující volby jsou nastaveny jako na Obr. 2e.

Obr 2e: Publish Settings pro exportování souboru .SWF

Výchozí nastavení kvality JPEG je 80. U mého fontu nebyl pro nastavení kvality JPEG 80 a 100 žádný rozdíl, a tak jsem nastavil 100. Po úpravě nastavení stiskněte tlačítko Publish a tím vytvoříte svůj soubor. (Váš nový soubor .SWF by se měl objevit ve stejné složce jako soubor sifr.fla.)

Soubor, který jste právě vytvořili, se bude jmenovat sifr.swf; přejmenujte ho na název vašeho písma, v mém případě by to bylo arnopro.swf. Teď můžete nahrát soubory na svůj server.

3. Nahrání souborů na server

Aby sIFR fungoval, musíte nahrát následující soubory:

• css/sIFR-print.css
• css/sIFR-screen.css
• js/sifr-config.js
• js/sifr.js
• flash/yourtypeface.swf

Nyní odkažte na příslušné soubory CSS a JavaScript (Obr 3a). (Na flashový soubor odkážeme v dalším kroku.)

4. Inicializace sIFR

V tomto kroku vyvoláte soubor .SWF a řeknete mu, který text má nahrazovat. Soubor, který řídí náhradu textu, je sifr-config.js, možná jste si všimli, že jeho velikost je teď 0.

V tomto návodu použiju jako příklad dva zápisky do blogu se značkováním zobrazeným na Obr. 4a a CSS zobrazeným na Obr. 4b, výstup je zobrazen na Obr. 4c

Obr 4c

Nejdříve otevřte soubor sifr-config.js a přidejte kód zobrazený na Obr. 4d, kde yourtypeface je název písma, které jste si vybrali, když jste editovali flashový soubor. Takže můj var název by byl arnopro. (Upozornění: Ujistěte se, že váš var název je jedno slovo vcelku bez mezer, a použil bych podtržítka místo pomlček.)

Tohle odkazuje na soubor .SWF, který jste vytvořili v kroku 2, aktivuje ho, a pak nahradí vaše titulky textem ze sIFR. Dávejte pozor na formátování, je docela složité a nepromíjí chyby. Příkaz wmode: 'transparent' způsobí v Opeře bílé pozadí místo průhledného.

5. stylování

Teď, když je normální text nahrazen textem z sIFR, je potřeba nový text nastylovat. Trochu matoucí je, že CSS styly pro text ze sIFR se editují v souboru sIFR-config.js. Formátování se (většinou) dělá standardní CSS syntaxí, jen je to v javascriptovém souboru.

Styly CSS se vkládají do .sIFR-root jak ukazuje Obr. 5a. V podstatě se zde říká “asociuj každý styl, který zde je, s novým textem sIFR.”

K nastylování textu zadejte CSS vlastnosti stejně jako byste to udělali v normálním CSS souboru. Pro náš příklad zadáme CSS jak ukazuje Obr. 5b.

Nyní porovnejte normální text (levý sloupec) s textem ze sIFR (pravý sloupec) na Obr. 5c.

Obr. 5c

Jsou zde nějaké problémy s rozestupem písma, které se naštěstí dají vyřešit při dolaďování pomocí sIFR’s advanced JavaScript options. Ale tohle si necháme na jindy.

Přidání alternativních stylů

Můžete také přidat alternativní styly pro značky v textu, který chcete nahrazovat. Například, kdybyste chtěli stylovat tagy em a strong když jsou použity v hlavičkách h2, mohli byste přidat kód zobrazený na Obr. 5d.

Takže teď, když našem příkladu přidám slova Very Long s tagem strong měly by být tučné a šedé (viz Obr 5e a 5f)

Obr. 5f

6. Závěrečné úpravy

Na konci nastavte pravidlo v souboru sIFR-screen.css, které skryje normální text, když se nahrává text ze sIFR. Tak zabráníte tomu, aby se výchozí text objevil a pak zmizel, když se nahraje text ze sIFR. Otevřte sIFR-screen.css (je ve složce css), odrolujte dolů na konec a přidejte kód zobrazený na Obr 6a

Teď už se normální text nebobjevuje, když je sIFR aktivní, ale když je deaktivován, objeví se s normálními styly, protože class .sIFR-active je před h2.cpost-title.

7. Poznámky na konec a další zdroje

Důležité upozornění k současnému stavu sIFR a o tomto návodu.

1. Ne každé pravidlo CSS je v sIFR platné, podívejte se do dokumentace sIFR 3 na kompatitibilitu (zvláště na sekci o stylování).
2. Nemohu o sobě prohlašovat, že jsem expert na sIFR, takže když najdete v tutoriálu nějaké chyby, dejte mi vědět. Mým cílem bylo ukázat ostatním, jak to v jednoduše rozjet.

chcete vědět víc? Potřebujete pomoc?

1. Teď když si můžete vybrat z množství různých fontů, bude možná vaše práce ještě trochu těžší. Přečtěte si Výběr fontu na I Love Typography.
2. Jestli jste se zasekli a nevíte jak dál, Joyent má forum o sIFR.

Pozn: SiFR 3 je stále ve vývoji a do souborů byla zabudována kontrola, zda sifr.js a soubor .swf jsou ze stejné verze. Proto se objevuje chyba, když si v jedné verzi vyrobíte .swf s písmy a pak stáhnete na web novější build sIFR. Musíte .swf soubor vyexportovat znova.

Pozn2: Některé texty, které jsou v orig článku skutečně nastylované pomocí SIFR, jsou zde jen jako obrázky, protže to nepoužívám a nechtělo se mi kvůli tomu upravovat šablonu blogu, ale úspěšně jsem si to zkusila s demo fonty na testovací stránce, vážně to funguje :-)

podběly : asfaltka - 3 : 0

lítám po školeních a po firmě, protože "to" nefunguje, a to co funguje, se zkazí, sotva k tomu přijdu, a ještě po mně, největším chaotikovi, chtějí, abych koordinovala jakýsi projekt, tak to je ten správný čas na relaxaci, nějakou netradiční ... třeba vyrobit si další web pro radost :-)

V poslední době jsem totiž přešla z Photofiltre na Paint.NET a jak si s tím hraju, napadlo mě, že takový webík pro lamy, které si chtějí patlat doma obrázky a přitom moc netuší, co s počít s vrstvami a všemi těmi funkcemi okolo, by mohl být užitečný. Na webu o photofiltre vidím, že tam stále přicházejí noví lidi a někteří už z free photofiltre vyrostli, a chtěli by tu verzi s vrstvami, která ale není zadarmo. Paint.NET, který má bezvadnou a nadšenou anglicky mluvící komunitu, by mohl být dobrá alternativa. A líbí se mi čím dál víc.

Tak nakoukněte na novou ohrádku pro zvědavé lamy - paintnet.suewebik.net a jestli máte připomínky k obsahu nebo ke vzhledu, napište, zkusím na tom zapracovat ...