Anong wika ang ginagamit upang ilarawan ang mga hypertext na dokumento. Mga pangunahing kaalaman sa HTML, hypertext markup language. A) Mga editor ng Raster graphics

Ang mga modernong teknolohiya ng impormasyon sa Web ay mabilis na nagbabago sa ating mundo at direktang nakakaimpluwensya sa pagbuo ng mga teknolohiya sa Web. Ang teknolohikal na rebolusyon na ito ay lubhang nakaapekto hindi lamang sa negosyo kundi pati na rin sa personal at propesyonal na buhay. Ang pinakabagong mga teknolohiya sa Web ay tumatagos sa lahat ng larangan ng buhay panlipunan, nagbabago ng mga pamamaraan ng komunikasyon at mga prinsipyo ng pagsasagawa ng mga proyekto sa Web. modernong kumpanya, pagtukoy sa kapalaran ng huli. Ang panloob na pagiging kumplikado at matinding pagiging simple ng paggamit ng mga modernong teknolohiya ng impormasyon sa Web ay ginagawang naa-access ang mga ito sa lahat na araw-araw na nakakaharap ng kanilang paggamit sa kanilang mga propesyonal na aktibidad.

Parehong sa pang-araw-araw na buhay at sa negosyo, sa pagsusulatan at kalakalan, ginagamit ng mga tao at organisasyon ang Web, lumikha ng kanilang sariling mga Web site kung saan nag-aalok sila ng impormasyon, mga kalakal at serbisyo. Ang mga tool para sa paglikha ng mga mapagkukunan sa Web ay mabilis na umuunlad at walang tigil, na nagbibigay-daan sa iyong lumikha ng mga kumplikadong dokumento sa Web nang hindi nangangailangan ng espesyal na kaalaman tungkol sa kanilang istraktura at hitsura, na nagbibigay ng oras para sa produktibong aktibidad ng malikhaing. Ang pangunahing bentahe ng mga teknolohiya sa Web ay modernong kondisyon ay nakasalalay sa kanilang pagiging simple at, bilang isang resulta, sa pagtaas ng kahusayan ng kanilang paggamit.

Hypertext Markup Language HTML

Ang katanyagan ng Internet ay higit sa lahat dahil sa pagdating ng World Wide Web (WWW), dahil ito ang unang teknolohiya ng network na nagbigay sa user ng madaling modernong interface upang ma-access ang iba't ibang mapagkukunan ng network. Ang pagiging simple at kadalian ng paggamit ay humantong sa pagtaas ng bilang ng mga gumagamit ng WWW at naakit ang atensyon ng mga komersyal na istruktura. Pagkatapos ang proseso ng paglaki sa bilang ng mga gumagamit ay naging isang avalanche, at ito ay nagpapatuloy hanggang sa araw na ito. Batay sa pangangailangan na pagsamahin ang lahat ng maraming mapagkukunan ng impormasyon, nagsimulang umunlad ang teknolohiya sa tulong kung saan tinukoy ang hypertext. sistema ng nabigasyon. Ang teknolohiyang ito ay naging wikang HTML. Naka-on ang teknolohiyang HTML paunang yugto ay napakasimple, at halos lahat ng mga gumagamit ng network ay sabay-sabay na nagkaroon ng pagkakataon na subukan ang kanilang mga sarili bilang mga tagalikha at mga mambabasa ng mga materyal na impormasyon na inilathala sa World Wide Web. Ang katotohanan ay kapag ang pagbuo ng iba't ibang mga bahagi ng teknolohiya, ipinapalagay na ang mga kwalipikasyon ng mga may-akda ng mga mapagkukunan ng impormasyon at kanilang kagamitan teknolohiya ng kompyuter magiging minimal.

Wika ng HTML (HyperText Markup Language, hypertext markup language) ay isa sa mga tinatawag na markup language. Ang terminong "markup" ay tumutukoy sa pangkalahatang impormasyon ng serbisyo na hindi ipinapakita kasama ng dokumento, ngunit tumutukoy; kung ano dapat ang hitsura ng ilang partikular na fragment ng dokumento. Halimbawa, maaari kang humiling na ipakita ang isang salita sa bold o italic font, display hiwalay na talata sa isang espesyal na font o gumawa ng mga heading sa mas malaking font.

Mayroong maraming iba't ibang mga markup language na magagamit sa mga araw na ito. Halimbawa, sa mga programa sa komunikasyon espesyal na hugis Tinutukoy ng markup ang kahulugan ng bawat pakete ng mga zero at mga ipinadala sa Internet. Gayunpaman, dapat malutas ng anumang markup language ang dalawang mahahalagang problema:

1) tinutukoy ng wika ang markup syntax;

2) tinutukoy ng wika ang kahulugan ng markup.

Ang pinakakaraniwang markup language para sa mga Web page ay HTML. Ginawa at na-promote ang markup language na ito bilang subset ng SGML. Unang iminungkahi noong 1974 ni Charles Goldfarb at pagkatapos, pagkatapos ng makabuluhang pagpipino, pinagtibay bilang opisyal Pamantayan ng ISO Ang SGML (Standard Generalized Markup Language) ay isang metalanguage - isang sistema para sa paglalarawan ng iba pang mga wika.

Ang paglitaw ng pamantayan ng SGML ay dahil sa pangangailangan pagbabahagi data mula sa iba't ibang mga application at operating system. Kahit noong dekada 60, maraming problema sa compatibility ang mga gumagamit ng computer. Matapos suriin ang mga pagkukulang ng maraming hindi karaniwang mga markup na wika, tatlong IBM scientist - Charles Goldfarb, Ed Mosher at Ray Lorie - ay bumuo ng tatlong pangkalahatang prinsipyo na ginagawang posible na pakikipagtulungan may mga dokumento sa iba't ibang operating system.

1) Paggamit ng pare-parehong mga prinsipyo sa pag-format sa lahat ng mga programa na nagpoproseso ng mga dokumento. Isang ganap na lohikal na kinakailangan - alam nating lahat kung gaano kahirap para sa mga taong nagsasalita ng iba't ibang mga wika na sumang-ayon sa isa't isa. Ang pagkakaroon ng isang solong hanay ng mga syntactic na istruktura at karaniwang semantika ay makabuluhang pinapasimple ang pakikipag-ugnayan sa pagitan ng mga programa.

2) Espesyalisasyon ng mga wika sa pag-format. Salamat sa kakayahang bumuo ng isang dalubhasang wika batay sa isang hanay ng mga karaniwang tuntunin, ang programmer ay hindi na umaasa sa mga panlabas na pagpapatupad at sa kanilang mga ideya tungkol sa mga pangangailangan ng end user.

3) Malinaw na kahulugan ng format ng dokumento. Ang mga patakaran na tumutukoy sa format ng dokumento ay tumutukoy sa numero at pagmamarka ng mga construct ng wika na ginamit sa dokumento. Aplikasyon karaniwang format tinitiyak na alam ng user ang eksaktong istraktura ng nilalaman ng dokumento. Pakitandaan: hindi ito tungkol sa display format ng dokumento, ngunit tungkol sa structural format nito. Ang hanay ng mga panuntunang naglalarawan sa format na ito ay tinatawag na "pagtukoy sa uri ng dokumento" ( uri ng dokumento kahulugan, DTD).

Ang tatlong panuntunang ito ay naging batayan ng hinalinhan ng SGML, ang GML (Generalized Markup Language). Nagpatuloy ang pananaliksik at pagpapaunlad ng GML sa loob ng humigit-kumulang sampung taon hanggang sa lumabas ang pamantayan ng SGML bilang resulta ng isang kasunduan na naabot ng isang internasyonal na grupo ng mga developer.

Ang HTML (Hypertext Markup Language) ay wika ng kompyuter, na sumasailalim sa World Wide Web. Ang HTML ay batay sa pamantayan ng SGML, isang hypertext markup language para sa pagtatanghal ng dokumento sa Web. Ang mga pamantayan sa wikang HTML, isa sa mga pangunahing pamantayan sa Web, ay binuo at pinananatili ng W3C consortium. Ang nagtatag ng internasyonal na consortium na ito ay si Tim Berners-Lee. Bilang karagdagan sa paglikha ng mga pamantayan sa pag-format, ang consortium ay ang sentro para sa pagbuo ng Semantic Web (semantic network). Ang wikang HTML ay nagbibigay ng format markup para sa mga dokumento at tumutukoy sa mga hyperlink sa pagitan ng mga dokumento at/o ang kanilang mga fragment.

Ang karaniwang HTML code ay pinili bilang batayan sa pagsulat nito. text file. Kaya, ang hypertext database sa konsepto ng WWW ay isang set ng mga text file na minarkahan sa HTML, na tumutukoy sa anyo ng presentasyon ng impormasyon (markup) at ang istraktura ng mga koneksyon sa pagitan ng mga file na ito at iba pang mapagkukunan ng impormasyon (hypertext links).

Nagawa ng mga developer ng HTML ang dalawang problema:

· magbigay ng hypertext database designer na may simpleng paraan ng paglikha ng mga dokumento;

· gawing sapat na makapangyarihan ang tool na ito upang ipakita ang mga kasalukuyang ideya tungkol sa user interface ng mga hypertext database.

