Autor Zpráva
janavk
Profil
Omlouvám se, ale do pronajatého eshopu potřebuji udělat bílé pozadí hlavičky, a oni mi nedají jinou možnost, než to tam dát jako obrázek (jinak tam nabízejí galerii barevných hrůz).
Takže se ještě jednou omlouvám, protože tohle je asi hodně triviální, ale já prostě nevím jak ten bílý obrázek 970x170px,nejlépe asi v .jpg, udělat. Prosím o radu - podotýkám, že žádný photoshop či cokoliv jiného nemám a hlavně neovládám.
janbarasek
Profil
janavk:
Otevři Malování a ve vlastnostech obrázek nastav na velikost 970x170px, následně jen menu: Soubor -> Uložit -> ... -> Hotovo!

Podívat se, jak přesně to tam je teď nemůžu, na svém počítači mám Linux.
_es
Profil
janavk:
jak ten bílý obrázek 970x170px
Prečo by si ho robil v takej veľkosti? Stačí ho spraviť 1x1px a roztiahnuť na celé pozadie.

photoshop či cokoliv jiného nemám a hlavně neovládám.
„Skicár“ vo Windowse snáď zvládneš.
janavk
Profil
janbarasek:
Moc díky, programátorovi toho shopu se mě zželelo a poslal mi to v jpg. Ale zkouším to prubnout sama, a pohořela jsem hned na tom, že nemohu najít, kde otevřít malování. Takového exota jste tady myslím dlouho neměli..
janbarasek
Profil
janavk:
Takového exota jste tady myslím dlouho neměli..
No, spíše se divím, že jsi dokázala napsat sem na fórum, když neovládáš základní funkce počítače, jako je třeba tvorba primitivních obrázků.
Kubo2
Profil
janavk:
pohořela jsem hned na tom, že nemohu najít, kde otevřít malování.
Vo Vistovskom Štartmenu napíš do dolného políčka pre vyhľadávanie Skicár (čo ti, mimochodom, spomínal už aj _es) a stlač Enter, otvorí sa ti program Skicár/Malovanie. Ak máš iný Windows, otvor klasické Štartmenu, a tam by defaultne mal niekde byť prichytený odkaz na Skicár či Malovanie. Ak nie je, klikni v tom menu na Zobraziť všetky programy, trochu sa tam poobzeraj a Malovanie tam určite nájdeš.

V prípade, že máš iný operačný systém, to ti veľmi neporadím, na Linuxe som ani ja nenašiel jednoduchý editor obrázkov a Mac som nikdy nepoužíval.
Bubák
Profil
janavk:
pohořela jsem hned na tom, že nemohu najít, kde otevřít malování
Ve Windows XP to je:
Start > Všechny programy > Příslušenství > Malování
Obrázek > Atributy > Šíška xxx, Výška xxx, Barvy - černobíle
Soubor > Uložit > Uložit do + Název souboru* + Uložit jako jako typ PNG (PNG)

*Malování je potvůrka, některé přípony dává velkými písmeny. Dá se tomu zabránit třeba tak, že napíšeš jméno souboru i s příponou do uvozovek, příklad: "hlavicka.png"
Ve jménech souborů pro web nepoužívej mezery ani diakritiku, jako třebas "hlavička.png".
Pro jednoduché obrázky (málo barev) je vhodnější formát PNG, než JPEG, důvodů je více.
Kubo2
Profil
janavk:
A keby si naozaj nevedela nájsť ten Skicár, vytvoril som živú ukážku takého obrázku (trvalo to asi osem a pol sekundy, z toho 5 sekúnd sa mi otváral program Logo Motion):
Bohužiaľ je to obrázok 1x1 pixel, takže tu asi nebude veľmi viditeľný (na mobiloch pri maximálnom priblížení by mal byť vidieť malý biely štvorček), skôr sa pozri na živú ukážku použitia.


