Meny
Är gratis
checka in
den huvudsakliga  /  Navigatörer / Till aktiva delar av webbsidor relatera. Grundläggande webbsidor

De aktiva elementen på webbsidor är relaterade. Grundläggande webbsidor

Huvuddelen av innehållet som presenteras på Internet är webbsidor. Detta är en historiskt den allra första typen av dokument som är avsedda för boende i det virtuella nätverksutrymmet, men bevarade fortfarande relevansen och praktiskt taget icke-konkurrerande format. Vad är strukturen på webbsidor? Med vilka medel för webbutveckling skapas de?

Vad är en webbsida?

"Lista de grundläggande elementen på webbsidan", berättar examinatoren oss i den informatiklektionen. Vad kan vi berätta för honom som svar? Först och främst berättar vi om vad webbsidan är i princip.

Enligt en definition som uppstått i en IT-specialistmiljö är detta ett dokument som är utformat för att öppna i ett specialiserat program - webbläsare och som innehåller data som ska visas på datorskärmen med lämplig typ för olika användbara innehåll - texter, länkar, Grafik, video, musik och musik och etc. Webbsidan är ett textdokument. Motsvarande data för webbläsaren är bokstäver, siffror och särskilda symbolerAnvänds som element i markeringsspråket - HTML. Det använde det att skaparen av webbsidan "förklarar" webbläsaren, hur man visar ett eller ett annat innehåll på skärmen.

Plats och roll av webbsidor i platsstrukturen

Är det möjligt att säga att webbsidan är huvudkomponenten på webbplatsen? Delvis är det sant. Men som vi noterade ovan är webbsidan bara ett textdokument. Webbplatsen, som regel, ordnar också bilder, video och andra multimediaelement. En webbsida för att rymma dem i sig, men i sin struktur kan den innehålla länkar till dem. Således kan webbsidan kallas huvudkomponenten på webbplatsen i den aspekten av den dominerande rollen i visning av virtuellt innehåll framför användare.

I sällsynta fall är det självklart det aktuella dokumentet den enda delen av webbplatsen - om den inte ges av några skäl att visa grafik, video och andra multimediaelement. I synnerhet, de allra första platserna - när arbetarna på webbsidorna bara uppträdde, inkluderade inte det lämpliga innehållet. Före användarens ögon var det bara text och länkar.

Princip för användning av hypertext

Så, webbsidan kallas ett dokument som upprättats i HTML, med vilket hypertextmarkeringen utförs. Men vad är det här fenomenet? Vad är hypertext? Utan att fördjupa starkt i teorin noterar vi att det här är en text som på ett eller annat sätt kan få snabb åtkomst till en annan - med hänvisning. I den vanliga boken är det omöjligt - det finns "enkel text". För att få tillgång till önskad sida måste läsaren göra några omfördelningar, innan du läser innehållet eller fotnoterna. I "Hypertext" -läget gör huvuddelen av arbetet en dator - på grund av den information som återspeglas i sidan HTML-element.

Om datavetenskapsläraren berättar för oss: "Lista de grundläggande elementen på webbsidan", så kan vi perfekt starta historien om komponenterna i det aktuella dokumentet, som skapas med hjälp av HTML-markeringsspråket. Därför, till att börja med, överväga några teoretiska ögonblick som rör HTML.

HTML Språkstruktur: Taggar

Hur läser webbläsaren nödvändig data om webbsidan från dokumentet som upprättats i HTML? Väldigt enkelt.

Huvudelementen på detta språk är taggar. I de flesta fall är de parade - det är öppet, och det är en stängning. Den första betecknas med endast vinkelsatser. Den andra är liknande, men ett snedstreck placeras före den andra konsolen - symbolen. Browser kan känna igen dem, och visar därför innehållet på webbsidor utan problem i enlighet med de algoritmer som skapats av dokumentets utvecklare.

Öppningsetiketten skrivs vanligtvis av stora bokstäver stängda - små. Detta är en standard som är etablerad i en IT-specialistmiljö. Webbläsaren kommer definitivt att känna igen HTML-kommandot med några bokstäver, men webbutvecklare rekommenderas också att följa det markerade taggskrivningsprogrammet. Detta gör det lättare, till exempel förbättringen av webbsidan av andra specialister.

Attribut

Andra viktiga HTML-språkelement är attribut. Med hjälp av hjälp kan skaparen av webbsidan ställa in innehållets egenskaper - till exempel höjden på teckensnittet, dess färg, position i förhållande till sidan. Detsamma gäller för bilder, videor och andra multimedia-komponenter. Attribut skrivs i öppningsetiketten.

Innehåll

Mellan öppnings- och stängningskoden finns följande nyckelkomponent på webbsidan - innehåll. Detta, i själva verket samma innehåll som ska visas före användaren på skärmen. Det här kan vara text, länk, bild, video eller annat multimediaelement.

Webbsidor

"Lista lista de grundläggande elementen på webbsidan, äntligen!" - upprepar läraren. "Med glädje," - vi svarar på honom. Vad ingår i strukturen av den typ av dokument som behandlas? Vi håller med om att vi kommer att överväga denna aspekt för exakt ramen för HTML-elementen på webbsidan. Det vill säga, deras display i webbläsaren är att användaren ser på skärmen - vi kommer att undra i mindre utsträckning. Faktum är att motsvarande HTML-algoritmer, på grundval av vilka programmet visar innehållet lika, kan vara annorlunda. Och i den här funktionen i HTML-språket: Den önskade bilden på webbsidan kan visas olika sätt. Samtidigt kan de både motsvarighet från arbetskraftskostnaderna för webbsidans skapare på sätt och ta olika mängder ansträngning och tid för genomförandet.

Webbsidor: Header

Standardelement på webbsidan, som det var överraskande lät, presenteras i en mycket liten mängd. I huvudsak finns det bara två av dem - titeln och huvuddelen av dokumentet. Samtidigt kan var och en av dem ha en ganska komplicerad struktur.