Nalutas ang unang problema sa pamamagitan ng pagpili ng modelo ng pag-tag para sa paglalarawan ng dokumento. Ang wikang HTML ay nagpapahintulot sa iyo na markahan ang isang elektronikong dokumento na ipinapakita sa screen na may antas ng pag-print ng disenyo; ang resultang dokumento ay maaaring maglaman ng maraming uri ng mga label, mga larawan, mga fragment ng audio at video, at iba pa. Kasama sa wika ang mga binuo na tool para sa paglikha ng iba't ibang antas ng mga heading, mga seleksyon ng font, iba't ibang listahan, mga talahanayan at marami pang iba.

Pangalawa mahalagang punto Ang nakaimpluwensya sa kapalaran ng HTML ay ang isang regular na text file ang napili bilang batayan. Miyerkules Pag-edit ng HTML ay isang no-man's land sa pagitan ng isang simpleng text file at isang WYSIWYG (what you see is what you get) application. Ang pagpili ng kapaligiran sa pag-edit ay nagbibigay sa iyo ng lahat ng mga benepisyo ng pag-edit ng teksto.

Mga hypertext na link na nagtatatag ng mga koneksyon sa pagitan mga tekstong dokumento, unti-unting nagsimulang pagsamahin ang iba't ibang mapagkukunan ng impormasyon, kabilang ang tunog at video. Sistema Mga HTML hyperlink nagpapahintulot sa iyo na bumuo ng isang sistema ng magkakaugnay na mga dokumento ayon sa iba't ibang pamantayan. Ang wikang HTML ay naglalaman ng mga utos (tag) na nagbibigay-daan sa iyong kontrolin ang hugis at laki ng mga font, ang laki at lokasyon ng mga guhit, at nagbibigay-daan sa iyong lumipat mula sa isang piraso ng teksto o ilustrasyon patungo sa isa pang HTML na dokumento - ang tinatawag na hypertext link . Ang isang dokumento sa html na format ay isang text file na naglalaman ng lahat kinakailangang impormasyon tungkol sa impormasyong ipinapakita sa screen. Maaari kang gumamit ng mga wika sa scripting tulad ng JavaScript, Java, at VBScript upang pamahalaan ang mga script sa pagba-browse sa website (isang hypertext database na naka-host sa World Wide Web). Ang mga form para sa input ng user ng data na naproseso sa ibang pagkakataon at iba pang impormasyon ay maaaring iproseso gamit ang mga espesyal na programa ng server (halimbawa, Mga wikang PHP o Perl). Ang wikang HTML ay nagpapahintulot sa iyo na maglagay ng mga hypertext na link sa mga pahina at mga interactive na pindutan, na nagkokonekta sa iyong mga Web page sa ibang mga page sa parehong Web site, gayundin sa iba pang mga Web site sa buong mundo.

Ang HTML ay isang text markup language, hindi isang programming language, na isa lamang sa mga tool (mas tiyak, isang wika ng paglalarawan ng pahina) na ginagamit upang lumikha ng mga Web page. Ang HTML ay may limitadong mga kakayahan sa pag-format ng teksto kumpara sa mga kakayahan ng pag-publish ng mga programa, lalo na kapag nag-publish ng tekstong mayaman sa mga kumplikadong elemento.

Wala pa rin kasing kumportable Mga editor ng HTML, upang magawa mo nang walang text editor at manu-manong paglalagay ng mga tag. Pinapalubha nito ang pagtatrabaho sa wika at ginagawang kinakailangan para sa kanila na makabisado ang mga function na ganap na hindi karaniwan para sa kanila.

Pag-aralan ang mga tampok ng wikang HTML at pagtatasa sa antas ng pag-unlad nito, maaari tayong makarating sa konklusyon na sa mga darating na taon dapat nating asahan ang paglitaw ng mas advanced na mga pagbabago nito, mga bagong wika at mga pakete ng aplikasyon para sa pagtatrabaho sa mga web page.

Dynamic at static na HTML na mga dokumento

Mayroong dalawang uri ng mga HTML na dokumento - static at dynamic. Ang mga static na dokumento ay naka-imbak sa mga file file system, na ginagamit ng web server o browser kapag tumitingin mga lokal na file. Kapag nagpo-post ng impormasyon sa isang web server, maaari kang gumamit ng mga dynamic na dokumento - ang mga hindi permanenteng umiiral sa anyo ng mga file, ngunit nabuo sa oras ng kahilingan ng kliyente. Bukod dito, para sa end user, hindi mahalaga kung ang mga dokumento ay ipinakita nang pabago-bago o statically.

Upang makabuo ng isang dynamic na HTML na dokumento, ang isang espesyal na nakasulat na programa ay kinakailangan ayon sa mga panuntunang tinukoy ng web server. Kapag nagpaplano ng paglalagay ng impormasyon sa isang web server, para sa tamang kahulugan paggamit ng anumang uri ng mga dokumento, kinakailangang isaalang-alang ang antas ng pag-update ng data, ang kanilang dami at dalas ng sirkulasyon.

Tinutukoy ng dynamic na paraan ang pag-iimbak ng data sa isang pormal na anyo, halimbawa sa isang database.

Kung ang data ay naka-imbak sa isang pormal na anyo, pagkatapos ay ang mga static na dokumento ay nabuo gamit ang mga template ng dokumento kung saan ang mga pagbabago ay ginawa. Upang makabuo ng mga static na dokumento, maaari mong gamitin ang anumang mga tool sa pag-uulat na magagamit sa database management system (DBMS) kung saan pinoproseso at ginawang pormal ang data.

Mga Pananaw sa HTML

Walang mga bagong bersyon ng wikang HTML, ngunit mayroon pa Pag-unlad ng HTML tinatawag na XHTML (Extensible Hypertext Markup Language). Habang ang XHTML ay maihahambing sa mga kakayahan sa HTML, mayroon itong mas mahigpit na mga kinakailangan sa syntax. Tulad ng HTML, ang XHTML ay isang subset ng wikang SGML, ngunit ang XHTML, hindi katulad ng hinalinhan nito, ay umaayon sa detalye ng XML. Ang XHTML 1.0 ay naaprubahan bilang isang Rekomendasyon ng Consortium World Wide Web(W3C) Enero 26, 2000. Gayunpaman, kinakailangang isaalang-alang ang isang seryosong detalye - sa format na ito ito ay nilikha malaking bilang mga mapagkukunan ng impormasyon na sila ay "maiintindihan" ng mga web browser sa mahabang panahon at gagamitin sa kanilang orihinal na anyo. Bilang karagdagan, ang lahat ng mga bagong format ay bubuo (at binuo na - halimbawa XML) na may suporta para sa mga teknolohiyang HTML.

Ang paraan ng paggawa namin ay nagbabago, at gayundin ang paraan ng pag-access ng nilalaman. Ang wikang HTML ay orihinal na nilikha bilang isang wikang independiyente sa platform. Ginagamit ang mga bagong teknolohiya sa halos lahat ng dako, at sa lalong madaling panahon ang espasyo ng World Wide Web ay hindi na magiging pag-aari lamang ng mga gumagamit ng desktop. mga personal na computer, aktibong ginagamit na ng ilang user mga voice browser para sa mga bulag o mga browser na gumagamit ng Broglie alphabet, ang nilalaman ay madalas na ipinapakita hindi sa isang computer monitor, ngunit sa isang TV, kapag ang mga set-top box na may access sa network o teletype ay ginagamit, o sa mga monochrome na display ng iba't ibang pager at iba pa.

Noong 1989, ang hypertext ay kumakatawan sa isang promising na bagong teknolohiya na may medyo malaking bilang ng mga pagpapatupad, sa isang banda, at sa kabilang banda, ang mga pagtatangka ay ginawa upang bumuo ng mga pormal na modelo ng mga hypertext system na mas naglalarawan sa kalikasan at inspirasyon ng tagumpay ng relational na diskarte sa paglalarawan ng data.

Ang HTML ay isang wika hypertext markup, ginagamit sa pag-encode ng mga dokumento. Ang wikang HTML ay isang hanay ng mga utos ayon sa kung saan ipinapakita ng browser ang mga nilalaman ng isang dokumentong HTML na mga utos ay hindi ipinapakita. Ang wikang HTML ay nagpapatupad ng mekanismo ng pag-link ng hypertext na nagpapahintulot sa isang dokumento na maiugnay sa iba. Ang mga dokumentong ito ay maaaring matatagpuan sa parehong server bilang ang pahina kung saan sila naka-link, o maaaring sila ay naka-host sa ibang server.

Ang ideya ng HTML ay isang halimbawa ng isang napakatagumpay na solusyon sa problema ng pagbuo ng isang hypertext system gamit ang isang espesyal na tool sa pagkontrol ng display.

Kinilala ang mga link na hypertext sa konteksto bilang ang pinakaepektibong anyo ng organisasyon ng hypertext, at bilang karagdagan, kinilala ang paghahati sa mga link na nauugnay sa buong dokumento sa kabuuan at sa mga indibidwal na bahagi nito.

