Užitočné tipy

Ako sa máš?

Pin
Send
Share
Send
Send


Dostali ste sa na túto zaujímavú a potrebnú stránku, ktorú som vytvoril, aby som vás naučil vytvárať weby v Dreamweaveri. A je to presne vytvorenie mnohých stránok, pretože dúfam, že sa nezastavíte na jednom mieste. Ak ste človek, ktorý rád pracuje nielen pre ostatných, ale predovšetkým pre seba.

Všetky vedomosti, ktoré vám tu dám, vám umožnia zvládnuť techniku ​​stavania stránok vlastnými rukami, ale aj pomocou Dreamweaveru. Osobne používam tento spôsob vytvárania stránok. Úprimne ti to poviem, veľmi sa mi to páči, pretože som si uvedomil jednoduchosť tejto lekcie. V počiatočnej fáze sa vám môže zdať čudné, ale verte mi, na tom nie je nič zložitého. Najdôležitejšou vecou je vaša trpezlivosť a záujem. Všetko ostatné k vám príde postupne a stanete sa profesionálnymi tvorcami webových stránok.

Ale stále ako vytvoriť webovú stránku v Dreamweaver začiatočník, ktorý ovláda iba základy tejto techniky, konkrétne vytvorenie miesta.

Je spravodlivé povedať, že program Dreamweaver má veľa možností a tento program je lídrom medzi dizajnérmi webových stránok. Ale pre začiatočníkov je tento program celkom vhodný. Koniec koncov, ako som už povedal, všetko, čo od tohto programu potrebujeme, je jeho malá časť. Táto časť je však hlavná pri každom vytváraní stránok v Dreamweaveri.

Nakonfigurujeme program Adobe Dreamweaver.

Musíte ísť do nastavení Dreamweaveru a vykonať nejaké zmeny, ktoré vám umožnia tento program používať vo vysokej kvalite.

Po nastavení programu môžeme bezpečne začať s prácou priamo pri vytváraní stránky.

Vytvárame šablónu pre budúcu stránku.

Prvá vec, ktorú potrebujeme, je vytvoriť šablónu pre budúcu stránku. Spravidla je už pripravený v dreanweavere. Môžete to vidieť v ponuke kódu pri vytváraní nového dokumentu, ktorý sa nazýva predvolený nový dokument bez názvu. A ak sa pozriete do kódu tohto dokumentu, uvidíte hotovú šablónu, ktorá je potrebná pre všetky stránky. Tento kód je potrebný pre každú novú stránku na webe. Kód by mal vyzerať takto:





Dokument bez názvu

Čo musíte zahrnúť na stránku sitemap HTML

Stránka HTML stránky v základnej podobe obsahuje zoznam štandardných hypertextových odkazov na všetky stránky webu. Tento zoznam by mal obsahovať odkazy na domovskú stránku, na všetky hlavné stránky a podstránky na webe a na všetky ďalšie stránky na webe, ktoré nemusia byť prístupné pomocou hlavnej navigácie, napríklad v časti „Zásady ochrany osobných údajov“ alebo „Služby zákazníkom“.

Najlepšie výsledky dosiahnete, ak stránku uložíte pomocou súboru s názvom súboru. html a odošlite všetky hypertextové odkazy na web v jednoduchom formáte zoznamu.

Ak chcete túto dokončenú stránku sprístupniť, musíte do nej pridať odkaz v päte a pridať na ňu odkaz v rámci kapitoly na stránke. Tieto dva kroky pomôžu zlepšiť prístupnosť vašej stránky.

Zakázaní návštevníci používajúci čítačky obrazovky alebo iné zariadenia

Návštevníci s inými preferenciami zobrazenia, ako sú textové prehliadače a prehliadače s vypnutým JavaScriptom

Návštevníci, ktorí chcú mať možnosť jediným kliknutím prejsť na ktorúkoľvek stránku webu a nepoužívať hlavný navigačný systém stránky

Návštevníci, ktorí chcú okamžite vidieť všetky stránky na tejto stránke a vedia, ako sú prakticky organizované

Vytvorenie stránky sitemap

Vytvorenie stránky sitemap v HTML je celkom jednoduché. Je to len otázka vloženia zoznamu uvedených hypertextových odkazov, ktoré vedú k zvyškom stránok na webe.

Otvorte domovskú stránku dokončeného webu v Dreamweaveri alebo v preferovanom editore HTML alebo WYSIWYG.

Ak používate Dreamweaver, uistite sa, že je váš web na paneli Súbory uvedený ako spravovaná stránka. Ak nie, vyberte „Site“ → „Site Management“ a vyberte svoju stránku zo zoznamu.

Vyberte Súbor → Uložiť ako a keď otvoríte dialógové okno Uložiť ako, uložte kópiu domovskej stránky na koreňovej úrovni vášho webu s názvom súboru Sitemap. HTML.

Nová stránka vyzerá rovnako ako domovská stránka vrátane všetkých prvkov dizajnu webových stránok, umiestnenia loga a navigácie.

V hlavnej upraviteľnej oblasti stránky vyberte a odstráňte všetok obsah určený pre hlavnú stránku.

Teraz máte miesto na vloženie zoznamu hypertextových odkazov.

Umiestnite kurzor do hornej časti prázdnej oblasti a zadajte názvy všetkých stránok lokality vrátane stránky Mapa stránok s jedným menom v riadku tak, ako sa zobrazujú na mape vizuálnej stránky.

Napríklad použite názvy stránok Domov, O aplikácii, Produkty, Tlač, Obchody, Kontaktujte nás a Mapa stránok.

Vyberte všetky slová a skonvertujte ich na neusporiadaný zoznam, čím zmeníte názov každej stránky na položku zoznamu.

V kóde HTML na stránke Mapa stránok by ste mali používať značky bez poradia zoznamu, ako je to znázornené na nasledujúcom príklade kódu:

Keď vytvoríte svoju vlastnú stránku Mapa stránok v HTML, nezabudnite zahrnúť odkazy v tomto zozname na všetky stránky na vašom webe, ktoré nemožno prepojiť prostredníctvom hlavnej navigácie. Ak napríklad váš web obsahuje stránky pravidiel ochrany osobných údajov, zmluvných podmienok a podpory zákazníkov, pridajte odkazy na tieto stránky v dolnej časti zoznamu priamo nad odkazom na stránku Mapa stránok.

Ak máte nejaké podstránky, pridajte tieto stránky do zoznamu ako podmnožinu hlavnej stránky, na ktorú by mali byť nasmerované, ako je to znázornené v tomto príklade:

Napríklad web Sugar Monkey nemá podstránky pre žiadny z hlavných navigačných odkazov, takže môžete tento krok preskočiť.

(Voliteľné) Voliteľne zadajte do každej položky označenej v zozname popisnú vetu, aby návštevníci vedeli, čo môžu očakávať, že nájdu na každej stránke.

Takýto popis môže pomôcť návštevníkom pri prehliadaní stránok, ako aj vyhľadávacím nástrojom pri vyhľadávaní a indexovaní každej stránky na webe.

Ak napríklad chcete pridať popis na stránku HTML webovej stránky Sugar Monkey, jedna z vašich položiek v zozname by mohla vyzerať takto:

Konvertujte všetky názvy stránok na zoznam v hypertextových odkazoch na ich príslušné stránky na webe a uistite sa, že každý odkaz obsahuje vlastný atribút názvu.

Napríklad, ak sa element about about stal odkazom na stránku About, váš kód by mohol vyzerať takto:

Uložte zmeny a zatvorte mapu stránok. html a nahrať kópiu tohto súboru na server vzdialeného hostiteľa.

Čo najskôr otestujte stránku a opravte preklepy alebo chyby kódovania. Ak vykonáte akékoľvek zmeny, nahrajte opravený súbor na vzdialený hostiteľský server.

Nikto nebude vedieť o tejto stránke, kým nepridáte niekoľko odkazov na sprístupnenie stránky návštevníkom webu.

Nastavenia programu

Najprv musíte urobiť nejaké nastavenia programu, aby ste vytvorili web pomocou Dreamweaveru.

  • Pri prvom spustení programu v otvorenej ponuke musíte vybrať zobrazenie stránky. Toto bude stránka HTML.
  • Na načítanej stránke s nástrojmi prejdite do ponuky Vlastnosti a prejdite do kategórie Kódovanie. V rozbaľovacej ponuke vyberte položku Cyrillic Windows. Ak ponuka obsahuje typ dokumentu DTD, vyberte 4.01 Transitional a stlačte Ok.
  • Okamžite vytvorte ďalšiu stránku. Ak to chcete urobiť, prejdite do ponuky Súbor.
  • Vyberte podponuku Nové.
  • Vyberte typ dokumentu 4.01 Prechodné.
  • V hornom okne kliknite na HTML. Kliknite na tlačidlo OK.
  • Vytvorte šablónu pre budúcu stránku. V Dreanweavere je zvyčajne pripravený. Môžete ho vidieť v ponuke kódu pri vytvorení nového dokumentu. V predvolenom nastavení sa nazýva dokument bez názvu. V kóde tohto dokumentu je hotová šablóna.