Vad är rubriken för rubriken? Det ligger högst upp på webbsidan. I en HTML-kod som genererar en rubrik antas som regel endast "kryptering" krypteras, men om nödvändigt kan små grafiska insatser också placeras i det lämpliga elementet. Och det här är faktiskt allt som kan sägas om titeln. Det verkar som om hans roll i strukturen i det relevanta dokumentet är obetydligt. Men det är det inte. Webbsidor rubriker är mycket betydelsefulla ur sikt på platsindexering i sökmotorer - Yandex, Google. Detta element Måste vara helt relevant innehållet på webbsidan, liksom de tematiska specifikationerna på webbplatsen.

Hur fixeras webbsidans huvud med hjälp av HTML? Väldigt enkelt. Först är öppningsetiketten skrivet, som alltid ser ut som huvud med hörnfästen, sedan titelinnehållet, efter - stängningstaggen. De är naturligtvis skrivna högst upp i webbdokumentet.

Webdokumenthuvudet kan innehålla ett antal ytterligare element. Ibland kan webbsidans format kräva textvisning i en specifik kodning. Hur man säkerställer att webbdokumentet överensstämmer med detta kriterium? Väldigt enkelt. I dokumentrubrikens struktur måste HTML-algoritmer placeras, förskriva webbläsaren för att använda ett specifikt språkkodning - till exempel cyrillic. De relevanta kommandona placeras i META-taggen, som, liksom andra, det händer att öppna och stängas.

Mest del av webbsidan

Huvuddelen av webbdokumentet öppnas med kroppsmärket, stänger med det lämpliga elementet, inklusive ett snedstreck. Samtidigt kan mellan öppnings- och stängningstaggar vara stor mängd Ytterligare kommandon av hypertextmarkeringsspråket. Detta beror på det faktum att det användbara innehållet är publicerat i huvuddelen av webbsidan - texter, länkar, grafik, videor, olika former för fyllning.

Var och en av de respektive typerna av innehåll har sina egna taggar. I strukturen hos huvuddelen av webbdokumentet kan en HTML-kommandon vara närvarande, med vilken textformateringen också utförs - till exempel, vilket gör teckensnittet för en viss färg, storlek och andra egenskaper.

Tänk på vad specificiteten av några ofta använda HTML-taggar. Egentligen utgör de också de grundläggande elementen på webbsidan.

Grundläggande HTML-taggar

Så, med sikte på en detaljerad studie av vad som är element på webbsidan, kommer vi att studera mer av kärnan i de grundläggande HTML-taggarna. Några av dem var redan ledda ovan - i synnerhet de som webbläsaren läser rubrikerna på webbsidorna och bestämmer var huvuddelen av dokumentet är belägen.

P. Tag är tillräckligt fördelat. Det, som andra liknande delar av Hypertext Markup-språket, kan upptäcka och stängas. Med den här taggen kan du formatera ett separat stycke i dokumentet. Du kan till exempel ställa in en viss typ av teckensnitt för den eller dess färg. Detta görs dock med hjälp av en extra tagg - font. Samtidigt kommer det att vara beläget inuti den som betecknar gränserna för stycket - det här tillåter att inte distribuera HTML-kommandot, vilket återspeglar typen av föredragen teckensnitt, till andra delar på webbsidan.

Med tagle tagg skapas tabeller. Med hjälp av de attribut som motsvarar det kan du bestämma det önskade antalet kolumner och rader, ställa in sin bredd, gränserna för gränserna, storleken och färgen på textfonten i tabellen.

Ansvarig för bearbetning av webbläsaren av bilder. Det kan också placera olika attribut som reglerar storleken på bilden, dess läge på sidan.

Referenser till andra webbdokument eller filer anges med taggen A. Som regel är de attribut som indikerar det faktum att i webbsidans struktur är en hyperlänk. Detta anger det dokument, fil eller webbplats som den leder.

Taggen distribueras som framseset. Med det kan du dela upp webbsidans utrymme i flera områden - ramar. I var och en av dem kan du på separata webbdokument. Det är, ramar tillåter dig att placera dig korrekt på en skärm samtidigt två eller flera sidor.

En berättelse om nyckelelement på webbsidor och en efterföljande historia om formateringsmedlen med hjälp av HTML-språket - om detta kommer att vara algoritmen för vårt svar på frågan vi frågade examinator. Om han appellerade till oss, säger "Lista de grundläggande elementen på webbsidan", då använder vi den lämpliga metoden, alla chanserna att avslöja ämnet. Det är under termen "Elements" Vi kan förstå de viktigaste komponenterna i webbdokumentstrukturen eller innehållstyperna - text, bilder, tabeller, ramar, länkar som webmaster genererar med hjälp av ett sådant verktyg som HTML-språk.

Specificitet av webbutvecklingsverktyg

Förutom de nämnda vi kan klargöra att taggar och attribut som anges av HTML-standarder är ett stort belopp. Förutom HTML-webbutvecklare kan användas ytterligare medel Formatera hypertextdokument. Till exempel. använda JavaScript Du kan skapa dynamiska webbsidor - det vill säga de där innehållet ständigt uppdateras (både genom användarens handlingar och i enlighet med algoritmerna i förväg i skripten).

Det kommer att vara användbart att tillägga att webbutvecklaren kan använda fullfjädrade programmeringsspråk, till exempel Perl, PHP, Java, Python, med vilken möjligheterna att arbeta med hypertext-dokument blir ännu bredare. Behovet av detta kan bero på att applikationerna av webbteknik idag är mycket olika. De uppgifter som står inför moderna utvecklare kan vara ganska komplicerade. Till exempel är det ibland nödvändigt att översätta webbsidor skrivna på ryska till engelska. I det här fallet kommer utvecklarens verktygslåda att vara den mest mångsidiga.

Webbsidor

Varje webbsida innehåller en specifik uppsättning standardelement som är obligatoriska komponenter i varje internetresurs. Naturligtvis kan intervallet och antalet liknande föremål variera beroende på tematiska orienteringen av platsen, mängden material som publiceras på den, liksom i syfte och uppgifter som skaparen av den här resursen sätter sig. Layouten av sådana element, utformningen av deras ömsesidiga plats och är en av de viktigaste uppgifterna för webben.