Bubák:
Pro jednoduché obrázky (málo barev) je vhodnější formát PNG, než JPEG, důvodů je více.
Nemám v formátoch až taký prehľad, ale mám dojem, že na 1x1 pixel je najlepší GIF (používa sa prevažne pre malé obrázky). Ak hovorím tlachy, tak ma prosím, oprav.
janavk
Profil
Bubák:
Měl by to být tento postup, v XP. Vím, že mi to nebudete věřit, ale já to v té nabídce "Příslušenství" prostě nemám (už jsem to tam hledala původně, fakt..
Petr ZZZ
Profil
Doplním, že při vykreslování trochu většího než jednopixelového obrázku se prohlížeč méně nadře a z hlediska datového přenosu je rozdíl mezi jedním a několika stovkami pixelů zanedbatelný, zvláště když formát bude PNG a obrázek jednobarevný.

janavk: „já to v té nabídce "Příslušenství" prostě nemám“
Zkus si to vygůglit v obrázcích, ať víš, jak vypadá ikonka toho programu, měl by být v každé základní instalaci Windows.

Tady ten obrázek máš:
janavk
Profil
Tak hlásím úspěch - jmenuje se to u mě Paint.net, a není to v příslušenství, ale jako samostatný program.


Jinak k 1px obrázku - tohle by se stejně nedalo použít, jak říkám, ten eshop má prostě přednastavenou hodnotu, vše ostatní je individuální úprava programátorem za příplatek. Ale jinak - díky všem, problém je mezitím vyřešený. Bohužel, po otevření pain.netu jsem konstatovala, že na grafiku (jakkoliv jednoduchou) jsem opravdu zcela tupá.
Bubák
Profil
Paint.NET je úplně jiný program, takový "fotoshop chudých", jednoduché ovládání, umí křivky a vrstvy.


Nejrychlejší postup v Paint.NET (mám jej v angličnině, nechce se mi instalovat češtinu):
Image > Canvas size, nastavíš šířku (width) a výšku (height), ostatní nastavení není v tomto případě důležité.
Dáš uložit jako PNG, ve jménu souboru pro web nepoužívej mezery ani diakritiku. Dialog Save Configuration ponech na autodetect, mimo zvláštní případy je to nejvhodnější volba.

Pro zajímavost, co se stane, když klepneš na Start > Spustit (nebo stiskneš win + R) a napíšeš mspaint? Pokud je Malování nainstalováno, spustí se. Možná jen někdo smazal ikonku malování z Příslušenství.
janavk
Profil
Bubák:
co se stane, když klepneš na Start > Spustit (nebo stiskneš win + R) a napíšeš mspaint? Pokud je Malování nainstalováno, spustí se.
Jo, malování se spustilo..:)

Ten návod zkusím, takový minikurz se vždycky hodí.


Tak se mi to podle tvého návodu povedlo - mám png bílý obrázek 970x170, hurá a díky. Sdovoelním bych si tě uschovala jako výborný kontakt, co umí poradit...?
jenikkozak
Profil
Petr ZZZ:
Doplním, že při vykreslování trochu většího než jednopixelového obrázku se prohlížeč méně nadře a z hlediska datového přenosu je rozdíl mezi jedním a několika stovkami pixelů zanedbatelný
Nezpochybňuji to, ale nemáš k tomu nějaké doplňující informace? Nedovedu si vysvětlit, proč by v tom vykreslování měl být vnímatelný rozdíl. Že 970×170 px nejspíš nebudou stovky pixelů je asi jasné… Je však pravda, že ten rozdíl dat velký nebude.
Petr ZZZ
Profil
jenikkozak:
Papouškuji Chamurappiho; že trochu větší než jednopixelový obrázek je lepší, zmínil myslím nejen tady, ale další výskyt či vysvětlení se mi nedaří najít.
peta
Profil
Petr ZZZ: To zalezi na algoritmech. Spatne udelany tapetuje 1x1 na 1000px sirku 1000x. Celkove 1000 kroku cyklu. Kdezto 100x1 se tapetuje 10x, 10 kroku cyklu (to je tim, ze jsem zvolil 100x100, pri 10x10 je to 100 kroku). Coz je vykonove mnohem mensi zatez. Chytry algoritmus si vytapetuje z 1x1 treba 10x10 a pak 100x100 obrazek a pak ho dal tapetuje. Celkove 30 kroku cyklu.
A je to teda v nekolika starsich tematech, mozna i s odkazy.
Joker
Profil
Bubák:
Pro zajímavost, co se stane, když klepneš na Start > Spustit (nebo stiskneš win + R) a napíšeš mspaint? Pokud je Malování nainstalováno, spustí se. Možná jen někdo smazal ikonku malování z Příslušenství.
V modernějších Windows (Vista a novější) je asi nejjednodušší postup stisknout Windows tlačítko na klávesnici (což rozbalí nabídku Start, resp. obrazovku Start ve Windows 8) a začít psát (měl by být rovnou aktivní řádek „Prohledat programy a soubory“) název programu: „Malování“ (v anglických Windows „Paintbrush“).

