Vložení obrazu



Při vložení obrazu do dokumentu Dreamweaveru se ve zdrojovém kódu HTML vytvoří odkaz na soubor tohoto obrazu. Aby byl tento odkaz správný, musí se soubor obrazu nacházet v aktuálním webovém místě. Pokud tomu tak není, Dreamweaver se dotáže, zda chcete soubor do místa zkopírovat.

Obrazy lze vkládat také dynamicky. Dynamické obrazy jsou obrazy, které se často mění. Například systémy rotace reklamních proužků náhodně vyberou jeden proužek ze seznamu dostupných proužků a při aktivaci stránky dynamicky zobrazí obraz vybraného proužku.

Po vložení obrazu můžete nastavit atributy usnadnění přístupu tagu obrazu, které mohou číst programy pro čtení z obrazovky pro slabozraké uživatele. Tyto atributy lze upravit v kódu HTML.

Výukovou lekci o vkládání obrazů najdete na www.adobe.com/go/vid0148_cz.

  1. V okně dokumentu umístěte textový kurzor na místo, kde se má obraz zobrazit, a proveďte jeden z následujících úkonů:
    • V kategorii Společné na panelu Vložit klepněte na ikonu Obrazy .

    • V kategorii Společné na panelu Vložit klepněte na tlačítko Obrazy a vyberte ikonu Obraz. Ikonu Obraz zobrazenou v panelu Vložit je možné přetáhnout do okna Dokument (případně do okna zobrazení kódu).

    • Zvolte Vložit > Obraz.

    • Přetáhněte obraz z panelu Datové zdroje (Okna > Datové zdroje) do požadovaného umístění v okně dokumentu; pokračujte krokem 3.

    • Přetáhněte obraz z panelu Soubory do požadovaného umístění v okně dokumentu; pokračujte krokem 3.

    • Přetáhněte obraz z pracovní plochy do požadovaného umístění v okně dokumentu; pokračujte krokem 3.

  2. V dialogovém okně, které se objeví, proveďte jeden z následujících úkonů:
    • Vyberte Souborový systém a zvolte soubor obrazu.

    • Vyberte Zdroj dat a zvolte zdroj dynamického obrazu.

    • Klepněte na tlačítko Webová místa a servery a zvolte obrazový soubor ve vzdálené složce jednoho z webových míst Dreamweaveru.

  3. Vyhledejte obraz nebo zdroj obsahu, který chcete vložit.

    Pokud pracujete v neuloženém dokumentu, Dreamweaver vytvoří odkaz file:// na soubor obrazu. Po uložení dokumentu kdekoliv ve webovém místě Dreamweaver odkaz převede na cestu relativní k dokumentu.

    Poznámka: Při vkládání obrazů je také možné použít absolutní cestu k obrazu, který se nachází na vzdáleném serveru (například obraz, který není dostupný na lokálním pevném disku). Pokud se ale při práci vyskytnou problémy s výkonem počítače, můžete vypnout zobrazování obrazu v zobrazení Návrh odznačením volby Příkazy > Zobrazovat externí soubory.
  4. Klepněte na OK. Pokud jste v předvolbách (Úpravy > Předvolby) aktivovali dialogové okno Atributy tagu obrazu pro usnadnění přístupu, zobrazí se.
  5. Zadejte hodnoty do textových polí Alternativní text a Dlouhý popis a klepněte na OK.
    • Do pole Alternativní text zadejte název nebo krátký popis obrazu. Program pro čtení obrazovky přečte informace, které sem zadáte. Zadaný text byste měli omezit na přibližně 50 znaků. Chcete-li vytvořit delší popis, zvažte zadání odkazu na soubor, který o obrazu obsahuje více informací, do textového pole Dlouhý popis.

    • Do pole Dlouhý popis zadejte umístění souboru, který se zobrazí po klepnutí na obraz, nebo soubor vyhledejte klepnutím na ikonu složky. Toto textové pole obsahuje odkaz na soubor, který souvisí s obrazem nebo obsahuje více informací o něm.

    Poznámka: Podle potřeby můžete zadat informace do jednoho nebo obou textových polí. Program pro čtení z obrazovky čte atribut Alt obrazu.
    Poznámka: Pokud klepnete na Zrušit, obraz se v dokumentu zobrazí, ale Dreamweaver k němu nepřiřadí atributy ani tagy pro usnadnění přístupu.
  6. V inspektoru Vlastnosti (Okna > Vlastnosti) nastavte vlastnosti obrazu.

Nastavení vlastností obrazu

Inspektor Vlastnosti obrazů umožňuje nastavení vlastností obrazu. Pokud nevidíte všechny vlastnosti obrazu, klepněte na rozbalovací šipku v pravém dolním rohu.

  1. Výběrem Okna > Vlastnosti zobrazíte inspektor Vlastnosti vybraného obrazu.
  2. Do textového pole pod miniaturou zadejte název, abyste mohli na obraz odkazovat při použití chování Dreamweaveru (například Zaměnit obraz) nebo při používání skriptovacího jazyka (například JavaScriptu nebo VBScriptu).
  3. Nastavte libovolné volby obrazu.
    Š a V
    Šířka a výška obrazu v obrazových bodech. Při vložení obrazu do stránky Dreamweaver automaticky vyplní tato textová pole původními rozměry obrazu.

    Pokud nastavíte hodnoty šířky a výšky, které neodpovídají skutečné výšce a šířce obrazu, obraz se nemusí v prohlížeči zobrazit správně. (Chcete-li obnovit původní hodnoty, klepněte na popisy textových polí Š a V nebo na tlačítko Obnovit velikost obrazu, které se zobrazí vpravo od textových polí Š a V při zadání nové hodnoty.)

    Poznámka: Tyto hodnoty můžete změnit a změnit tak i měřítko zobrazení této instance obrazu, ale doba stahování se tím nezmenší, protože prohlížeč před použitím měřítka stáhne veškerá obrazová data. Chcete-li zkrátit dobu stahování a zajistit, aby se všechny instance obrazu zobrazovaly ve stejné velikosti, upravte rozměry obrazů pomocí aplikace pro úpravy obrazů.

    Zdroj
    Určuje zdrojový soubor obrazu. Klepnutím na ikonu složky můžete soubor vyhledat; můžete také přímo zadat cestu.

    Odkaz
    Určuje hypertextový odkaz na obraz. Přetáhněte ikonu Ukázat na soubor na soubor v panelu Soubory, klepněte na ikonu složky a vyhledejte dokument ve webovém místě nebo ručně zadejte URL.

    Zarovnání
    Zarovná obraz a text na jednom řádku.

    Alt
    Určuje alternativní text, který se zobrazí na místě obrazu v textových prohlížečích nebo v prohlížečích nastavených na ruční stahování obrazů. Slabozrakým uživatelům čtou syntetizátory hlasu v textových prohlížečích tento text nahlas. V některých prohlížečích se tento text také zobrazí v případě, že nad obraz přesunete ukazatel.

    Nástroje název mapy a aktivní oblast
    Umožňují popsat a vytvořit obrazovou mapu na straně klienta.

    Mezera S a mezera V
    Přidá podél obrazu mezery v obrazových bodech. Mezera S přidá mezery podél horní a dolní části obrazu. Mezera V přidá mezery podél levé a pravé části obrazu.

    Cíl
    Určuje rámec nebo okno, do kterého se navázaná stránka načte. (Volba není dostupná v případě, že obraz není navázán na jiný soubor.) Názvy všech rámců v aktuální sadě rámců se zobrazují v seznamu Cíl. Můžete vybrat také z následujících vyhrazených názvů cílů:
    • _blank načte navázaný soubor do nového nepojmenovaného okna prohlížeče.

    • _parent načte navázaný soubor do rodičovské sady rámců nebo okna rámce, který obsahuje odkaz. Pokud rámec, který obsahuje odkaz, není vnořený, navázaný soubor se načte do celého okna prohlížeče.

    • _self načte navázaný soubor do stejného rámce nebo okna jako odkaz. Tento cíl je výchozí, takže ho obvykle nemusíte určovat.

    • _top načte navázaný soubor do celého okna prohlížeče a odstraní tak všechny rámce.

    Okraj
    Šířka okraje obrazu v obrazových bodech. Výchozí nastavení je žádný okraj.

    Upravit
    Spustí editor obrazů, který zadáte v předvolbách externích editorů, a otevře vybraný obraz.

    Úprava nastavení obrazu
    Otevře dialog Náhled obrazu a umožní optimalizovat obraz.

    Oříznout
     Ořízne obraz a tak z něho odstraní nepotřebné oblasti.

    Převzorkovat
     Převzorkuje obraz se změněnou velikostí a zlepší tak jeho kvalitu pro novou velikost a tvar.

    Jas a kontrast
     Upravuje nastavení jasu a kontrastu obrazu.

    Zostřit
     Upravuje ostrost obrazu.

    Obnovit velikost
     Obnoví hodnoty Š a V na původní velikost obrazu. Toto tlačítko se zobrazí vpravo od textových polí Š a V, když upravíte hodnoty vybraného obrazu.

Úpravy atributů přístupnosti obrazu v kódu

Pokud jste pro obraz vložili atributy usnadnění přístupu, můžete jejich hodnoty upravit v kódu HTML.

  1. V okně dokumentu vyberte obraz.
  2. Proveďte jeden z následujících úkonů:
    • Upravte příslušné atributy obrazu v zobrazení kódu.

    • Klepněte pravým tlačítkem (Windows) nebo s klávesou Ctrl (Macintosh) a vyberte Upravit tag.

    • V inspektoru Vlastnosti upravte hodnotu Alt.