Homer, majstrovské dielo v CSS

DSL.sk, 5.5.2008

Zaujímavé dielo v HTML s použitím textu a formátovania pomocou CSS vytvoril a zverejnil v apríli Román Cortés.

Ide o vernú podobu Homera Simpsona s renderovanou veľkosťou približne 250 x 400 bodov.

Kód je na Windows kompatibilný s finálnymi verziami všetkých hlavných prehliadačov, korektne by sa mal vykresľovať v Internet Exploreri 5.5, 6, 7, Opere 9, Firefoxe 2 a Safari 3.

HTML kód intenzívne využívajúci tag div má celkovo 14 638 bajtov a 327 riadkov.

Cortésov Homer je priamočiarejšou obdobou Acid2 testu, keď jeho hlavnou úlohou samozrejme nie je testovať prehliadače ale len zobrazovať korektne zložitý obrazec vytvorený pomocou CSS.

Unikátne obrázky s použitím HTML vznikali aj v minulosti, napríklad v tomto prípade v Japonsku s použitím HTML tabuliek. Kým v japonskom prípade ale išlo najmä o manuálnu prácu, ktorou je možné vytvoriť takmer ľubovoľný obrázok, v prípade Homera sú použité prvky unikátne pre Homera.

Screenshot renderovanej podoby CSS Homera vo Firefoxe 3 Beta 5

Dielo Cortésa je možné nájsť tu, jeho zaujímavú analýzu v podobe javascriptovej modifikácie, ktorá vykresľuje a animuje jednotlivé použité elementy postupne, tu.


Najnovšie články:



Diskusia:

crl+alt+del Od reg.: jakub89 | Pridané: 5.5.2008 9:48 "je možné vytvoriť takmer ľubovoľný obrázok, v prípade Homera sú použité prvky unikátne pre Homera" toto som trosku nepochopil :D Ovladam len HTML a pomocou tabuliek by sa teoreticky dalo nakreslit skoro vsetko. Ale inac konecne sa netreba preklikavat na ine stranky koli obrazkom a dsl.sk ich dava rovno sem. Odpovedať Hodnotiť:

Re: crl+alt+del Od: _PM | Pridané: 5.5.2008 9:54 Pomocou tabuliek?? Si robis srandu? Tabulky su tabulky a na nic ine by sluzit nemali. Odpovedať Hodnotiť:

Re: crl+alt+del Od reg.: Marťan | Pridané: 5.5.2008 11:16 tak ty si asi velky expert, co videl HTML max tak poslednych par mesiacov/rocikov. Kedysi sa vsetko robilo cez tabulky Odpovedať Hodnotiť:

Re: crl+alt+del Od: _PM | Pridané: 5.5.2008 13:18 Jasne a kedysi pocitace nevedeli zobrazit viac ako 16 farieb. Mna absolutne nezaujima co sa robilo kedysi. Ten kto videl HTML len chvilu si ty ak nedokazes nakodit stranku bez pouzitia tabulky. Odpovedať Známka: 0.0 Hodnotiť:

Re: crl+alt+del Od: Uzivatel | Pridané: 5.5.2008 13:50 Joooj velky ignorant ? Robim s HTML 4-5 rokov, co zjavne ty nie a nedovolil by som si zautocit ako ty. Kedze podobni ako ten na ktoreho si zautocil su "priekopnici" webu a ty by si bez nich, ze to zacali pouzivat a tzv. "dovliekli" na Slovensko doteraz nevedel co to je. Odpovedať Hodnotiť:

Re: crl+alt+del Od reg.: Uhlik | Pridané: 5.5.2008 18:15 robim s HTML 11 rokov a tiez som si chvilu zvykal, ze tabulky maju byt len na tabulky, no teraz si neviem vynachvalit, ze som sa toho dinosaurieho zlozvyku zbavil ... tak ako sme sa vsetci vzdali Windows 98, musime sa vzdat aj tabulkoveho layoutu ... pripajam sa teda k nazoru "velkeho ignoranta" ... Odpovedať Známka: 0.0 Hodnotiť:

Re: crl+alt+del Od: Uzivatel | Pridané: 6.5.2008 21:56 Vazne nechapem tento komentar. Najprv si precitaj na co som reagoval, reagoval som na utocny postoj, nikto tu predsa tabulky nepresadzuje. Odpovedať Hodnotiť:

Re: crl+alt+del Od: TTTT | Pridané: 11.5.2008 13:15 Uhlik ;) Odpovedať Hodnotiť:

Re: crl+alt+del Od: lalalalaalalaa | Pridané: 5.5.2008 16:32 on ma pravdu, tabulky su LEN na tabulky a mali by tak aj byt pouzivane, bohuzial, niektori ludia to nechapu... Odpovedať Hodnotiť:

Re: crl+alt+del Od: Uzivatel | Pridané: 5.5.2008 18:07 Vrat sa o 5 rokov dozadu a povedz to 70% webu ;) Odpovedať Hodnotiť:

Re: crl+alt+del Od reg.: Uhlik | Pridané: 5.5.2008 18:19 preco sa vracat dozadu ? ... mne je jedno, kto bol v ŠTB a kto chodil do kostola, kto robil tabulky a kto pisal neformatovany text ... dnes je doba XML, ked je prvorade oddelit formu od obsahu a na to je CSS jedinecny a nenahraditelny nastroj ... rad by som videl, ako sa trapis s tabulkami napriklad pri vytvarani samostatnej verzie stranky pre obrazovku a pre tlac ;) ... a to uz nehovorim o pristupnosti zdravotne postihnutym spoluobcanom ... nemyslite si, prosim, ze "spravne" zobrazenie je to jedine, co je pri tvorbe stranky dolezite ... podme len dopredu a prestanme sa uz konecne obzerat za minulostou ... Odpovedať Známka: -3.3 Hodnotiť:

Re: crl+alt+del Od reg.: jakub89 | Pridané: 6.5.2008 13:29 no napriklad pred 5 rokmi bolo velmi vela ludi v STB :D Odpovedať Hodnotiť:

Re: crl+alt+del Od: LirukS | Pridané: 6.5.2008 16:03 ved tabulky mozes pouzivat aj v kombinacii s CSS a XML tak preco to nevyuzit? Ale kazdy mame ine metody. Hlavne nech to je kompatibilne s prehliadacmi minimalne par rokov dozadu ;) Nie kazdy pouziva rovnake prehliadaca a najnovsie platformy, niektory zostavaju pri starom Win98, sice to nie je na dnesnu dobu, ale poznam aj takych co pouzivaju vylucne textove browsovanie webu Odpovedať Hodnotiť:

Re: crl+alt+del Od: LoL.... | Pridané: 6.5.2008 14:30 Normalne zadate kolko má byť vzdialenosť a farbu pixelov a máte CSS lamy :D Ale je to aj tak pozoruhodné . ze sa s tym tak sral. Odpovedať Hodnotiť:

Re: crl+alt+del Od: trigger* | Pridané: 5.5.2008 11:19 ja oblubujem tabulky cokolady Odpovedať Známka: 7.8 Hodnotiť:

Re: crl+alt+del Od: ARnyXXX | Pridané: 5.5.2008 12:25 By si sa divil kde vsade su html tabulky pouzivane. Odpovedať Hodnotiť:

aky CSS ? Od: co tooo ? | Pridané: 5.5.2008 10:28 nechapem toto. Moze to niekto povedat tak normalne beznemu clovekovi ? Odpovedať Hodnotiť:

Re: aky CSS ? Od: patic | Pridané: 5.5.2008 11:19 Cascading Style Sheets)CSS, všeobecné rozšírenie HTML Štýly umožnujú oddeliť štruktúru HTML alebo XHTML od vzhľadu...atd google ? nič ? Odpovedať Známka: 3.3 Hodnotiť:

Re: aky CSS ? Od: remusss | Pridané: 5.5.2008 15:13 nie Odpovedať Známka: 8.7 Hodnotiť:

ako cez CSS Od: brano2 | Pridané: 5.5.2008 11:11 Staci si predstavit ze je tam vela krat pismeno "O" "C" "_", jediny problem je ich v spravnom poradi prekryt a dat ich spravnej velkosti a farby, to by mohlo stacit na pochopenie. Prave to bujare formatovanie a prekreslovanie klasickych znakov je mozne cez CSS. Odpovedať Hodnotiť:

no... nie vsade to funguje Od reg.: Chuck Garabedian | Pridané: 5.5.2008 12:07 napriklad u mna sa to zobrazi takto: http://tiny.cc/9u3hz Odpovedať Hodnotiť:

Re: no... nie vsade to funguje Od reg.: Redakcia DSL.sk | Pridané: 5.5.2008 12:19 Ono to bude zrejme kombináciou Linuxu a pôvodnými inštalovanými fontami, keďže sa tam používa text. Nám to ide aj na Ubuntu 8.04 + FF 3.0 Beta 5, máme ale nainštalované Windows fonty. Odpovedať Známka: 5.0 Hodnotiť:

Re: no... nie vsade to funguje Od reg.: Chuck Garabedian | Pridané: 5.5.2008 16:32 jasne.. s microsoft core fonts to fici jak ma :) Odpovedať Hodnotiť:

__________ Od: ______ | Pridané: 5.5.2008 12:50 neviete kde by som to nasiel ?pretoze ten link co je uvedeny uz nefunguje. Odpovedať Hodnotiť:

ehmehm Od: DeeerDance | Pridané: 5.5.2008 15:28 no neviem ale nieco co sa oznacuje za "majstrovske dielo" by malo dodrziavat nejake pomery stran... a neviem ci som jediny ale ten krk ma trocha dost na picu.. Odpovedať Známka: -1.1 Hodnotiť:

Zakazat. Od reg.: DSL = LSD | Pridané: 12.5.2008 8:14 Je to blbost. Predstav si, ze zanedlho tak bude zasrany cely internet tymto formatom. Uz si fotku nikdy nestiahnes jednoduchsim sposobom ako doteraz. Odpovedať Hodnotiť:

Pridať komentár