Ang lahat ng mga HTML na dokumento ay may parehong istraktura, na tinukoy ng isang nakapirming hanay ng mga tag ng istraktura. Ang isang HTML na dokumento ay dapat palaging magsimula sa isang tag< HTML >at magtatapos sa naaangkop na pansarang tag (). Mayroong dalawang pangunahing seksyon sa loob ng isang dokumento: ang seksyon ng mga heading at ang katawan ng dokumento, sa ganoong pagkakasunud-sunod. Ang seksyon ng mga header ay naglalaman ng impormasyon na naglalarawan sa dokumento sa kabuuan at nililimitahan ng mga tag<НЕАD>At. Sa partikular, ang seksyon ng mga heading ay dapat maglaman ng pangkalahatang pamagat ng dokumento, na nililimitahan ng nakapares na tag<ТITLE>.

). Gayunpaman, hindi inirerekomenda na alisin ang mga tag ng istraktura kapag gumagawa ng HTML na dokumento. pinakasimple tamang dokumento Ang HTML na naglalaman ng lahat ng mga tag na tumutukoy sa istraktura ay maaaring magmukhang ganito:

< TITLE >Pamagat ng dokumento< /TITLE >

Teksto ng dokumento

Mga elemento ng HTML.

Para sa mga nakapares na tag, ang saklaw ay tinutukoy ng bahagi ng dokumento sa pagitan ng pagbubukas at pagsasara ng mga tag. Ang bahaging ito ng dokumento ay itinuturing na isang elemento ng wikang HTML. Kaya, maaari nating pag-usapan ang tungkol sa isang "Elemento ng BODY" na kinabibilangan ng tag, ang katawan ng dokumento at ang pansarang tag. Ang buong HTML na dokumento. ay maaaring isipin bilang isang "element ng HTML." Para sa mga hindi nakapares na tag, ang elemento ay kapareho ng tag na tumutukoy dito.

Karamihan sa mga elemento ng HTML na wika. naglalarawan ng mga bahagi ng nilalaman ng dokumento at inilalagay sa pagitan ng mga tag . At, iyon ay, sa loob ng elemento ng istruktura ng KATAWAN. Ang mga nasabing elemento ay nahahati sa bloke at teksto. Ang mga elemento ng block ay tumutukoy sa mga piraso ng teksto sa antas ng talata. Inilalarawan ng mga elemento ng teksto ang mga katangian ng mga indibidwal na parirala at kahit na mas maliliit na bahagi ng teksto.

Ngayon ay maaari na tayong bumuo ng mga panuntunan para sa mga elemento ng nesting.

Ang mga elemento ay hindi dapat magsalubong. Sa madaling salita, kung ang pambungad na tag ay matatagpuan sa loob ng isang elemento, ang katumbas na pansarang tag ay dapat na nasa loob ng parehong elemento.

Ang mga elemento ng block ay maaaring maglaman ng mga nested block at mga elemento ng teksto.

Ang mga elemento ng teksto ay maaaring maglaman ng mga nested na elemento ng teksto.

Ang mga elemento ng teksto ay hindi maaaring maglaman ng mga nested block na elemento.

Mga functional na elemento ng block.

Sa karamihan ng mga dokumento ang pangunahing functional na mga elemento ay mga pamagat at talata. HTML na wika. sumusuporta sa anim na antas ng mga heading. Tinukoy ang mga ito gamit ang mga nakapares na tag mula sa<Н1>sa<Н6>. Kapag ipinakita, ang mga dokumento sa Web ay ipinapakita gamit ang pamamaraang ito; tag (dokumento sa screen ng computer, ang mga elementong ito ay ipinapakita gamit ang mga font na may iba't ibang laki.

Ang mga regular na talata ay tinukoy gamit tag pair <Р>. HTML na wika. ay hindi naglalaman ng mga tool para sa paglikha indentasyon ng talata(“pulang linya”), kaya kapag ipinakita sa screen ng computer, ang mga talata ay pinaghihiwalay ng isang blangkong linya. Pansarang tagay itinuturing na opsyonal. Nauunawaan na nauuna ito sa tag, na tumutukoy sa simula ng susunod na talata ng dokumento. Halimbawa:

Heading

<Р>Unang talata<Р>Pangalawang talata

Pangalawang antas ng heading

Ang kahihinatnan ng pagkakaroon ng isang espesyal na tag na tumutukoy sa isang talata ay ang katotohanan na ang karaniwang end-of-line na character na ipinasok sa pamamagitan ng pagpindot ENTER keys, ay hindi sapat upang lumikha ng indent ng talata. HTML na wika. tinatrato ang mga end-of-line na character at espasyo sa isang espesyal na paraan. Anumang pagkakasunod-sunod; na binubuo lamang ng mga puwang at end-of-line na mga character, ay itinuturing bilang isang solong espasyo kapag ipinakita ang dokumento. Ito, sa partikular, ay nangangahulugan na ang end-of-line na character ay hindi man lang humahantong sa isang bagong linya (isang elemento ng teksto na tinukoy ng isang hindi nakapares na tag ay ginagamit para sa layuning ito.
.

Ang pahalang na tagapamahala ay maaari ding gamitin bilang delimiter ng talata. Ang elementong ito ay tinukoy ng isang hindi nakapares na tag
. Kapag ang isang dokumento ay ipinapakita sa screen, ang isang ruler ay naghihiwalay ng mga bahagi ng teksto mula sa isa't isa. Ang haba at kapal nito ay tinutukoy ng mga katangian ng tag
.

Lumilikha ang tag na ito ng 10 pixel ang lapad na pahalang na ruler na tumatagal ng kalahati ng lapad ng window at nakaposisyon sa kanan.

Ang paggawa ng website ay isa sa pinakalawak magagamit na mga pagkakataon modernong industriya ng Internet. Ang aktwal na paglikha ng mga website ay, sa prinsipyo, hindi gaanong mas mahirap gawin personal mga elektronikong mailbox at mga electronic business card.

Upang lumikha ng isang website, una sa lahat, kailangan mo ng isang server na konektado sa Internet kung saan maaari mong ilagay ang mga kinakailangang hypertext. Bilang karagdagan, kinakailangang irehistro ang pangalan ng saiga sa provider na nagsisilbi sa napiling server.

Sa Internet mahahanap mo ang mga provider na nag-aalok libreng pagbubukas mga site sa kanilang mga server. Maaaring mabuksan ang mga libreng site sa mga domestic server narod.ru, boom.ru, hotmail.ru at sa mga dayuhang server, halimbawa geocities.com, tripod.com.

Sa mga server na ito maaari kang magrehistro ng mga pangalan ng domain tulad ng:

<имя>. narod.ru

pangalan>.boom.ru,

Mga halimbawa ng mga nakarehistrong domain name:

wdu.da.ru - website ng elektronikong unibersidad;

wduniv.newmail.ru - website ng isang distributed na unibersidad.

Pagkatapos irehistro ang domain name ng isang site, maaari kang mag-host ng mga hypertext dito. Ang mga hypertext ay inilalagay sa site gamit ang mga espesyal na programa na nagbibigay-daan sa iyo upang lumikha, mag-edit, mag-ipon at kopyahin ang isang malawak na iba't ibang mga hypertext. Kaagad pagkatapos i-post ang pinakaunang (pangunahing) pahina ng hypertext mababasa ang impormasyon nito gamit ang isang browser sa anumang bansa mula sa anumang computer na konektado sa Internet. Upang gawin ito, ipasok ang address ng website sa Internet sa window ng browser. Halimbawa: http://bak.boom.ru

Ang lahat ng nai-post na file ay dapat na mga hypertext, nakasulat sa HTML na format at may mga identifier ng form<имя>.html.

Ang HTML ay isang hypertext markup language.

Sa mga tuntunin ng istraktura, ang hypertext ay teksto na may mga link sa iba pang mga hypertext na matatagpuan sa ang server na ito, o sa iba pang mga server. Kapag nag-click ka sa naturang link, awtomatikong naglo-load ang browser ng hypertext page sa screen ng iyong computer, anuman ang nasa server nito at sa anong bansa ito matatagpuan.

Gamit ang mga tool at program na ito sa Internet, maraming iba't ibang mga site at system ng impormasyon ang maaaring gawin - mga personal na site, branded na site, mga elektronikong pahayagan, magazine, mga e-libro, encyclopedia, at mga elektronikong archive at mga aklatan.

Ang pagkakaiba sa pagitan ng mga site ay ang dami ng impormasyon, ang kanilang istraktura at mga pamamaraan sa pag-update. Sa pangkalahatan, para sa mga site sa Internet, tulad ng para sa anumang organisasyon, maaari nating pag-usapan ang mga siklo ng buhay ng kanilang paglikha, pag-unlad, paggawa ng makabago at pagpuksa.

Ang dami ng impormasyon ay tinutukoy ng mga may-ari - mga tao o organisasyon na lumikha ng mga site at nagpo-post ng kanilang impormasyon sa kanila. Ang dami ng impormasyon sa mga website ay maaaring mula sa ilang kilobytes hanggang ilang gigabytes (milyong kilobytes).

Ang istraktura ng mga site ay maaaring maging lubhang magkakaibang. Ang pinakasimpleng istraktura- ito ang pangunahing pahina na may mga link sa isang hanay ng mga teksto. Ang mga link na ito ay maaaring nasa teksto ng pangunahing pahina o naka-highlight sa talaan ng mga nilalaman sa simula nito.

Ang bawat pahina ng site ay maaaring bigyan ng isang pamagat, na lumilitaw sa tuktok na linya ng screen kapag ang site ay na-load ng browser.

Bilang karagdagan, sa home page site, maaari mong tukuyin ang isang listahan ng mga keyword para sa mga search engine.

Lingguhang ini-scan ng mga search engine ang lahat ng mga server sa Internet at itinatala ang mga address ng lahat ng mga site at hypertext na matatagpuan kasama ang mga keyword na naka-highlight sa mga ito. Para sa mga kadahilanang ito, hindi lalampas sa isang linggo mamaya, ang anumang impormasyong nai-publish sa Internet ay matatagpuan gamit ang mga keyword na nakapaloob sa mga ito.

MINISTRY OF EDUCATION AND SCIENCE OF UKRAINE

SKHIDNOUKRAINIAN NATIONAL UNIVERSITY

Pinangalanan pagkatapos ng Volodymyr Dahl

Kagawaran ng Computer Science

Sa pamamagitan ng disiplina

Disenyo ng computer at multimedia

Mag-aaralBoldakova I.V.

1. Panimula

3.1 Mga editor ng HTML

Panitikan

1. Panimula

Ang World Wide Web - isang pandaigdigang computer network ngayon ay naglalaman ng milyun-milyong site na naglalaman ng lahat ng uri ng impormasyon. Ina-access ng mga tao ang impormasyong ito sa pamamagitan ng paggamit ng teknolohiya sa Internet. Upang mag-navigate sa WWW, ginagamit ang mga espesyal na programa - Mga web browser, na lubos na nagpapadali sa paglalakbay sa malawak na kalawakan ng WWW Ang lahat ng impormasyon sa Web browser ay ipinapakita sa anyo ng mga Web page.

Ang mga web page, na sumusuporta sa teknolohiyang multimedia, ay pinagsama iba't ibang uri impormasyon: teksto, graphics, tunog, animation at video. Ang tagumpay nito sa Internet ay higit na nakasalalay sa kung gaano kahusay at kaganda ang pagkakagawa ng isang partikular na Web page.

Ang gumagamit ay nalulugod na bisitahin ang mga Web page na iyon na may naka-istilong disenyo, hindi nabibigatan ng labis na graphics at animation, mabilis na naglo-load at tama na ipinapakita sa window ng Web browser.

Ang paglikha ng isang Web page ay hindi madali, ngunit marahil lahat ay gustong subukan ang kanilang sarili bilang isang taga-disenyo. At ako, sa sa kasong ito, ako ay walang pagbubukod, kaya't pinili ko ang paksang ito para sa aking gawaing kurso.

Sa aking sanaysay, sinubukan kong maunawaan kung ano ang kailangan mong malaman at magagawa upang lumikha ng isang Web page, anong software ang isang tool para sa paglikha ng mga Web page at kung paano ito epektibong gamitin.

Sa gawaing ito din ay sinuri ko ang mga pangunahing kaalaman ng programming language ng Web page - HTML, na karaniwang tinatanggap na pamantayan ng WWW. Bibigyan tayo nito ng pagkakataong maging pamilyar sa istruktura ng isang Web page at mga pamamaraan nito. tamang disenyo. Titingnan din natin ang paggawa ng website gamit ang CMS Joomla.

2. Isaalang-alang ang hypertext markup language na HTML

Maaaring umiral ang mga web page sa anumang format, ngunit tinatanggap ito bilang pamantayan Hyper Text Markup Language- isang hypertext markup language na idinisenyo upang lumikha ng naka-format na teksto na mayaman sa mga larawan, tunog, animation, mga video clip at hypertext na mga link sa iba pang mga dokumento.

Maaari kang magtrabaho sa Web nang hindi alam ang wikang HTML, dahil ang mga HTML na teksto ay maaaring malikha ng iba mga espesyal na editor at mga nagko-convert. Ngunit ang direktang pagsulat sa HTML ay hindi mahirap. Maaaring mas madali pa ito kaysa sa pag-aaral ng HTML editor o converter, na kadalasang limitado sa kanilang mga kakayahan, buggy, o gumawa ng mahinang HTML na hindi gumagana sa mga platform.

Ang wikang HTML ay may ilang mga lasa at patuloy na nagbabago, ngunit ang mga HTML na konstruksyon ay malamang na patuloy na gagamitin sa hinaharap. Sa pamamagitan ng pag-aaral ng HTML at pag-unawa dito nang mas malalim, paggawa ng isang dokumento sa simula ng pag-aaral ng HTML at pagpapalawak nito hangga't maaari, nakakagawa kami ng mga Web page na maaaring matingnan ng maraming Web browser, ngayon at sa hinaharap. Hindi nito ibinubukod ang posibilidad ng paggamit ng iba pang mga pamamaraan, tulad ng advanced na paraan na ibinigay ng Opera, Google Chrome, Internet Explorer o iba pang mga browser.

Ang pagtatrabaho sa HTML ay isang paraan upang matutunan ang mga pasikot-sikot sa paggawa ng mga dokumento sa isang standardized na wika, gamit lang ang mga extension kung talagang kinakailangan.

Ang HTML ay pinagtibay ng World Wide Web Consortium. Ito ay suportado ng lahat ng mga browser.

Dahil ang mga HTML na dokumento ay nakasulat sa ASCI I na format, anumang text editor ay maaaring gamitin upang likhain ito.

Karaniwan ang isang HTML na dokumento ay isang file na may extension na .html o . htm, kung saan ang teksto ay minarkahan ng mga HTML na tag (Tag sa Ingles - mga espesyal na built-in na tagubilin). Tinutukoy ng HTML ang syntax at paglalagay ng mga tag ayon sa kung saan ipinapakita ng browser ang nilalaman ng isang dokumento sa Web. Ang teksto ng mga tag mismo ay hindi ipinapakita ng Web browser.

Ang lahat ng mga tag ay nagsisimula sa "<" и заканчиваются символом ">". Kadalasan mayroong isang pares ng mga tag - isang panimula (pagbubukas) at isang pangwakas na (pagsasara) na tag (katulad ng pagbubukas at pagsasara ng mga panaklong sa matematika), kung saan inilalagay ang impormasyon ng markup:

Impormasyon

Narito ang panimulang tag ay ang tag

At ang mga huling -

. Ang pangwakas na tag ay naiiba lamang sa panimulang tag dahil mayroon itong mga panaklong bago ang teksto<>may simbolo" / "(slash).

Ang isang browser na nagbabasa ng HTML na dokumento ay ipinapakita ito sa isang window gamit ang HTML tag structure. Ang bawat HTML na dokumento ay dapat may tatlong pangunahing bahagi:

A) deklarasyon ng HTML;

B) Heading bahagi;

