Nove HTML5 strukturne oznake. Postavljanje kontakt informacija na svim stranicama
Nove HTML5 strukturne oznake. Postavljanje kontakt informacija na svim stranicama
19.04.2019Zanimljivo
Semantički HTML5 elementi jasno opisati njihovo značenje ili svrhu i za pretraživače i za web programere. Prije pojave HTML5 standarda, sva markiranja stranica se obavljala prvenstveno pomoću elemenata.
, kojima su dodijeljene klase klasa ili id identifikatori za deskriptivno označavanje (na primjer,
). Uz njihovu pomoć postavljena su zaglavlja i podnožja u HTML dokument, bočne ploče, navigaciju i još mnogo toga.
HTML5 standard je pružio nove elemente za strukturiranje, grupisanje sadržaja i označavanje tekstualnog sadržaja. Novi semantički elementi poboljšali su strukturu web stranice dodajući semantičko značenje sadržaju koji se u njima nalazi (bilo je
, postao ). Nisu postavljena pravila za prikaz izgleda elemenata, tako da se elementi mogu stilizirati kako god želite. Svi elementi su dostupni.
Prema HTML5 specifikaciji, svaki element pripada određenoj (nula ili više) kategoriji. Svaki od njih grupiše elemente sa sličnim karakteristikama. Postoje sljedeće opće kategorije:
Meta sadržaj
Streaming Content
Sadržaj odjeljka
sadržaj zaglavlja
Tekstualni sadržaj
Ugrađeni sadržaj
interaktivni sadržaj
Opis HTML5 elemenata
1. Stavka
Kategorije sadržaja: streaming sadržaja. Grupe uvodne i navigacijske elemente, opciono. Može sadržavati naslove, omotati sadržaj odjeljka stranice, obrazac za pretraživanje ili logotip. HTML dokument može sadržavati više elemenata u isto vrijeme. i mogu se postaviti bilo gdje na stranici.
opis stranice
Element ne može se postaviti unutar elemenata
2. Element
Kategorije sadržaja: Dizajniran za kreiranje navigacijskog bloka web stranice ili cijele web stranice i ne mora biti unutra . Na stranici može biti više elemenata
Ne samo da se stavke liste mogu koristiti kao elementi trake za navigaciju:
Također možete dodati naslove unutar elementa:
3. Element
Kategorije sadržaja: streaming sadržaja, sekcijski sadržaj. Koristi se za grupisanje postova - publikacija, članaka, blogova, komentara. To je samostalni zasebni blok namijenjen za višekratnu upotrebu, u pravilu počinje zaglavljem. Može se umnožavati na drugim stranicama stranice i sadržavati druge elemente unutar , čiji je sadržaj usko povezan sa sadržajem eksternog članka. Ako se na stranici nalazi samo jedan članak s naslovom i tekstualnim sadržajem, ne mora biti omotan elementom. . Preporučuje se da se element koristi samo ako će sadržaj elementa biti eksplicitno naveden u skici dokumenta.
...
4. Element
Kategorije sadržaja: streaming sadržaja, sekcijski sadržaj. Element predstavlja generički dio dokumenta. Grupira tematski sadržaj i obično sadrži naslov. To nije blok omotača, u ove svrhe je prikladnije koristiti element
. Sadržaj može biti sadržaj, dijelovi naučnih publikacija, program događaja. Početna stranica sajt se takođe može podeliti na sekcije - blok pozadinske informacije, vijesti i kontakti. Preporučuje se da se element koristi samo ako će sadržaj elementa biti eksplicitno naveden u skici dokumenta.
...
...
...
unutra
Možete kreirati roditeljske elemente sa ugniježđenim elementima , koji imaju jedan ili više elemenata . Ne moraju sve stranice biti postavljene na ovaj način, ali ovo je valjan način ugniježđenja elemenata. Na primjer, područje glavnog sadržaja stranice sadrži dva bloka sa člancima o različitim temama. To možete naglasiti postavljanjem svakog članka iste teme unutar elementa
Nature Notes
...
...
Historical Notes
...
...
5. element
Kategorije sadržaja: streaming sadržaja, sekcijski sadržaj. Grupira sadržaj koji je direktno povezan sa okolnim sadržajem, ali se može smatrati odvojenim (tj. uklanjanje ovog bloka neće utjecati na razumijevanje glavnog sadržaja). Najčešće se element postavlja kao bočni stupac (kao u knjigama) i uključuje grupu elemenata:
6. Stavka
Kategorije sadržaja: streaming sadržaja. Predstavlja podnožje sekcije koja sadrži ili korijenskog elementa. Obično sadrži podatke o autoru članka, podatke o autorskim pravima itd. Kada se koristi kao zaglavlje cijele stranice, sadržaj je dopunjen informacijama o autorskim pravima, vezama do uslova korištenja, kontakt informacijama, vezama na srodni sadržaj itd.
U jednom web dokumentu može biti više elemenata
7. Element
Kategorije sadržaja: streaming sadržaja. Koristi se za definiranje kontakt informacija za autora/vlasnika dokumenta ili članka. Za označavanje autora dokumenta, oznaka se postavlja unutar elementa
, za prikaz autora članka - unutar oznake . Obično se prikazuje kurzivom u pretraživaču.
8. Stavka
Kategorije sadržaja: streaming sadržaja. Element predstavlja glavni sadržaj dokumenta (sadržaj elementa ). Sadržaj unutar elementa mora biti jedinstven i ne ponavlja se u svim dokumentima stranice, kao što su navigacijske veze, informacije o autorskim pravima, logotipi, obrasci za pretraživanje (u slučaju da je formular za pretraživanje glavna funkcija dokumenta).
Element ne može biti dijete elemenata kao što su ,
Pudlica
O rasi
9. Element
Kategorije sadržaja: streaming sadržaja, osnovni sadržaj odjeljka. Element predstavlja samostalni sadržaj (opcionalno sa naslovom) koji je nezavisan element glavnog toka. Element se može premjestiti iz glavnog sadržaja dokumenta na bočnu traku ili aplikaciju bez utjecaja na tok dokumenta. Korištenje elementa možete dodati kratke karakteristike ilustracije, fotografije, dijagrami, isječci koda, itd.
Jesenska šuma
Element je blokovski, po širini zauzima cijelu širinu bloka kontejnera minus margine margina:
10. Element
Element - podređeni element , ne pripada nijednoj kategoriji sadržaja. Element je blok element, širina je jednaka širini elementa , zadana visina je 18px.
11. Element
Kategorije sadržaja: Određuje gregorijansko vrijeme (24 sata) ili datum, opcionalno sa pomakom vremena i vremenske zone. Tekst zatvoren u ovoj oznaci nije stilizovan od strane pretraživača. Za oznaku je dostupan atribut datetime, čiji sadržaj određuje šta će korisnik vidjeti na ekranu svog računara:
Da bi se datum automatski čitao, mora biti u formatu GGGG-MM-DD. Vrijeme, koje se također može specificirati, navedeno je u formatu HH:MM uz dodatak prefiksa za odvajanje T (vrijeme):
12. Element
Kategorije sadržaja: stream sadržaj, tekstualni sadržaj. Tekst postavljen unutar oznake , označeno prema zadanim postavkama žuta(boja pozadine i boja fonta u odabranom bloku mogu se promijeniti postavljanjem određenih css stilova). Via data tag možete označiti važan sadržaj kao i ključne riječi.
13. Element
Kategorije sadržaja: stream sadržaj, tekstualni sadržaj. Odvaja dio teksta koji mora biti izoliran od ostatka teksta za dvosmjerno oblikovanje teksta. Koristi se za tekstove pisane istovremeno na jezicima koji se čitaju s lijeva na desno i s desna na lijevo.
14. Element
Kategorije sadržaja: stream sadržaj, tekstualni sadržaj. Pojedinačna oznaka pokazuje pretraživaču gdje treba dodati dugi prijelom reda ako je potrebno.
15. Elementi za opisivanje istočnoazijskih simbola
Kategorije sadržaja: stream sadržaj, tekstualni sadržaj. Element omogućava vam da označite jedan ili više elemenata kategorije tekstualnog sadržaja rubin napomenom. Ruby anotacija se prvenstveno koristi u istočnoazijskoj tipografiji kao vodič za izgovor ili za uključivanje drugih karakteristika. Element može sadržavati: - jedan ili više tekstualnih čvorova ili elemenata ; - jedan ili više elemenata
Elementi ,
Element definira svoj ugniježđeni tekst kao osnovnu komponentu napomene. Element
Cap sugerira da je broj koji je napisan na sredini stranice i veliki je uočljiviji. Uradi to ako želiš više klijenata uspjeli su proći i razgovarati sa zaposlenima u kompaniji.
Dajte kontakte različitih odjela
Za veliku kompaniju koja svakodnevno prima ogroman tok zahtjeva klijenata, ima smisla odmah postaviti koordinate odjela prodaje, tehničke podrške, ljudskih resursa i drugih odjela. Tako ljudi mogu brzo dobiti odgovor na svoje pitanje.
Na web stranici međunarodnog restoranskog holdinga "Ginza Project" nalaze se brojevi telefona call centra, PR službe, HR odjela i drugih odjela.
Kontakti regionalnih odjeljenja ne moraju odmah biti izloženi na velikoj listi. Možete ih prikazati samo klikom na naziv željene reprezentacije. Na primjer, kao u odjeljku s kontakt informacijama na web stranici Autolacquer Refinish.
"Međunarodni centar za razmjenu" ima dosta filijala širom svijeta. Predstavnici kompanije su grupisani u kategorije po zemljama za zgodna pretraga njihove brojeve telefona i adrese.
Fotografije natpisa offline trgovine na web stranici brenda BatNorton streetwear će pomoći kupcima da se kreću po trgovačkom centru i pronađu pravi odjel.
U iskačućim prozorima pojavljuju se kontakti regionalnih kancelarija "Sinera". Ova tehnika će osloboditi stranicu za kontakt od suvišnih informacija. Korisnik će moći detaljno da se upozna sa telefonom i adresom samo trgovca koji mu je potreban.
Window Continent ima četrdeset sedam predstavništava u Moskvi. Za praktičnost kupaca, kontakti su objavljeni na stranici u tri oblika: na jednoj listi, na mapi grada i na mapi metroa. U posljednje dvije opcije, kontakt podaci se pojavljuju u iskačućem prozoru klikom na željeno predstavništvo.
Napišite kontakte zaposlenih
Osoba vjeruje drugoj osobi više nego bezličnom imenu određene kompanije. Stoga pričajte o svojim stručnjacima. Pokažite da su određeni ljudi odgovorni za svako područje rada kompanije.
Pokušajte da postavite slike zaposlenih. Razmislite o tome koje fotografije će izazvati najviše povjerenja kupaca? Možda će to biti fotografije na radnom mjestu ili fotografije u poslovnim odijelima u profesionalnom studiju.
Pokaži upute
Jasna mapa štedi vrijeme objašnjavajući svakom klijentu kako doći do kompanije. I osigurava da se većina gostiju ne izgubi.
Dobro nacrtane upute. Oni proizvode realistične slike zgrada, parkova i drugih obližnjih objekata na koje će se ljudi pozivati kada traže vašu kancelariju.
Međutim, imajte na umu da je crtanje karte puta radno intenzivan posao. I najvjerovatnije će odgovarati kompanijama koje imaju nekoliko ureda ili prodajnih mjesta, jednu ili dvije.
Ako kompanija ima mnogo ureda ili predstavništava, onda je lakše koristiti standardnu kartu umjesto ručno nacrtane. Lako ga je kreirati u bilo kojem dizajneru mapa. A kako ne biste zatrpali stranicu kontaktima na web mjestu s brojnim uputama, oni se mogu sakriti u skočnim prozorima.
Mary Tartuffle web stranica sadrži rukom nacrtane upute do dva svadbena salona.
Na renderiranoj mapi rute do Giftstar suvenirnice vidljivi su najsitniji detalji: od mačke ispod drveta do vanzemaljaca koji kradu Žigulije.
Kontakti predstavništava „Centar međunarodna razmjena» objavljeno na stranici u obliku liste. Ako kliknete na naziv predstavništva, karta će se otvoriti u iskačućem prozoru.
U odjeljku sa kontakt informacijama na web stranici PSCB banke, upute do svake kancelarije su u početku skrivene. A oni se pojavljuju klikom na naziv ureda u padajućim blokovima.
Na kontakt stranici brendirane internet prodavnice "Sony" u iskačućem prozoru korisnik bira željeni grad. I odmah nakon toga, stranica prikazuje relevantne kontakt informacije, mapu lokacije i tekstualni opis kako do tamo.
Sajt automobilskog festivala "Unlim 500+" prekidači različite šeme- putovanje do mjesta održavanja događaja, mapa autopoligona i lokacija kafića i bine na vidikovcu. izabrati željenu šemu- mijenjaju se opis na lijevoj strani stranice i karta na desnoj strani.
Na web stranici Rozovoza kontakt informacije se objavljuju u jednom iskačućem prozoru. A već unutar prozora možete prebaciti dva informacijska bloka: adrese cvjećara i broj telefona dostavne službe.
Na web stranici stambenog kompleksa "Panorama Skolkovo" moguće je dobiti upute od proizvoljne tačke na karti do prodajnog ureda.
Koristite prostor u iskačućem prozoru unutar karte
Ponekad na mapi trebate prikazati adrese i brojeve telefona nekoliko poslovnica odjednom. Ali ako sve izložiš kontakt informacije odmah, stranica će biti preopterećena, biće teško pronaći nešto konkretno.
Pogodno je sakriti kontakte u iskačućim prozorima koji se pojavljuju klikom na određenu tačku na mapi. Nedostatak velikog broja kontakt podataka raznih trgovina, predstavništava i ureda vizualno olakšava navigaciju po stranici.
Na web stranici restoranskog holdinga Ginza Project možete prebaciti četiri informacijska bloka unutar iskačućeg prozora: adresu restorana, broj telefona, radno vrijeme i najbližu metro stanicu.
Na web stranici Summer Bank, u iskačućem prozoru na karti, možete ocijeniti rad filijale na skali od 5 bodova.
Na sajtu cvjetne baze "Sve je hrpa" u pop-up prozoru, pored adrese, broja telefona i radnog vremena nalaze se i fotografije svakog skladišta.
U iskačućim prozorima na mapi za upute do centara za učenje strani jezici J&S ima dugme za poziv na mreži, vezu do Vkontakte grupe i nekoliko fotografija. A takođe i ovo" standardni set» poput adrese, broja telefona i radnog vremena.
Postavite fotografiju ulaza u kancelariju kompanije
Pokažite kako izgleda ulaz u kancelariju kompanije. Pogotovo ako nemate svoj znak sa logom na fasadi zgrade. Lakše je to jednom pokazati na fotografiji nego svaki put to objasniti kupcima riječima.
Napišite kako doći do kancelarije
Navedite nekoliko načina da opišete kako ljudi mogu doći do vas: pješice, automobilom, mimo javni prijevoz. Zamislite sebe na mjestu osobe koja je izašla iz posljednjeg vagona metroa na stanici Kaluzhskaya i prvi put se našla u ulici Profsoyuznaya. Gdje bi trebao dalje? Sa koje strane ulice? Gdje i gdje se treba obratiti? Recite nam o tome što je detaljnije moguće.
Upute za orijentaciju mogu se postaviti odjednom ili sakriti informacioni blokovi, padajući meni klikom miša.
Na stranici Giftstar suvenirnice nalaze se upute za planinare i vozače.
U Gazprom možete doći ne samo pješice, već i trolejbusom ili automobilom. Opis šetnji i izleta u ured je objavljen na stranici za kontakt.
Na web stranici Autolacquer Refinish, opisi kako doći do kompanije automobilom ili javnim prijevozom pojavljuju se klikom na odgovarajući naslov.
Na kontakt stranici klinike za reprodukciju MAMA nalaze se uputstva ne samo za korisnike trolejbusa i automobila, već i za nerezidentne goste koji putuju sa stanice ili aerodroma. Blokovi sa različiti tekstovi prebacite klikom na ikone sa automobilom, autobusom, vozom.
Obratite pažnju na tekstove
Nemojte biti dosadni, radite na tekstovima i naslovima na stranici za kontakt. Svetao naslov će zaustaviti vaše lutajuće oči na pravom mestu.
Rambler kaže da postoji mnogo razloga da mu se piše. Ali na ovom mjestu može biti neka siva fraza poput "Lista adresa e-pošte."
Pletene kape brenda "Handy Hat" želi da bude bliže svojim kupcima. Dođite, kaže, na naš Vkontaktik.
Na stranici s kontaktima proizvođača dekorativnih impregnacija "Veres" nalazi se jedna nepretenciozna fraza da su proizvodi predstavljeni u više od 300 gradova Rusije. Ovo mjesto je moglo biti standardni naslov "Naši predstavnici". Ali tada niko ne bi znao koliko je široka geografija aktivnosti kompanije.
Postavite link na kontakte u drugim dijelovima stranice
“U crno-crnom podnožju, u najudaljenijem uglu, među desetak drugih linkova, bio je skriven jedini link na sajtu do stranice za kontakt. Da to niko sigurno neće pronaći“, jeziva je priča o jednoj kompaniji koja nije htela da čuje pozive i da čita pisma ljudi.
Ako želite da što više kupaca stupi u kontakt, onda učinite link do odjeljka za kontakte što vidljivijim. Na primjer, koristite slike za dizajn veza.
Navedite link do kontakt informacija gdje god je to prikladno. Na primjer, pišete vijest o predstojećem predavanju eminentnog poslovnog trenera u vašoj kompaniji. Logično je članak dopuniti linkom na kontakt podatke kako bi se svi mogli prijaviti za predavanje.
Na svakoj stranici stranice cvjetne baze "Sve je greda" jasno je vidljiv link na adrese skladišta.
Kontakt stranica je jedna od ključnih na komercijalnoj web stranici. Treba se fokusirati ne samo na promocija pretrage(iako je i ovo važno) koliko u potpunosti informisati posjetitelje. Kontakt podaci kompanije su komercijalni faktori rangiranje - pretraživači ih koriste za procjenu resursa u smislu njegovog konkurentsku prednost ispred sličnih sajtova.
naravno, savršena stranica kontakti neće otvoriti direktan put ka TOP-3, ali će njegov doprinos biti važan u cjelokupnoj strategiji promocije. U ovom članku ćemo razmotriti kako pravilno dizajnirati stranicu "Kontakti" na web stranici kako biste dobili dodatni plus u karmi stranice u očima PS-a.
Dostupnost u 1 klik
Stranica za kontakt treba da se otvori jednim klikom sa bilo koje stranice resursa. Poželjno je postaviti link do njega u prvi vidljivi dio ekrana: to je obično horizontalni meni u zaglavlju stranice. Također možete duplicirati link u podnožju kako bi korisnik mogao pronaći načine da kontaktira čitajući informacije do kraja i nalazi se na dnu stranice. Preporučljivo je postaviti link na stranicu za kontakt što je više moguće u kodu - na taj način robot za pretragu dati mu veći prioritet.
Mikromarkiranje u izgledu
Bolje je uključiti atribute Schema.org u HTML kod tokom izgleda stranice za kontakt. Upotreba standardiziranog mikro-označavanja omogućit će pretraživačima da bolje prouče resurs, dobiju ga važna informacija i fokusirajte se na to u rezultatima Rezultati pretrage. Drugim riječima, u isječku sa ispravno podešavanje adresa, region i drugi podaci će biti prikazani, što će poboljšati mogućnost klikanja. Pretraživači pružaju detaljne informacije o korištenju Schema.org sintakse u svojoj pomoći. Takođe uključite u oznaku
naziv kompanije i <a href="https://bumotors.ru/bs/podobrat-domen-po-klyuchevym-slovam-podbiraem-domen-s-klyuchevym-slovom.html">ključna riječ</a>(na primjer, "Kontakti", "Lokacija" ili "Adresa ureda"). Na primjer, <title>Venik Company - Kontakti»
Korištenje potrebnih elemenata
Kontakt stranica treba da sadrži puna lista načini kontaktiranja kompanije (uključujući fizičku adresu), informacije o načinu rada. Dajte svojim klijentima što je više moguće informacija i manje je vjerovatno da ćete morati odgovarati na "glupa" pitanja o tome kako nazvati odjel prodaje ili gdje poslati komercijalni zahtjev. Obavezni elementi stranice "Kontakti":
telefonski broj sa pozivnim brojem (broj fiksnog telefona je uvijek poželjniji od broja mobilnog). Još bolje, ako kompanija koristi besplatni broj sa šifrom 8(800). Brojevi mobilnih telefona trebaju biti sekundarni, a ne primarni. Ne škodi navesti brojeve ključnih stručnjaka kompanije;
adresa - potrebno je navesti stvarnu poštanska adresa sa indeksom. Ovo uvelike povećava nivo povjerenja u kompaniju (ako je na stranici za kontakt - samo broj mobitela i polje povratne informacije, opravdano se postavlja pitanje - od koga se ona krije?);
Email. U ovom slučaju, bolje je i objaviti glavna adresa i adrese ključnih stručnjaka/odjeljenja;
raspored rada - potrebno je dati informacije o radnom vremenu, satima prijema ključnih stručnjaka, pauzama za ručak, radu vikendom. korisna stvarće biti indikacija vremena prije zatvaranja, na primjer: "Ostalo je 1 sat i 14 minuta do zatvaranja radnje.";
upute za vožnju - mogu se organizirati pomoću ugrađenih Yandex.Maps ili Google mapa. Rutu je bolje popratiti tekstualnim komentarom za vozače i pješake, dati informacije o dostupnosti parkinga, sistemu propusnica. Za punu sliku - dodajte GPS koordinate, posebno ako se vaša kompanija ne nalazi na malo poznatom mjestu;
ulaz u zgradu - najbolje rješenje bit će fotografija koja vam omogućava da precizno vidite potrebna vrata. Također se može dopuniti kontroliranim videom pomoću tehnologija virtuelne stvarnosti na google mapama.
Dostupnost dodatnih elemenata
Ako na stranici navedete gore opisane informacije, u većini slučajeva to će biti dovoljno potencijalnim klijentima ili su partneri pronašli način da vas kontaktiraju i odvezu se do vaše kancelarije. Ali ove mogućnosti se mogu proširiti pružanjem dodatnih informacija. To uključuje:
sredstva onlajn komunikacije - sažeti oblici povratnih informacija (bukvalno - ime, polje za e-mail adresa ili telefon, kutija za poruke), Skype;
personalizacija zaposlenih - objavljivanje fotografija i imena menadžera i ključnih stručnjaka;
video ili grafika - fotografija ureda, video s pješačkom rutom;
pravni podaci - OJMK, PIB, KPP, pravna adresa, puno ime i prezime direktora i drugi podaci potrebni partnerima;
dodajte QR kod s osnovnim informacijama o putovanju;
dugme "štampaj tekstualnu verziju".
Ako imate puno posjetitelja i aktivnih kupaca, potrebno je da unesete captcha za obrazac za povratne informacije, što će vam pomoći da odsiječete veliki broj neželjena pošta. Ali u isto vrijeme, ne zaboravite da je captcha faktor „odvraćanja“ za brojne posjetitelje koji se mogu predomisliti o slanju poruke.
Šta je dobro, šta je loše
Pred vama - dvije stranice kontakata. Prvi od njih je u TOP-10 Yandexa, drugi je izvan TOP-50. Koristeći stečeno znanje, sami procijenite šta je uzrokovalo takvu razliku.
Ispravan dizajn stranice "Kontakti"
Nepravilan dizajn stranice "Kontakti"
Šta je sa kontaktima filijala?
Ako kompanija ima više filijala u istom gradu ili predstavništva u regijama, potrebno je voditi računa o kreiranju posebnih stranica za kontakt za svaki od odjela. Ako se radi o 2-3 poslovnice u istom gradu, preporučljivo je navesti njihove kontakte na jednoj stranici, ali u isto vrijeme ne treba dozvoliti da se stranica pretvori u „list“. Ako ima mnogo adresa, kreirajte odvojena stranica za svaku, a na opštoj stranici napraviti mapu sa oznakama i linkovima ka svim odjeljenjima odn kratka lista sa linkovima. Ovo će se svidjeti i korisnicima i robotima za pretraživanje.
Malo je teže organizirati kontakt stranice za regionalne odjele. Sasvim je moguće da ćete morati da razbijete adrese regija na relevantne stranice. Međutim, u ovom slučaju morate razmisliti o geografskom ciljanju. AT tražilice ah - geo zavisno izdavanje. Jednostavno rečeno, stanovnici Moskve ili Sankt Peterburga videće različite sajtove u rezultatima pretrage za svaki komercijalni zahtev. Regiju dodjeljuju pretraživači prilikom proučavanja podataka navedenih na stranici "Kontakti". Stoga bi bilo logičnije da predstavništva kreiraju zasebne stranice na poddomenama i promoviraju ih u regionalnim rezultatima pretraživanja.
Kontakti i promocija web stranice
Yandex.Webmaster i Google alati za webmastere omogućavaju vam da informišete pretraživače o regionu vašeg sajta, uslugama kompanije, rasporedu rada, adresi i drugim važnim podacima koji će biti prikazani u rezultatima pretrage. U Yandex.Webmasteru za to morate koristiti alate "Regija web-mjesta" i "Adrese i organizacije". Google je dizajniran za ovo " Google adrese". Pored visokokvalitetnog isječka, ovo će dati priliku za postavljanje podataka kompanije usluge karte- a to će privući dodatni promet.
Postavljanje kontakt informacija na svim stranicama
Telefon i drugi kontakt podaci (ili link do njih) moraju biti naznačeni na svakoj stranici stranice. U isto vrijeme, oni bi trebali biti jasno vidljivi, inače posjetitelj koji je spreman nazvati i naručiti možda neće pronaći vaše kontakte i otići do konkurenata.
Kako bi posjetitelj odabrao način naručivanja robe koji mu odgovara, navedite sve svoje kontakt podatke: telefon, e-mail, Skype, ICQ itd. U većini slučajeva broj fiksnog telefona je vjerodostojniji od mobilnog.
Posjedovanje praktične i informativne kontakt stranice omogućit će kreiranje efikasan kanal komunikacija sa posjetiteljima, povećati nivo povjerenja u kompaniju. Kompetentna optimizacija ove stranice će povećati atraktivnost stranice za pretraživače i doprinijet će tome ukupna strategija uspješan napredak u komercijalni upiti. Slobodno se obratite profesionalcima kako biste postigli ove prednosti.
Koji vam omogućavaju da jasno opišete blokove sadržaja
Šta je HTML5?
HTML5 je najnoviju verziju Hypertext Markup Language (HTML), koji je najradikalnija revizija ovog jezika u njegovoj istoriji. Ova verzija ima mnogo novih funkcija raznim poljima. Najznačajniji od njih uključuju sljedeće.
Ugrađene medijske oznake za podršku audio i video sadržaja
Oznaka platna za crtanje sadržaja direktno u pretraživaču
"Pametni" obrasci koji dozvoljavaju operacije kao što je provjera valjanosti korištenjem potrebnog atributa
Poboljšanje kvalifikacionih vještina na ovu temu
Ovaj članak je dio programa Putanja znanja. Cm. .
Novi set strukturni elementi (tagovi) u HTML5 modificiraju način na koji su HTML dokumenti strukturirani. Novo strukturne oznake fokusiran na podelu HTML dokumenta na logičke delove. Naziv svake oznake strukture opisuje tip sadržaja koji je ova oznaka namijenjena za pohranu. Ovaj članak je o Detaljan opis ove nove oznake.
Pozadina
Tim Berners-Lee je 1989. godine kreirao prvu verziju HTML jezika kako bi prevazišao određena ograničenja koja su postojala u metodama pristupa informacijama na Internetu u to vrijeme. Na početna faza postojanje internet orijentacije u njemu je bilo izazovan zadatak. Sadržaji na Internetu su bili zbirka zasebnih dokumenata, dok ih nije bilo jednostavna metoda navigaciju kroz ove dokumente. Zaista, korisnik je trebao znati tacnu adresuželjeni dokument i ručno unesite ovu adresu. Da bi riješio ovaj problem, Berners-Lee je kreirao dvije tehnologije: HTTP (Hypertext Transfer Protocol) i HTML jezik(Hypertext Markup Language).
HTTP je servisni protokol koji web serveri koriste za isporuku sadržaja. Pogledaj u adresna traka vaš web pretraživač. Ako vaš pretraživač prikazuje pun URL, onda najvjerovatnije ova adresa počinje znakovima "http://". Ovaj dio URL-a govori pretraživaču koji tip protokola da koristi kada upućuje zahtjev Web serveru. Kada web server primi zahtjev za dokumentom, u većini slučajeva dokument se predstavlja HTML format ili konvertovano u ovaj format. To je HTML dokument koji se šalje pretraživaču koji je poslao zahtjev.
HTML je skriptni jezik koji govori web pretraživaču kako da prikaže sadržaj. Veze ka drugim dokumentima mogu biti prisutne unutar sadržaja, pružajući korisniku laku metodu navigacije između dokumenata na webu.
Ova kombinacija HTTP i HTML tehnologija omogućava brz i lak način navigacije internetskim sadržajem - za navigaciju između dokumenata, samo kliknite na linkove u tekstu. Nakon kreiranja gornje dvije tehnologije, Berners-Lee je osnovao organizaciju pod nazivom W3C ( širom svijeta web konzorcijum). W3C je vodio razvoj prve četiri verzije HTML-a.
Prvobitna svrha interneta bila je da služi jednostavnom tekstualni dokumenti. Prvi pretraživači su bili isključivo tekstualno orijentisani (drugim rečima, nisu imali fensi prozore – postojao je samo tekst na ekranu). Čak je i dodavanje slika bilo prilično značajno dostignuće - u vrijeme njihovog prvog pojavljivanja. Danas ljudi rade mnogo stvari na internetu - od slanja poruka do e-mail prije gledanja televizijski programi. Internet je već evoluirao u mnogo više od mehanizma za transport jednostavnih tekstualnih dokumenata. Nove karakteristike i nove upotrebe stvorile su nove izazove i izazove koje HTML nikada nije trebao riješiti.
W3C je pokušao da reši probleme današnjeg Interneta sa standardom XHTML 2.0 (Extensible Hypertext Markup Language). Međutim, ovaj standard nije široko prihvaćen i do sada je zapravo napušten. Godine 2004, dok je W3C koncentrisao svoje napore na standard XHMTL 2.0, druga organizacija pod nazivom WHATWG (Radna grupa za tehnologiju web hipertekstualnih aplikacija) počela je da razvija HTML5 standard, koji je dobio mnogo pozitivnije prihvatanje zajednice od standarda XHTML 2.0. W3C je prestao raditi na XHTML 2.0 i trenutno razvija HTML5 specifikaciju sa WHATWG.
Podržani pretraživači
U vrijeme pisanja ovog teksta, HTML5 standard još nije zvanično objavljen. Većina sadržaja na webu se i dalje kreira u skladu sa specifikacijom HTML 4. Međutim, neki pretraživači podržavaju HTML5 specifikaciju. Situacija može biti nezgodna jer svaki od ovih pretraživača može podržati samo podskup HTML5 funkcija. Prije kreiranja HTML5 web stranice, provjerite svaki ciljni pretraživač da vidite podržava li funkcije koje namjeravate koristiti na svojoj web lokaciji.
Ažurirana deklaracija tipa dokumenta
Bez obzira na mogućnosti vaših ciljnih pretraživača, morate svakom pretraživaču reći da želite da prikažete svoj sadržaj koristeći HTML5 specifikaciju. Ovo se može učiniti pomoću deklaracije tipa dokumenta.
Deklaracija doctype govori pretraživaču u kojoj verziji jezika za označavanje je napisana trenutna stranica. To radi pomoću predloška DTD (Definicija tipa dokumenta). DTD specificira pravila koja koristi jezik za označavanje kako bi se pretraživačima pomoglo da ispravno prikazuju sadržaj.
Koncept deklaracija tipa dokumenta može biti prilično zbunjujući. Trenutna HTML specifikacija ima mnogo deklaracija doctype, među kojima razlike nisu sasvim jasne. Tabela 1 prikazuje dostupne ovog trenutka deklaracije doctype i njihove mogućnosti.
Tablica 1. Deklaracije tipa dokumenta i njihove mogućnosti
deklaracija tipa dokumenta
Mogućnosti
Primjer
HTML 4.01 strog
Omogućava korištenje svih elemenata i HTML atributi, ali ne dozvoljava prezentacijske oznake kao što je font. Elementi okvira nisu dozvoljeni.
HTML 4.01 prelazni
Slično HTML striktnoj deklaraciji, ali dozvoljava oznake kao što je font. Elementi okvira nisu dozvoljeni.
HTML 4.01 set okvira
Slično HTML tranzicionoj deklaraciji, ali dozvoljava upotrebu elemenata okvira.
XHTML 1.0 strog
Slično HTML striktnoj deklaraciji, međutim sav sadržaj mora biti u XML formatu. Na primjer, svaki element za otvaranje mora imati odgovarajući element za zatvaranje. Elementi okvira nisu dozvoljeni.
XHTML 1.0 prelazni
Slično HTML prijelaznoj deklaraciji, međutim sav sadržaj mora biti u XML formatu. Elementi okvira nisu dozvoljeni.
XHTML 1.0 frameset
Slično XHTML prelaznoj deklaraciji, ali dozvoljava elemente okvira.
XHTML 1.1
Slično XHTML striktnoj deklaraciji, plus pruža karakteristike modula kao što je podrška za Ruby za istočnoazijske jezike.
Srećom, u HTML5 specifikaciji, deklaracija tipa dokumenta je znatno pojednostavljena. Zaista, postoji samo jedna takva deklaracija u HTML5. Da bi vaš pretraživač prikazao koristeći HTML5 specifikaciju, dodajte deklaraciju tipa dokumenta prikazanu u .
Listing 1. HTML5 deklaracija tipa dokumenta
Deklaracija mora biti postavljena na samom početku HTML dokumenta, prije oznake .
Nove strukturne oznake
Preduvjet za kreiranje novih strukturnih oznaka je želja da se web stranice podijele na logičke dijelove pomoću elemenata čija deskriptivna imena odgovaraju sadržaju koji sadrže. Konceptualno, web stranica se može smatrati dokumentom. Dokumenti sadrže zaglavlja, podnožja, poglavlja i razne druge konvencije, dijeljenje dokumenata na logičke dijelove.
AT ovaj odjeljak primjer govori o trenutnim metodama cijepanja HTML dokumenta. U sljedećim odjeljcima članka modificirat ćemo originalni kod koristeći HTML5 strukturne oznake i in korak po korak način rada Razmislite o stvaranju logičke strukture dokumenta.
HTML 4 pristup
Čak i ako ste prije kreirali samo osnovne HTML dokumente, još uvijek ste upoznati sa oznakom div. U eri prije HTML5, div oznaka je bila primarni mehanizam za kreiranje blokova sadržaja u HTML dokumentu. Kao primjer, pokazuje kako koristiti div oznake za kreiranje jednostavne stranice sa zaglavljem, područjem sadržaja i podnožjem.
Listing 2. Jednostavna HTML stranica koja koristi div oznake
Jednostavna HTML stranica koja koristi Div
header
sadržaja
Ovaj pristup odlično funkcionira; div oznaka je odličan element opće namjene. Međutim, bez gledanja atributa id na svakoj div oznaci, teško je reći koji dio dokumenta svaka div oznaka predstavlja. Može se tvrditi da ako je id atribut pravilno imenovan, njegove mogućnosti kao indikatora su dovoljne, ali je upotreba id atributa opciona. Postoje mnoge varijacije atributa id koje se mogu smatrati jednako važećim. Sama oznaka div ne sadrži naznaku koju vrstu sadržaja je dobila da predstavlja.
HTML5 pristup
HTML5 rješava ovaj problem pružanjem skupa oznaka koje preciznije definiraju glavne blokove sadržaja koji čine HTML dokument. Bez obzira na konačni sadržaj koji web stranica prikazuje, većina web stranica se sastoji od razne kombinacije tipične sekcije i elementi stranice.
Listing 4. Dodavanje oznake sekcije
Jednostavna HTML stranicaheader
Ovo je važan dio stranice.
oznaka artikla
Oznaka članka označava važne dijelove sadržaja unutar web stranice. Na primjer, na blogu, svaki pojedinačni post predstavlja značajan dio sadržaja. Nakon dodavanja oznake artikla primjeru koda, dobivamo kod prikazan u .
Listing 5. Dodavanje oznaka članaka
Jednostavna HTML stranicaheader
Ovo je važan dio sadržaja na stranici. Možda post na blogu.
aside tag
Oznaka aside označava da je sadržaj sadržan u ovom elementu povezan s glavnim sadržajem ove stranice, ali nije dio njega. U određenom smislu, njegova upotreba je slična uvođenju komentara u tijelo teksta (poput ovog komentara). Sadržaj u zagradama pruža dodatne informacije o elementu koji sadrži sadržaj. Nakon dodavanja oznake aside u primjer koda, dobijamo kod prikazan u.
Listing 6. Dodavanje oznake aside
Jednostavna HTML stranicaheader
Ovo je važan dio sadržaja na stranici. Možda post na blogu.
Ovo je važan dio sadržaja na stranici. Možda post na blogu.
footer tag
Oznaka podnožja označava sadržaj koji sadrži kao podnožje trenutnog dokumenta. Nakon dodavanja oznake podnožja primjeru koda, dobijamo kod prikazan u .
Listing 7. Dodavanje oznake podnožja
Jednostavna HTML stranicaheader
Ovo je važan dio sadržaja na stranici. Možda post na blogu.
Ovo je važan dio sadržaja na stranici. Možda post na blogu.
U ovom trenutku, sve div oznake iz originalnog primjera su zamijenjene HTML5 strukturnim oznakama.
nav tag
Listing 8. Dodavanje navigacijske oznake
Jednostavna HTML stranicaheader
Ovo je važan dio sadržaja na stranici. Možda post na blogu.
Ovo je važan dio sadržaja na stranici. Možda post na blogu.
Konačna verzija primjera
Slika B prikazuje rezultat zamjene originalnih div oznaka novim HTML5 strukturnim oznakama.
Listing 9. Konačna verzija primjera
Jednostavna HTML stranicaheader
Ovo je važan dio sadržaja na stranici. Možda post na blogu.
Ovo je važan dio sadržaja na stranici. Možda post na blogu.
Iako je ovaj primjer pojednostavljen što je više moguće u svrhu demonstracije, poređenje originalan primjer na bazi div elementi() sa rezultirajućom varijantom () jasno pokazuje svrhu novih oznaka strukture.
Zaključak
Nove HTML5 strukturne oznake opisuju sadržaj koji sadrže i pomažu da se dokument podijeli na logičke dijelove. Poput autora koji piše knjigu, autor dokumenta će i dalje moći odlučiti kada i gdje će koristiti ove nove elemente u svom dokumentu. Iako dva autora koji pišu istu knjigu mogu izabrati različite načine da tu knjigu podijele na poglavlja, upotreba poglavlja je i dalje dosljedan pristup razbijanju knjiga na dijelove. Slično tome, dok dva autora web stranice mogu izabrati različite strukture, novi strukturni elementi HTML5 pružaju programerima web stranica novo, konzistentno iskustvo koje nije bilo omogućeno starim div oznakama.
