Mitä kieltä käytetään hypertekstiasiakirjojen kuvaamiseen. HTML:n perusteet, hypertekstin merkintäkieli. A) Rasterigrafiikkaeditorit

Nykyaikaiset Web-tietotekniikat muuttavat maailmaamme nopeasti ja vaikuttavat suoraan verkkoteknologioiden kehitykseen. Tämä teknologinen vallankumous on vaikuttanut suuresti paitsi liike-elämään myös henkilökohtaiseen ja työelämään. Uusimmat verkkoteknologiat tunkeutuvat kaikkiin sosiaalisen elämän alueisiin, muuttavat viestintätapoja ja verkkoprojektien toteuttamisen periaatteita. nykyaikaiset yritykset, joka määrittää jälkimmäisen kohtalon. Nykyaikaisten verkkotietoteknologioiden sisäinen monimutkaisuus ja käytön äärimmäinen yksinkertaisuus tekee niistä kaikkien saatavilla, jotka päivittäin kohtaavat niiden käytön ammattitoiminnassaan.

Sekä arjessa että liike-elämässä, kirjeenvaihdossa ja kaupassa ihmiset ja organisaatiot käyttävät verkkoa, luovat omia web-sivustoja, joissa ne tarjoavat tietoa, tavaroita ja palveluita. Verkkoresurssien luomiseen tarvittavat työkalut kehittyvät nopeasti ja pysähtymättä. Niiden avulla voit luoda monimutkaisia ​​verkkodokumentteja ilman erityistä tietoa niiden rakenteesta ja ulkonäöstä, mikä vapauttaa aikaa tuottavaan luovaan toimintaan. Web-tekniikoiden tärkein etu on nykyaikaiset olosuhteet johtuu niiden yksinkertaisuudesta ja sen seurauksena niiden käytön tehostamisesta.

Hypertext Markup Language HTML

Internetin suosio johtuu suurelta osin World Wide Webin (WWW) tulosta, sillä se oli ensimmäinen verkkotekniikka, joka tarjosi käyttäjälle helpon moderni käyttöliittymä käyttääksesi erilaisia ​​verkkoresursseja. Yksinkertaisuus ja helppokäyttöisyys ovat johtaneet WWW-käyttäjien määrän kasvuun ja herättäneet kaupallisten rakenteiden huomion. Sitten käyttäjien määrän kasvuprosessista tuli lumivyöry, ja tämä jatkuu tähän päivään asti. Perustuen tarpeeseen yhdistää kaikki tietoresurssit, alkoi kehittyä tekniikka, jonka avulla määritellään hyperteksti navigointijärjestelmä. Tästä tekniikasta tuli HTML-kieli. HTML-tekniikka käytössä alkuvaiheessa oli äärimmäisen yksinkertainen, ja lähes kaikilla verkon käyttäjillä oli samanaikaisesti mahdollisuus kokeilla itseään Webissä julkaistujen tietomateriaalien luojina ja lukijoina. Tosiasia on, että teknologian eri komponentteja kehitettäessä oletettiin, että tietoresurssien ja heidän laitteidensa tekijöiden pätevyys tietokonetekniikka tulee olemaan minimaalinen.

HTML-kieli (hyperteksti Merkintäkieli, hypertekstin merkintäkieli) on yksi niin sanotuista merkintäkielistä. Termi "merkintä" viittaa yleisiin palvelutietoihin, joita ei näytetä asiakirjan mukana, mutta jotka määrittelevät; miltä tiettyjen asiakirjan osien tulisi näyttää. Voit esimerkiksi pyytää, että sana näytetään lihavoituna tai kursivoituna, näyttö erillinen kappale erityisellä fontilla tai tee otsikot suuremmalla fontilla.

Nykyään on saatavilla monia erilaisia ​​merkintäkieliä. Esimerkiksi sisään viestintäohjelmat erityinen muoto markup määrittää jokaisen Internetiin lähetetyn nollien ja ykkösten paketin merkityksen. Minkä tahansa merkintäkielen on kuitenkin ratkaistava kaksi tärkeää ongelmaa:

1) kieli määrittää merkintäsyntaksin;

2) kieli määrittää merkinnän merkityksen.

Web-sivujen yleisin merkintäkieli on HTML. Tämä merkintäkieli luotiin ja sitä mainostettiin SGML:n osajoukkona. Ensimmäisen kerran ehdotti vuonna 1974 Charles Goldfarb, ja myöhemmin se hyväksyttiin viralliseksi ISO-standardi SGML (Standard Generalized Markup Language) on metakieli – järjestelmä muiden kielten kuvaamiseen.

SGML-standardin syntyminen johtui tarpeesta jakaminen tietoja eri sovelluksista ja käyttöjärjestelmistä. Jo 60-luvulla tietokoneen käyttäjillä oli monia yhteensopivuusongelmia. Analysoituaan monien epästandardien merkintäkielten puutteet kolme IBM:n tutkijaa - Charles Goldfarb, Ed Mosher ja Ray Lorie - muotoilivat kolme yleistä periaatetta, jotka mahdollistavat yhteistyötä dokumenttien kanssa eri käyttöjärjestelmissä.

1) Käytä yhtenäisiä muotoiluperiaatteita kaikissa asiakirjoja käsittelevissä ohjelmissa. Täysin looginen vaatimus - me kaikki tiedämme, kuinka vaikeaa eri kieliä puhuvien ihmisten on olla samaa mieltä keskenään. Yhden syntaktisten rakenteiden ja yhteisen semantiikan joukon läsnäolo yksinkertaistaa merkittävästi ohjelmien välistä vuorovaikutusta.

2) Muotoilukielten erikoistuminen. Koska ohjelmoija pystyy rakentamaan erikoiskielen vakiosääntöjen perusteella, hän lakkaa olemasta riippuvainen ulkoisista toteutuksista ja heidän ideoistaan ​​loppukäyttäjän tarpeista.

3) Asiakirjan muodon selkeä määritelmä. Asiakirjan muodon määrittävät säännöt määrittelevät dokumentissa käytettävien kielirakenteiden lukumäärän ja merkinnät. Sovellus vakiomuoto varmistaa, että käyttäjä tietää tarkasti dokumentin sisällön rakenteen. Huomaa: tässä ei ole kyse dokumentin näyttömuodosta, vaan sen rakenteellisesta muodosta. Tätä muotoa kuvaavaa sääntöjoukkoa kutsutaan "asiakirjatyypin määritelmäksi" ( asiakirjan tyyppi määritelmä, DTD).

Nämä kolme sääntöä muodostivat perustan SGML:n edeltäjälle, GML:lle (Generalized Markup Language). GML:n tutkimus- ja kehitystyö jatkui noin kymmenen vuotta, kunnes SGML-standardi syntyi kansainvälisen kehittäjäryhmän tekemän sopimuksen tuloksena.

HTML (Hypertext Markup Language) on tietokoneen kieli, joka on World Wide Webin taustalla. HTML perustuu SGML-standardiin, hypertekstin merkintäkieleen dokumenttien esittämiseen verkossa. W3C-konsortio kehittää ja ylläpitää HTML-kielistandardeja, jotka ovat yksi tärkeimmistä Web-standardeista. Tämän kansainvälisen konsortion perustaja on Tim Berners-Lee. Muotoilustandardien luomisen lisäksi konsortio on semanttisen verkon (semanttisen verkon) kehittämisen keskus. HTML-kieli tarjoaa muotomerkinnät asiakirjoille ja määrittää hyperlinkkejä asiakirjojen ja/tai niiden fragmenttien välillä.

Sen kirjoittamisen pohjaksi valittiin tavallinen HTML-koodi. tekstitiedosto. WWW-käsitteen hypertekstitietokanta on siis joukko HTML:llä merkittyjä tekstitiedostoja, jotka määräävät tiedon esitysmuodon (markup) sekä näiden tiedostojen ja muiden tietoresurssien välisten yhteyksien rakenteen (hypertekstilinkit).

HTML-kehittäjät pystyivät ratkaisemaan kaksi ongelmaa:

· tarjota hypertekstitietokannan suunnittelijoille yksinkertainen tapa luoda asiakirjoja;

· Tee tästä työkalusta tarpeeksi tehokas heijastamaan silloin olemassa olevia ajatuksia hypertekstitietokantojen käyttöliittymästä.

Ensimmäinen ongelma ratkaistiin valitsemalla asiakirjan kuvaukselle merkintämalli. HTML-kielen avulla voit merkitä näytöllä näkyvän sähköisen asiakirjan painotason suunnittelulla; tuloksena oleva asiakirja voi sisältää laajan valikoiman tarroja, piirroksia, ääni- ja videopätkiä ja niin edelleen. Kieli sisältää kehitettyjä työkaluja eritasoisten otsikoiden, fonttivalintojen, erilaisten luetteloiden, taulukoiden ja paljon muuta luomiseen.

Toinen tärkeä kohta HTML:n kohtaloon vaikutti se, että pohjaksi valittiin tavallinen tekstitiedosto. keskiviikko HTML-muokkaus on ei-kenenkään maa yksinkertaisen tekstitiedoston ja WYSIWYG-sovelluksen (mitä näet on mitä saat) välissä. Muokkausympäristön valitseminen antaa sinulle kaikki tekstinmuokkauksen edut.