Det första elementet på webbsidan som vi måste tänka på är dess titel. Den kan utföras både i text och i den grafiska versionen, och i det andra fallet ska den vara belägen högst upp i dokumentet. Ibland med rubriken kombinerar den cyrilliska kodningsvalmenyn och knapparna för att gå till den engelskspråkiga versionen till den engelskspråkiga versionen, om den här webbresursen presenteras på två språk. Direkt undertitle dokumentet, som regel, det finns ett utrymme som tilldelats för att tillgodose en reklambanner. Inklusive banner exakt högst upp på webbsidan är i de flesta fall obligatorisk tillstånd Site Registreringar i Banner Exchange Services - system som annonserar den resurs du har skapat i utbyte för att visa på sidorna på din webbplats som annonserar andra deltagare i Banner-nätverket. Standard storlek Banderoller som publiceras under rubriken i dokumentet är vanligtvis 468x60 poäng. Om du använder en statisk sidlayoutprincip, kommer bredden på ditt dokument att vara cirka 640 pixlar: detta värde beror först och främst behovet av att säkerställa korrekt visning av dokumentet på bildskärmarna med en skärmupplösning Av 640x480 poäng och undvik utseendet på den horisontella rullningsfältet, vilket gör det svårt att se den. Det är uppenbart att bannerbredden i det här fallet kommer att vara betydligt mindre än rubriken, så att det i den del av sidan där du planerar att ta en plats för reklam, bildas ett ledigt utrymme, vilket kan fyllas i logotypen av ägaren av denna webbplats eller referens till en server som implementerar webbhotell. Naturligtvis är logotypen inte alltid nödvändig: som regel ingår det bara på webbsidan om webbplatsen har en kommersiell orientering.

Huvuddelen av dokumentet tar det så kallade textfältet - en tomt där den semantiska fyllningen av sidan är placerad: meningsfull informationstext och illustrationer. De listade elementen kallas också en contentee (från engelska, innehållsinnehåll). Platsen för textfältet beror främst på hur webbdesignern kommer att placera de andra elementen i dokumentet.

Nästa obligatoriska komponent på webbsidan är navigeringselement - hyperlänkar som ansluter det här dokumentet med andra delar av webbplatsen. Navigationselement kan göras i form av textsträngar, grafiska föremål, det vill säga knappar eller aktiva ingredienser, t.ex Java-appletter. Den senare är samma knappar som, till skillnad från deras traditionella systrar, kan svara på musens rörelse, som utför med markören när du svänger på dem några enkla åtgärder (byte på bakgrundsbelysningen, vilket skapar en effekt av att trycka, en ändring i form, etc.). Som jag nämnde i avsnittet grundläggande "postulates" av webbdesign, bör navigeringselementen placeras på ett sådant sätt att de alltid är i sikte, till hands, så att användaren inte behöver släppa tillbaka sidan, Om textfältet tar en höjd av flera fysiska skärmar, varefter en lång tid att leta efter länkar till andra sektioner. Det mest etablerade tillvägagångssättet är placeringen av navigeringselement från den vänstra gränsen på sidan.

I botten av dokumentet är det vanligt att publicera information om webbplatsutvecklarna och den e-postadress där besökare av resursen kan skicka sin feedback, förslag och önskemål till ägarna. Om webbsidan är ett startdokument, läggs du på botten av det också en visiträknare - ett litet skript som kallar CGI-skriptet som är installerat på servern, som åtgärdar varje öppning av dokumentet i användarbrowser genom att ändra mätvärdet för mätare . Tack vare detta kommer Web-guiden enkelt att bestämma antalet besökare bifogade sin sida för när som helst. Jag noterar att besöksmätaren endast är installerad på den första sidan som heter när du öppnar webbplatsen saknas det i andra resursdokument. Det rekommenderas inte heller att posta flera olika meter på en sida.

Så, vi demonterar alla huvudkomponenter på webbsidan och deras möjliga plats i förhållande till varandra.

I praktiken finns webbplatser ofta, i utformningen av vilka navigeringselement är placerade på skärmens högra gräns. I det här fallet flyttas textfältet till vänster, de återstående komponenterna i dokumentet är belägna, baserat på principen om den maximala estetiken för deras kombination.

Som framgår av figuren placeras logotypen i det här fallet på en nivå med dokumentrubriken, och reklambannern är placerad i förhållande till mitten av sidan. Med detta tillvägagångssätt rekommenderas att tåla grafisk design av rubriken, logotypen och fälten för att placera reklam i en enda färg och konstnärlig stil - då är asymmetrin av positionen för dessa föremål inte så uppenbara och kommer inte att skära ögon till anhängare Med strikt, bords estetik design.

Navigationsobjekt kan placeras inte bara nära höger och vänster gränser på sidan, men också högst upp i dokumentet. Ett sådant layoutalternativ är mest lämpligt, enligt min mening, när du skapar inhemska sidor: I det här fallet är alla sidobjekt harmoniskt i den angivna bredden osynligt bordSamtidigt förenklas förberedelsen av bordet i själva verket. Den enda nackdelen med detta tillvägagångssätt är behovet av att duplicera navigeringselementen längst ner i dokumentet, eftersom när sidan är vertikal rullning, försvinner de efter skärmens övre gräns, och för att komma till dem måste användaren behöva Slå upp skärmen tillbaka, som du ser, är ganska obekväma.

Naturligtvis är allt som har sagts i det här avsnittet inte ett panacea, men ledarskap till handling. Jag försöker bara ange generella principerSom används när man lägger platsen på platsen, är den slutliga lösningen alltid kvar för webmästaren. I slutändan, vilken typ av design du inte lanserade vårt framtida projekt, kommer resultatet av dina verk fortfarande att vara korrekta: det finns ingen censur på internet, inga regler som jagar skaparen av webbplatsen i de eller andra styva ramar. Ett exempel på en designerlösning som inte faller i någon av de angivna kategorierna kan fungera som den så kallade blandade layouten

Som det kan ses från figuren, i det här exemplet är en del av kontrollelementen byggd direkt i sidtiteln - vi pratar om knappen för att byta mellan de ryska och engelska versionerna av webbplatsen, liksom navigeringsknapparna: Det här kan vara en länk till resursskapets e-postadress, dupliceras i bottendokumentet och en referens till en av de tematiska sektionerna, till exempel en nyhetssida. Huvudenheten för navigeringselement är placerad i förhållande till den vänstra gränsen för dokumentet, men menyn Cyrillic Encoding är placerad direkt under annonseringsbannern längst upp på sidan. Textfältet är uppdelat i två asymmetriska kolumner, och korta meddelanden om tematiska kolumners resurs, inklusive länkar till dessa avsnitt, placeras till höger.