C) Katawan ng dokumento .

A) HTML na deklarasyon

At. Ang isang pares ng mga tag na ito ay nagsasabi sa tumitingin (browser) na mayroong isang HTML na dokumento na nakapaloob sa pagitan ng mga ito, at ang unang tag sa dokumento ay dapat na ang tag (sa pinakadulo simula ng dokumento), at huling -(sa pinakadulo ng dokumento).

B) Bahagi ng pamagat.

At. Sa pagitan ng mga tag na ito ay ang impormasyon tungkol sa dokumento (pamagat, mga keyword sa paghahanap, paglalarawan, atbp.). Gayunpaman, ang pinakamahalagang bagay ay ang pamagat ng dokumento, na nakikita natin sa tuktok na linya ng window ng browser at sa mga listahan ng "Mga Paborito (BookMark)". Ginagamit ng mga espesyal na programa ng spider ng search engine ang pamagat ng dokumento upang buuin ang kanilang mga database. Upang magbigay ng pamagat sa iyong HTML na dokumento, inilalagay ang teksto sa pagitan ng mga tag At.

Ang aking unang pahina

C) Ang katawan ng dokumento.

Ang ikatlong pangunahing bahagi ng dokumento ay ang katawan nito. Kaagad itong sumusunod sa pamagat at matatagpuan sa pagitan ng mga tag At. Ang una ay dapat na pagkatapos mismo ng tag, at ang pangalawa ay bago ang tag. Ang katawan ng isang HTML na dokumento ay kung saan inilalagay ng may-akda ang impormasyong naka-format gamit ang HTML.

Ang aking unang pahina ..........

Ngayon ay maaari na naming isulat ang HTML code para sa aming pahina:

Ang aking unang pahina Ang aking mga pahina ay dito!

Sa seksyong BODY, lahat ng tab at line break ay binabalewala ng browser at hindi nakakaapekto sa pagpapakita ng page sa anumang paraan. Samakatuwid, ang linya feed sa pinagmulang teksto Hindi magsisimula ang HTML na dokumento bagong linya sa tekstong ipinapakita ng browser sa kawalan ng mga espesyal na tag. Ang panuntunang ito ay napakahalagang tandaan at huwag kalimutang maglagay ng mga tag na naghihiwalay sa mga linya, kung hindi, ang teksto ay hindi magkakaroon ng mga talata at ito ay magiging hindi nababasa.

Upang magsimula ng bagong linya, gamitin ang tag
(pinaikling mula sa English break - interrupt). Ang tag na ito ay nagiging sanhi ng browser na magpakita ng karagdagang teksto mula sa simula ng susunod na linya. Walang closing tag na ginamit para dito. Maginhawa kung kailangan mong magsulat mula sa isang bagong linya sa isang punto nang hindi nagsisimula ng isang bagong talata, halimbawa, sa isang tula. Ang paggamit nito muli ay nagpapahintulot sa iyo na magpasok ng isa o higit pang mga blangkong linya, na inililipat ang susunod na fragment ng pahina pababa.

Ang tuluy-tuloy na teksto na walang mga puwang ay hindi napakadaling basahin; Nahahati sa mga talata, ang teksto ay nakikita nang mas mabilis. Ginagamit ang tag upang magsimula ng bagong talata