Hypertekstilinkit, jotka muodostavat yhteyksiä välille tekstiasiakirjoja, alkoi vähitellen yhdistää erilaisia ​​tietoresursseja, kuten ääntä ja videota. Järjestelmä HTML-hyperlinkit voit rakentaa toisiinsa liittyvien asiakirjojen järjestelmän eri kriteerien mukaan. HTML-kieli sisältää komentoja (tageja), joiden avulla voit hallita kirjasinten muotoa ja kokoa, kuvien kokoa ja sijaintia sekä siirtyä teksti- tai kuvapalasta muihin HTML-dokumentteihin - ns. hypertekstilinkkiin. . Html-muotoinen asiakirja on tekstitiedosto, joka sisältää kaiken tarvittavat tiedot näytöllä näkyvistä tiedoista. Voit käyttää komentosarjakieliä, kuten JavaScript, Java ja VBScript, hallitaksesi verkkosivustojen selausskriptejä (World Wide Webissä isännöity hypertekstitietokanta). Myöhemmin käsiteltävät lomakkeet käyttäjän syöttämiseksi ja muut tiedot voidaan käsitellä erityisillä palvelinohjelmilla (esim. PHP kielet tai Perl). HTML-kielen avulla voit sijoittaa hypertekstilinkkejä sivuille ja interaktiivisia painikkeita, jotka yhdistävät Web-sivusi muihin saman Web-sivuston sivuihin sekä muihin Web-sivustoihin ympäri maailmaa.

HTML on tekstinkuvauskieli, ei ohjelmointikieli, joka on vain yksi työkaluista (tarkemmin sanottuna sivunkuvauskieli), jota käytetään Web-sivujen luomiseen. HTML:llä on rajoitetut tekstin muotoiluominaisuudet verrattuna julkaisuohjelmien ominaisuuksiin, varsinkin kun julkaistaan ​​monimutkaisia ​​elementtejä sisältävää tekstiä.

Niitä ei ole vieläkään niin kätevä HTML-editorit, joten voit tehdä ilman tekstieditoria ja tunnisteiden manuaalista sijoittamista. Tämä hankaloittaa kielen kanssa työskentelyä ja tekee heidän hallitsevan toimintoja, jotka ovat heille täysin epätavallisia.

Analysoimalla HTML-kielen ominaisuuksia ja arvioimalla sen kehitystasoa voimme tulla siihen tulokseen, että tulevina vuosina on odotettavissa siihen kehittyneempiä modifikaatioita, uusia kieliä ja sovelluspaketteja web-sivujen parissa työskentelemiseen.

Dynaamiset ja staattiset HTML-asiakirjat

HTML-dokumentteja on kahdenlaisia ​​- staattisia ja dynaamisia. Staattiset asiakirjat tallennetaan tiedostoihin tiedostojärjestelmä, jota verkkopalvelin tai selain käyttää katseltaessa paikalliset tiedostot. Kun lähetät tietoja verkkopalvelimelle, voit käyttää dynaamisia asiakirjoja - niitä, jotka eivät ole pysyvästi olemassa tiedostoina, mutta jotka luodaan asiakkaan pyynnöstä. Lisäksi loppukäyttäjälle ei ole väliä, esitetäänkö asiakirjat dynaamisesti vai staattisesti.

Dynaamisen HTML-dokumentin luomiseen tarvitaan erityisesti kirjoitettu ohjelma web-palvelimen määrittelemien sääntöjen mukaisesti. Kun suunnittelet tiedon sijoittamista web-palvelimelle, esim oikea määritelmä kaikentyyppisten asiakirjojen käytön yhteydessä on otettava huomioon tietojen päivitysaste, niiden määrä ja kiertotiheys.

Dynaaminen menetelmä määrittää tietojen tallennuksen formalisoidussa muodossa, esimerkiksi tietokantaan.

Jos tiedot tallennetaan formalisoidussa muodossa, staattiset dokumentit luodaan dokumenttipohjien avulla, joihin on tehty muutoksia. Staattisten asiakirjojen luomiseen voit käyttää mitä tahansa tietokannan hallintajärjestelmässä (DBMS) saatavilla olevia raportointityökaluja, joilla tiedot käsitellään ja muotoillaan.

HTML:n näkökulmat

HTML-kielestä ei tule uusia versioita, mutta niitä on lisää HTML-kehitys nimeltään XHTML (Extensible Hypertext Markup Language). Vaikka XHTML on ominaisuuksiltaan verrattavissa HTML:ään, sillä on tiukemmat syntaksivaatimukset. Kuten HTML, XHTML on SGML-kielen osajoukko, mutta XHTML, toisin kuin edeltäjänsä, noudattaa XML-spesifikaatiota. XHTML 1.0 on hyväksytty konsortion suosituksena World Wide Web(W3C) 26. tammikuuta 2000. On kuitenkin otettava huomioon yksi vakava yksityiskohta - tässä muodossa se luotiin suuri määrä tietoresursseja, että verkkoselaimet "ymmärtävät" ne pitkään ja käyttävät niitä alkuperäisessä muodossaan. Lisäksi kaikkia uusia formaatteja kehitetään (ja kehitetään jo - esimerkiksi XML) HTML-tekniikoiden tuella.

Tapamme työskennellä muuttuvat, ja niin ovat myös sisällön käyttötavat. HTML-kieli luotiin alun perin alustasta riippumattomaksi kieleksi. Uusia tekniikoita käytetään lähes kaikkialla, ja melko pian World Wide Web -tila ei ole enää vain työpöytäkäyttäjien omaisuutta. henkilökohtaiset tietokoneet, jotkut käyttäjät käyttävät jo aktiivisesti ääniselaimet sokeille tai Broglie-aakkostoa käyttäville selaimille sisältö ei usein näy tietokoneen näytöllä, vaan televisiossa, kun käytetään digisovittimia, joilla on pääsy verkkoon tai teletyyppiin, tai erilaisten hakulaitteiden ja muiden yksivärisillä näytöillä.

Vuonna 1989 hyperteksti edusti lupaavaa uutta tekniikkaa, jolla oli toisaalta suhteellisen paljon toteutuksia, ja toisaalta hypertekstijärjestelmistä yritettiin rakentaa muodollisia malleja, jotka olivat luonteeltaan enemmän kuvailevia ja jotka saivat inspiraationsa relaatiolähestymistavan menestys datan kuvaamisessa.

HTML on kieli hypertekstimerkintä, käytetään asiakirjojen koodaamiseen. HTML-kieli on joukko komentoja, joiden mukaan selain näyttää asiakirjan sisällön HTML-komentoja ei näytetä. HTML-kieli toteuttaa hypertekstin linkitysmekanismin, jonka avulla yksi asiakirja voidaan linkittää muihin. Nämä asiakirjat voivat sijaita samalla palvelimella kuin sivu, jolta ne on linkitetty, tai ne voivat sijaita eri palvelimella.

HTML-idea on esimerkki erittäin onnistuneesta ratkaisusta hypertekstijärjestelmän rakentamiseen erityisellä näytönohjaustyökalulla.

Kontekstuaaliset hypertekstilinkit tunnistettiin tehokkaimmaksi hypertekstin organisointimuodoksi, ja lisäksi tunnistettiin jako linkkeihin, jotka liittyvät koko asiakirjaan ja sen yksittäisiin osiin.


Kaikilla HTML-dokumenteilla on sama rakenne, joka määritellään kiinteällä rakennetunnistejoukolla. HTML-dokumentin tulee aina alkaa tunnisteella< HTML >ja lopeta sopivaan sulkevaan tagiin (). Asiakirjassa on kaksi pääosiota: otsikot ja asiakirjan runko tässä järjestyksessä. Otsikkoosio sisältää tietoja, jotka kuvaavat asiakirjaa kokonaisuutena ja joita rajoittavat tunnisteet<НЕАD>Ja. Erityisesti otsikkoosion tulee sisältää asiakirjan yleinen otsikko, joka on erotettu pariliitoksella<ТITLE>.

). Rakennetunnisteiden jättämistä pois HTML-dokumenttia luotaessa ei kuitenkaan suositella. yksinkertaisin oikea asiakirja HTML-koodi, joka sisältää kaikki rakenteen määrittävät tagit, voi näyttää tältä:

< TITLE >Asiakirjan otsikko< /TITLE >

Asiakirjan teksti

HTML-elementtejä.

Parillisille tunnisteille laajuuden määrittää avaus- ja sulkemistunnisteiden välissä oleva asiakirjan osa. Tätä asiakirjan osaa pidetään HTML-kielen osana. Joten voimme puhua "BODY-elementistä", joka sisältää tunnisteen, asiakirjan runko ja lopputunniste. Koko HTML-dokumentti. voidaan ajatella "HTML-elementtinä". Parittomia tunnisteita varten elementti on sama kuin tagi, joka määrittää sen.

Useimmat HTML-kielen elementit. kuvaa osia dokumentin sisällöstä ja sijoitetaan tunnisteiden väliin . Ja, eli BODY-rakenneelementin sisällä. Tällaiset elementit on jaettu lohkoihin ja tekstiin. Lohkoelementit viittaavat kappaletason tekstiin. Tekstielementit kuvaavat yksittäisten lauseiden ja jopa pienempien tekstiosien ominaisuuksia.

Nyt voimme muotoilla säännöt sisäkkäisille elementeille.