Självklart kan varianterna av blandad layout på en webbsida vara en bra uppsättning: specifika lösningar beror på antalet partitionsresurskomponenter, volymen av texten som är förberedd för webbplatsen och slutligen från planterns fantasi själv. Det är bara viktigt att utseendet på webbplatsen inte väcker klagomål från besökare. I slutändan har du bara du som utvecklare, du och ingen annan rätt att visa alla dina förmågor och talanger och komponera sidan på din egen smak. Skaparna av några hempåsar, som inte plågas av tvivel, placera besökaren i det övre högra hörnet av dokumentet, är webbplatsnamnet skrivet med ett litet rostfont och publicera det under en reklambanner, och för vissa anledningar är navigeringselementen Oväntat detekterat rätt i mitten av textblocket, mellan en berättelse om dig själv och bilder av den älskade hunden av författaren till projektet. Smaken och färgen, som de säger, inga kamrater. Men personligen verkar den här sjukdomen mig obotlig.

Vi läser alla ett stort antal artiklar om hur du väljer sökord och korrekt komponera från dem en lista, som använder nyckelord för att göra webbplatsen relevant för vissa sökfrågor. Låt oss överväga frågan om webbhotell i mer detaljer på webbsidor.

Från kunskapen om var och hur man placerar sökord på webbsidan beror på framgång eller misslyckande av ditt SEO-företag.

På varje webbsida finns 5 element i vilka sökord ska placeras:

  1. Sidtitel (titel tagg)
  2. Nyckelordssidor (Meta Tag Nyckelord)
  3. Sida Beskrivning (Meta Tag Beskrivning)
  4. Alternativ text för bilder (ALT-tagg)
  5. Webbsidainnehåll (Body Tag)

Av alla ovanstående delar på webbsidan är innehållet på sidan viktigast (punkt 5). Mer om detta vidare.

Låt oss nu undra den här listan i ordning.

Element nummer 1. Sidtitel (titel tagg)

Först, överväga titelsidan (titel tagg). Detta element är det allra första och viktigaste av alla andra föremål i huvudblocket på någon webbsida.

Webbsidans titel Du kan titta på den övre raden i webbläsaren. För att se till att, starta en webbläsare, till exempel, Internet Explorer., Opera eller Mozilla Firefox., Gå till någon plats och jämför innehållet i titeltaggen med den övre raden i dessa webbläsare. Sökmotorer använder den här taggen för sina egna ändamål - att samla in information om webbplatsen och definitionerna av dess ämnen och även använda i resultat av sökresultat (SERP) som namn på webbsidan.

Kom ihåg! Webbsidans rubrik är henne kort beskrivning.

Förutom ovanstående innehåll används titeltaggen som ett webbsidans namn när du lägger till det i favoriter Internet-webbläsare.

Element nummer 2. Nyckelordssidor (Meta Tag Nyckelord)

Låt oss nu prata om meta-taggar Nyckelord och beskrivning. För en tid sedan användes Meta Tag Nyckelord när du lägger till en webbplats till sökmotorindex. Men dessa tider passerade. Nu söker sökmotorer helt enkelt den här taggen, eftersom Frektioner av användningen i "smutsiga" ändamål. Vissa sökmotorer uppmärksammar den här taggen för att bestämma ämnet för webbplatsen.

Av allt detta följer att den här taggen inte är nödvändig, men du kan använda den uteslutande i direkt utnämning.

Nyckelord ska separeras med ett komma. I början av listan, posta de viktigaste sökorden, som ytterligare faller med deras betydelse. Sökmotorer upphörde att vara uppmärksam på det register där sökorden görs, så nu kan alla nyckelord skrivas ut i små bokstäver.

Element nummer 3. Sida Beskrivning (Meta Tag Beskrivning)

Meta Tag Beskrivning - Ett annat element i den webbplats där sökord ska placeras. Sökmotorer Visa den här taggen för närvaron av sökord i den, och jämföra också innehållet med innehållet på själva webbplatsen (innehållet i kroppsmärket). En mycket viktig omständighet är att sökmotorer använder innehållet i beskrivningskoden som en beskrivning av webbsidan i sökresultatresultatet (SERP).

Den här taggen måste innehålla en kort beskrivning av webbsidan, men inte mer än 50 ord.

Element nummer 4. Alternativ text för bilder (ALT-tagg)

Alt-taggar är en textbeskrivning av innehållet, d.v.s. Om bilden av någon anledning inte är laddad, och den här bilden har alt text, då i stället för bilden visas den här texten.

Om bilden är laddad, och alt texten på bilden har också, så kan vi se det när du svävar muspekaren till bilden. Alt-taggar används för bekvämligheten hos de internetanvändare som av någon anledning inte visas.

Många sökmotorer indexerar innehållet i denna tagg, det kan finnas nyckelord. Glöm inte att Alt-texten ska matcha bilden, beskriva det, var dess textmeddelande. Använd inte ALT-taggen i förhållande till markering av bilder, till exempel delningslinjer, markörer ...

Element nummer 5. Webbsidainnehåll (Body Tag)

Så slutligen kom vi till det mest grundläggande elementet på webbplatsen - kroppsmärket, objektet, vars innehåll är mest intresserade av internetanvändare. De viktigaste sökmotorerna ger dig inte längre 1 rad i resultatresultatet (SERP) på grund av närvaron av flera sökordsrepetitioner på sidan på din webbplats. Det kommer bara att finnas den mest relevanta webbsidan på en viss sökfråga.

För att uppnå detta bör du implementera valda sökord i koden för webbsidor, observera frekvensen för deras upprepning. Lag enligt följande: För varje specifik sida väljer du 1-2 sökord och optimerar motsvarande sida för dem.

Föreställ dig att du förbereder presentationen av din nya webbplats eller produkt. Därefter, till exempel glidbanorna i din PowerPoint-presentation - stycken. De måste vara korta och tydliga. Precis som i PowerPoint-presentationen kan du använda listor för att räkna upp fördelarna med din webbplats eller produkt, varje gång betoning på utvalda sökord.

Genomföra valda nyckelord i de 5 elementen på varje webbsida som anges ovan, och du förbättrar dina nuvarande positioner och resultat.

HTML-språk

Webbsidor kan existera i vilket format som helst, men Hyper Text Markup-språk accepteras som ett standard-hypertext-märkningsspråk, utformat för att skapa formaterad text, mättad med bilder, ljud, animering, videoklipp och hypertextlänkar till andra dokument som är utspridda som hela webben utrymme och de som ligger på samma server eller är del av Samma webbprojekt.

Du kan arbeta på en webb utan kunskap om HTML-språk, eftersom HTML-texter kan skapas av olika specialredaktörer och omvandlare. Men skrivande direkt till HTML är inte svårt. Det kan till och med vara lättare än att studera en HTML-editor eller omvandlare, som ofta är begränsade i sina möjligheter, innehåller fel eller spenderar dålig HTML-kod som inte fungerar på olika plattformar.

HTML-språk finns i flera alternativ och fortsätter att utvecklas, men HTML-design kommer sannolikt att användas i framtiden. Studerar HTML och vet det djupare genom att skapa ett dokument i början html studerar Och expandera det så långt som möjligt har vi möjlighet att skapa webbsidor som kan ses av många webbläsareSom nu och i framtiden. Detta utesluter inte möjligheten att använda andra metoder, till exempel, den avancerade funktionsmetoden, som tillhandahålls av Netscape Navigator, Internet Explorer eller några andra program.

HTML-arbete är ett sätt att assimilera funktionerna i att skapa dokument på ett standardiserat språk med hjälp av tillägg endast om det verkligen är nödvändigt.

HTML har ratificerats av World Wide Web Consortium. Den stöds av flera utbredda webbläsare, och kan bli grunden för nästan hela programvaran som är relaterad till webben.

Principer för att skapa en webbsida, de grundläggande elementen på webbsidan

För att skapa webbsidor används ett speciellt HTML-språk (Hypertext Markup Language - Hypertext-märkningsspråk). Detta språk definierar en uppsättning speciella kommandon som kallas taggar och används för att ställa in formatering eller tilldela vissa delar av webbsidan. Särskilda taggar används för att tillgodose på webbsidor grafiska bilder, ljud och videoklipp och andra så kallade inbäddade objekt.

Webbsidor är vanliga textfilerskapad i en standard anteckningsblock eller liknande enkel textredigerare. Och de innehåller texten, samma text som du vill sätta på sidorna är bara placerad på ett speciellt sätt. För att olika webbläsare ska kunna visa samma webbsida måste HTML-språket standardiseras.

I praktiken har HTML-standarden ett stort inflytande med närvaron av taggar som föreslagits och stöds av de mest kända webbläsarna, som Microsoft Internet Explorer och Google Chrom. Dessa taggar B. det här ögonblicket Kan, hur man går in och inte ingår i den aktuella HTML-specifikationen.

Det finns redigeringsverktyg som är utformade speciellt för att skriva HTML. De låter dig spara tid, eftersom de innehåller nycklar snabb åtkomst För att utföra återkommande operationer, till exempel att ställa in de första installationerna av dokument, tabeller eller helt enkelt tillämpa stilar i texten. HTML-redaktörer De skiljer sig från författarens WYSIWYG TOOLKIT eftersom de behöver kunskap om HTML-kompileringsreglerna manuellt, redaktörer förenklar och påskyndar den här processen. Såväl som hTML-taggar, standardiserade wwwc (standard taggar), webbläsare stöder flera icke-standardiska taggar. Dessa taggar ingicks av utvecklare av ett webbläsarprogram för att få en fördel gentemot konkurrenterna. De hoppades att dessa märkesutbyggnader skulle komma in i HTML-standarden, men dessa förhoppningar var inte avsedda att bli sanna. Emellertid förblev taggarna, och de stöds fortfarande.

För att skapa webbsidor behöver du någon webbläsare - Internet Explorer eller Google Chrome Mozilla Firefox, och bättre båda, eftersom många HTML-element är olika på olika sätt. olika program Visning och mycket önskvärt att kontrollera denna skillnad.

Dessutom behöver du någon textredigerare, till exempel för hTML-utbildning - Filer och webbläsare - för att visa och kontrollera.

För att skapa en webbsida skapar den första sajtens struktur. Webbplatsen är en server som har ett unikt namn och permanent adress, fysiskt ansluten till WWW, eller nästan placerad på en annan, större server.

Efter att ha skapat webbplatsstrukturen textredigerare Ord, skapa nytt dokument Och spara den som en webbsida, börja med att skapa en webbsida. Det gör vårt arbete enklare och bättre. I det definierar vi tidpunkten för skapandet av webbplatsen, dess felsökning, dess ämne, liksom fyllning.

Det finns flera enkla regler som tillåter gränssnittet för webbplatsen att förstås av besökaren [№10].

1. På webbplatsen bör inte vara värdelös information, bör tecknet lätt läsas. Grafiska element ska vara tydliga, uttrycksfulla och snabbt laddade.

2. Det mänskliga ögat skannar platssidorna från topp till botten. Den största uppmärksamheten är inriktad på den övre vänstra delen av sidan. Därför är högst upp på platssidan, som regel, den mest viktig information: Företagsnamn, logotyp, platsnamn, etc.

3. Webbplatsens besökare måste enkelt hitta den information du är intresserad av och för att kunna få omfattande information (beskrivning i form av text plus flera bilder).

4. Informationen måste distribueras av grupper. Det är möjligt att säkerställa möjligheten att söka efter varor i avseende på titel och beskrivningar.

5. På webbplatsen måste du vara informationssektioner:

med data om företaget (verksamhetsområde, adress, kontakta telefonnummer etc.);

Huvudelementen på webbsidor:

1. Titel / Logo (CAP)

3. Innehåll / innehåll (textfält)

4. Navigeringselement

5. Information om webbplatsutvecklare

Varje webbsida innehåller en specifik uppsättning standardelement som är obligatoriska komponenter i varje internetresurs.

Det första elementet på webbsidan som vi måste tänka på är dess titel. Logotypen eller titeln på webbplatsen utför samma roll för den som skylt vid ingången till någon institution. En annan sak är internet: här är det viktigaste sättet att flytta teleportation, och därför behöver jag se denna "skylt" på varje sida.