(Talata sa Ingles - talata). Ang tag na ito, bilang karagdagan sa pagsisimula ng isang bagong linya, ay naglalagay ng isang walang laman na linya. Ngunit paulit-ulit na pag-uulit

Unlike
, ay hindi hahantong sa paglitaw ng ilang walang laman na linya, magkakaroon pa rin ng parehong walang laman na linya.

Sa loob ng mga bracket ng isang tag, bilang karagdagan sa pangalan nito, maaari ding ilagay ang mga katangian. Ang mga ito ay pinaghihiwalay mula sa pangalan at mula sa bawat isa sa pamamagitan ng mga puwang (isa o higit pa), at nakasulat sa anyo attribute_name ="ibig sabihin". Kung ang halaga ay hindi naglalaman ng mga puwang, maaaring alisin ang mga quote, ngunit hindi ito inirerekomenda. Tag

Maaaring maglaman ng isang ALIGN attribute na tumutukoy sa paragraph alignment. Bilang default, ang isang talata ay nakahanay sa kaliwa ALIGN="left". Ang right alignment ALIGN="right" at center alignment ALIGN="center" ay posible rin. Kapag gumagamit ng mga katangian, dapat kang gumamit ng pansarang tag pagkatapos ng na-format na teksto

. Kung wala ito, pagkatapos ay isang bagong tag

Nangangahulugan ng pagsasara ng nauna, ayon sa pagkaka-nest

Imposible. Posible ring isentro ang text gamit ang tag

Ngayon ay maaari na tayong maglagay ng ilang teksto na may iba't ibang pagkakahanay sa aming Web page:

Ang aking unang pahina

Darating ang akin mga personal na pahina!

Sa kanila mahahanap mo ang: - isang kuwento tungkol sa akin at sa aking mga libangan; - aking mga litrato.

Mula sa isa sa aking mga pahina ito ay magiging posible
padalhan ako ng email.

3. Mga tool para sa paglikha ng mga Web page

3.1 Mga editor ng HTML

Pinipili ng bawat isa ang kanilang sariling tool para sa paglikha ng mga Web page. Ito ay maaaring MS FrontPage o Macromedia DreamWeaver, Allaire HomeSite o 1st Page. At ang ilan ay gumagamit ng isang simpleng text editor, tulad ng Notepad.

Ang mga editor ng teksto ay maaari lamang magamit upang lumikha ng maliliit na pahina, dahil mayroon silang maraming mga kawalan: ang mga proyekto ay hindi suportado, walang "pag-highlight" ng teksto, sa pangkalahatan, ito ay lubhang hindi maginhawa upang gumana.

Ang pangunahing kawalan ng MS FrontPage ay ang pagbuo nito ng napakalaking HTML code (napakaraming hindi kinakailangang bagay), kaya ang mga pahina ay lumalabas na malaki, na nakakaapekto sa bilis ng paglo-load. Bukod dito, kapag lumilikha ng mga Web page sa editor na ito ay nakikita mo ang isang bagay, ngunit sa window ng browser ay nakikita mo ang isang bagay na ganap na naiiba. Ang mga pahina ay lumalabas na medyo baluktot, kaya upang lumikha ng mga de-kalidad na Web page, inirerekumenda na gamitin ang mga pakete na tatalakayin sa ibaba.

Magsisimula tayo sa sikat na Macromedia DreamWeaver. Ang Macromedia ay itinuturing na isang pinuno sa paggawa ng software para sa paglikha ng mga website, pati na rin ang isang trendsetter sa lugar na ito.

DreamWeaver 3.0

Ngunit ang DreamWeaver ay ilang hakbang na nauuna sa iba pang mga editor ng WYSIWYG, pangunahin dahil ito ay bumubuo ng napakalinis na HTML. Hinahayaan ka ng DreamWeaver na alisin ang paulit-ulit na gawain kapag lumilikha ng mga pahina (halimbawa, layout ng teksto) sa pamamagitan ng paggamit mga opsyon na "record command sequence" ( itatala mo ang pagkakasunud-sunod ng mga utos na iyong ginawa, pagkatapos ay pindutin, halimbawa, CTRL+P, at pinapatugtog ng DreamWeaver ang lahat sa parehong pagkakasunud-sunod.

HomeSite 4.0

Ang susunod na editor ay HomeSite 4 - para sa paggawa ng mga pahina nang manu-mano, i.e. para sa HTML connoisseurs. Makukuha mo ang ganap na kontrol sa HTML code, at posibleng i-optimize ang iyong page para sa isa sa tatlo mga sikat na browser(MSIE, Google Phrome, Opera).

Ang HomeSite ay naglalaman ng dalawang pangunahing mga mode: I-edit at Disenyo. Ang design mode ay isang uri ng WYSIWYG editor na gumagawa ng HTML code, at kung maglo-load ka ng HTML code ng ibang tao, muling isusulat ng HomeSite ang lahat sa sarili nitong paraan.

Ang isa pang natatanging tampok ng HomeSite ay ang "pagdikit" nito sa Dreamweaver. Ang HomeSite ay may "Dreamweaver" na button at kasama rin bilang pamantayan. Gayunpaman, mayroon ding kakayahan ang DreamWeaver na ikonekta ang HomeSite bilang isang editor para sa pag-edit ng HTML code.

Isa sa mga pinakabagong HTML editor ay ang EVR Soft 1st Page v2.

Ang kanyang slogan ay "Gumawa ng mga website ng 1st class!" (“Bumuo ng Magagandang Website!”). Ang editor ay naglalaman ng ilang mga mode - Normal, Easy, Advanced/Expert at Hardcore, iyon ay, maaari mong piliin ang iyong antas at kalaunan ay lumipat sa isang mas mataas. Ang isa pang tampok ay isang medyo malaking koleksyon ng mga script sa JavaScript at DHTML. Ang lahat ng ito ay medyo maginhawang nahahati sa mga kategorya.

3.2 Mga graphic editor

Ang paglikha at pag-optimize ng mga graphics ay isang kumplikado at pabagu-bagong gawain. Siyempre, posible na lumikha ng isang Web page nang hindi gumagamit ng mga graphics - gamit ang mga font, script at style sheet (CSS) - at ito ay magiging maganda at naka-istilong. Ngunit ang huling hitsura ng dokumento ay nakasalalay sa isang malaking bilang ng iba't ibang mga kadahilanan, tulad ng: ang lapad ng window ng browser, mga preset ng browser, default na laki ng font, pangalan ng font at kulay. Bilang karagdagan, hindi lahat ng mga script at estilo ay sinusuportahan ng lahat ng mga browser. Kung ginamit ang mga graphics, makikita ito ng bisita sa iyong pahina nang eksakto tulad ng ginawa mo at makikita ito.

Ang pangunahing kahirapan sa pagtatrabaho sa Web graphics ay ang bandwidth ng mga channel sa Internet, sa karamihan ng mga kaso, ay napakababa at agad kang makakaharap sa mga problema - kung paano gawin graphic na file maliit sa volume, ngunit magandang kalidad, anong mga programa at diskarte ang gagamitin kapag ino-optimize ito.

Ito ang pinag-uukulan ng seksyon sa vector at raster graphic editor, na makapangyarihang mga tool sa pagpoproseso ng imahe sa mga may kakayahang kamay.

Bago isaalang-alang ang vector at raster graphics editor, dapat mong maunawaan ang pagkakaiba sa pagitan ng vector at raster na representasyon ng isang imahe.

Raster graphics ay isang grid (raster), ang mga cell nito ay tinatawag na mga pixel. Ang bawat pixel sa isang raster na imahe ay may mahigpit na tinukoy na lokasyon at kulay, samakatuwid ang anumang bagay ay kinakatawan ng programa bilang isang hanay ng mga may kulay na pixel. Nangangahulugan ito na ang gumagamit, kapag nagtatrabaho sa mga larawan ng raster, ay hindi gumagana sa mga partikular na bagay, ngunit sa mga pangkat ng mga pixel na bumubuo sa kanila.

Ang mga raster na imahe ay nagbibigay ng mataas na katumpakan sa paghahatid ng mga gradasyon ng mga kulay at mga halftone, pati na rin ang mataas na detalye ng imahe, kaya sila ang pinakamainam na paraan ng pagtatanghal mga larawan ng tono, tulad ng mga na-scan na litrato.

Palaging ginagamit para sa raster graphics nakapirming dami mga pixel, ibig sabihin. Ang kalidad ng isang raster na imahe ay direktang nakasalalay sa resolusyon ng kagamitan. Nangangahulugan ito na ang anumang pagbabago sa imahe (pag-ikot, pagpapalaki, atbp.) ay humahantong sa patuloy na pagbaluktot ng imahe at ang mga hangganan ng mga bagay ay hindi pantay.

Mga imaheng vector ay nabuo batay sa mga numerong inilarawan sa matematika na tinatawag na mga vector, at ang hitsura ng imahe ay tinutukoy ng mga parameter ng mga vector. Sa madaling salita, ang mga vector graphics ay binubuo ng mga kurba na may mga coordinate, kulay at iba pang mga parameter, pati na rin ang mga saradong lugar na puno ng isang partikular na kulay. Ang mga hangganan ng mga lugar na ito ay inilalarawan din ng mga kurba. Ang vector image file ay naglalaman ng mga coordinate at parameter ng mga curves.

Pagproseso ng mga resulta mga imaheng vector huwag umaasa sa resolution ng kagamitan, kaya maaari mong arbitraryong baguhin ang kanilang mga parameter (laki, kulay, hugis, atbp.) - ang kalidad ay hindi lumala. Ginagamit ang mga vector graphics kapag gumagawa ng mga digital na bagay gamit ang maliliit na laki ng point (mga laki ng font) o mga bagay tulad ng mga logo na nangangailangan ng malulutong na mga outline at walang limitasyong scalability.

Ang mga graphic na pakete (mga editor) ay nahahati din sa dalawang uri: raster at vector. Tingnan natin ngayon ang pinakasikat sa kanila.

A) Mga editor ng Raster graphics