Elementit eivät saa mennä päällekkäin. Toisin sanoen, jos alkutunniste sijaitsee elementin sisällä, niin vastaavan päättävän tagin on sijaittava saman elementin sisällä.

Lohkoelementit voivat sisältää sisäkkäisiä lohko- ja tekstielementtejä.

Tekstielementit voivat sisältää sisäkkäisiä tekstielementtejä.

Tekstielementit eivät voi sisältää sisäkkäisiä lohkoelementtejä.

Toiminnalliset lohkoelementit.

Useimmissa asiakirjoissa tärkein toiminnallisia elementtejä ovat otsikoita ja kappaleita. HTML-kieli. tukee kuutta otsikkotasoa. Ne määritetään käyttämällä parillisia tunnisteita kohteesta<Н1>to<Н6>. Kun Web-asiakirjat näytetään, ne näytetään tällä menetelmällä; tag (asiakirja tietokoneen näytöllä, nämä elementit näytetään erikokoisilla fonteilla.

Tavalliset kappaleet määritetään käyttämällä tunnistepari <Р>. HTML-kieli. ei sisällä työkaluja luomiseen kappaleen sisennys("punainen viiva"), joten kun ne näytetään tietokoneen näytöllä, kappaleet erotetaan tyhjällä rivillä. Sulkeva tagipidetään valinnaisena. Ymmärretään, että se tulee ennen tunnistetta, joka määrittää asiakirjan seuraavan kappaleen alun. Esimerkiksi:

Otsikko

<Р>Ensimmäinen kappale<Р>Toinen kappale

Toisen tason otsikko

Seurauksena kappaleen määrittelevän erikoistunnisteen olemassaolosta on se, että tavallinen rivin loppumerkki syötetään painamalla ENTER-näppäimet, ei riitä kappaleen sisennyksen luomiseen. HTML-kieli. käsittelee rivin lopun merkkejä ja välilyöntejä erityisellä tavalla. Mikä tahansa sekvenssi; koostuu vain välilyönneistä ja rivin lopun merkeistä, sitä käsitellään yhtenä välilyöntinä, kun asiakirja näytetään. Tämä tarkoittaa erityisesti sitä, että rivin lopun merkki ei edes johda uudelle riville (tähän tarkoitukseen käytetään parittoman tagin määrittelemää tekstielementtiä
.

Vaakaviivainta voidaan käyttää myös kappaleen erottimena. Tämän elementin määrittää pariton tagi


. Kun asiakirja näytetään näytöllä, viivain erottaa tekstin osat toisistaan. Sen pituus ja paksuus määritetään tunnistemääritteillä
.


Tämä tunniste luo 10 pikseliä leveän vaakasuuntaisen viivaimen, joka vie puolet ikkunan leveydestä ja on sijoitettu oikealle.


Verkkosivustojen luominen on yksi laajimmista käytettävissä olevia mahdollisuuksia moderni Internet-teollisuus. Varsinainen verkkosivustojen luominen ei periaatteessa ole paljon vaikeampi luoda henkilökohtainen sähköiset postilaatikot ja sähköiset käyntikortit.

Verkkosivuston luomiseen tarvitset ensinnäkin Internetiin yhdistetyn palvelimen, jolle voit sijoittaa tarvittavat hypertekstit. Lisäksi on tarpeen rekisteröidä nimi saiga valittua palvelinta palvelevan palveluntarjoajan kanssa.

Internetistä löydät palveluntarjoajia, jotka tarjoavat ilmainen avaus sivustoja palvelimillaan. Ilmaisia ​​sivustoja voidaan avata kotimaisilla palvelimilla narod.ru, boom.ru, hotmail.ru ja ulkomaisilla palvelimilla, esimerkiksi geocities.com, tripod.com.

Näillä palvelimilla voit rekisteröidä verkkotunnuksia, kuten:

<имя>. narod.ru

nimi>.boom.ru,

Esimerkkejä rekisteröidyistä verkkotunnuksista:

wdu.da.ru - sähköisen yliopiston verkkosivusto;

wduniv.newmail.ru - hajautetun yliopiston verkkosivusto.

Kun olet rekisteröinyt sivuston verkkotunnuksen, voit isännöidä siihen hypertekstejä. Hypertekstejä sijoitetaan sivustolle erityisillä ohjelmilla, joiden avulla voit luoda, muokata, kerätä ja kopioida monenlaisia ​​hypertekstejä. Välittömästi ensimmäisen (pää) julkaisemisen jälkeen hypertekstisivu sen tiedot voidaan lukea selaimella missä tahansa maassa mistä tahansa Internetiin yhdistetystä tietokoneesta. Voit tehdä tämän kirjoittamalla Internet-sivuston osoitteen selainikkunaan. Esimerkiksi: http://bak.boom.ru

Kaikkien lähetettyjen tiedostojen tulee olla hypertekstejä, kirjoitettuja HTML-muodossa ja niissä on oltava lomakkeen tunnisteet<имя>.html.

HTML on hypertekstikuvauskieli.

Rakenteeltaan hyperteksti on tekstiä, jossa on linkkejä muihin hyperteksteihin tämä palvelin, tai muilla palvelimilla. Kun napsautat tällaista linkkiä, selain lataa automaattisesti hypertekstisivun tietokoneen näytölle riippumatta siitä, millä palvelimella se on ja missä maassa se sijaitsee.

Käyttämällä näitä Internetin työkaluja ja ohjelmia voidaan luoda monenlaisia ​​tietosivustoja ja järjestelmiä - henkilökohtaisia ​​sivustoja, merkkisivustoja, sähköisiä sanomalehtiä, aikakauslehdet, e-kirjoja, tietosanakirjoja ja sähköiset arkistot ja kirjastot.

Sivustojen ero on tiedon määrä, rakenne ja päivitysmenettelyt. Yleisesti ottaen Internet-sivustoille, kuten kaikille organisaatioille, voimme puhua niiden luomisen, kehittämisen, modernisoinnin ja likvidoinnin elinkaaresta.

Tietojen määrän määräävät omistajat - ihmiset tai organisaatiot, jotka loivat sivustoja ja julkaisevat tietonsa niille. Verkkosivustoilla olevan tiedon määrä voi vaihdella useista kilotavuista useisiin gigatavuihin (miljooniin kilotavuihin).

Sivuston rakenne voi olla hyvin monipuolinen. Yksinkertaisin rakenne- Tämä on pääsivu, jolla on linkkejä tekstiin. Nämä linkit voivat olla pääsivun tekstissä tai korostettuina sisällysluettelossa sen alussa.

Sivuston jokaiselle sivulle voidaan antaa otsikko, joka tulee näkyviin näytön yläriville, kun selain lataa sivuston.

Lisäksi sisään kotisivu voit määrittää avainsanaluettelon hakukoneille.

Hakukoneet tarkistavat viikoittain kaikki Internetin palvelimet ja tallentavat kaikkien löydettyjen sivustojen osoitteet ja hypertekstit sekä niissä korostetut avainsanat. Näistä syistä viimeistään viikkoa myöhemmin kaikki Internetissä julkaistut tiedot löytyvät niissä olevilla avainsanoilla.

UKRAINAN OPETUS- JA TIETEMINISTERIÖ

SKHIDNOUKRAINIAN KANSALLINEN YLIOPISTO

Nimetty Volodymyr Dahlin mukaan

Tietojenkäsittelytieteen laitos

Kurin mukaan

Tietokonesuunnittelu ja multimedia

OpiskelijaBoldakova I.V.

1. Johdanto

3.1 HTML-editorit

Kirjallisuus

1. Johdanto

World Wide Web - maailmanlaajuinen tietokoneverkko sisältää nykyään miljoonia sivustoja, jotka sisältävät kaikenlaista tietoa. Ihmiset käyttävät näitä tietoja Internet-tekniikan avulla. WWW:ssä liikkumiseen käytetään erityisiä ohjelmia - Web-selaimia, jotka helpottavat huomattavasti WWW:n laajuuksia. Kaikki Web-selaimen tiedot näkyvät Web-sivujen muodossa.

Multimediatekniikkaa tukevat web-sivut yhdistyvät erilaisia ​​tyyppejä tiedot: teksti, grafiikka, ääni, animaatio ja video. Sen menestys Internetissä riippuu pitkälti siitä, kuinka hyvin ja kauniisti tietty Web-sivu on tehty.

Käyttäjä vierailee mielellään niillä verkkosivuilla, jotka ovat tyylikkäästi muotoiltuja, joita ei kuormita liiallisella grafiikalla ja animaatioilla, jotka latautuvat nopeasti ja näkyvät oikein Web-selainikkunassa.

Web-sivun luominen ei ole helppoa, mutta luultavasti jokainen haluaisi kokeilla itseään suunnittelijana. Ja minä sisään tässä tapauksessa, en ole poikkeus, siksi valitsin tämän aiheen kurssityökseni.

Yritin esseessäni ymmärtää, mitä sinun tulee tietää ja osata tehdä web-sivun luomiseen, mikä ohjelmisto on työkalu verkkosivujen luomiseen ja kuinka sitä käytetään tehokkaasti.

Myös tässä työssä kävin läpi web-sivujen ohjelmointikielen perusteet - HTML, joka on yleisesti hyväksytty WWW-standardi. Tämä antaa meille mahdollisuuden tutustua Web-sivun rakenteeseen ja sen tekniikoihin. oikea muotoilu. Tarkastelemme myös verkkosivuston luomista CMS Joomlalla.

2. Harkitse hypertekstin merkintäkieltä HTML

Web-sivuja voi olla missä tahansa muodossa, mutta se hyväksytään standardina Hyper Text Markup Language- hypertekstin merkintäkieli, joka on suunniteltu luomaan muotoiltua tekstiä, jossa on runsaasti kuvia, ääntä, animaatioita, videoleikkeitä ja hypertekstilinkkejä muihin asiakirjoihin.

Voit työskennellä verkossa tuntematta HTML-kieltä, koska HTML-tekstejä voidaan luoda erilaisilla erikoistoimittajat ja muuntimet. Mutta suoraan HTML-kielellä kirjoittaminen ei ole vaikeaa. Se voi jopa olla helpompaa kuin HTML-editorin tai -muuntimen oppiminen, sillä ne ovat usein toiminnaltaan rajallisia, bugisia tai tuottavat huonoa HTML-koodia, joka ei toimi kaikilla alustoilla.

HTML-kieltä on useita eri makuja ja se kehittyy edelleen, mutta HTML-rakenteita käytetään todennäköisesti jatkossakin. Oppimalla HTML:ää ja ymmärtämällä sitä syvemmin, luomalla dokumentin HTML:n oppimisen alussa ja laajentamalla sitä mahdollisimman paljon, pystymme luomaan web-sivuja, joita voidaan tarkastella monilla verkkoselaimilla niin nyt kuin tulevaisuudessakin. Tämä ei sulje pois mahdollisuutta käyttää muita menetelmiä, kuten Operan tarjoamaa edistynyttä menetelmää, Google Chrome, Internet Explorer tai muut selaimet.

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 kaikki selaimet.

Koska HTML-dokumentit on kirjoitettu ASCI I -muodossa, mitä tahansa tekstieditoria voidaan käyttää niiden luomiseen.

Tyypillisesti HTML-dokumentti on tiedosto, jonka tunniste on .html tai . htm, jossa teksti on merkitty HTML-tageilla (englanniksi tag - erityiset sisäänrakennetut ohjeet). HTML määrittelee tunnisteiden syntaksin ja sijoittelun, jonka mukaan selain näyttää Web-asiakirjan sisällön. Web-selain ei näytä itse tunnisteiden tekstiä.

Kaikki tunnisteet alkavat "<" и заканчиваются символом ">". Yleensä tunnistepari - aloitus (avaa) ja loppu (sulkeva) tagi (samanlainen kuin matematiikan avaus- ja sulkemissulut), joiden väliin merkintätiedot sijoitetaan:

Tiedot

Tässä aloitustunniste on tagi

Ja viimeiset -

. Lopputunniste eroaa aloitustunnisteesta vain siinä, että siinä on sulut ennen tekstiä<>siellä on symboli" / " (vinoviiva).

HTML-dokumenttia lukeva selain näyttää sen ikkunassa, jossa käytetään HTML-tunnisterakennetta. Jokaisessa HTML-dokumentissa on oltava kolme pääosaa:

A) HTML-ilmoitus;

B) Otsikkoosa;

C) Asiakirjan runko .

A) HTML-ilmoitus

Ja. Näiden tunnisteiden pari kertoo katsojalle (selaimelle), että niiden välissä on HTML-dokumentti ja asiakirjan ensimmäisen tunnisteen tulee olla tunniste. (asiakirjan alussa) ja viimeinen -(asiakirjan lopussa).

B) Otsikkoosa.

Ja. Näiden tunnisteiden välissä on tietoja asiakirjasta (otsikko, hakusanat, kuvaus jne.). Tärkeintä on kuitenkin asiakirjan otsikko, jonka näemme selainikkunan ylärivillä ja "Suosikit (Kirjanmerkki)" -luetteloissa. Erityiset hakukoneiden hämähäkkiohjelmat käyttävät asiakirjan otsikkoa tietokantojensa rakentamiseen. Jotta HTML-dokumentille voidaan antaa otsikko, teksti sijoitetaan tunnisteiden väliin Ja.

Ensimmäinen sivuni

C) Asiakirjan runko.

Asiakirjan kolmas pääosa on sen runko. Se seuraa välittömästi otsikkoa ja sijaitsee tunnisteiden välissä Ja. Ensimmäisen tulee olla heti tagin jälkeen, ja toinen on ennen -tunnistetta. HTML-dokumentin runko on paikka, johon kirjoittaja sijoittaa HTML:llä muotoiltuja tietoja.

Ensimmäinen sivuni ..........

Nyt voimme kirjoittaa sivullemme HTML-koodin:

Ensimmäinen sivuni Sivuni ovat täällä!

BODY-osiossa selain jättää huomioimatta kaikki välilehdet ja rivinvaihdot, eivätkä ne vaikuta sivun näyttöön millään tavalla. Siksi rivinsyöttö lähdeteksti HTML-dokumentti ei käynnisty uusi rivi selaimen näyttämässä tekstissä, jos erityisiä tunnisteita ei ole. Tämä sääntö on erittäin tärkeä muistaa ja älä unohda laittaa rivejä erottavia tunnisteita, muuten tekstissä ei ole kappaleita ja siitä tulee lukukelvoton.

Aloita uusi rivi käyttämällä tunnistetta
(lyhennetty englanninkielisestä taukosta - keskeytys). Tämä tunniste saa selaimen näyttämään lisää tekstiä seuraavan rivin alusta. Siihen ei ole käytetty sulkemistunnistetta. Se on kätevää, jos haluat kirjoittaa uudelta riviltä jossain vaiheessa aloittamatta uutta kappaletta, esimerkiksi runossa. Käyttämällä sitä uudelleen voit lisätä yhden tai useamman tyhjän rivin siirtämällä sivun seuraavaa osaa alaspäin.

Jatkuvaa tekstiä ilman aukkoja ei ole kovin helppo lukea, se on hankalaa selailla ja löytää oikeita paikkoja. Kappaleihin jaettu teksti havaitaan paljon nopeammin. Tunnistetta käytetään uuden kappaleen aloittamiseen

(Englanninkielinen kappale - kappale). Tämä tagi lisää uuden rivin aloittamisen lisäksi yhden tyhjän rivin. Mutta toistuva toisto

Toisin kuin
, ei johda useiden tyhjien rivien ilmestymiseen, silti on sama yksi tyhjä rivi.

Tagin hakasulkeisiin voidaan sijoittaa sen nimen lisäksi myös attribuutteja. Ne erotetaan nimestä ja toisistaan ​​välilyönnillä (yksi tai useampi) ja kirjoitetaan muotoon attribuutin_nimi ="merkitys". Jos arvo ei sisällä välilyöntejä, lainausmerkit voidaan jättää pois, mutta tätä ei suositella. Tag

Saattaa sisältää ALIGN-attribuutin, joka määrittää kappaleiden tasauksen. Oletuksena kappale tasataan vasemmalle ALIGN="left". Myös kohdistus oikealle ALIGN="oikealle" ja keskikohdistus ALIGN="keskelle" ovat myös mahdollisia. Kun käytät attribuutteja, käytä lopputunnistetta muotoillun tekstin jälkeen

. Jos sitä ei ole, niin uusi tunniste

Tarkoittaa edellisen sulkemista, vastaavasti sisäkkäin

Mahdotonta. On myös mahdollista keskittää tekstiä tunnisteen avulla

.

Nyt voimme laittaa verkkosivullemme tekstiä eri tasauksilla:

Ensimmäinen sivuni

Omani tulee olemaan täällä henkilökohtaiset sivut!

Niistä löydät: - tarina minusta ja harrastuksistani; - minun valokuvani.

Yhdeltä sivultani se on mahdollista
lähetä minulle sähköpostia.

3. Työkalut web-sivujen luomiseen

3.1 HTML-editorit

Jokainen valitsee oman työkalunsa web-sivujen luomiseen. Tämä voi olla MS FrontPage tai Macromedia DreamWeaver, Allaire HomeSite tai 1st Page. Ja jotkut ihmiset käyttävät yksinkertaista tekstieditoria, kuten Muistio.

Tekstieditoreja voidaan käyttää vain pienten sivujen luomiseen, koska niillä on monia haittoja: projekteja ei tueta, tekstiä ei "korosteta", yleensä se on erittäin hankalaa työskennellä.

MS FrontPagen suurin haittapuoli on, että se tuottaa erittäin suurta HTML-koodia (liikaa turhaa tavaraa), joten sivut osoittautuvat suuriksi, mikä vaikuttaa latausnopeuteen. Lisäksi, kun luot Web-sivuja tässä editorissa, näet yhden asian, mutta selainikkunassa näet jotain aivan muuta. Sivut osoittautuvat hieman vinoiksi, joten laadukkaiden web-sivujen luomiseksi on suositeltavaa käyttää alla selostettavia paketteja.

Aloitamme suositulla Macromedia DreamWeaverilla. Macromediaa pidetään johtavana verkkosivustojen luomiseen tarkoitettujen ohjelmistojen valmistajana sekä tämän alan suunnannäyttäjänä.

DreamWeaver 3.0

Mutta DreamWeaver on useita askeleita edellä muita WYSIWYG-editoreja, pääasiassa siksi, että se tuottaa erittäin puhdasta HTML-koodia. DreamWeaverin avulla voit poistaa toistuvan työn sivuja luotaessa (esimerkiksi tekstin asettelu) käyttämällä valinnat "tallenna komentosarja" ( tallennat tuottamiesi komentojen sarjan ja painat sitten esimerkiksi CTRL+P, jolloin DreamWeaver toistaa kaiken samassa järjestyksessä.

Kotisivu 4.0

Seuraava editori on HomeSite 4 - sivujen luomiseen manuaalisesti, ts. HTML-tutkijoille. Saat täyden hallinnan HTML-koodista, ja voit optimoida sivusi jollekin kolmesta suositut selaimet(MSIE, Google Chrome, Opera).

HomeSite sisältää kaksi päätilaa: Muokkaa ja Suunnittele. Suunnittelutila on eräänlainen WYSIWYG-editori, joka tuottaa HTML-koodia, ja jos lataat jonkun muun HTML-koodin, HomeSite kirjoittaa kaiken uudelleen omalla tavallaan.

Toinen HomeSiten erottuva piirre on sen "liimaus" Dreamweaverilla. HomeSitessa on "Dreamweaver"-painike, ja se on myös vakiona. DreamWeaverilla on kuitenkin myös mahdollisuus yhdistää HomeSite editoriksi HTML-koodin muokkaamista varten.

Yksi uusimmista HTML-editoreista on EVR Soft 1st Page v2.

Hänen iskulauseensa on "Luo 1. luokan verkkosivustoja!" ("Rakenna upeita verkkosivustoja!"). Editorissa on useita tiloja - Normal, Easy, Advanced/Expert ja Hardcore, eli voit valita tasosi ja siirtyä lopulta korkeammalle. Toinen ominaisuus on melko suuri kokoelma JavaScript- ja DHTML-skriptejä. Kaikki tämä on jaettu melko kätevästi luokkiin.

3.2 Graafiset editorit

Grafiikan luominen ja optimointi on monimutkainen ja oikukas tehtävä. Tietenkin on mahdollista luoda Web-sivu ilman grafiikkaa - käyttämällä fontteja, skriptejä ja tyylisivuja (CSS) - ja se on kaunis ja tyylikäs. Mutta asiakirjan lopullinen ulkoasu riippuu useista eri tekijöistä, kuten: selainikkunan leveydestä, selaimen esiasetuksista, oletuskirjasimen koosta, fontin nimestä ja väristä. Lisäksi kaikki selaimet eivät tue kaikkia komentosarjoja ja tyylejä. Jos grafiikkaa käytetään, sivusi vierailija näkee sen juuri sellaisena kuin teit sen ja näkee sen.

Verkkografiikan kanssa työskentelyn suurin vaikeus on, että Internet-kanavien kaistanleveys on useimmissa tapauksissa erittäin alhainen ja kohtaat välittömästi ongelmia - kuinka tehdä graafinen tiedosto volyymiltaan pieni, mutta hyvä laatu, mitä ohjelmia ja tekniikoita käytetään optimoinnissa.

Tälle on omistettu osio vektori- ja rasterigrafiikkaeditoreista, jotka ovat tehokkaita kuvankäsittelytyökaluja osaavissa käsissä.

Ennen kuin harkitset vektori- ja rasterigrafiikkaeditoreja, sinun tulee ymmärtää ero kuvan vektori- ja rasteriesityksen välillä.

Rastergrafiikka on ruudukko (rasteri), jonka soluja kutsutaan pikseleiksi. Jokaisella rasterikuvan pikselillä on tiukasti määritelty sijainti ja väri, joten ohjelma esittää minkä tahansa kohteen värillisten pikselien joukona. Tämä tarkoittaa, että käyttäjä rasterikuvien kanssa työskennellessään ei käsittele tiettyjä objekteja, vaan niitä muodostavia pikseliryhmiä.

Rasterikuvat tarjoavat suuren tarkkuuden väri- ja puolisävyjen siirtämisessä sekä korkeat kuvan yksityiskohdat, joten ne ovat optimaalinen esitystapa sävykuvia, kuten skannatut valokuvat.

Aina käytetty rasterigrafiikassa kiinteä määrä pikseliä, ts. Rasterikuvan laatu riippuu suoraan laitteen resoluutiosta. Tämä tarkoittaa, että mikä tahansa kuvan muutos (kierto, suurennus jne.) johtaa kuvan jatkuvaan vääristymiseen ja objektien rajat ovat epätasaisia.

Vektorikuvat muodostetaan matemaattisesti kuvattujen, vektoreiksi kutsuttujen kuvioiden pohjalta ja kuvan ulkoasu määräytyy vektoreiden parametrien mukaan. Toisin sanoen vektorigrafiikka koostuu käyristä, joilla on koordinaatit, värit ja muut parametrit, sekä suljetuista alueista, jotka on täytetty tietyllä värillä. Näiden alueiden rajoja kuvataan myös käyrien avulla. Vektorikuvatiedosto sisältää käyrien koordinaatit ja parametrit.

Tulosten käsittely vektorikuvat eivät riipu laitteiden resoluutiosta, joten voit mielivaltaisesti muuttaa niiden parametreja (koko, väri, muoto jne.) - laatu ei heikkene. Vektorigrafiikkaa käytetään luotaessa digitaalisia objekteja käyttäen pieniä pistekokoja (fonttikokoja) tai objekteja, kuten logoja, jotka vaativat teräviä ääriviivoja ja rajoittamattoman skaalautuvuuden.

Grafiikkapaketit (editorit) jaetaan myös kahteen tyyppiin: rasteri ja vektori. Katsotaanpa nyt niistä suosituimpia.

A) Rasterigrafiikkaeditorit

Microsoft Paint on yksinkertainen (tai paremmin sanottuna yksinkertaisin) editori, joka sisältyy käyttöjärjestelmien vakiopakettiin. Microsoftin järjestelmät. Siinä on joukko yksinkertaisia ​​toimintoja (sivellin, kynä, pyyhekumi jne.), joiden avulla voit luoda yksinkertaisia ​​kuvia. Valitettavasti se ei käytännössä sovellu grafiikan käsittelyyn. Oikealla näkyvä kuva on suurin, mitä tämä editori voi tehdä.

Adobe Photoshop - tänään tämä on tehokkain paketti ammattimainen käsittely rasterigrafiikka. Tämä on kokonaisuus, jossa on lukuisia mahdollisuuksia muokata rasterikuvaa, jossa on valtava valikoima erilaisia ​​suodattimia ja tehosteita, ja siihen on mahdollista liittää itsenäisten valmistajien työkaluja.

Paketissa on esimerkiksi työkaluja vaurioituneiden kuvien restaurointiin, kuvien retusointiin tai upeimpien kollaasien luomiseen, mitä mielikuvituksemme voi kuvitella. Kaiken kaikkiaan tämän paketin potentiaali on todella valtava. Versiosta 5.5 alkaen paketti sisältää ohjelman Adobe ImageReady, tarjoamalla valtavia mahdollisuuksia WEB-grafiikkakäsittelyssä (kuvan optimointi, luominen animoidut gifit, kuvien "leikkaaminen" pienemmiksi jne.). Adobe Photoshop -kehittäjien motto - "Mielesi kamera" - ei tarkoita vain teknistä huippuosaamista, vaan myös täydellistä luovuuden vapautta, johon tämän ohjelman kanssa työskentelevä henkilö on yksinkertaisesti tuomittu.

PhotoPaint- toinen yhtä kuuluisa graafinen editori (paketista Corel Draw) rasterigrafiikan käsittelyyn, joka kilpailee Adobe Photoshopin kanssa. Siinä on myös kaikki tarvittavat työkalut grafiikan käsittelyyn, erilaiset suodattimet, tekstuurit. Ainoa ero on helppokäyttöisyydessä, käyttöliittymässä ja suodatinsovelluksen nopeudessa - sovellus on hieman hitaampi.

Taidemaalari- editori tarjoaa erinomaiset mahdollisuudet emuloida oikeita piirtotyökaluja: grafiittia, liitua, öljyä jne. Sen avulla voit myös matkia materiaalien pintakuvioita, maalausta ja luoda animaatioita. Erittäin kätevä kehittämiseen taustakuvia tai maalaustyylisiä verkkosivuja. Käyttämällä tätä ohjelmaa tunnet olevasi todellinen taiteilija.

Siellä on myös useita toimittajia ( Microsoft Valokuvaeditori,Microsoft PhotoDRAW), joka mahdollistaa myös yksinkertaisimpien tehtävien toteuttamisen, mutta ei täytä ammattilaisten tarpeita.

B) Vektorigrafiikkaeditorit

Adobe Illustrator- Paketin avulla voit luoda, käsitellä ja muokata vektorigrafiikkaa. Teholtaan se on vastaava

rasterieditori Adobe Photoshop: sillä on samanlainen käyttöliittymä, voit yhdistää erilaisia ​​suodattimia ja tehosteita, ymmärtää monia graafisia formaatteja, jopa kuten. cdr (Corel Draw) ja. swf (Flash).

CorelDraw- Varmasti niin kuuluisa grafiikkapaketti ei voinut tulla ilman käsittelyvälineitä vektorigrafiikkaa. Paketti on lähes yhtä tehokas kuin näytönohjaimet Adoben editorit Photoshop ja Adobe Illustrator. Tämä paketti sisältää vektorigrafiikkakäsittelyn lisäksi rasterigrafiikkaprosessorin (Photo Paint), kuvan jäljittimen, fonttieditorin, tekstuurin valmistelun ja viivakoodin luomisen sekä valtavat kuvakokoelmat (CorelGallery).

Adobe Streamline- toinen Adobe-tuote, joka on suunniteltu rasterigrafiikan jäljittämiseen (kääntämiseen) vektorigrafiikaksi. Tämä on pieni mutta erittäin hyödyllinen ja tehokas tuote. Erityisen hyödyllinen, jos luot Web-sivuja käyttämällä vektorigrafiikkaa, kuten Flash-tekniikkaa.

4. Verkkosivuston luominen CMS Joomla 1.5.7:llä

Siirrymme sujuvasti periaatteen mukaisesti yksinkertaisesta monimutkaiseen staattiset sivut WWW dynaamiseen. Tämän saavuttamiseksi tarvitsemme tietoa web-kielistä PHP, Jscript, Perl, jQuery ja ainakin rakennekieli MySQL-kyselyt. Ei hätää, pari vuotta ja olet ammattilainen, joka osaa tehdä sellaisia ​​monitoimisia sivustoja, joissa sivut syntyvät lennossa, joissa on tietokanta foorumiohjelmista, kirjautumisista, salasanoista, tunnistamisesta, autentikaatiosta, yhdistävistä animaatioista ja paljon muuta.

Mutta dynaamisen monikäyttöisen verkkosivuston luomiseen ei tarvitse osata kaikkia kieliä. Minulla oli tarpeeksi tietoa HTML:stä, SCC:stä, PHP:stä, 3Ds Maxista, Photoshopista ja SMC Joomlasta.

Joomla on PHP:llä ja JavaScriptillä kirjoitettu sisällönhallintajärjestelmä, joka käyttää tallennustilana MySQL-tietokantaa. Onko ilmaisia ​​ohjelmistoja jaettu alla GNU-lisenssi GPL.

Pääominaisuudet:

1. Toimintoja voidaan laajentaa lisämoduuleilla (laajennukset, lisäosat).

2. Suojausmoduuli käyttäjien ja järjestelmänvalvojien monitasoiseen todentamiseen.

3. Mallijärjestelmän ansiosta se on helppo vaihtaa ulkonäkö sivusto.

4. Mukautettavat moduuliasettelut, mukaan lukien vasen, oikea ja keskivalikkolohkot.

5. Järjestelmän etuja ovat se, että voit kirjoittaa kaikki moduulit, komponentit, lisäosat, mallit itse, sijoittaa ne strukturoituun laajennushakemistoon tai muokata niitä olemassa oleva laajennus oman harkintasi mukaan.

Voit työskennellä Joomlan kanssa Internetin isännöintipalvelimella (lisäkustannukset, ja paljon riippuu Internetin nopeudesta). Työskentelen mieluummin paikallisella palvelimella. Tätä varten valitsin Apache/2.2.4 (Win32) mod_ssl/2.2.4 OpenSSL/0.9.8d PHP/5.2.4 Server 127.0.0.1 portilla 80.

Eli asennettu paikallinen palvelin. Luo localhost/home/www/-hakemistoon kansio, johon asetamme itse Joomlan. Haluaisin huomauttaa, että Joomla ei toimi oikein PHP5.3.1:ssä. FireBoard- ja Kunena-foorumien osat tuottavat jatkuvasti virheitä sivustolle, sinun täytyy muokata php-tiedostoa. ini ja poista virheilmoitukset käytöstä, koska itse toiminto lupaa sivustolle odottamattomia olosuhteita. Tästä syystä suosittelen valitsemaan PHP versio 5.2.4, vakaa toiminta kaikille laajennuksille, moduuleille ja komponenteille. Kun olet asentanut Joomlan selaimen kautta, luo admin-käyttäjä MySQL:ssä ja käytä hänen kirjautumistaan ​​ja salasanaansa siirtyäksesi hallintapaneeliin. Seuraavaksi sinun on valittava sivuston malli. Ensi silmäyksellä näyttää siltä, ​​​​että se on erittäin helppoa, mutta syvemmälle kaivamalla olet vakuuttunut, että 80% ajasta käytetään tämän mallin modernisointiin. Siksi suosittelen valitsemaan tarpeisiisi sopivimman mallin, unohtamatta näytettäviä moduuleja. Seuraavaksi yhdistämme kaikki sivuston toiminnot: rekisteröinti, foorumi, diaesitykset, bannerit, kilpailutiedostot, online-video, ääni, editointi, kaikki näytettävät sivut. Työskentelemme pääasiassa Index-tiedoston kanssa. php ja malli. css ja tietysti konfiguroimme itsellemme kaikki liitetyt laajennukset, joita on noin 6000 Joomlalle. Seuraavaksi tulee paras osa - verkkosivuston suunnittelu. Rasteriohjelmiston Photoshop ja 3Ds Max käyttäminen (täysi ominaisuus ammattilainen ohjelmistojärjestelmä luomiseen ja muokkaamiseen 3D-grafiikka ja Autodeskin kehittämä animaatio sisältää uusimmat työkalut taiteilijoille ja multimediaammattilaisille) luo mallipohjan. Muokkaa otsikkoa ja tee siitä haluamasi näköinen.

Johtopäätös

Web-ohjelmoinnin nopean kehityksen ja useiden CMS-järjestelmien luomisen ansiosta web-suunnittelijan työ on helpottunut. Nyt monitoimisen, tehokkaan dynaamisen verkkoportaalin luomiseen riittää, että hallitset useita ohjelmointikieliä (jos lisäämme laajennuksia ja komentosarjoja), hallitset taitavasti graafiset ja rasteriohjelmat, vähän inspiraatiota, innovaatiota ja taitoa.

Kirjallisuus

1. Kotorev D.V., Kostarev A.F. "PHP 5 tai käsikirjoituksen täydellisin käsikirja." Pietari 2005

2. A. Goncharov "HTML Self-Teacher".

3. A. Matrosov, A. Sergeev, M. Chaunin "HTML 4.0 alkuperäisessä muodossa"

4. Isaacs S. "Dynaaminen HTML"

5. Bayens J. "Web-ohjelmointigadgetit"

6. Bursov M.V. jne. "Dreamweaverin HTML-editorin perusteet. Opetusopas"

7. Velikhov V. "HTML 4.0:n käsikirja"

UKRAINAN OPETUS- JA TIETEMINISTERIÖ

SKHIDNOUKRAINIAN KANSALLINEN YLIOPISTO

Nimetty Volodymyr Dahlin mukaan

Tietojenkäsittelytieteen laitos

Kurin mukaan

Tietokonesuunnittelu ja multimedia

OpiskelijaBoldakova I.V.

1. Johdanto

3.1 HTML-editorit

4. Verkkosivuston luominen CMS Joomla 1.5.7:llä

Kirjallisuus

1. Johdanto

World Wide Web - maailmanlaajuinen tietokoneverkko sisältää nykyään miljoonia sivustoja, jotka sisältävät kaikenlaista tietoa. Ihmiset käyttävät näitä tietoja Internet-tekniikan avulla. WWW:ssä liikkumiseen käytetään erityisiä ohjelmia - Web-selaimia, jotka helpottavat huomattavasti WWW:n laajuuksia. Kaikki Web-selaimen tiedot näkyvät Web-sivujen muodossa.

Multimediatekniikkaa tukevat web-sivut yhdistävät erityyppistä tietoa: tekstiä, grafiikkaa, ääntä, animaatiota ja videota. Sen menestys Internetissä riippuu pitkälti siitä, kuinka hyvin ja kauniisti tietty Web-sivu on tehty.

Käyttäjä vierailee mielellään niillä verkkosivuilla, jotka ovat tyylikkäästi muotoiltuja, joita ei kuormita liiallisella grafiikalla ja animaatioilla, jotka latautuvat nopeasti ja näkyvät oikein Web-selainikkunassa.

Web-sivun luominen ei ole helppoa, mutta luultavasti jokainen haluaisi kokeilla itseään suunnittelijana. Ja tässä tapauksessa en ole poikkeus, minkä vuoksi valitsin tämän aiheen kurssityöhöni.

Yritin esseessäni ymmärtää, mitä sinun tulee tietää ja osata tehdä web-sivun luomiseen, mikä ohjelmisto on työkalu verkkosivujen luomiseen ja kuinka sitä käytetään tehokkaasti.

Myös tässä työssä kävin läpi web-sivujen ohjelmointikielen perusteet - HTML, joka on yleisesti hyväksytty WWW-standardi. Tämä antaa meille mahdollisuuden tutustua Web-sivun rakenteeseen ja sen oikean suunnittelun tekniikoihin. Tarkastelemme myös verkkosivuston luomista CMS Joomlalla.

2. Harkitse hypertekstin merkintäkieltä HTML

Web-sivuja voi olla missä tahansa muodossa, mutta se hyväksytään standardina Hyper Text Markup Language- hypertekstin merkintäkieli, joka on suunniteltu luomaan muotoiltua tekstiä, jossa on runsaasti kuvia, ääntä, animaatioita, videoleikkeitä ja hypertekstilinkkejä muihin asiakirjoihin.

Voit työskennellä verkossa tuntematta HTML-kieltä, 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-kieltä on useita eri makuja ja se kehittyy edelleen, mutta HTML-rakenteita käytetään todennäköisesti jatkossakin. Oppimalla HTML:ää ja ymmärtämällä sitä syvemmin, luomalla dokumentin HTML:n oppimisen alussa ja laajentamalla sitä mahdollisimman paljon, pystymme luomaan web-sivuja, joita voidaan tarkastella monilla verkkoselaimilla niin nyt kuin tulevaisuudessakin. Tämä ei sulje pois mahdollisuutta käyttää muita menetelmiä, kuten Operan tarjoamaa edistynyttä menetelmää, Google Chrome, Internet Explorer tai muut selaimet.

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 kaikki selaimet.

Koska HTML-dokumentit on kirjoitettu ASCI I -muodossa, mitä tahansa tekstieditoria voidaan käyttää niiden luomiseen.

Tyypillisesti HTML-dokumentti on tiedosto, jonka tunniste on .html tai . htm, jossa teksti on merkitty HTML-tageilla (englanniksi tag - erityiset sisäänrakennetut ohjeet). HTML määrittelee tunnisteiden syntaksin ja sijoittelun, jonka mukaan selain näyttää Web-asiakirjan sisällön. Web-selain ei näytä itse tunnisteiden tekstiä.

Kaikki tunnisteet alkavat "<" и заканчиваются символом ">". Yleensä tunnistepari - aloitus (avaa) ja loppu (sulkeva) tagi (samanlainen kuin matematiikan avaus- ja sulkemissulut), joiden väliin merkintätiedot sijoitetaan:

Tiedot

Tässä aloitustunniste on tagi

Ja viimeiset -

. Lopputunniste eroaa aloitustunnisteesta vain siinä, että siinä on sulut ennen tekstiä<>siellä on symboli" / " (vinoviiva).

HTML-dokumenttia lukeva selain näyttää sen ikkunassa, jossa käytetään HTML-tunnisterakennetta. Jokaisessa HTML-dokumentissa on oltava kolme pääosaa:

A) HTML-ilmoitus;

B) Otsikkoosa;

C) Asiakirjan runko .

A) HTML-ilmoitus

Ja. Näiden tunnisteiden pari kertoo katsojalle (selaimelle), että niiden välissä on HTML-dokumentti ja asiakirjan ensimmäisen tunnisteen tulee olla tunniste. (asiakirjan alussa) ja viimeinen -(asiakirjan lopussa).

B) Otsikkoosa.

Ja. Näiden tunnisteiden välissä on tietoja asiakirjasta (otsikko, hakusanat, kuvaus jne.). Tärkeintä on kuitenkin asiakirjan otsikko, jonka näemme selainikkunan ylärivillä ja "Suosikit (Kirjanmerkki)" -luetteloissa. Erityiset hakukoneiden hämähäkkiohjelmat käyttävät asiakirjan otsikkoa tietokantojensa rakentamiseen. Jotta HTML-dokumentille voidaan antaa otsikko, teksti sijoitetaan tunnisteiden väliin Ja.

Ensimmäinen sivuni

C) Asiakirjan runko.

Asiakirjan kolmas pääosa on sen runko. Se seuraa välittömästi otsikkoa ja sijaitsee tunnisteiden välissä Ja. Ensimmäisen tulee olla heti tagin jälkeen, ja toinen on ennen -tunnistetta. HTML-dokumentin runko on paikka, johon kirjoittaja sijoittaa HTML:llä muotoiltuja tietoja.

Ensimmäinen sivuni ..........

Nyt voimme kirjoittaa sivullemme HTML-koodin:

Ensimmäinen sivuni Sivuni ovat täällä!

BODY-osiossa selain jättää huomioimatta kaikki välilehdet ja rivinvaihdot, eivätkä ne vaikuta sivun näyttöön millään tavalla. Siksi rivinvaihto HTML-dokumentin lähdetekstissä ei aloita uutta riviä selaimen näyttämässä tekstissä, ellei siinä ole erityisiä tunnisteita. Tämä sääntö on erittäin tärkeä muistaa ja älä unohda laittaa rivejä erottavia tunnisteita, muuten tekstissä ei ole kappaleita ja siitä tulee lukukelvoton.

Aloita uusi rivi käyttämällä tunnistetta
(lyhennetty englanninkielisestä taukosta - keskeytys). Tämä tunniste saa selaimen näyttämään lisää tekstiä seuraavan rivin alusta. Siihen ei ole käytetty sulkemistunnistetta. Se on kätevää, jos haluat kirjoittaa uudelta riviltä jossain vaiheessa aloittamatta uutta kappaletta, esimerkiksi runossa. Käyttämällä sitä uudelleen voit lisätä yhden tai useamman tyhjän rivin siirtämällä sivun seuraavaa osaa alaspäin.

Jatkuvaa tekstiä ilman aukkoja ei ole kovin helppo lukea, se on hankalaa selailla ja löytää oikeita paikkoja. Kappaleihin jaettu teksti havaitaan paljon nopeammin. Tunnistetta käytetään uuden kappaleen aloittamiseen

(Englanninkielinen kappale - kappale). Tämä tagi lisää uuden rivin aloittamisen lisäksi yhden tyhjän rivin. Mutta toistuva toisto

Toisin kuin
, ei johda useiden tyhjien rivien ilmestymiseen, silti on sama yksi tyhjä rivi.

Tagin hakasulkeisiin voidaan sijoittaa sen nimen lisäksi myös attribuutteja. Ne erotetaan nimestä ja toisistaan ​​välilyönnillä (yksi tai useampi) ja kirjoitetaan muotoon attribuutin_nimi ="merkitys". Jos arvo ei sisällä välilyöntejä, lainausmerkit voidaan jättää pois, mutta tätä ei suositella. Tag

Saattaa sisältää ALIGN-attribuutin, joka määrittää kappaleiden tasauksen. Oletuksena kappale tasataan vasemmalle ALIGN="left". Myös kohdistus oikealle ALIGN="oikealle" ja keskikohdistus ALIGN="keskelle" ovat myös mahdollisia. Kun käytät attribuutteja, käytä lopputunnistetta muotoillun tekstin jälkeen

. Jos sitä ei ole, niin uusi tunniste

Tarkoittaa edellisen sulkemista, vastaavasti sisäkkäin

Mahdotonta. On myös mahdollista keskittää tekstiä tunnisteen avulla

.

Nyt voimme laittaa verkkosivullemme tekstiä eri tasauksilla:

Ensimmäinen sivuni

Omat sivuni ovat täällä!

Niistä löydät: - tarina minusta ja harrastuksistani; - minun valokuvani.

Yhdeltä sivultani se on mahdollista
lähetä minulle sähköpostia.

3. Työkalut web-sivujen luomiseen

3.1 HTML-editorit

Jokainen valitsee oman työkalunsa web-sivujen luomiseen. Tämä voi olla MS FrontPage tai Macromedia DreamWeaver, Allaire HomeSite tai 1st Page. Ja jotkut ihmiset käyttävät yksinkertaista tekstieditoria, kuten Muistio.

Tekstieditoreja voidaan käyttää vain pienten sivujen luomiseen, koska niillä on monia haittoja: projekteja ei tueta, tekstiä ei "korosteta", yleensä se on erittäin hankalaa työskennellä.

MS FrontPagen suurin haittapuoli on, että se tuottaa erittäin suurta HTML-koodia (liikaa turhaa tavaraa), joten sivut osoittautuvat suuriksi, mikä vaikuttaa latausnopeuteen. Lisäksi, kun luot Web-sivuja tässä editorissa, näet yhden asian, mutta selainikkunassa näet jotain aivan muuta. Sivut osoittautuvat hieman vinoiksi, joten laadukkaiden web-sivujen luomiseksi on suositeltavaa käyttää alla selostettavia paketteja.

Aloitamme suositulla Macromedia DreamWeaverilla. Macromediaa pidetään johtavana verkkosivustojen luomiseen tarkoitettujen ohjelmistojen valmistajana sekä tämän alan suunnannäyttäjänä.

Internet Engineering Task Force) julkaisi luonnoksen HTML-standardiksi

HTML-dokumentin rakenne

HTML 4 -dokumentti koostuu kolmesta osasta:

  • merkkijono, joka sisältää HTML-versiotiedot,
  • otsikkoosion ilmoittaminen (HEAD-elementin rajoittama),
  • itse asiakirjan sisältävä runko.

Runko voi sisältyä BODY- tai FRAMESET-elementteihin. Välilyönnit (välilyöntejä, rivinvaihdot, sarkainmerkit ja kommentit) voivat näkyä ennen tätä osaa tai sen jälkeen.

Yksinkertainen sivu

Hei maailma!

Dokumentti alkaa elementillä tyyppi asiakirja tai asiakirjatyyppi. Se kuvaa, minkä tyyppistä HTML-koodia käytetään, jotta käyttäjän asiakassovellus voi määrittää, kuinka dokumentti tulkitaan, ja päättää, noudattaako se sääntöjä, joita se väittää noudattavansa.

Tämän jälkeen näet html-elementin avaustunnisteen. Tämä on kääre koko asiakirjan ympärillä. Päättävä html-tunniste on viimeinen objekti missä tahansa HTML-asiakirjassa.

html-elementin sisällä on head-elementti. Se sisältää tietoja asiakirjasta (metadata). Inside head on otsikkoelementti, joka määrittää "Yksinkertaisen sivun" otsikon valikkorivillä.