jenikkozak:
Nezpochybňuji to, ale nemáš k tomu nějaké doplňující informace?
Jednou jsem ten efekt viděl, ale už tak před deseti lety.

Tehdy opravdu když byl na pozadí stránky 1px opakující se obrázek (roztažený být nemohl, vývoj CSS3 ještě ani nezačal), hlavně na slabších počítačích šlo opravdu vidět, jak prohlížeč ty stovky* opakování postupně vykresluje. Výhoda je, že závislost počtu opakování na počtu pixelů je hyperbola (1/x), takže první přidaný pixel udělá největší rozdíl.

Týká se to samozřejmě opakování obrázku na pozadí, nevím, jak to bude s roztažením.

Ještě jedna zajímavost: Hlavně když jde o PNG obrázek s nějakým pravidelným vzorem, nemusí být obrázek ve větším rozměru datově větší.
Příklad: Mám přechod černá-bílá v PNG, široký 10px a jeho varianty na 1-4px výšky (jednoduše n opakování té 1px varianty pod sebou).
Výsledná velikost souboru:
1x10 px: 170 B
2x10 px: 184 B
3x10 px: 193 B
4x10 px: 178 B

Další věc je, že třeba ten bílý obrázek 500x100 co poslal Petr ZZZ má velikost 468 bajtů, což skoro nemá cenu řešit. Pro zajímavost, je to zhruba 1% velikosti jQuery.

* vertikálního rozlišení displejů jako by se technický vývoj netýkal, za těch 10 let se výrazně nezměnilo

Oprava: Přesunul jsem poznámku, že se to týká opakování obrázku, k textu, ke kterému patří.
_es
Profil
Joker:
Hlavně když jde o PNG obrázek s nějakým pravidelným vzorem, nemusí být obrázek ve větším rozměru datově větší.
Je použitá aj bezstratová kompresia, tú je tuším možné použiť aj v GIF obrázku. Jednotlivé softvéry sa môžu líšiť v tom, do akej miery ju použijú.

Další věc je, že třeba ten bílý obrázek 500x100 co poslal Petr ZZZ má velikost 468 bajtů, což skoro nemá cenu řešit.
Pri nastavení čiernobielej farebnej palety v obyčajnom Windows „skicári“ by mal veľkosť len 195 či 138 batov. Pri použití nejakých „špeciálnejších“ nastavení formátu či kompresie možno aj menej.
peta
Profil
Joker:
116b indexovana paleta, vypnute komentare, cerna-bila ve vodorovnem smeru 10x10 (Gimp)
<img alt="" src="data:image/gif;base64,R0lGODdhCgAKAOMQAAAAABQUFC8vLzAwMEpKSktLS2ZmZoGBgYKCgpycnJ2dnbe3t7i4uNLS0tPT0+7u7iwAAAAACgAKAAAEKRAEUcxRyz056s1b0FkJo0mUgSRLE47fOXmKGQqEyspwKaexV2XFcEUAADs=" />