Ang Microsoft Paint ay isang simple (o mas mainam na sabihin, ang pinakasimpleng) editor na kasama sa karaniwang pakete ng mga operating system. Mga sistema ng Microsoft. Mayroon itong hanay ng mga simpleng function (brush, lapis, pambura, atbp.) na nagbibigay-daan sa iyong lumikha ng mga simpleng larawan. Sa kasamaang palad, halos hindi ito angkop para sa pagproseso ng graphics. Ang larawang nakikita mo sa kanan ang pinakamaraming magagawa ng editor na ito.

Adobe Photoshop - ngayon ito ang pinakamalakas na pakete para sa propesyonal na pagproseso raster graphics. Ito ay isang buong complex na may maraming mga posibilidad para sa pagbabago ng isang raster na imahe, may isang malaking hanay ng iba't ibang mga filter at epekto, at posible na ikonekta ang mga tool mula sa mga independiyenteng tagagawa.

Ang package ay nag-aalok, halimbawa, ng mga tool para sa pagpapanumbalik ng mga nasirang larawan, pag-retouch ng mga larawan o paglikha ng pinakakahanga-hangang mga collage na maiisip ng ating imahinasyon. Sa pangkalahatan, ang potensyal ng package na ito ay talagang napakalaki. Simula sa bersyon 5.5, kasama sa package ang programa Adobe ImageReady, pagbibigay malalaking pagkakataon sa pagpoproseso ng graphics para sa WEB (pag-optimize ng imahe, paglikha mga animated na gif, "pagputol" ng mga larawan sa mas maliliit na larawan, atbp.). Ang motto ng mga developer ng Adobe Photoshop - "Camera ng iyong isip" - ay nagpapahiwatig hindi lamang ng teknikal na kahusayan, kundi pati na rin ang kumpletong kalayaan ng pagkamalikhain, kung saan ang isang taong nagtatrabaho sa program na ito ay tiyak na mapapahamak.

PhotoPaint- isa pang pantay na sikat na graphic editor (mula sa package Corel Draw) para sa pagproseso ng raster graphics, nakikipagkumpitensya sa Adobe Photoshop. Mayroon din itong lahat ng kinakailangang tool para sa pagproseso ng graphics, iba't ibang mga filter, mga texture. Ang pagkakaiba lamang ay sa kadalian ng paggamit, interface at bilis ng paglalapat ng mga filter - ang application ay medyo mabagal.

Pintor- ang editor ay nagbibigay ng mahusay na mga pagkakataon para sa pagtulad sa mga tunay na tool sa pagguhit: grapayt, chalk, langis, atbp. Pinapayagan ka nitong gayahin ang texture sa ibabaw ng mga materyales, pagpipinta, at lumikha ng animation. Tunay na maginhawa para sa pag-unlad mga larawan sa background o mga Web page sa istilo ng pagpipinta. Gamit ang program na ito pakiramdam mo ay isang tunay na artista.

Mayroon ding bilang ng mga editor ( Microsoft Editor ng Larawan,Microsoft PhotoDRAW), na nagpapahintulot din sa pagpapatupad ng pinakasimpleng mga gawain, ngunit hindi nagbibigay-kasiyahan sa mga pangangailangan ng mga propesyonal.

B) Mga editor ng vector graphics

Adobe Illustrator- Binibigyang-daan ka ng package na lumikha, magproseso at mag-edit ng mga vector graphics. Sa mga tuntunin ng kapangyarihan ito ay katumbas

raster editor Adobe Photoshop: ay may katulad na interface, nagbibigay-daan sa iyo upang ikonekta ang iba't ibang mga filter at epekto, naiintindihan ang marami mga graphic na format, kahit na tulad ng. cdr (Corel Draw) at. swf (Flash).

CorelDraw- tiyak na sikat pakete ng graphics hindi maaaring gawin nang walang paraan para sa pagproseso vector graphics. Ang pakete ay halos kasing lakas ng mga graphics card Mga editor ng Adobe Photoshop at Adobe Illustrator. Bilang karagdagan sa pagpoproseso ng vector graphics, ang package na ito ay naglalaman ng isang raster graphics processor (Photo Paint), isang image tracer, isang font editor, paghahanda ng texture at paggawa ng barcode, pati na rin ang malalaking koleksyon ng mga larawan (CorelGallery).

Adobe Streamline- isa pang produkto ng Adobe na idinisenyo para sa pagsubaybay (pagsasalin) ng mga raster graphics sa vector graphics. Ito ay isang maliit ngunit napaka-kapaki-pakinabang at makapangyarihang produkto. Lalo na kapaki-pakinabang kung gagawa ka ng mga Web page gamit ang vector graphics, gaya ng teknolohiyang Flash.

4. Paglikha ng website gamit ang CMS Joomla 1.5.7

Smoothly, ayon sa prinsipyo mula sa simple hanggang sa kumplikado, lumipat tayo mula mga static na pahina WWW sa dynamic. Upang magawa ito, kailangan namin ng kaalaman sa mga wika sa Web PHP, Jscript, Perl, jQuery at least ang wika ng istruktura Mga query sa MySQL. Okay lang, ilang taon lang at ikaw ay isang pro, na may kakayahang gumawa ng mga ganitong multifunctional na site, kung saan ang mga pahina ay nabuo sa mabilisang, kung saan mayroong isang database ng mga kliyente ng forum, mga pag-login, mga password, pagkakakilanlan, pagpapatunay, pagkonekta ng mga animation at marami pang iba.

Ngunit hindi kinakailangan na magkaroon ng kaalaman sa lahat ng mga wika upang lumikha ng isang dynamic na multifunctional na website. Mayroon akong sapat na kaalaman sa HTML, SCC, PHP, 3Ds Max, Photoshop at SMC Joomla.

Ang Joomla ay isang content management system na nakasulat sa PHP at JavaScript, gamit ang MySQL database bilang storage. Ay libreng software na ipinamamahagi sa ilalim Lisensya ng GNU GPL.

Pangunahing tampok:

1. Maaaring palawakin ang functionality gamit ang mga karagdagang module (extension, plugins).

2. Security module para sa multi-level na authentication ng mga user at administrator.

3. Pinapadali ng sistema ng template na baguhin hitsura site.

4. Nako-customize na mga layout ng module, kabilang ang kaliwa, kanan at gitnang mga bloke ng menu.

5. Kasama sa mga bentahe ng system ang katotohanan na maaari mong isulat ang lahat ng mga module, mga bahagi, mga plugin, mga template sa iyong sarili, ilagay ang mga ito sa isang structured na direktoryo ng mga extension o i-edit ang mga ito umiiral na extension sa iyong sariling paghuhusga.

Maaari kang magtrabaho kasama ang Joomla sa isang hosting server sa Internet (mga karagdagang gastos, at marami ang nakasalalay sa bilis ng Internet). Mas gusto kong magtrabaho sa isang lokal na server. Para dito pinili ko ang Apache/2.2.4 (Win32) mod_ssl/2.2.4 OpenSSL/0.9.8d PHP/5.2.4 Server sa 127.0.0.1 Port 80.

Kaya, naka-install lokal na server. Sa localhost/home/www/ directory, lumikha ng isang folder kung saan inilalagay namin ang Joomla mismo. Gusto kong tandaan na hindi gumagana nang tama ang Joomla sa ilalim ng PHP5.3.1. Ang mga bahagi ng mga forum ng FireBoard at Kunena ay patuloy na gumagawa ng mga error sa site, kailangan mong i-edit ang php file. ini at huwag paganahin ang mga mensahe ng error, dahil ang aksyon mismo ay nangangako ng mga hindi inaasahang pangyayari para sa site. Para sa kadahilanang ito, inirerekomenda kong pumili bersyon ng PHP 5.2.4, matatag na operasyon para sa lahat ng mga plugin, module at mga bahagi. Pagkatapos i-install ang Joomla sa pamamagitan ng browser, lumikha ng admin user sa MySQL at gamitin ang kanyang login at password upang pumunta sa admin panel. Susunod, kailangan mong pumili ng isang template para sa site. Sa unang sulyap ay tila napakadali, ngunit ang paghuhukay ng mas malalim ay kumbinsido ka na 80% ng oras ay ginugol sa paggawa ng makabago ng template na ito. Samakatuwid, inirerekumenda ko ang pagpili ng pinaka-angkop na template para sa iyong mga pangangailangan, hindi nakakalimutan ang tungkol sa mga module na ipapakita. Susunod, ikinonekta namin ang lahat ng pag-andar ng site: pagpaparehistro, forum, mga slide show, mga banner, mga file para sa karera, on-line na video, audio, pag-edit, lahat ng ipinapakitang pahina. Pangunahing nagtatrabaho kami sa Index file. php at template. css at siyempre i-configure namin ang lahat ng konektadong extension para sa aming sarili, kung saan mayroong humigit-kumulang 6000 para sa Joomla. Ang susunod ay ang pinakamagandang bahagi - ang disenyo ng website. Gamit ang raster software na Photoshop at 3Ds Max (full-feature na propesyonal sistema ng software para sa paglikha at pag-edit 3D graphics at animation, na binuo ng Autodesk, ay naglalaman ng pinakabagong mga tool para sa mga artist at multimedia professional) na lumikha ng disenyo ng template. I-edit ang header at gawin itong hitsura sa paraang gusto mo.

Konklusyon

Dahil sa mabilis na pag-unlad ng Web programming at ang paglikha ng maraming CMS, ang gawain ng isang Web designer ay naging mas madali. Ngayon, upang lumikha ng isang multifunctional, malakas na dynamic na web portal, sapat na upang makabisado ang ilang mga programming language (kung magdaragdag kami ng mga extension at script), maging bihasa sa mga graphic at raster na programa, at magkaroon ng kaunting inspirasyon, pagbabago at kasanayan.

Panitikan

1. Kotorev D.V., Kostarev A.F. "PHP 5 o ang pinakakumpletong manual sa script." Petersburg 2005

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

3. A. Matrosov, A. Sergeev, M. Chaunin "HTML 4.0 sa orihinal"

4. Isaacs S. "Dynamic na HTML"

5. Bayens J. “Web programming gadgets”

6. Bursov M.V. atbp. "Mga pangunahing kaalaman sa pagtatrabaho sa Dreamweaver HTML editor. Manual na pang-edukasyon"

7. Velikhov V. "Handbook ng HTML 4.0"

MINISTRY OF EDUCATION AND SCIENCE OF UKRAINE

SKHIDNOUKRAINIAN NATIONAL UNIVERSITY

Pinangalanan pagkatapos ng Volodymyr Dahl

Kagawaran ng Computer Science

Sa pamamagitan ng disiplina

Disenyo ng computer at multimedia

Mag-aaralBoldakova I.V.

1. Panimula

3.1 Mga editor ng HTML

4. Paglikha ng website gamit ang CMS Joomla 1.5.7

Panitikan

1. Panimula

Ang mga web page, na sumusuporta sa teknolohiyang multimedia, ay pinagsama ang iba't ibang uri ng impormasyon: teksto, graphics, tunog, animation at video. Ang tagumpay nito sa Internet ay higit na nakasalalay sa kung gaano kahusay at kaganda ang pagkakagawa ng isang partikular na Web page.

Ang paglikha ng isang Web page ay hindi madali, ngunit marahil lahat ay gustong subukan ang kanilang sarili bilang isang taga-disenyo. At sa kasong ito, hindi ako eksepsiyon, kaya naman pinili ko ang paksang ito para sa aking gawaing kurso.

Sa gawaing ito din ay sinuri ko ang mga pangunahing kaalaman ng programming language ng Web page - HTML, na karaniwang tinatanggap na pamantayan ng WWW. Ito ay magbibigay sa atin ng pagkakataong maging pamilyar sa istruktura ng isang Web page at ang mga pamamaraan para sa wastong disenyo nito. Titingnan din natin ang paggawa ng website gamit ang CMS Joomla.

2. Isaalang-alang ang hypertext markup language na HTML

Maaari kang magtrabaho sa Web nang hindi alam ang wikang HTML, dahil ang mga tekstong HTML ay maaaring malikha ng iba't ibang mga espesyal na editor at converter. Ngunit ang direktang pagsulat sa HTML ay hindi mahirap. Maaaring mas madali pa ito kaysa sa pag-aaral ng HTML editor o converter, na kadalasang limitado sa kanilang mga kakayahan, buggy, o gumawa ng mahinang HTML na hindi gumagana sa mga platform.

Ang pagtatrabaho sa HTML ay isang paraan upang matutunan ang mga pasikot-sikot sa paggawa ng mga dokumento sa isang standardized na wika, gamit lang ang mga extension kung talagang kinakailangan.

Ang HTML ay pinagtibay ng World Wide Web Consortium. Ito ay suportado ng lahat ng mga browser.

Dahil ang mga HTML na dokumento ay nakasulat sa ASCI I na format, anumang text editor ay maaaring gamitin upang likhain ito.

Impormasyon

Narito ang panimulang tag ay ang tag

At ang mga huling -

. Ang pangwakas na tag ay naiiba lamang sa panimulang tag dahil mayroon itong mga panaklong bago ang teksto<>may simbolo" / "(slash).

Ang isang browser na nagbabasa ng HTML na dokumento ay ipinapakita ito sa isang window gamit ang HTML tag structure. Ang bawat HTML na dokumento ay dapat may tatlong pangunahing bahagi:

A) HTML na deklarasyon;

B) Heading bahagi;

C) Katawan ng dokumento .

A) HTML na deklarasyon

B) Bahagi ng pamagat.

Ang aking unang pahina

C) Ang katawan ng dokumento.

Ang aking unang pahina ..........

Ngayon ay maaari na naming isulat ang HTML code para sa aming pahina:

Ang aking unang pahina Ang aking mga pahina ay dito!

Sa seksyong BODY, lahat ng tab at line break ay binabalewala ng browser at hindi nakakaapekto sa pagpapakita ng page sa anumang paraan. Samakatuwid, ang isang line break sa source text ng isang HTML na dokumento ay hindi magsisimula ng bagong linya sa text na ipinapakita ng browser maliban kung may mga espesyal na tag. Ang panuntunang ito ay napakahalagang tandaan at huwag kalimutang maglagay ng mga tag na naghihiwalay sa mga linya, kung hindi, ang teksto ay hindi magkakaroon ng mga talata at ito ay magiging hindi nababasa.

Ang tuluy-tuloy na teksto na walang mga puwang ay hindi napakadaling basahin; Nahahati sa mga talata, ang teksto ay nakikita nang mas mabilis. Ginagamit ang tag upang magsimula ng bagong talata

(Talata sa Ingles - talata). Ang tag na ito, bilang karagdagan sa pagsisimula ng isang bagong linya, ay naglalagay ng isang walang laman na linya. Ngunit paulit-ulit na pag-uulit

Unlike
, ay hindi hahantong sa paglitaw ng ilang walang laman na linya, magkakaroon pa rin ng parehong walang laman na linya.

. Kung wala ito, pagkatapos ay isang bagong tag

Nangangahulugan ng pagsasara ng nauna, ayon sa pagkaka-nest

Imposible. Posible ring isentro ang text gamit ang tag

Ngayon ay maaari na tayong maglagay ng ilang teksto na may iba't ibang pagkakahanay sa aming Web page:

Ang aking unang pahina

Ang aking mga personal na pahina ay dito!

Sa kanila mahahanap mo ang: - isang kuwento tungkol sa akin at sa aking mga libangan; - aking mga litrato.

Mula sa isa sa aking mga pahina ito ay magiging posible
padalhan ako ng email.

3. Mga tool para sa paglikha ng mga Web page

3.1 Mga editor ng HTML

Task Force sa Internet Engineering) naglathala ng draft na panukala para sa isang pamantayang HTML

Istruktura ng Dokumento ng HTML

Ang isang HTML 4 na dokumento ay binubuo ng tatlong bahagi:

isang string na naglalaman ng impormasyon ng bersyon ng HTML,
pagdedeklara ng seksyon ng header (nakatali sa elemento ng HEAD),
ang katawan na naglalaman ng mismong dokumento.

Ang katawan ay maaaring nakapaloob sa mga elemento ng BODY o FRAMESET. Mga character na whitespace (mga puwang, mga bagong linya, mga character sa tab, at komento) ay maaaring lumitaw bago o pagkatapos ng seksyong ito.

Simpleng page

Hello mundo!

Nagsisimula ang dokumento sa isang elemento uri dokumento, o doctype. Inilalarawan nito kung anong uri ng HTML ang gagamitin upang matukoy ng client application ng user kung paano i-interpret ang dokumento at magpasya kung sinusunod nito ang mga panuntunang sinasabi nitong sinusunod.

Pagkatapos nito, makikita mo ang pambungad na tag ng elemento ng html. Ito ay isang pambalot sa buong dokumento. Ang pagsasara ng html tag ay ang huling bagay sa anumang HTML na dokumento.

Sa loob ng elemento ng html mayroong isang elemento ng ulo. Naglalaman ito ng impormasyon tungkol sa dokumento (metadata). Sa loob ng ulo ay isang elemento ng pamagat na tumutukoy sa pamagat na "Simple page" sa menu bar.

Pagkatapos ng elemento ng ulo ay darating ang elemento ng katawan, na siyang balot na naglalaman ng aktwal na nilalaman ng pahina - sa kasong ito, ang elementong header lamang sa unang antas (h1), na naglalaman ng tekstong "Hello world!" .

Ang mga elemento ay kadalasang naglalaman ng iba pang mga elemento. Ang katawan ng dokumento ay palaging naglalaman ng maraming nested na elemento.

Ang mga seksyon ng pahina ay lumikha ng pangkalahatang istraktura ng dokumento, at maaaring maglaman ng mga subsection. Maaari rin silang maglaman ng mga heading, talata, listahan, atbp. Ang mga talata ay maaaring maglaman ng mga elemento na lumilikha ng mga link sa iba pang mga elemento, mga panipi, mga highlight, atbp.

Syntax ng elemento ng HTML

Ang isang pangunahing elemento sa HTML ay binubuo ng dalawang tag na nakapalibot sa isang bloke ng teksto. May mga elemento na hindi bumabalot ng teksto, at sa halos lahat ng kaso, ang mga elemento ay maaaring maglaman ng mga subelement (tulad ng html na naglalaman ng ulo at katawan sa halimbawa sa itaas).

Maaaring mayroon din ang mga item mga katangian, na maaaring baguhin ang pag-uugali ng elemento at magpakilala ng karagdagang halaga.

Sa halimbawang ito, ang elemento ng div (ang seksyon ng pahina, ang paraan ng paghahati-hati ng mga dokumento sa mga lohikal na bloke) ay may idinagdag na katangian ng id na nakatakda sa masthead. Ang div element ay naglalaman ng h1 element (ang una, o pinakamahalaga, level heading), na naglalaman naman ng ilang text. Ang ilan sa tekstong ito ay nakabalot sa isang elemento abbr(na ginagamit upang tukuyin ang abbreviation extension) na mayroong katangiang pamagat na ang halaga ay nakatakda sa Hypertext Markup Language.

Maraming mga katangian sa HTML ang karaniwan sa lahat ng elemento, ngunit ang ilan ay partikular sa isang partikular na elemento o elemento. Lahat sila ay may anyo:

keyword="value"

Ang halaga ay dapat ilagay sa isa o dobleng mga panipi (sa ilang mga sitwasyon ang mga quote ay maaaring nawawala, ngunit ito ay hindi masyadong mahusay sa mga tuntunin ng predictability, pag-unawa).

Ang mga katangian at ang kanilang mga posibleng halaga ay pangunahing tinutukoy ng mga detalye ng HTML (http://www.w3.org/TR/html401/index/attributes.html), kaya hindi ka maaaring lumikha ng iyong sariling mga katangian. Ang tanging tunay na pagbubukod ay ang mga katangian ng id at klase, na ang buong halaga ay nilayon upang magdagdag ng iyong sariling kahulugan at semantika sa mga dokumento.

Ang isang elemento sa loob ng isa pang elemento ay tinatawag "kaapu-apuhan" elementong ito. Sa halimbawa sa itaas abbr ay isang anak ng h1 , na siya namang anak ng div . Sa kabaligtaran, ang div ay ang "ninuno" ng h1 na elemento.

Block-level na mga elemento at inline na elemento

Mayroong dalawang pangunahing kategorya ng mga elemento sa HTML, na tumutugma sa mga uri ng nilalaman at istraktura na kinakatawan ng mga elementong ito - mga elemento ng block level at inline na elemento.

Antas ng block nangangahulugan ng higit pa mataas na antas elemento, kadalasang nagpapaalam tungkol sa istruktura ng dokumento. Ang mga elemento sa antas ng block ay maaaring ituring na mga elemento na nagsisimula sa isang bagong linya, na humihiwalay sa kung ano ang nauna rito. Karaniwan mga elemento ng block ay talata, bullet point, heading at talahanayan.

Mga elemento ng string nakapaloob sa loob mga elemento ng istruktura block level at sumasakop lamang ng mga bahagi ng teksto ng dokumento, sa halip na mga buong lugar. Ang isang inline na elemento ay hindi nagreresulta sa isang bagong linya na lumilitaw sa dokumento, dahil sila ay mga elemento na lumilitaw sa isang talata ng teksto. Karaniwan mga elemento ng string ay hypertext link, naka-highlight na salita o parirala at maiikling sipi.

Heading

Ang ulo ng isang HTML na dokumento ay isang opsyonal na elemento ng markup. Sa una, ang pagkakaroon ng pamagat ay tinutukoy ng pangangailangan pagpapangalan sa window ng browser. Ito ay nakamit sa pamamagitan ng elemento ng markup TITLE:

Ito ang pamagat ... ...

Ang isa pang function ng HTML document header ay upang kontrolin ang trapiko ng HTTP sa pamamagitan ng elemento ng markup META. Sa kasalukuyang kasanayan ng pagho-host ng mga Web site ng kumpanya sa mga server ng provider, maaaring hindi mapangasiwaan ng mga administrator ng mga site na ito ang programa ng server. Sa kasong ito, mayroon lamang isang opsyon na natitira upang kontrolin ang palitan - sa pamamagitan ng header ng HTML na dokumento.

Ang header ng isang HTML na dokumento ay inilaan din upang ilarawan ang imahe ng paghahanap ng dokumento, na kinakailangan para sa pag-index ng dokumento ng mga robot ng search engine. Binibigyang-daan ka ng elemento ng META na mag-imbak ng mga listahan ng mga keyword at paglalarawan ng dokumento na gagamitin upang i-compile ang index search engine at lalabas bilang isang paglalarawan ng dokumento kung ang isang link dito ay ipinapakita sa panahon ng paghahanap ng keyword.

Ang mga pangunahing tag ng header ay mga elemento ng HTML markup na kadalasang matatagpuan sa head ng isang HTML na dokumento, ibig sabihin. sa loob elemento ng markup ULO:

TITLE (pamagat ng dokumento);
BASE (URL base);
ISNDEX (patern ng paghahanap);
META (meta impormasyon);
LINK (pangkalahatang mga link);
STYLE (style descriptors);
SCRIPT (mga script).

Ang pinakakaraniwang ginagamit na elemento ay TITLE, SCRIPT, STYLE. Ang paggamit ng elemento ng META ay nagpapahiwatig ng kamalayan ng may-akda sa mga panuntunan para sa pag-index ng mga dokumento sa mga search engine at ang kakayahang pamahalaan ang HTTP data exchange. Ang BASE at ISNDEX ay halos hindi ginagamit kamakailan. Tinukoy lamang ang LINK kapag gumagamit ng mga deskriptor ng style sheet sa labas ng dokumento.

Elemento ng markup Ang HEAD ay naglalaman ng ulo ng HTML na dokumento. Ibinigay elemento ng markup ay opsyonal. Kung mayroong panimulang tag elemento ng markup Maipapayo na gumamit din ng end tag elemento ng markup. Bilang default, ang HEAD na elemento ay sarado kung ang BODY container start tag o ang FRAMESET container start tag ay nakatagpo.

Ang lalagyan ng header ay ginagamit upang maglaman ng impormasyong nauugnay sa buong dokumento.

Elemento ng markup Ang TITLE ay ginagamit upang pangalanan ang isang dokumento sa World Wide Web. Kapag pumipili ng teksto para sa nilalaman ng lalagyan ng TITLE, tandaan na ito ay ipinapakita font ng system , dahil ito ang pamagat ng browser window.

TITLE container syntax pangkalahatang pananaw ganito ang hitsura:

pamagat ng dokumento

Ang header ay hindi kinakailangang lalagyan ng dokumento. Maaari itong ibaba. Ginagamit ng mga robot ng maraming search engine ang mga nilalaman ng elemento ng TITLE upang lumikha ng imahe sa paghahanap ng dokumento. Ang mga salita mula sa TITLE ay kasama sa index ng search engine. Para sa mga kadahilanang ito, palaging inirerekomenda na gamitin ang elemento ng TITLE sa mga pahina ng Web site.

Elemento ng markup Ginagamit ang BASE upang matukoy ang base URL para sa mga link ng hypertext ng dokumento na tinukoy sa hindi kumpleto (partial) na form. Bilang karagdagan, pinapayagan ka ng BASE na tukuyin ang default na window ng target na pag-download ng dokumento kapag pumipili ng hypertext link kasalukuyang dokumento. Ang BASE ay kadalasang matatagpuan sa mga pahina ng mga site na mayroong "mga salamin". Bahagi ng pangunahing mga dokumento ng server iba't ibang dahilan hindi ito inililipat sa "mirror" server. Sa kasong ito, ang isang dokumento na may sapilitang base URL ay palaging magli-link sa pangunahing server.

Ang tag ng panimulang container ay naglalaman ng isang kinakailangang katangian ng HREF, at maaaring maglaman ng isang opsyonal na katangian ng TARGET. Ang pangkalahatang syntax ng isang BASE container ay ang mga sumusunod:

Elemento ng markup Ang ISNDEX ay ginagamit upang tukuyin ang pattern ng paghahanap at minana mula sa mga naunang bersyon HTML. Sa HTML 4.0 hindi tinukoy ang container na ito.

META markup element

Ang META ay naglalaman ng impormasyon ng kontrol na ginagamit ng browser upang maipakita at maiproseso nang tama ang nilalaman ng katawan ng dokumento, halimbawa, gamit ang katangiang uri ng Nilalaman, maaari mong tukuyin ang pag-recode ng dokumento sa panig ng kliyente.

Maaari mo ring tukuyin ang iba pang mga operator gamit ang META. Halimbawa, huwag paganahin ang pag-cache ng dokumento. Upang huwag paganahin ang pag-cache, magpasok lamang ng isang tag na tulad nito sa META header:

Sa bagong bersyon ng HTTP protocol (HTTP 1.1), ang pag-cache ay kinokontrol sa pamamagitan ng Cache-Control statement. Upang makuha ang parehong resulta tulad ng sa kaso ng Pragma, sa header ng HTML na dokumento ito ay sapat na upang ipahiwatig:

Maaari mong ipagbawal ang pag-imbak ng isang dokumento pagkatapos ipasa.