Extra kroky mimo programu

Uložte tento dokument do svojho počítača. Ak to chcete urobiť, musíte:

  • Vytvorte zdieľaný priečinok pre web a pomenujte ho.
  • V tomto priečinku vytvorte priečinok, ktorý by sa mal nazývať WWW. Nedá sa to nazývať iným spôsobom.
  • V tomto priečinku vytvorte ďalší. Zavolaj jej obrázky. Obrázky pre web sú uložené tu.
  • A teraz dokument uložte do priečinka WWW pod názvom index.html. Toto je hlavná stránka, jej názov by mal byť iba tento.

Pokračovanie stránky

  • V pracovnom okne na paneli programu kliknite na tlačidlo Súbory.
  • V rozbaľovacom zozname vyberte možnosť Spravovať webové stránky.
  • V okne správy lokality kliknite na tlačidlo Vytvoriť.
  • V okne, ktoré sa otvorí, musíte zadať nejaké informácie.
  • Do podpoložky Názov webovej stránky zadajte jej názov.
  • V položke Local folder folder vyberte predtým vytvorený priečinok s názvom WWW.
  • V ponuke Advanced Settings (Rozšírené nastavenia) vyhľadajte v predvolenom nastavení riadok Image folder (Priečinok Image). Vyberte priečinok s názvom obrázky.
  • Ok.
  • Kliknite na tlačidlo Uložiť. Objaví sa známe okno s názvom stránky.
  • Hotovo. V ponuke súborov sa zobrazí stránka, v ktorej bude priečinok WWW a súbor index.html. Ak kliknete na priečinok WWW, otvorí sa v ňom priečinok s obrázkami.

Pripojte šablónu so štýlmi CSS k webu

  • V programe vyberte kartu Štýl CSS.
  • Kliknite na znamienko + dole s bielym listom.
  • V zobrazenom okne vyberte názov selektora. Musíte to urobiť, ak v zozname nie sú žiadne mená, musíte ho vytvoriť. Kliknite na tlačidlo OK.
  • Zobrazí sa okno na uloženie súboru.
  • Musíte ho uložiť do priečinka WWW.
  • Otvorte lokalitu v ponuke Súbor a skontrolujte, či sa tam tento súbor nenašiel. Ak nie, stlačením klávesu F5 okno obnovte. Súbor by sa mal objaviť.

Vytvorenie drôtového modelu a pozadia webových stránok

  • Na hlavnej stránke webu prejdite na kartu Dizajn.
  • Na paneli nástrojov otvorte kartu Všeobecné.
  • Kliknite na ikonu tabuľky.
  • Zadajte parametre stránky: stĺpce 1, riadok 3, šírka tabuľky 900. Nadpis - č.
  • Rám je pripravený. Prejdite na pozadie.
  • Prejdite na kartu Súbor a potom na adresu style.css.
  • Súbor sa otvorí v programe pre celú oblasť. Zobrazí sa prázdna stránka s názvom súboru. Tu musíte zadať kód.
  • Do kódu by malo byť napísané: 1 riadok - farba a hrúbka rámu, 2. - mal by sa vybrať obrázok pre obrázok na pozadí, 3. riadok - farba obrázka na pozadí.

Dizajn hotového webu

  • Ak chcete dokončiť web v Dreamweaveri, musíte urobiť niekoľko ďalších krokov.
  • Vytvorenie hlavičky stránky pomocou programu Adobe Photoshop.
  • Vytvorenie horizontálnej ponuky pre web.
  • Vytváranie odkazov na nové stránky na webe.
  • Výber hostingu.
  • Umiestňovanie stránok na internete.
  • Aby návštevníci mohli vstúpiť na stránku, musia byť zaregistrovaní vo vyhľadávačoch.

Podrobne sme preskúmali, ako vytvoriť web v aplikácii Adobe Dreamweaver, čo je veľmi praktický program. Pokúste sa to urobiť sami a budete mať úspech.

Pin
Send
Share
Send
Send