218b - bmp, run-length kodovani
<img alt="" src="data:image/bmp;base64,Qk3aAAAAAAAAAHYAAAAoAAAACgAAAAoAAAABAAQAAgAAAGQAAAATCwAAEwsAABAAAAAQAAAAAAAAABQUFAAvLy8AMDAwAEpKSgBLS0sAZmZmAIGBgQCCgoIAnJycAJ2dnQC3t7cAuLi4ANLS0gDT09MA7u7uAAAKATVonN8AAAAACgElZ6vvAAAAAAoBNWec7wAAAAAKASRom+8AAAAACgElZ6zvAAAAAAoBNWer7wAAAAAKASVom98AAAAACgE1Z5zvAAAAAAoBNWer7wAAAAAKASVnq+8AAAE=" />
Bubák
Profil
_es:
Pri nastavení čiernobielej farebnej palety v obyčajnom Windows ‚skicári‘ by mal veľkosť len 195 či 138 batov. Pri použití nejakých ‚špeciálnejších‘ nastavení formátu či kompresie možno aj menej.
V IrfanView při uložení pluginem PNGOUT to je dokonce jen 100 bajtů (přeuložením přes GIF, nebo jiný formát, který neukládá rozlišení, případně dodatečným odstraněním chunku pHYs (info o rozlišení).


peta:
Tvůj obrázek jsem přeuložil do PNG ve škále šedé a dostal jsem se na 114 B, což je 2 bajtů méně, než u tvého obrázku v GIFu. S barevným obrázkem by tento trik nešel použít a velikost by narostla o zanedbatelných 10 bajtů.
jenikkozak
Profil
Za deset let se dost věcí změnilo. Tehdy ještě skoro každý kodér věděl, co jsou to „bezpečné barvy“, vertikální rozlišení zobrazovacích zařízení se příliš nezměnilo, ale výkon zařízení narostl mnohonásobně. Tak nějak bych předpokládal, že i prohlížeče jsou v tomto směru lépe navrženy.
Chamurappi
Profil
Reaguji na Jokera:
Při skutečně dobrém zmačkání mají bílé obrázky 1×10 až 4×10 všechny 82 bajtů (liší se navzájem jen v bajtu určujícím velikost a v CRC).

roztažený být nemohl, vývoj CSS3 ještě ani nezačal
Vývoj CSS 3 začal koncem roku 1998 a někdy od roku 2000 už šlo v Exploreru roztahovat obrázky DirectX filtrem AlphaImageLoader. Což u jednopixelového obrázku na některých grafických kartách vedlo (a tam, kde filtr funguje, stále vede) ke zvláštním výsledkům — mohl vzniknout jakýsi diagonální bíloprůhledný gradient.


Reaguji na jenikkozaka:
Tak nějak bych předpokládal, že i prohlížeče jsou v tomto směru lépe navrženy.
Jsou, více spoléhají na grafickou kartu, která také raději pracuje s většími texturami. Ale s malými obrázky už je určitě méně potíží než bývalo. Pokud vím, tak opakování malých obrázků špatně snáší z dnes používaných prohlížečů už jen Explorer 7.

Tehdy ještě skoro každý kodér věděl, co jsou to ‚bezpečné barvy‘
Před patnácti lety možná, před deseti už spíš ne. Nejsem si ani moc jistý, kdy a jak dlouho vůbec bývaly bezpečné barvy skutečně vnímané jako důležitý výčet. To, že se barva zaokrouhlila, nebyla z hlediska kodéra zase taková tragédie (na současných TN displejích se také zaokrouhluje) a tehdejší grafikové.
Joker
Profil
_es, peta, Chamurappi:
Má poznámka ve smyslu, že rozdíly jsou tak malé, že je můžeme zanedbat, zdá se vyvolala závody v produkování ještě zanedbatelnějších rozdílů :-)

Ale já víceméně i schválně nehledal co nejvíc optimalizovaný obrázek, ale spíš výchozí nastavení. Závěr „Při typickém použití jsou rozdíly minimální a optimalizací je můžeme ještě zmenšit“ je myslím lépe vypovídající, než „V ideálním případě se můžeme dopracovat až k nulovému rozdílu“.

jenikkozak:
Za deset let se dost věcí změnilo.
Ale předpokládal bych, že opakování obrázku sežere pořád podobné množství výkonu, jen výkon počítačů narostl do té míry, že to není vidět.
Samozřejmě pořád je řeč o opakování obrázku, roztažení obrázku asi bude něco úplně jiného.

Vaše odpověď

Mohlo by se hodit

  • Pokud přikládáte obrázkové ukázky, dbejte prosím na jejich přijatelnou (datovou) velikost.
  • Uvádějte v titulku grafický program, na který se ptáte.

Odkud se sem odkazuje


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: