Koti › koulutus › Mitkä ovat verkkosivun pääelementit? Verkkosivujen peruselementit. HTML-kielirakenne: tagit

Mitkä ovat verkkosivun pääelementit? Verkkosivujen peruselementit. HTML-kielirakenne: tagit

Mikä tahansa verkkosivu sisältää tietyn joukon vakioelementtejä, jotka ovat jokaisen resurssin pakollisia osia Internet-verkot. Tällaisten elementtien asettelu, niiden suhteellisen sijainnin suunnittelu on yksi verkkovastaavan päätehtävistä.

Web-sivun ensimmäinen elementti on sen otsikko. Se voidaan tehdä joko teksti- tai graafisessa muodossa, mutta molemmissa tapauksissa sen tulee sijaita asiakirjan yläosassa. Joskus yhdistettynä otsikkoon Kyrillisen koodauksen valintavalikko Ja painikkeita vaihtaaksesi sivuston venäjänkielisestä englanninkieliseen versioon, jos tämä verkkoresurssi esitetään kahdella kielellä.

Suoraan asiakirjan alaotsikossa on pääsääntöisesti sijoittelulle varattu tila mainosbanneri. Bannerin lisääminen Web-sivun yläosaan on useimmissa tapauksissa edellytys sivuston rekisteröinnille bannerivaihtopalveluissa - järjestelmissä, jotka mainostavat luomaasi resurssia vastineeksi muiden bannerinvaihtoverkoston osallistujien mainosten näyttämisestä sinun sivusi.

Pääosan asiakirjasta muodostavat ns tekstikenttä- alue, jossa sivun semanttinen sisältö sijaitsee: sisältö tietoteksti ja kuvituksia. Lueteltuja elementtejä kutsutaan myös "sisällöksi" (englanniksi sisältö). Tekstikentän sijainti riippuu ensisijaisesti siitä, miten web-suunnittelija sijoittaa asiakirjan loput elementit.

Web-sivun seuraava pakollinen osa on navigointielementit- yhdistävät hyperlinkit Tämä asiakirja sivuston muiden osien kanssa. Navigointielementtejä voidaan tehdä tekstijonoina, graafisina objekteina eli painikkeina tai aktiivisina komponentteina.

nents, esimerkiksi Java-sovelmat. Jälkimmäiset ovat samoja painikkeita, jotka, toisin kuin niiden "perinteiset" sisarukset, voivat reagoida hiiren liikkeisiin suorittamalla joitain yksinkertaisia toimintoja, kun osoitin on niiden päällä (taustavalon kytkeminen päälle, "napsautus"-efektin luominen, muodon muuttaminen jne.). d.).

Vakiintunein tapa on sijoittaa navigointielementit sivun vasempaan reunaan.

On tapana julkaista asiakirjan alareunassa tiedot sivuston kehittäjistä ja osoitteesta Sähköposti , jonka kautta vierailijat voivat lähettää vastauksensa, ehdotuksensa ja toiveensa sivun omistajille.

Jos verkkosivu on aloitusdokumentti, se sijoitetaan myös sen alaosaan osuma laskuri- pieni komentosarja, joka kutsuu palvelimelle asennettua CGI-komentosarjaa, joka tallentaa jokaisen asiakirjan avaamisen käyttäjän selaimessa ja muuttaa laskurin ilmaisimen arvoa. Ei ole suositeltavaa sijoittaa useita eri laskureita yhdelle sivulle.

Verkkosivustot eroavat toisistaan:

Koot (useita sivuja Web-palvelimiin, joissa on gigatavuja tietoa).

Suunnittelu (yleinen värimaailma, fonttimuoto, käytetyt kuvitukset jne.).

Rakenne (linkkijärjestelmä, sivujen yhdistäminen sivuston sisällä sekä yhteys muihin sivustoihin).

Samaan aikaan mikä tahansa verkkosivu rakennetaan vakioelementeistä, jotka voidaan jakaa kahteen ryhmään:

Passiiviset (kuvaavat) elementit

animaatio

Aktiiviset elementit

syöttökenttiä
kytkimet

Kehyksetkehys- kehys, kehys) on tekniikka, jonka avulla voit jakaa verkkosivun useisiin osiin (ikkunoihin) ja mahdollistaa kunkin osan sisällön muuttamisen muista osista riippumatta. Siten sivuston sisällysluettelo sijoitetaan usein yhteen muuttumattomaan kehykseen ja sisältö toiseen.

Aihe 9. Sähköinen viestintä. Sähköpostiosoitteet

Sähköposti (sähköposti) on verkkopalvelun päätyyppi. Viestintä tapahtuu järjestelmän kautta sähköpostipalvelimet.

Jokaiselle sähköpostipalvelimen käyttäjälle on oma Postilaatikko on paikka palvelinlevyllä, johon sähköpostiviestit tallennetaan. Sähköpostiosoitteen rekisteröinnin suorittamisen yhteydessä käyttäjä saa kirjautumistunnuksen ja salasanan, joita käytetään hänen postilaatikkoonsa pääsemiseen. Postilaatikon nimen (login) antaa käyttäjä itse. Palvelin varmistaa vain, että nimi on yksilöllinen.

Sähköpostiosoite koostuu kahdesta osasta, jotka erotetaan @-merkillä (tätä merkkiä kutsutaan yleisesti "koiraksi"):

Nimi postilaatikko käyttäjä (hänen valitsema, esimerkissämme - irina).

Verkkotunnus sähköpostipalvelin(esimerkissämme - postia. ru) .

Esimerkiksi, irina@ postia. ru

Sähköpostiosoitteet kirjoitetaan ilman välilyöntejä latinalaisilla kirjaimilla, numeroilla tai symboleilla (käyttö sallittu).

Käyttäjän tietokoneella olevan sähköpostiosoitteen rekisteröintitietojen perusteella aTili , joka sisältää sähköpostipalveluun ottamiseksi tarvittavat tiedot, mukaan lukien käyttäjätunnus (Kirjaudu sisään) ja salasana.

Tämän tietueen perusteella palvelin tunnistaa käyttäjän.

Internetin suojauksen suunnittelu

Hyökkäyksen kohteena voi olla sekä verkon kautta välitetty tieto että Internetiin kytketty tietokone.

Täydellistä turvallisuutta Internetiä käytettäessä on mahdotonta varmistaa, mutta ennakkoturvallisuussuunnittelu vähentää merkittävästi hyökkäysten todennäköisyyttä. Koska Internet kehittyy jatkuvasti, uusia tietoturvaongelmia ilmaantuu jatkuvasti, joten tietoturvatyökalujen päivittäminen on olennainen osa tietokonejärjestelmän kunnon ylläpitämistä.

Puolustuslinjat:

Mahdollisten hyökkäysten estäminen:

Käytä erityisiä ohjelmistoja ja laitteita, jotka estävät vaaralliset ja tarpeettomat tiedot.

Käytä todennusta ja salausta.

Riskilähteiden vähentäminen:

Käytä vain niitä Internet-palveluita, joita todella tarvitset.

Käytä virheetöntä ohjelmistoa ja päivitä se säännöllisesti.

Määritä ohjelmisto oikein (mitä vähemmän sallittua, sitä korkeampi turvallisuus).

Älä mainosta tietoja itsestäsi verkossa.

Rajoita pääsyä tietokoneesi resursseihin.

Valmistautuminen toipumaan hyökkäyksestä:

Luo ja päivitä säännöllisesti varmuuskopiot työtiedot.

Pidä aina ohjelmiston jakelusarjat käsillä.

Todennus (alkaenrpekologinenautenttiset- aitous) - aitouden vahvistus.

Olemme kaikki lukeneet valtavan määrän artikkeleita siitä, kuinka valita avainsanoja ja laatia niistä oikein luettelo, kuinka avainsanojen avulla luodaan tietyille hakukyselyille osuva verkkosivusto. Tarkastellaanpa tarkemmin avainsanojen sijoittamista verkkosivuille.

Tietäen, mihin ja miten avainsanoja sijoitetaan verkkosivulle, voi tehdä tai rikkoa SEO-yrityksesi.

Jokaisella verkkosivulla on 5 elementtiä, joihin sinun tulisi sijoittaa avainsanasi:

Sivun otsikko (title tag)
Sivun avainsanat (sisällönkuvauskenttien avainsanat)
Sivun kuvaus (Meta description tag)
Vaihtoehtoinen teksti kuville (Alt-tunniste)
Web-sivun sisältö (body tag)

Kaikista yllä mainituista verkkosivun elementeistä tärkein on sivun sisältö (kohta 5). Tästä lisää alla.

Katsotaanpa tätä luetteloa toistaiseksi järjestyksessä.

Elementti #1. Sivun otsikko (title tag)

Katsotaanpa ensin sivun otsikkoa (title tag). Tämä elementti on ensimmäinen ja tärkein kaikista muista elementeistä minkä tahansa verkkosivun otsikkolohkossa.

Näet verkkosivun otsikon Internet-selaimen ylimmällä rivillä. Voit varmistaa tämän käynnistämällä minkä tahansa selaimen, esimerkiksi Internet Explorer, Opera tai Mozilla Firefox, siirry mille tahansa verkkosivustolle ja vertaa otsikkotunnisteen sisältöä kyseisten selaimien ylimpään riviin. Hakukoneet käyttävät tätä tunnistetta omiin tarkoituksiinsa - kerätäkseen tietoja sivustosta ja määrittääkseen sen aiheen sekä käyttääkseen sitä hakukonetuloksissa (SERP) verkkosivun nimenä.

Muistaa! Web-sivun otsikko on sen Lyhyt kuvaus.

Yllämainittujen lisäksi otsikkotunnisteen sisältöä käytetään verkkosivun otsikkona, kun se lisätään Internet-selaimen suosikkeihin.

Elementti nro 2. Sivun avainsanat (sisällönkuvauskenttien avainsanat)

Puhutaanpa nyt avainsanoista ja kuvaussisällönkuvauskentistä. Jokin aika sitten Meta avainsanat -tunnistetta käytettiin lisättäessä sivusto hakukoneen hakemistoon. Mutta ne ajat ovat menneet. Nyt hakukoneet yksinkertaisesti jättävät tämän tunnisteen huomioimatta, koska... on usein tapauksia, joissa sitä käytetään "likaisiin" tarkoituksiin. Jotkut hakukoneet kiinnittävät huomiota tähän tunnisteeseen määrittääkseen sivuston aiheen.

Kaikesta sanotusta seuraa, että tätä tunnistetta ei vaadita, mutta voit käyttää sitä vain aiottuun tarkoitukseen.

Avainsanat tulee erottaa pilkulla. Sijoita tärkeimmät avainsanat luettelon alkuun ja sen jälkeen tärkeysjärjestykseen. Hakukoneet eivät enää kiinnitä huomiota siihen, missä tapauksessa avainsanat kirjoitetaan, joten nyt kaikki avainsanat voidaan kirjoittaa pienillä kirjaimilla.

Elementti nro 3. Sivun kuvaus (Meta description tag)

Kuvaussisällönkuvauskenttä on toinen sivuston elementti, johon avainsanat tulisi sijoittaa. Hakukoneet tarkistavat tämän tunnisteen avainsanojen varalta ja vertaavat sen sisältöä itse sivuston sisältöön (body-tunnisteen sisältöön). Erittäin tärkeä seikka on se, että hakukoneet käyttävät kuvaustunnisteen sisältöä verkkosivun kuvauksena hakutuloksissa (SERP).

Tämän tunnisteen tulee sisältää lyhyt kuvaus verkkosivusta, mutta enintään 50 sanaa.

Elementti nro 4. Vaihtoehtoinen teksti kuville (Alt-tunniste)

Alt-tagit ovat tekstikuvaus kuvan sisällöstä, ts. Jos kuva ei jostain syystä lataudu ja tässä kuvassa on vaihtoehtoinen teksti, tämä teksti näytetään kuvan sijaan.

Jos kuva on ladattu ja kuvassa on myös alt-teksti, näemme sen, kun viemme hiiren kuvan päälle. Alt-tageja käytetään niiden Internet-käyttäjien mukavuuden vuoksi, jotka eivät jostain syystä näytä grafiikkaa.

Monet hakukoneet indeksoivat tämän tunnisteen sisällön, joten se voi sisältää avainsanoja. Muista vain, että vaihtoehtoisen tekstin tulee vastata kuvaa, kuvailla sitä ja olla sen tekstivastine. Älä käytä alt-tunnistetta merkintäkuvien, kuten jakoviivojen, luotien...

Elementti nro 5. Web-sivun sisältö (body tag)

Pääsimme siis vihdoin sivuston peruselementtiin - body-tunnisteeseen, elementtiin, jonka sisältö kiinnostaa eniten Internetin käyttäjiä. Suuret hakukoneet eivät enää anna sinulle 1. sijaa SERP:issä vain siksi, että verkkosivustosi sivulla on useita avainsanatoistoja. Vain tietyn asian kannalta olennaisimmat hakulauseke Nettisivu.

Tämän saavuttamiseksi sinun tulee sisällyttää valitut avainsanat verkkosivujen koodiin tarkkailla niiden toistotiheyttä. Toimi seuraavasti: valitse kullekin sivulle 1-2 avainsanaa ja optimoi niitä vastaava sivu.

Kuvittele, että olet valmistelemassa esittelyä uudesta verkkosivustostasi tai tuotteestasi. Sitten esimerkiksi diojasi PowerPoint-esityksiä– kappaleet. Niiden tulee olla lyhyitä ja selkeitä. Aivan kuten PowerPoint-esityksessä, voit käyttää luetteloita listataksesi sivustosi tai tuotteesi edut keskittyen joka kerta valittuihin avainsanoihin.

Liitä valitut avainsanat kunkin verkkosivun yllä oleviin viiteen elementtiin, niin parannat huomattavasti nykyistä sijoitustasi ja tuloksiasi.

HTML-kieli

Web-sivuja voi olla missä tahansa muodossa, mutta standardi on Hyper Text Markup Language, hypertekstin merkintäkieli, joka on suunniteltu luomaan rikastekstiä, jossa on runsaasti kuvia, ääntä, animaatioita, videoleikkeitä ja hypertekstilinkkejä muihin Webissä hajallaan oleviin asiakirjoihin. sijaitsevat samalla palvelimella tai ovat olennainen osa samaa Web-projektia.

Voit työskennellä verkossa ilman tietoa HTML-kieli, koska HTML-tekstejä voidaan luoda erilaisilla erikoiseditoreilla ja muuntimilla. Mutta suoraan HTML-kielellä kirjoittaminen ei ole vaikeaa. Se voi jopa olla helpompaa kuin HTML-editorin tai -muuntimen oppiminen, sillä niiden ominaisuudet ovat usein rajoitettuja, bugisia tai tuottavat huonoa HTML-koodia, joka ei toimi kaikilla alustoilla.

HTML-kielellä on useita makuja ja se kehittyy edelleen, mutta HTML-rakenteita käytetään todennäköisesti jatkossakin. Oppimalla HTML:n ja ymmärtämällä sitä syvemmin, luomalla dokumentin HTML:n oppimisen alussa ja laajentamalla sitä mahdollisimman paljon, pystymme luomaan web-sivuja, joita monet voivat katsella. Web-selaimet, sekä nyt että tulevaisuudessa. Tämä ei sulje pois mahdollisuutta käyttää muita menetelmiä, kuten Netscape Navigatorin, Internet Explorerin tai joidenkin muiden ohjelmien tarjoamaa edistynyttä menetelmää.

Työskentely HTML:n kanssa on tapa oppia luomaan asiakirjoja standardoidulla kielellä käyttämällä laajennuksia vain tarvittaessa.

World Wide Web Consortium on ratifioinut HTML:n. Sitä tukevat useat laajalti käytetyt selaimet, ja se tulee todennäköisesti olemaan melkein kaiken perusta ohjelmisto, joka liittyy verkkoon.

Verkkosivun luomisen periaatteet, verkkosivun peruselementit

Web-sivujen luomiseen käytetään erityistä kieltä nimeltä HTML (HyperText Markup Language). Tämä kieli määrittää joukon erikoiskomentoja, joita kutsutaan tunnisteiksi ja joita käytetään määrittämään Web-sivun tiettyjen elementtien muotoilu tai tarkoitus. Web-sivuille sijoittamiseen käytetään erityisiä tunnisteita graafisia kuvia, ääni- ja videoleikkeet ja muut ns. upotetut objektit.

Nettisivut ovat tavallisia tekstitiedostoja luotu vuonna tavallinen muistilehtiö tai vastaava yksinkertainen tekstieditori. Ja ne sisältävät tekstiä, samaa tekstiä, jonka haluat laittaa sivuille, vain erityisellä tavalla merkittynä. Jotta erilaisia ohjelmia Jotta web-selaimet näyttäisivät saman Web-sivun oikein, HTML:n on oltava standardoitu.