Huvuddelen av dokumentet tar det så kallade textfältet - en tomt där den semantiska fyllningen av sidan är placerad: meningsfull informationstext och illustrationer.

De listade elementen kallas också "innehåll" (från engelska, innehållsinnehåll). Platsen för textfältet beror främst på hur webbdesignern kommer att placera de andra elementen i dokumentet.

Figur 1. Prov innehållsplats

Nästa obligatoriska komponentdel av webbsidan är navigeringselement - hyperlänkar som ansluter detta dokument med andra delar av webbplatsen. Navigationselement kan göras i form av textsträngar, grafiska objekt, det vill säga knappar eller aktiva komponenter, som Java-appletter.

I botten av dokumentet är det vanligt att publicera information om webbplatsutvecklarna och den e-postadress där besökare av resursen kan skicka sin feedback, förslag och önskemål till ägarna. (Fig 2)


Figur 2. Kontaktinformation

Innan du börjar skapa din webbplats, kommer det att vara mycket ansvarig för problemet med layout av sidor. I allmänhet är webbsidan uppdelad i sidor, navigering och relaterad information. Dessa element är i sin tur uppdelade i mindre element.

Som ett resultat kommer sekvensen av åtgärder att utveckla en webbplats ner till följande enkla algoritm:

1. Förklaring av mål och definition av grundläggande uppgifter.

2. Skapa en lista över framtida tematiska sektioner.

3. Utveckling av resursens logiska och fysiska struktur.

4. Förberedelse av designskiss, platslayouter, osynligt Verstalbord.

5. Förberedelse av textmaterial.

6. Framställning av grafiska material i vektorform.

7. Exportera vektorritningar i rasterformat.

8. Optimering av alla bilder.

9. Skapa webbsidor mallar.

10. Bygg webbsidor och felsökningskod.

11. Kontrollera identiteten att visa webbsidor med olika skärmupplösning och färgpalett och olika webbläsare.

Web-Design Basics

Web-Design Basics

Historien om utvecklingen av Internet. Framväxten av Internet i Vitryssland. Webbdesign. Historien om uppkomsten. Webbdesignkrav i enlighet med W3C-standarder. De viktigaste webbläsarna. Webbplatsstruktur, discipshes och taggar.

Internet ( engelsk Internet, sammankopplade nätverk - United Networks) - jätte datornätverkbestående av en mängd mindre ansluten till varandra och täcker hela jordklotet.

Internetets historia började i mitten av förra seklet: i 1957. I Förenta staterna skapades byrån för lovande utveckling (ARPA), som var engagerad i militär utveckling.

1989 skapade Tim Berners-Lee HTML-språk.

1961. Förvaltningen av potentiell forskning och utveckling av den amerikanska försvarsdepartementet (Darpa - Defensive Advanced Research Agensy) om uppgiften för US Department of Defense började ett projekt för att skapa ett experimentellt paketöverföringsnät. Detta nätverk heter ARPANET.Det var ursprungligen avsett att studera metoder för att säkerställa tillförlitlig kommunikation mellan datorer av olika typer.

I januari 1969 Under några minuter lanserades systemet med fyra datorer i olika ändar i USA i några minuter. Det hände längs en telefonlinje med låg hastighet.

I 1973 Året genom ARPANET för första gången, datorer i olika länder "kommunicerade". Nätverket har blivit internationellt.

Nätverksutvecklingen gick snabbt. År 1987 översteg antalet värdar 10 000. 1988, Kanada, Island, Danmark, Norge, Frankrike, Finland och Sverige kopplade till NSFnet. År 1989 översteg antalet värdar 100 000. Nätverket kopplade Förenade kungariket, Japan, Tyskland, Österrike, Israel, Italien, Mexiko, Nya Zeeland, Nederländerna till nätverket. Ryssland ansluten till nätverket 1990. Vitryssland är också i början av 90-talet.

Antalet anslutna användare ökade årligen med en snabb takt. 1995. Nätverket har blivit den största, dynamiska och prisvärda masskommunikationen.

Webbdesign. Historien om uppkomsten.

Webbdesign (från Eng. Webbdesign) - Detta är en visuell design av webbsidor. Det spelar samma roll för webbplatsen som utskriftsdesign och layout för pappersutgåva. Ofta kallas "webbdesign" webbutveckling: designgränssnitt (grafik och textinnehåll på webbplatsen), designstruktur, navigering och platsmotor (vald del programkod Att genomföra en specifik tillämpad uppgift).

För närvarande förstår termen "webbdesign" utformningen av strukturen, ideologiska integriteten hos Internet-resursen, vilket garanterar bekvämligheten med att använda Internet-resursen för användare. En viktig del design av webbplatser, är deras överensstämmelse med W3C-standarder (Eng. World Wide Web Consortium, World Wide Web Consortium - en organisation som utvecklar och genomför tekniska standarder för World Wide Web), vilket garanterar tillgången till platser för personer med begränsad fysiska möjligheter, såväl som för användare av bärbara enheter.

Också med direkt designwebbplatser är intilliggande marknadsföring på Internet (internetmarknadsföring), det vill säga främjande och reklam för den skapade resursen, sökmotoroptimering

Web-design, även om den är baserad på en grafisk komponent, skiljer sig fortfarande signifikant från tryckdesign. Detta, först och främst, beror på den dynamiska och interaktiviteten hos den visuella bilden på webbsidan.

Nästan varje webbsida har hyperlänkar, navigeringsmeny och andra föremål som ger övergångar mellan informationsenheter. Interaktiva data (det vill säga de som behöver någon åtgärd och svarar på dem) och särskiljer elektroniska gränssnitt från den vanliga boken, tidskriften eller tidningen.

Vid utformning av en webbsida är dessa element viktiga. Utvecklingen av kompetent layout av sidor, den logiska strukturen på webbplatsen och navigeringsrutterna är baserad på en webbdesign och användbarhet

Yuzabilitet (Engelska. Användbarhet - Bokstavligen "Användarvänlighet", "Tillämplighet") - Tillämpad till datortekniker Termen användbarhet är begreppet att utveckla användardefinierade programvarugränssnitt, orienterade till den maximala psykologiska och estetiska bekvämligheten för användaren.

Webbdesignkrav i enlighet med W3C-standarder

Webbdesign ska vara bekväm , tydligt visas i någon webbläsare. Webbplatsen måste ha en original grafisk design som garanterar korrekt funktionalitet.

Webbplatsen bör ge bekvämlighet och fullständighet av navigeringselement.

Grundläggande information, menyer och andra navigeringselement måste vara tillgängliga utan horisontell rullning helt Öppet fönster Webbläsare när du löser skärmen 1024x768 poäng.

Design (plats för informationsblock, visuell design) Huvudsidan kan skilja sig från utformningen av typiska sidor samtidigt som du bevarar webbplatsens stil.

Närvaron av vackra grafiska föremål, användningen av små, men eleganta grafiska element (piktogram, visuella) i designen av platssidorna.

En liten inkludering av animeringselement välkomnas.

Utformningen av webbplatsen bör vara "lätt" när det gäller volymen av grafiska element och ge så mycket som möjligt hastigheten på sidsidorna.

Se till att du enkelt identifierar partitionen och underavsnittet där användaren är belägen.

Det är korrekt att visa information om datorer utan förinstallerade Flash-plugins, med funktionshindrade stöd för skript, grafik, stilmallar.

Konstruktionen bör ge möjlighet att utveckla platsens struktur genom utveckling och inkludering av nya sektioner och underavsnitt till dess sammansättning.

Webbläsare eller webbläsare.

För närvarande väljer varje användare för sig själv "hans" webbläsare. De mest populära är Opera och Firefox. För dem är Internet Explorer (dvs.).

Webbläsare eller webbläsare (från engelska. Webbläsare.) - detta är programvara För att söka, visa webbplatser, det vill säga att begära webbsidor (mest från nätverket), för att bearbeta, dra tillbaka och övergå från en sida till en annan.

Crows-webbläsarplatsen är en professionell och kompetent webbplats, densamma som möjligt när du tittar i olika webbläsare. Webbplatsen måste tillhandahålla korrekt datavisning i följande webbläsare:

Internet Explorer (version 5.5 och högre):

Opera (version 7.0 och högre);

Mozilla Firefox (version 1.0 och högre).

Det huvudsakliga färgläget för monitorerna, där platsen ska ses korrekt - 15 färgutsläpp och över (antalet färger är 65536 och högre).

Utveckling av webbprojektstrukturen

Enligt projektets allmänna koncept är målen för webbprojektet bestämda och uppgifter, nämligen:

§ Datastruktur, definition av kopplingar mellan databasbord, dataöverföringsstrukturer från externa källor;

§ Definition av datautomatiseringsnivå, utveckling av datahanteringsstruktur;

§ Specifikationen av formulären och förfarandet för deras utseende utförs.

§ Struktur användargränssnitt: Menyalternativ och navigeringselement krävs nestningsnivåer;

§ Utveckling av designskisser i projektet (antalet alternativ är godkända i förväg).

Utveckling.

§ Design: Konstnärlig och teknisk lösning. Skapa en originalplatsstil: Färglösning, Tillverkning av designelement, banners, grafiska element;

§ Programmering: Skapa programvaruelement;

§ Navigationsimplementering inom ramen för den godkända projektmodellen;

§ Grundläggande informationsinnehåll;

Html hypertext markering språk

  • (från engelska. Hypertext Markup Language - "Hypertext Marking Language") - Detta är ett vanligt märkningsspråk för dokument i World Wide Web. Alla webbsidor skapas med hjälp av HTML (eller XHTML). HTML-språk tolkas av en webbläsare och visas i form av ett dokument som är bekvämt för en person.
  • Tillsammans med XML klassificeras HTML vanligtvis som "textmarkeringsspråk". Faktum är att dessa två språks roll, som själva formatet kallas "bara text" ("vanlig text") långt bortom bearbetningen textinformation.
  • Studien av ett datorspråk börjar med bekantskap med sina huvudbyggnadsblock - operatörer, uttryck, variabler. Ur denna synvinkel är HTML-språket extremt lätt att inte säga - primitiv: Förutom vanlig text innehåller HTML-filen endast en typ av kontrolldesigner, den så kallade taggar (taggar).

Ord fångar i vinkelkonsoler "<” и “>"Ring HTML-descriptors eller HTML-taggar.

Grundläggande komponenter på webbsidan

Main Navigation Site Panel (Meny). Alternativ meny och duplicera huvudmeny. Länkar, typer av länkar och deras utförande. Huvudelementen i platsdesignen. Layout Sidans webbplats. Färgsidans lösning. Optimering Web Graphics, bildberedning för en webbsida. Principer att arbeta med bilder.

Huvudnavigationsplatspanel (Meny). Navigeringspanelen på webbplatsen, som innehåller referenser till huvuddelarna på webbplatsen (och kanske på underavsnittet av den aktuella sektionen), bör vara på varje sida på webbplatsen och bör inte ändras sin plats, vilket anses Var den mest brutto kränkningen av användbarhetsnormerna.

Generellt accepterade är två alternativ för att placera navigeringspanelen: vertikalt i den vänstra kolumnen eller i linjen i sidfoten. Ofta kan du hitta en kombination av dessa metoder när den vänstra kolumnen och den övre strängen används för att organisera navigeringspanelen. Samtidigt B. Övre strängSom regel är hänvisningar till det viktigaste, enligt utvecklingen av utvecklaren, sektionerna placeras.

Flera huvudmenyalternativ kan dupliceras i alternativ meny. Om huvudhorisontellt är vertikal eller vice versa.

Enligt användbarhetsnormerna kan aldrig och i inget fall inte göra menyn länkar - länkar till nedladdningsbara filer, till exempel på pris. Allt som inte leder till standardsidor - måste föregås av inskriptionen: "Hämta".

Den aktiva delen av menyn (sidan som användaren är placerad) ska fördelas genom att uttryckligen skilja sig från andra föremål, till exempel färg.

Besökta sektioner ska fördelas till annan färg så att besökaren kan ses där han var och var det inte finns något.

Länk till huvudsidan. Det är mycket önskvärt att ha en länk till huvudsidan på alla sidor på webbplatsen. Den allmänt accepterade regeln var användningen av en webbplatslogotyp med hänvisning till huvudsidan eller ikonen i form av ett hus.

Tillgänglighet Välkommen duplicera huvudmenynpå botten av sidan.

Huvudelementen i platsdesignen.

Design - Det är utformningen av saker, bilar, interiörer baserat på principerna om att kombinera bekvämlighet, effektivitet och skönhet.

Grafik - Konstbild av objekt med konturlinjer och slag, utan färger (ibland - med färgfläckar) (Ordbok av Ozhegov).

Huvudideen för grafisk design är att kombinera de estetiska principerna och funktionella uppgifter i en design. Framgången med ett eller ett annat projekt beror till stor del på överensstämmelse interna principersom styrs av en specialist när man skapar grafisk design.

Huvuduppgiften för webbdesignen är skapandet av en bekväm atmosfär för att assimilera information på sidorna på webbplatsen.

Universell lösning i utformningen av designen av webbsidor existerar inte. Helt olika alternativ för webbdesign, som innefattar utvecklingen av följande element:

Layout av webbsidor på webbplatsen;

Grafik.

Layout Sidans webbplats.

Webbsidan anses faktiskt som en uppsättning rektangulära block som läggs ut i en viss ordning. I det här fallet är data som regel beläget i kolumnerna, så när layouten används termen en-, två-, tre-kolonnlayout.

Platsens layout på webbplatsen ska ge automatisk sidskalning beroende på bredden på användarbrowsern. Minsta storlek (Bredd) på webbläsarens arbetsfält, där det är nödvändigt att tillhandahålla en fullfjädrad sidvisning (utan en horisontell rullningsfält), är 1024 pixlar.

Färgsidans lösning.

Färg ett av de mest tvetydiga webbdesignelementen. Färg kan betona sammanhanget och kan och tryck. Sammansättningen av webbplatsen beror till stor del på det valda färgschemat. Forskare inom användbarhet och webbdesign Det noteras att det första intrycket av informationen Internet resurs är baserat på en färgstark komposition, och den lagras i användarens minne och inte informationsinnehåll.

För att skapa en effektiv design är det nödvändigt att överväga ett antal krav som åläggs valet av färglösningar:

Ljusstyrka, ton och färgmättnad måste överensstämma med företagets märkesstil;

Valet av färg görs med hänsyn till orienteringen till den här resursens publik.

Antalet grundläggande färger som används som möjligt bör inte överstiga tre;

De färger som används på platsen måste interagera och harmonisera varandra.

Användningen av färg måste vara ansvarig för de elementära reglerna för logik.

Ett separat objekt är att markera valet av färger för text. Bakgrunden och texten på sidan måste vara dekorerad med kontrasterande färger. Den bästa förståelsen säkerställs med hjälp av svarta tecken på en vit bakgrund. Texten ska inte slås samman med bakgrunden, och rubrikerna är förlorade.

Det är nödvändigt att färgbeslutet motsvarar formen av arkivering av material, dess innehåll, platsens publik.

Optimering Web Graphics, bildberedning för en webbsida. Principer att arbeta med bilder.

Användningen av grafik måste vara berättigad, grafiken måste klart överensstämma med innehållet på webbplatsen. Överutbudet av grafik och animering distraherar från huvudinnehållet, vilket byter uppmärksamheten hos besökare, gör det svårt att ladda sidan.

Platsen ska hämtas snabbt, och grafen är upptagen av huvudvolymen av webbsidor. Ett foto i kilobytes sker i tiotals gånger mer än texten i texten A4. Grafik måste optimeras! Du bör använda upprepande bilder, eftersom datorn sparar de nedladdade filerna i tillfälliga mappar för att spara tid. En upprepad bild kan fungera som en "hatt" på webbplatsen på alla sina sidor.

Om du behöver placera stora bilder - kan du göra det så att de öppnas av programmatiskt på ytterligare klick i det nya webbläsarfönstret. Men som standard bör webbplatsen vara lätt.

Den genomsnittliga sidladdningstiden får inte överstiga 30 sekunder med en anslutningshastighet på 28,8 kbps. Det är tillåtet att öka nedladdningstiden enskilda sidor upp till 35 sekunder, men inte mer än 30% av det totala antalet sidor på webbplatsen. Huvudsida måste ha nedladdningstid inte mer än 40 sekunder

På webbsida Du kan använda grafiska filer av JPG, GIF och PNG-format. GIF-specialnätverk: Det har en liten filstorlek, möjligheten till jämn manifestation och animering, liksom transparenseffekten, så att du kan använda bilden som "tapeter" på sidan eller i tabellerna. Men eftersom GIF innehåller 256 färgpalett, det är ineffektivt för att lagra foton. JPG motsatt har inga begränsningar i färgdjupet, men också möjligheten att animera. Nytt format Filer som stöder och djup och öppenhet -Png, har en nackdel att de gamla webbläsarna inte ser det. Därför, om du inte tar hänsyn till användare med föråldrade program, kan Pingie inkluderas i sidorna. För att inkludera en ritning på sidan måste du beskriva länken till den:

där src (från s.ou. rce-källa) \u003d bildfil i GIF, JPG eller PNG-format som innehåller en bild.
Du kan ställa in den ömsesidiga layouten av figuren och texten för att vända justering \u003d "attributet:

Följande typer av anpassning är möjliga:
Justera \u003d "Middle" - i förhållande till mitten av linjen
justera \u003d "vänster" -text stärker bilden till höger
Justera \u003d "höger" - samma till vänster

När du använder vänster eller högerjustering kan du aktivera i IMG-taggen ytterligare parameter Avgång runt bilden så att bilden inte har tryckt nära din text. Parametern VSpace \u003d "n" - skapar en indragning vertikal och hspace \u003d "n" - horisontellt på n pixeln. Således kommer de rättskrivna taggbilderna med en flytande höger text att se ut så här:

Text.

Gränsens sista parameterbredd. Om det är närvarande utan mening, och helt enkelt i form av en ordgräns, dras kanten av en webbläsare på egen begäran, och om som i exemplet indikerar värdet. Nollvärdet för denna parameter används om filen fungerar som en grafisk hyperlänk, för dess förklädnad.


Liknande information.