Head-elementin jälkeen tulee body-elementti, joka on sivun varsinaisen sisällön sisältävä wrapper - tässä tapauksessa vain ensimmäisen tason otsikkoelementti (h1), joka sisältää tekstin "Hei maailma!" .

Elementit sisältävät usein muita elementtejä. Asiakirjan runko sisältää aina monia sisäkkäisiä elementtejä.

Sivuosat luovat asiakirjan yleisen rakenteen ja voivat sisältää alaosia. Ne voivat sisältää myös otsikoita, kappaleita, luetteloita jne. Kappaleet voivat sisältää elementtejä, jotka luovat linkkejä muihin elementteihin, lainauksia, korostuksia jne.

HTML-elementin syntaksi

HTML:n peruselementti koostuu kahdesta tekstilohkon ympärillä olevasta tagista. On elementtejä, jotka eivät rivitä tekstiä, ja lähes joka tapauksessa elementit voivat sisältää alielementtejä (kuten html sisältää head ja body yllä olevassa esimerkissä).

Tuotteet voivat myös olla attribuutteja, joka voi muuttaa elementin käyttäytymistä ja tuoda lisäarvoa.

Perusasiat HTML

Tässä esimerkissä div-elementtiin (sivun osaan, tapaan, jolla asiakirjat jaetaan loogisiin lohkoihin) on lisätty id-attribuutti, joka on asetettu mastopää. Div-elementti sisältää h1-elementin (ensimmäinen eli tärkein tason otsikko), joka puolestaan ​​sisältää jonkin verran tekstiä. Osa tästä tekstistä on kääritty elementtiin lyhenne(jota käytetään lyhenteen määrittämiseen), jolla on otsikko-attribuutti, jonka arvo on asetettu Hypertext Markup Language.

Monet HTML:n attribuutit ovat yhteisiä kaikille elementeille, mutta jotkut ovat ominaisia ​​tietylle elementille tai elementeille. Niillä kaikilla on muoto:

avainsana="arvo"

Arvo tulee laittaa kerta- tai kaksoislainausmerkkeihin (joissakin tilanteissa lainausmerkit saattavat puuttua, mutta tämä ei ole kovin hyvä ennustettavuuden, ymmärryksen kannalta).

Attribuutit ja niiden mahdolliset arvot määritellään ensisijaisesti HTML-määrittelyissä (http://www.w3.org/TR/html401/index/attributes.html), joten et voi luoda omia attribuuttejasi. Ainoat todelliset poikkeukset ovat id- ja class-attribuutit, joiden kokonaisarvot on tarkoitettu lisäämään asiakirjoihin oma merkitys ja semantiikka.

Toisen elementin sisällä olevaa elementtiä kutsutaan "jälkeläinen" tämä elementti. Yllä olevassa esimerkissä lyhenne on h1:n lapsi, joka puolestaan ​​on div:n lapsi. Päinvastoin div on h1-elementin "esi-isä".

Lohkotason elementit ja rivielementit

HTML:ssä on kaksi pääluokkaa elementtejä, jotka vastaavat sisältötyyppejä ja rakennetta, jota nämä elementit edustavat - lohkotason elementit ja rivielementit.

Estä taso tarkoittaa enemmän korkea taso elementti, joka yleensä kertoo asiakirjan rakenteesta. Lohkotason elementtejä voidaan ajatella elementeinä, jotka alkavat uudelta riviltä irtautuen sitä edeltäneestä. Yleistä lohkon elementit ovat kappaleet, luettelomerkit, otsikot ja taulukot.

Merkkijonoelementit sisällä rakenneosat lohkotasolla ja peittää vain osia asiakirjan tekstistä kokonaisten alueiden sijaan. Sisäinen elementti ei johda uuden rivin ilmestymiseen asiakirjaan, koska ne ovat elementtejä, jotka näkyvät tekstikappaleessa. Yleistä merkkijonoelementit ovat hypertekstilinkkejä, korostettuja sanoja tai lauseita ja lyhyitä lainauksia.

Otsikko

HTML-dokumentin otsikko on valinnainen merkintäelementti. Aluksi otsikon olemassaolo määräytyi tarpeen mukaan selainikkunan nimeäminen. Tämä saavutettiin kautta merkintäelementti TITLE:

Tämä on otsikko ... ...

Toinen HTML-dokumentin otsikon tehtävä on ohjata HTTP-liikennettä kautta merkintäelementti META. Nykyisellä käytännöllä isännöidä yrityksen Web-sivustoja palveluntarjoajan palvelimilla, näiden sivustojen järjestelmänvalvojat eivät ehkä pysty hallitsemaan palvelinohjelmaa. Tässä tapauksessa on vain yksi vaihtoehto ohjata vaihtoa - HTML-dokumentin otsikon kautta.

HTML-dokumentin otsikko on tarkoitettu myös kuvaamaan asiakirjan hakukuvaa, jota tarvitaan hakukonerobottien indeksoimiseksi dokumenttiin. META-elementin avulla voit tallentaa avainsanaluetteloita ja dokumenttien kuvauksia, joita käytetään indeksin kokoamiseen hakukone ja näkyvät asiakirjan kuvauksena, jos linkki siihen näytetään avainsanahaun aikana.

Perusotsikkotunnisteet ovat HTML-merkintäelementtejä, jotka löytyvät useimmiten HTML-dokumentin otsikosta, ts. sisällä merkintäelementti PÄÄ:

  • TITLE (asiakirjan nimi);
  • BASE (URL-pohja);
  • ISINDEX (hakumalli);
  • META (metatiedot);
  • LINKKI (yleiset linkit);
  • TYYLI (tyylikuvaajat);
  • SCRIPT (skriptit).

Yleisimmin käytetyt elementit ovat TITLE, SCRIPT, STYLE. META-elementin käyttö kertoo tekijän tietoisuudesta asiakirjojen indeksoinnin säännöistä hakukoneissa ja kyvystä hallita HTTP-tiedonvaihtoa. BASE ja ISINDEX ovat olleet vähäisessä käytössä viime aikoina. LINK määritetään vain, kun käytetään asiakirjan ulkopuolisia tyylisivukuvauksia.

Merkintäelementti HEAD sisältää HTML-dokumentin pään. Annettu merkintäelementti on valinnainen. Jos on aloitustunniste merkintäelementti On suositeltavaa käyttää myös lopputunnistetta merkintäelementti. Oletusarvoisesti HEAD-elementti suljetaan, jos joko BODY-säilön aloitustunniste tai FRAMESET-säilön aloitustunniste löytyy.

Otsikkosäiliötä käytetään koko asiakirjaan liittyvän tiedon tallentamiseen.

Merkintäelementti TITLE käytetään nimeämään asiakirja World Wide Webissä. Kun valitset tekstiä TITLE-säilön sisällölle, muista, että se näkyy järjestelmän fontti , koska se on selainikkunan otsikko.

TITLE säilön syntaksi yleinen näkemys näyttää tältä:

asiakirjan otsikko

Otsikko ei ole pakollinen asiakirjasäilö. Se voidaan laskea alas. Monien hakukoneiden robotit käyttävät TITLE-elementin sisältöä luodakseen asiakirjasta hakukuvan. Nimikkeen TITLE sanat sisältyvät hakukonehakemistoon. Näistä syistä on aina suositeltavaa käyttää TITLE-elementtiä Web-sivustojen sivuilla.

Merkintäelementti BASE-arvoa käytetään epätäydellisessä (osittaisessa) muodossa määritettyjen dokumenttien hypertekstilinkkien perus-URL-osoitteen määrittämiseen. Lisäksi BASE antaa sinun määrittää oletusasiakirjan latauskohdeikkunan valittaessa hypertekstilinkkiä nykyinen asiakirja. BASE löytyy useimmiten sellaisten sivustojen sivuilta, joilla on "peilejä". Osa pääpalvelimen asiakirjoja eri syistä sitä ei siirretä "peilipalvelimelle". Tässä tapauksessa asiakirja, jolla on pakotettu perus-URL, linkittää aina pääpalvelimeen.

Säilön aloitustunniste sisältää yhden pakollisen HREF-attribuutin ja voi sisältää yhden valinnaisen TARGET-attribuutin. BASE-säilön yleinen syntaksi on seuraava:

Merkintäelementti ISINDEXia käytetään määrittämään hakukuvio ja se peritään aikaisemmat versiot HTML. HTML 4.0:ssa tätä säilöä ei ole määritetty.

META-merkintäelementti

META sisältää ohjaustiedot, joita selain käyttää dokumentin rungon sisällön näyttämiseen ja käsittelemiseen oikein, esimerkiksi Content-type-attribuutin avulla voit määrittää dokumentin uudelleenkoodauksen asiakaspuolella.

Voit myös määrittää muita operaattoreita META:n avulla. Esimerkiksi poista asiakirjojen välimuisti käytöstä. Voit poistaa välimuistin käytöstä lisäämällä seuraavanlaisen tagin META-otsikkoon:

HTTP-protokollan uudessa versiossa (HTTP 1.1) välimuistia ohjataan Cache-Control-käskyn kautta. Saadaksesi saman tuloksen kuin tapauksessa Pragma, HTML-dokumentin otsikossa riittää, että ilmoitetaan:

Voit kieltää asiakirjan tallentamisen edelleenlähetyksen jälkeen.