Käytännössä HTML-standardiin vaikuttaa suuresti tunnetuimpien selaimien, kuten Microsoft Internet Explorer ja Google Chrom, ehdottamien ja tukemien tunnisteiden läsnäolo. Nämä tunnisteet sisään Tämä hetki saattaa olla osa nykyistä HTML-spesifikaatiota.

Muokkaustyökaluja on erityisesti suunniteltu HTML:n kirjoittaminen. Ne säästävät aikaa, koska ne sisältävät avaimia nopea pääsy toistuvien toimintojen suorittamiseen, kuten asiakirjojen, taulukoiden alkuasetusten määrittämiseen tai yksinkertaisesti tyylien käyttämiseen tekstiin. HTML-editorit eroavat WYSIWYG-kirjoitustyökaluista siinä, että ne edellyttävät HTML:n manuaalisen kääntämisen sääntöjen tuntemista; editorit vain yksinkertaistavat ja nopeuttavat tätä prosessia. WWWC-standardoitujen HTML-tunnisteiden (vakiotunnisteiden) lisäksi Web-selaimet tukevat monia ei-standardeja tunnisteita. Tietyn Web-selainohjelman kehittäjät ottivat nämä tunnisteet käyttöön saadakseen etua kilpailijoihin verrattuna. He toivoivat, että näistä patentoiduista laajennuksista tulisi myöhemmin osa HTML-standardia, mutta nämä toiveet eivät koskaan toteutuneet. Tunnisteet kuitenkin säilyvät ja niitä tuetaan edelleen.

Web-sivujen luomiseen tarvitset minkä tahansa selaimen - Internet Explorer tai Google Chrome Mozilla Firefox, tai vielä parempi molemmat, koska monet HTML-elementtejä näkyvät eri tavalla eri katseluohjelmissa, ja on erittäin toivottavaa hallita tätä eroa.

Lisäksi tarvitset minkä tahansa tekstieditorin esimerkiksi HTML-tiedostojen valmistelemiseen ja selaimen, jolla voit tarkastella ja hallita tehtyjä asioita.

Web-sivun luomiseksi ensimmäinen askel on luoda sivuston rakenne. Verkkosivusto on palvelin, jolla on yksilöllinen nimi ja pysyvä osoite ja joka on fyysisesti yhteydessä WWW-verkkoon tai jota isännöi virtuaalisesti toisella, suuremmalla palvelimella.

Kun olet luonut sivustorakenteen, suorita tekstieditori Sana, luo uusi asiakirja ja tallenna se Web-sivuksi ja jatka sitten Web-sivun luomiseen. Se tekee työstämme helpompaa ja parempaa. Siinä määritämme Web-sivuston luomisajankohdan, sen virheenkorjauksen, sen aiheen sekä sen täyttämisen.

On olemassa useita yksinkertaisia sääntöjä, joiden avulla vierailija voi ymmärtää sivuston käyttöliittymän [nro 10].

1. Sivusto ei saa sisältää turhaa tietoa, fontin tulee olla helppolukuinen. Graafisten elementtien oli oltava selkeitä, ilmeikkäitä ja nopeasti ladattavia.

2. Ihmissilmä skannaa verkkosivustojen sivut ylhäältä alas. Suurin huomio kohdistuu sivun vasempaan yläkulmaan. Siksi sivuston sivun yläosassa yleensä eniten tärkeää tietoa: yrityksen nimi, logo, verkkosivuston nimi jne.

3. Sivuston kävijän tulee helposti löytää häntä kiinnostava tieto ja saada kattavaa tietoa (tekstikuvaus sekä useita valokuvia).

4. Tietoa tulisi jakaa ryhmien kesken. On mahdollista tarjota mahdollisuus etsiä tuotteita nimen ja kuvauksen perusteella.

5. Verkkosivustolla on oltava tietoosiot:

tiedot yrityksestä (toimiala, osoite, yhteystiedot jne.);

Verkkosivujen peruselementit:

1. Otsikko/logo (otsikko)

3. Sisältö/Sisältö (tekstikenttä)

4. Navigointielementit

5. Tietoja sivuston kehittäjistä

Mikä tahansa Web-sivu sisältää tietyn joukon vakioelementtejä, jotka ovat jokaisen Internet-resurssin pakollisia osia.

Ensimmäinen Web-sivun elementti, jota meidän on tarkasteltava, on sen otsikko. Sivuston logolla tai nimellä on siinä sama rooli kuin kyltillä minkä tahansa laitoksen sisäänkäynnissä. Internet on toinen asia: tässä tärkein liikkumismenetelmä on teleportaatio, ja siksi minun on nähtävä tämä "merkki" jokaisella sivulla.

Suurimman osan dokumentista muodostaa ns. Tekstikenttä - alue, jossa sivun semanttinen sisältö sijaitsee: merkityksellinen tietoteksti ja kuvitukset.

Lueteltuja elementtejä kutsutaan myös "sisällöksi" (englanniksi sisältö - sisältö). Tekstikentän sijoitus riippuu ensisijaisesti siitä, miten Web-suunnittelija sijoittaa loput asiakirjan elementit.

Kuva 1. Esimerkki sivuston sisällöstä

Kuva 2. Yhteystiedot

Ennen kuin aloitat verkkosivustosi luomisen, ota erittäin vastuullinen lähestymistapa sivuelementtien järjestämiseen. Yleisesti ottaen web-sivu on jaettu sivun sisältöön, navigointiin ja niihin liittyviin tietoihin. Nämä elementit on puolestaan jaettu pienempiin osiin.

Tämän seurauksena Web-sivuston kehittämisen toimintosarja on seuraava yksinkertainen algoritmi:

1. Tavoitteiden asettaminen ja päätehtävien määrittely.

2. Luettelon luominen tulevista temaattisista osioista.

3. Resurssin loogisen ja fyysisen rakenteen kehittäminen.

4. Suunnitteluluonnoksen, työpaikan layoutin, näkymätön layout-taulukon laatiminen.

5. Tekstimateriaalien valmistelu.

6. Graafisten materiaalien valmistus vektorimuodossa.

7. Vie vektoripiirrokset rasterimuotoon.

8. Kaikkien kuvien optimointi.

9. Web-sivumallien luominen.

10. Web-sivujen kokoaminen ja virheenkorjauskoodi.

11. Verkkosivujen näyttöidentiteetin tarkistaminen eri näytön resoluutioilla ja väripaletteilla ja eri selaimilla.

Mikä tahansa verkkosivu sisältää tietyn joukon vakioelementtejä, jotka ovat pakollisia komponentteja jokaisessa Internet-resurssissa. Tietenkin tällaisten esineiden valikoima ja määrä voivat vaihdella riippuen sivuston teemakohteesta, sillä julkaistujen materiaalien määrästä sekä tavoitteista ja tavoitteista, jotka tämän resurssin luoja asettaa itselleen. Tällaisten elementtien asettelu, niiden suhteellisen sijainnin suunnittelu on yksi verkkovastaavan päätehtävistä.

Web-sivun ensimmäinen elementti, jota meidän on tarkasteltava, on sen otsikko. Se voidaan tehdä joko teksti- tai graafisessa muodossa, mutta molemmissa tapauksissa sen tulee sijaita asiakirjan yläosassa. Joskus otsikko yhdistetään valikkoon kyrillisen koodauksen valitsemiseksi ja painikkeisiin, joilla vaihdetaan sivuston venäläisestä englanninkielisestä versiosta, jos tämä verkkoresurssi esitetään kahdella kielellä. Suoraan asiakirjan alaotsikon alla on pääsääntöisesti mainosbannerin sijoittamiseen varattu tila. Bannerin lisääminen verkkosivun yläosaan on useimmissa tapauksissa edellytys sivuston rekisteröinnille bannerivaihtopalveluissa - järjestelmissä, jotka mainostavat luomaasi resurssia vastineeksi muiden bannerivaihtoverkoston osallistujien mainosten näyttämisestä sinun sivusi. Asiakirjan otsikon alla julkaistujen bannerien vakiokoko on yleensä 468x60 pikseliä. Jos käytät staattista sivuasettelua, asiakirjan otsikon leveys on noin 640 pikseliä ensisijaisesti sen varmistamiseksi, että asiakirja näkyy oikein 640 x 480 pikselin näytöissä ja jotta vältytään vaakasuuntaisesta vierityspalkista, joka vaikeuttaa sen katselemista. Ilmeisesti bannerin leveys on tässä tapauksessa huomattavasti pienempi kuin otsikon leveys, minkä vuoksi siinä sivun osassa, jossa aiot varata tilaa mainoksille, ilmestyy tyhjää tilaa, joka voidaan täyttää tämän sivuston omistavan yrityksen logo tai linkki palvelimeen, joka toteuttaa webin. Logoa ei tietenkään aina tarvita: pääsääntöisesti se sisällytetään verkkosivulle vain, jos sivustolla on kaupallinen painopiste.

Pääosan asiakirjasta muodostaa ns. tekstikenttä - alue, jossa sivun semanttinen sisältö sijaitsee: merkityksellinen tietoteksti ja kuvitukset. Lueteltuja elementtejä kutsutaan myös "sisällöksi" (englanniksi sisältö). Tekstikentän sijainti riippuu ensisijaisesti siitä, miten web-suunnittelija sijoittaa asiakirjan loput elementit.

Seuraava web-sivun pakollinen osa on navigointielementit - hyperlinkit, jotka yhdistävät tämän asiakirjan sivuston muihin osiin. Navigointielementtejä voidaan tehdä tekstijonoina, graafisina objekteina eli painikkeina tai aktiivisina komponentteina, kuten Java-sovelmina. Jälkimmäiset ovat samoja painikkeita, jotka, toisin kuin niiden "perinteiset" sisarukset, voivat reagoida hiiren liikkeisiin suorittamalla joitain yksinkertaisia toimintoja, kun osoitin on niiden päällä (taustavalon kytkeminen päälle, "napsautus"-efektin luominen, muodon muuttaminen jne.). d.). Kuten jo mainitsin kohdassa "Web-suunnittelun peruspostulaatit", navigointielementit tulee sijoittaa niin, että ne ovat aina "näkyvillä", "käden ulottuvilla" eli niin, ettei käyttäjällä ole "kelataksesi" sivua taaksepäin , jos tekstikenttä kattaa useita fyysisiä näyttöjä korkeudeltaan, käytä sitten kauan aikaa etsimään linkkejä muihin osiin. Vakiintunein tapa on sijoittaa navigointielementit sivun vasempaan reunaan.

Asiakirjan alareunassa on tapana julkaista tiedot sivuston kehittäjistä ja sähköpostiosoite, johon resurssin vierailijat voivat lähettää vastauksensa, ehdotuksensa ja toiveensa sivun omistajille. Jos verkkosivu on aloitusdokumentti, sen alaosaan sijoitetaan myös käyntilaskuri - pieni komentosarja, joka kutsuu palvelimelle asennetun CGI-komentosarjan, joka tallentaa jokaisen dokumentin avauksen käyttäjän selaimeen ja muuttaa sen arvoa. laskurin ilmaisin. Tämän ansiosta verkkovastaava voi helposti määrittää kävijöiden määrän, jotka vierailivat hänen sivullaan tietyn ajanjakson aikana. Huomaan, että käyntilaskuri asennetaan vain ensimmäiselle sivulle, jota kutsutaan sivustolle avattaessa; sitä ei ole muissa resurssin asiakirjoissa.

Olemme siis tarkastelleet kaikki verkkosivun pääkomponentit ja niiden mahdollinen sijainti suhteessa toisiinsa. Kuvassa on esimerkki verkkosivuston asettelusta, joka sisältää täydellisen joukon yllä kuvattuja komponentteja. 3.6. Se valitsee navigointielementit, jotka sijoitetaan asiakirjan vasempaan reunaan.

Riisi. 3.6. Esimerkki verkkosivun asettelusta, jossa navigointielementit on sijoitettu vasemmalle

Käytännössä kohtaamme usein verkkosivustoja, joissa navigointielementtien suunnittelu on sijoitettu näytön oikeaan reunaan. Tässä tapauksessa tekstikenttä siirtyy vasemmalle, asiakirjan loput osat on järjestetty niiden yhdistelmän maksimaalisen esteettisyyden periaatteen mukaisesti. Esimerkki tällaisesta sivuston toteutuksesta on esitetty kuvassa. 3.7.

Riisi. 3.7. Esimerkki verkkosivun asettelusta, jossa navigointielementit on sijoitettu oikealle

Kuten kuvasta näkyy, tässä tapauksessa logo sijoitetaan samalle tasolle asiakirjan otsikon kanssa ja mainosbanneri on sijoitettu suhteessa sivun keskikohtaan. Tällä lähestymistavalla on suositeltavaa säilyttää mainonnan otsikon, logon ja kentän graafinen suunnittelu yhdellä värillä ja taiteellisella tyylillä - silloin näiden esineiden sijainnin epäsymmetria ei ole niin ilmeinen eikä "satuta silmiä" " tiukan, "taulukkomuotoisen" suunnitteluestetiikkaa kannattavien joukossa.

Navigointielementtejä voidaan sijoittaa paitsi sivun oikean ja vasemman reunan lähelle, myös asiakirjan yläosaan. Tämä asetteluvaihtoehto on mielestäni sopivin kotisivuja luotaessa: tässä tapauksessa kaikki sivuobjektit "sopivat" harmonisesti näkymättömän taulukon annettuun leveyteen, kun taas itse taulukon valmistelu yksinkertaistuu huomattavasti. Tämän lähestymistavan ainoa haittapuoli on tarve kopioida asiakirjan alareunassa olevia navigointielementtejä, koska sivua pystysuunnassa rullattaessa ne katoavat näytön yläreunan taakse, ja päästäkseen niihin käyttäjän on "kelaa" näyttöä taaksepäin, mikä, näet, on erittäin hankalaa. Kuvassa on esimerkki sivun suunnittelusta, jossa on ylänavigointielementtejä. 3.8.

Riisi. 3.8. Esimerkki web-sivun asettelusta, jossa navigointielementit on sijoitettu ylhäältä

Tietenkin kaikki, mitä tässä osiossa on sanottu, ei ole ihmelääke, vaan toimintaopas. Yritän hahmotella vain yleiset periaatteet, joita käytetään sivuston rakenteen asettelussa, mutta lopullisen päätöksen tekee aina verkkovastaava. Loppujen lopuksi riippumatta siitä, mitä suunnittelua käytät tulevan projektisi perustana, työsi tulos on silti oikea: Internetissä ei ole sensuuria tai säännöksiä, jotka pakottavat sivuston luojan yhteen tai toiseen tiukkaan kehykseen. Esimerkki suunnitteluratkaisusta, joka ei kuulu mihinkään yllä olevista luokista, on niin sanottu sekoitettu layout, jonka likimääräinen kaavio on esitetty kuvassa. 3.9.

Kuten kuvasta näkyy, tässä esimerkissä osa ohjauselementeistä on rakennettu suoraan sivun otsikkoon - me puhumme Painikkeista, joilla vaihdetaan sivuston venäjän ja englanninkielisen version välillä, sekä navigointipainikkeista: tämä voi olla linkki resurssien luojien sähköpostiosoitteisiin, joka on kopioitu asiakirjan alareunassa, ja linkki johonkin temaattiset osiot, esimerkiksi uutissivu. Navigointielementtien päälohko on sijoitettu suhteessa asiakirjan vasempaan reunaan, mutta kyrillisen koodauksen valintavalikko sijaitsee suoraan mainosbannerin alapuolella sivun yläosassa. Tekstikenttä on jaettu kahteen epäsymmetriseen sarakkeeseen, ja oikealla on lyhyet tiedotteet resurssin muodostavista temaattisista osioista, mukaan lukien linkit näihin osioihin.

On selvää, että web-sivulle voi olla monia erilaisia "sekamuotoisia" vaihtoehtoja: konkreettisia ratkaisuja riippuvat resurssin muodostavien osien lukumäärästä, sivustolle sijoitettavan tekstin määrästä ja lopulta itse suunnittelijan mielikuvituksesta. Tärkeää on vain se ulkomuoto sivusto ei aiheuttanut valituksia vierailijoilta. Loppujen lopuksi vain sinulla kehittäjänä, sinulla eikä kenelläkään muulla, on oikeus näyttää kaikki kykysi ja kykysi sekä järjestää sivu oman makusi mukaan. Joidenkin kotisivujen luojat asettavat epäilyksiä vaivaamatta osumalaskurin dokumentin oikeaan yläkulmaan, sivuston nimi kirjoitetaan pienellä, siistillä fontilla ja julkaistaan mainosbannerin alla ja jostain syystä navigointi elementtejä ilmestyy yllättäen aivan tekstilohkon keskelle, itsestäsi kertovan tarinan ja projektin tekijän rakkaan koiran valokuvien väliin. Maulle ja värille ei ole tovereita, kuten sanotaan. Mutta henkilökohtaisesti tämä sairaus vaikuttaa minusta parantumattomalta.