HTML-basisprincipes voor beginners, wat elke beginnende webmaster of blogger nu zou moeten weten. Als je wilt leren hoe je basiswebsites kunt maken, de code zelf wilt begrijpen, wilt weten wat er achter zit en wat er moet komen, dan is het simpelweg onmogelijk om dit te doen zonder kennis van de basisprincipes van de HTML-taal. Op mijn blog zal ik een hele reeks artikelen hebben die ik van A tot Z aan dit onderwerp zal wijden, ik zal elke tag beschrijven die in het document aanwezig is, wat het betekent en hoe je het correct kunt gebruiken.

HTML-basisprincipes

Als je de meest fundamentele dingen niet weet, is je pad gesloten. Ik ben van mening dat iedereen die besluit websites te ontwikkelen en te maken de basisprincipes moet kennen en begrijpen, waar de site zelf uit bestaat, hoe deze werkt en wat er in de code zelf gebeurt.

Natuurlijk zijn er nogal wat programmeertalen, ze zijn allemaal op hun eigen manier complex, maar er zijn er een paar die je absoluut moet kennen. Als je een brief die per post moet worden verzonden mooi wilt ontwerpen, heb je je eigen VKontakte-groep, een groep in een andere sociale netwerken, hetzelfde YouTube-kanaal, je moet sleutelen aan de code op een van de site-engines, basisconcepten je moet het gewoon weten.

Ik heb slechts een paar voorbeelden gegeven, sterker nog, nu deze kennis steeds vaker op internet wordt gebruikt. Ik ben meer een beoefenaar dan een theoreticus, dus in mijn artikelen in deze sectie zal ik je stap voor stap mijn voorbeelden laten zien van hoe en wat ik deed. Ik zal zowel voorbeeldpagina's als hele sites plaatsen.

HTML-document is het eenvoudigst tekstdocument, de taggingtaal die u dagelijks op internet tegenkomt. Tags beschrijven de structuur van een document. Tags zijn opgemaakt als hoekig< >haakjes, waarbinnen de naam van de tag is geschreven. De browser kijkt naar de structuur van het document, bouwt het op en geeft het weer volgens de instructies op uw monitor, als u uiteraard alles correct hebt gedaan.

Dit hele proces begint voordat je zelfs maar de voltooide foto ziet. Browsers verwerken een document opeenvolgend, van begin tot eind. Inclusief alles wat op de pagina moet staan. Tabellen, afbeeldingen, scripts enzovoort, behalve dat dit CSS-stijlen omvat.

Basisprincipes voor beginners

Wat is html - als je kijkt naar wat Wikipedia schrijft - (HyperText Opmaaktaal)taal hypertext-opmaak documenten. De meeste pagina's op internet bevatten pagina-opmaak in deze taal. Deze taal wordt door browsers geïnterpreteerd en de resulterende opgemaakte tekst wordt weergegeven op uw computermonitor of mobiele apparaat.

Deze taal is van nature heel gemakkelijk en toegankelijk om te leren. Iedereen kan de basis ervan leren en begrijpen. Om een ​​dergelijke taal te gebruiken, moet u descriptors kennen en gebruiken, ook wel tags genoemd. Met behulp van tags wordt een document gemaakt.

Waaruit moet de structuur van het document bestaan, welke tags moeten aanwezig zijn. Laten we alles bekijken met een klein voorbeeld. Ik heb wat tekst geschreven in MS Office en deze in deze schermafbeelding weergegeven.

Om deze tekst in de browser weer te geven op dezelfde manier als deze in het document is geschreven, moet u er pagina-opmaak aan toevoegen, die enkele tags bevat. Kijk er eerst naar, dan zal ik iedereen beschrijven die waarvoor verantwoordelijk is.

Welkom op mijn blog, je volgt nu een les over HTML Basics. Als u dit artikel leuk vond, kunt u zich erop abonneren deze blog om nieuwe artikelen in uw e-mailinbox te ontvangen.

Blog van Jevgeni Nesmelov! website Basisprincipes van html en css voor beginners

Uit welke tags bestaat een HTML-document, wat staat er in en waar moet het allemaal worden opgeschreven?

< html > < body > < h2 >< / h2 > < p >Welkom op mijn blog, volg nu de tutorial over HTML Basics. Als je dit artikel leuk vond, kun je je op deze blog abonneren om nieuwe artikelen in je e-mailinbox te ontvangen.< / p > < h2 >Blog van Evgenia Nesmelov! Nesmelov. ru Basisprincipes van HTML en CSS voor beginners< / h2 > < / body > < / html >

Elke code bestaat uit tekens die tussen punthaken worden geplaatst. Dit worden allemaal elementen genoemd. Alle elementen bestaan ​​meestal uit twee tags, openen en sluiten. Ik raad je aan om eerst goed naar de tags te kijken; als je er een mist en deze niet sluit, zul je grote delen van de code moeten herzien om de fout te vinden.

Er waren gevallen waarin het meer dan een dag duurde, iemand contact opneemt en om hulp vraagt, hij kan geen fout op zijn site vinden, dus kijk altijd heel goed naar wat en waar je schrijft. Laten we nu gaan in dit voorbeeld Laten we eens kijken naar elk element van de code, wat erin geschreven staat, wat het betekent en wat er uiteindelijk gebeurt.

De meeste tags zijn gekoppeld, waaronder een openingstag en een sluitingstag. Naast dergelijke tags zijn er ook enkele tags. Tags kunnen samengaan met andere en dus in elkaar nestelen. Geef tekst bijvoorbeeld in één keer vet en cursief weer.

Tekst

< strong > < i >Tekst< / strong > < / i >

HTML-documentstructuur

Laat me u er nogmaals aan herinneren dat u de regels in het document moet volgen. Dit is hoe de browser begrijpt wat er op de pagina staat, de volgorde, de inhoud, enzovoort.

Een tag is een onderdeel dat de webbrowser vertelt een bepaalde taak uit te voeren. Bijvoorbeeld de aanwezigheid van een alinea, tabel, formulier of afbeelding.

Attribuut - wijzigt de tag. U kunt bijvoorbeeld een alinea gecentreerd of rechts uitgelijnd uitlijnen, ook de locatie van de afbeelding op de pagina instellen, enzovoort.

Sluit ALTIJD tags. Als u ze opent, zorg er dan voor dat u ze sluit. Anders treedt er een fout op en wordt uw document niet correct op de pagina weergegeven. Er zijn ook uitzonderingen, die niet mogen worden vergeten.

Het is duidelijk noodzakelijk om te begrijpen dat er een documenttitel en de inhoud ervan zijn. De titel is alles wat in de tag staat. Documenttekst (), de hoofdtekst van het document bevat de volledige inhoud van de pagina. Als het nodig is om een ​​stuk code voor jezelf achter te laten en daarbij deze tags in opmerkingen te plaatsen, wordt de tag hiervoor gebruikt. Alles wat zich in zo’n tag bevindt, dient als commentaar en wordt niet door browsers waargenomen.

Laten we beginnen met de allereerste. Aan het begin van het document opende ik een tag en aan het einde sloot ik deze. Deze code aanwezig in absoluut elk document, vertelt het de browser dat alles wat tussen deze tags wordt geplaatst HTML-code is. Het is de root van het document zelf; alles wat vervolgens achter deze tag aanwezig is, wordt niet langer opgenomen in het document en wordt niet waargenomen door browsers. Helemaal aan het begin van het document wordt de tag geopend en helemaal aan het einde moet deze worden gesloten.

Het hele gedeelte van deze tag bevat alles technische informatie document. Net als bij de vorige tag moet de kop ook aan het einde worden geopend en gesloten. Deze informatie omvat de paginatitel, de beschrijving ervan, trefwoorden voor zoekmachines en codering. Over de codering iets hieronder.

Inhoud

< head >Inhoud< / head >

Deze tag zit in het hoofd en moet binnenin worden geschreven hoofd label. Deze title-tag is verplicht en moet aanwezig zijn in elk HTML-document. Daarnaast verschijnt het als de titel van het browservenster. De lengte van een dergelijke header mag niet langer zijn dan 60 tekens. De tekst van een dergelijke kop moet het maximum bevatten volledige informatie, die de inhoud van de pagina kenmerkt.

Als u 'Hallo wereld' in de koptekst heeft geschreven, is dit de informatie die op de pagina moet worden weergegeven en geen andere. Je moet mensen en zoekmachines niet misleiden, dat vinden ze niet leuk, en daarmee maak je het nog erger voor jezelf. De informatie in deze tag moet relevant zijn voor de inhoud van uw pagina.

Na vereist label titel, is optioneel, maar ook best veel belangrijk etiket meta. Deze tag is enkelvoudig. Met deze tag stelt u een beschrijving in voor de pagina (description) en de trefwoorden (keywords).

Bovendien kan de metatag gegevens bevatten over de auteur van de pagina en andere metadata-eigenschappen. U kunt het indexeren van een pagina als geheel voorkomen zoekmachines. Neerzetten automatische update pagina na 20 seconden of na 5 seconden gevolgd door overgang naar een andere pagina.

< meta name = "robots" content = "index, follow" > < meta http - equiv = "refresh" content = "20" > < meta http - equiv = "refresh" content = "5; url=http://сайт/" >

Er kunnen meerdere van dergelijke meta-elementen zijn, omdat ze absoluut kunnen worden gedragen diverse informatie. Andere gebruikers zien niet al uw beschrijvingen wanneer ze de pagina in de browser openen; dit blijft allemaal aan het zicht onttrokken.

De style-tag kan ook worden gebruikt om stijlen op de pagina in te stellen. Als je veel gebruikt verschillende stijlen css, in dit geval is het raadzaam om deze in een apart bestand in te stellen. Als u er meerdere wilt opgeven, kunt u dit allemaal rechtstreeks in het HTML-document opgeven.

.base ( breedte: 100px; achtergrondkleur: #000; hoogte: 150px; kleur: #fff; )

< style type = "text/css" > Baseren( breedte: 100px; achtergrond - kleur: #000; hoogte: 150px; kleur: #fff;

Of voeg stijlen specifiek toe aan één tag; u moet hiervoor een stijlelement toevoegen in de tag zelf. Deze tag moet worden gebruikt in een container die stijlen voor de pagina instelt. U kunt meerdere van dergelijke tags gebruiken, dit is geen fout.

Een beetje vergelijkbaar met de vorige tag, kunt u met de linktag stijlen instellen voor een document dat zich in een ander bestand bevindt. Met andere woorden, u kunt verbinding maken met een bestaand document volle tafel CSS-stijlen, dat uit veel eigenschappen bestaat. Zo verkleint u de grootte van het document, dat uiteindelijk sneller wordt geladen en geopend op een computer of mobiel apparaat met lage internetsnelheid.

U kunt meer dan één bestand verbinden, er zijn geen beperkingen. Het is niet nodig om zo'n tag te sluiten. Als alles correct is gedaan, komen specifieke stijlen uit apart bestand. Deze tag kan worden toegevoegd html-basisprincipes en vergeet het bestaan ​​ervan niet. Het resultaat is een foto als deze:

< link href = "css/style-lg.css" rel = "stylesheet" > < link href = "css/style-md.css" rel = "stylesheet" > < link href = "css/style-sm.css" rel = "stylesheet" >

Met behulp van de scripttag kunt u verschillende scenario's (scripts) aan een document koppelen. De aanwezigheid van de sluittag is vereist. Het script zelf kan zich aan het begin van het document, binnenin of aan het einde bevinden.

Vertelt de browser dat alles wat tussen deze tags wordt geplaatst, in uw browservenster moet verschijnen. Hier zijn de belangrijkste tags die in absoluut elk document aanwezig kunnen zijn. De body-tag fungeert als hoofdtekst van de pagina en bevat alle inhoud. Het is raadzaam om deze tag te openen en deze aan het einde van het document te sluiten.

Paginakoppen h1 h2 h3

Laten we verder gaan, we zien een tag die op dezelfde manier opent en sluit. Deze tag geeft de hoofdtitel van de tekst aan; in de meeste gevallen staat onder de H1-kop de paginatitel. In feite zijn er slechts zes gegevensrubrieken. . Ze worden ook gebruikt in SEO, maar dit is een iets ander onderwerp. Ik zal hiervoor zeker één artikel uitlichten en geven gedetailleerde beschrijving

voor hen kunt u zich abonneren op blogupdates, zodat u niets mist.

De aanwezigheid van dergelijke koppen in het artikel zal een belangrijke rol spelen bij het promoten van de pagina. Bovendien geeft het gebruik ervan u een duidelijke paginastructuur, de titel, subkoppen, highlights, subparagrafen, enzovoort. Gebruik ze altijd en breng ze in de praktijk. Op veel CMS, zoals WordPress, zie je bij het schrijven van tekst “kop 1”, “kop 2”, “kop 3” enzovoort. Zij zijn degenen die verantwoordelijk zijn voor h1, h2 en h3.

Als u hoofdtekst uit een nieuwe alinea schrijft, schrijft u een tag

Aan het begin en sluit het aan het einde

. Het markeren van een paragraaf in HTML komt overeen met het aanmaken van een nieuwe paragraaf in een MS Word-document. Ik heb niets nieuws aan het document toegevoegd. Maar dit is niet alles wat in een HTML-document aanwezig zou moeten zijn. Laten we naar een ander voorbeeld kijken, de beschrijving komt iets later.

HTML-document Deze tekst zal vetgedrukt zijn,

< ! DOCTYPE html > < html > < head > < meta http - equiv = "Content-Type" content = "text/html; charset=utf-8" / > < title >en deze staat ook cursief< / title > < / head > < body > < p > < b > < / b > < / p > < / body > < / html >

HTML-document

Basiselementen Kop en Titel Elk document bevat een kop- en titelelement. De eerste, die onmiddellijk na de eerste tag komt. Deze tag bevat alle informatie over de pagina en bevat ook het element. Titel – informatie over de titel van de pagina, met andere woorden de titel van de pagina, de naam ervan. Het staat in de titel waar je naar verwijst juiste naam pagina waarop de gebruiker naar u zoekt zoekmachine , Erg belangrijk punt

. Beide elementen moeten open en ook gesloten zijn. Elk element wordt afgesloten met een “/”. Het resultaat is een foto als deze.

< / html >

Zoals je kunt zien, is er niets ingewikkelds. Hier zijn de meest elementaire tags die in elk HTML-document aanwezig zouden moeten zijn. Vergeet niet ze allemaal te sluiten, anders kan de browser niet het volledige beeld van de code waarnemen. Dit moet je altijd weten en onthouden. Vervolgens begint u met het invoegen van tekst, afbeeldingen, video's, enzovoort. Maar dit zal al in andere artikelen staan.

Kladblok++-editor

Gebruik het Notepad++-programma om met de code te werken. Het is gratis en het is niet moeilijk om het op internet te vinden. Zeer handig voor het begrijpen van elke code; het geeft ook handig de openings- en sluitingstags weer. We ondersteunen de syntaxis van meer dan 40 programmeertalen. Precies wat je nodig hebt om de basisprincipes van HTML te leren.

Kladblok is in alle opzichten superieur aan een gewoon notitieblok. Voor maximaal gemak, gemak en leerplezier deze redacteur U moet het eerst op uw computer installeren. Het belangrijkste voordeel en gemak Kladblok-editor++ toont hints bij het schrijven van code, waardoor uw werk veel sneller en beter wordt.

DOCTYPE-element

Elk document moet ook het volgende doctype-element bevatten. Waarom is het nodig en wat moet er in zitten. Meestal zijn mensen niet zo enthousiast over deze regels, ze kopiëren ze in hun documenten en werken rustig. Deze elementen vertellen de browser welke versie van HTML in het document wordt gebruikt, wat de paginabeschrijving is, welke codering wordt gebruikt, welke trefwoorden zijn opgenomen, wie de auteur is en hoe de pagina heet.

Ze worden meestal helemaal aan het begin geplaatst. Er zijn verschillende opties en ze verschillen allemaal van elkaar, ik zal één voorbeeld schrijven dat het vaakst wordt gebruikt. Deze blanco kan worden gebruikt als kant-en-klaar sjabloon. Het volgende zal zijn duidelijke beschrijving elke regel, hier zouden geen problemen mee moeten zijn.

Kort aan duidelijke taal over de basisprincipes van html: Deze lijn vertelt de browser dat dit document is XHTML versie 1.0, gebruikt Engelse taal en al deze rotzooi bevindt zich langs naar dit adres. Vervolgens geven we in de metatag aan welke codering wordt gebruikt. De meest gebruikte versie is Windows 1251.

Beschrijving - het onderwerp SEO wordt aangestipt, een van de drie hoofdtags die in absoluut elk document aanwezig moet zijn, geeft de beschrijving van de pagina aan; Wat staat er op deze pagina korte beschrijving, niet meer dan twee zinnen. De trefwoordentag omvat ook het onderwerp SEO, deze tag is vereist. Het bevat trefwoorden die internetgebruikers gebruiken om u via zoekmachines te vinden.

IN titel tag komt de naam van het document zelf, de titel, die we in de browser zien. Waarschijnlijk de belangrijkste tag in het hele document, die de grootste impact heeft op de promotie van de pagina. In het artikel over het toevoegen en ontwerpen wordt deze tag gedetailleerder beschreven.

Waarmee je moet onthouden deze les over de basisprincipes van html:

Bijna alle tags openen en sluiten;

Het document begint met de tag ;

Aanwezigheid van label;

Aanwezigheid van label;

Duidelijk html-structuur document.

Alle hoofdpagina's moeten altijd de naam index. Dit is hoe het wordt geaccepteerd en iedereen is eraan gewend, ongeacht de bestandsextensie, het kan html of php zijn. Zo wordt het altijd genoemd.

Bekijk een video over de basisprincipes van HTML van Webformyself.

Hypertext-opmaaktaal, basiselementen en structuur. Dit alles en nog veel meer zal ik proberen te beschrijven op mijn blog. Allereerst zal er nuttige informatie voor beginners worden geschreven, er zal een codevoorbeeld worden gegeven en er zal de mogelijkheid worden geboden om het voorbeeld zelf te downloaden, samen met de voltooide pagina.

IN de laatste tijd Steeds vaker organiseren verschillende internetbronnen holiwars over het onderwerp: is HTML een programmeertaal of niet. Zoals gewoonlijk zijn er een aanzienlijk aantal argumenten ten gunste van beide standpunten, dus besloot ik voor mezelf een einde te maken aan dit onnodige dispuut.

Definitie van een programmeertaal.

Programmeertaal - formeel tekensysteem, bedoeld voor opname computerprogramma's. De programmeertaal definieert de set lexicaal, syntactisch en semantisch regels definiëren verschijning programma's en acties, die zal worden uitgevoerd door de artiest (computer) onder haar controle.

• Aspect-georiënteerd programmeren (AOP) is een programmeerparadigma gebaseerd op het idee om functionaliteit te scheiden om de modularisering van een programma te verbeteren.
• Gestructureerd programmeren is een sdie gebaseerd is op het weergeven van een programma in de vorm hiërarchische structuur blokken. In de jaren ’70 van de 20e eeuw voorgesteld door E. Dijkstra, ontwikkeld en aangevuld door N. Wirth.
• Procedureel programmeren is programmeren in een imperatieve taal, waarin opeenvolgend uitgevoerde instructies kunnen worden samengevoegd tot subroutines, dat wil zeggen grotere. integrale eenheden code, waarbij gebruik wordt gemaakt van de mechanismen van de taal zelf.
• Logisch programmeren is een programmeerparadigma gebaseerd op automatisch bewijs van stellingen, evenals een sectie van discrete wiskunde die de principes van logische gevolgtrekking van informatie bestudeert op basis van gegeven feiten en gevolgtrekkingsregels. Logische programmering gebaseerd op de theorie en het apparaat van de wiskundige logica, waarbij gebruik wordt gemaakt van wiskundige resolutieprincipes.
• Objectgeoriënteerd programmeren (OOP) is een programmeerparadigma waarin de belangrijkste concepten de concepten van objecten en klassen zijn. In het geval van prototypingtalen worden prototypeobjecten gebruikt in plaats van klassen.
• Functioneel programmeren is een tak van de discrete wiskunde en een programmeerparadigma waarin het rekenproces wordt geïnterpreteerd als het berekenen van de waarden van functies in de wiskundige zin van laatstgenoemde (in tegenstelling tot functies als subroutines bij procedureel programmeren).
• Een programmeertaal met meerdere paradigma's is in de regel een programmeertaal die specifiek is ontwikkeld als hulpmiddel voor programmeren met meerdere paradigma's, dat wil zeggen waarvan de visuele mogelijkheden aanvankelijk bedoeld waren om te worden geërfd van verschillende, meestal niet-gerelateerde talen. .
• Een esoterische programmeertaal is een programmeertaal die is ontwikkeld om de grenzen van de mogelijkheden van het ontwikkelen van programmeertalen te verkennen, om de potentiële implementatie van een bepaald idee (het zogenaamde “proof of concept”, Engelse proof of concept) te bewijzen, als een werk softwarekunst, of als grap (computerhumor).

Imperatieve en declaratieve aanpak

Alle programmeertalen zijn verdeeld in twee groepen: declaratief en imperatief.

Vanuit wiskundig oogpunt is een programma in een imperatieve programmeertaal een algemene oplossing voor een bepaald probleem, met andere woorden, een antwoord op de vraag “hoe moet je dat doen?” Dit is een reeks opdrachten die de uitvoerder moet uitvoeren.

Een programma in een declaratieve programmeertaal is een combinatie van een probleem dat binnen de programmeertaal is geformaliseerd en alle stellingen die nodig zijn om het op te lossen; Een specifieke reeks acties wordt uitgevoerd door een compiler, of vaker een tolk: een programma dat programmacode in realtime uitvoert zonder deze in machinecode om te zetten.

HTML (van het Engelse HyperText Markup Language - hypertext markup-taal) is een standaard opmaaktaal voor documenten op internet. Het is in feite de belangrijkste en enige taal voor het bouwen van webpagina's die scripts en elementen van andere talen kunnen bevatten: Java, php, CSS, enz.

Hoewel het theoretische deel van het leren van deze taal in slechts 2-3 maanden kan worden geleerd, worden praktische vaardigheden meestal gedurende een heel leven ontwikkeld, omdat dit een van de meest dynamische programmeertalen is die voortdurend wordt ontwikkeld, aangevuld en gemoderniseerd, waardoor de webprogrammeur om zijn vaardigheden te verbeteren.

Elke gebruiker kan in realtime achterhalen in welke taal een pagina op internet is geschreven: klik met de rechtermuisknop op de lege ruimte en selecteer "Paginacode bekijken" - de paginatalen staan ​​in de tag

Om HTML 5 te begrijpen, moet je begrijpen wat XHTML is...

XHTML is een opmaaktaal voor webpagina's, vergelijkbaar met HTML, die meestal wordt gebruikt om complexe webapplicaties te bouwen, maar met een veel complexere syntaxis en foutgevoeligheid. Als mensen praten over het belang van de documentstructuur, noemen ze altijd XHTML, niet HTML.

Het leren van XHTML kost niet veel meer tijd dan het leren van HTML, maar de effectiviteit ervan tegen de achtergrond van de opkomst van een nieuwe taal - HTML 5 - neemt merkbaar af.

Toen slimme jongens die hun hele leven webprogrammeertalen hadden bestudeerd, beseften dat het voortdurend heen en weer schakelen tussen gemakkelijk leesbare HTML en complexe maar correcte XHTML gewoonweg saai was, besloten ze iets universeels te creëren, iets dat syntactische opmaak van beide zou bevatten. andere talen, zonder kwaliteitsverlies. Zo ontstond HTML 5, die officieel in ontwikkeling is, maar in feite een werkstandaard is (Engels: HTML Living Standard).

Voordat je iets gaat studeren en je tijd gaat besteden, moet je beslissen over je doelen. Als het doel is om een ​​paar pagina's op te maken of een website voor een visitekaartje te maken, dan is het onwaarschijnlijk dat u zelfs studieboeken hoeft te kopen: een of twee maanden hard werken met behulp van internetbronnen voor het leren van HTML en CSS zal voldoende zijn (tabellen trapsgewijze stijlen- taal voor het beschrijven van het uiterlijk van het document), en de site is klaar.

Als iemand webprogrammering wil doen en de fijne kneepjes van handmatige lay-out wil leren, zal hij ongeveer 10-15 keer meer tijd besteden. Om de syntaxis van alle talen zoals SGML te begrijpen, moet je eerst XML bestuderen (een taal voor het structureren van webdocumenten met complexe syntaxis) en vervolgens studeren HTML leren 5 en gaandeweg (aangezien deze twee talen onafscheidelijk zijn) begin je CSS te leren, en aan het einde "vul" je het allemaal met goede Java.

Veel mensen gaan er ten onrechte van uit dat je, om met succes webbronnen te ontwikkelen, 1-2 talen moet kennen. Dit is verkeerd. Het kennen van zo’n klein aantal talen maakt een webprogrammeur “onhandig” – niet in staat creatief te denken.

Om te slagen in webprogrammering is wilskracht vereist. Nou, het kan geen kwaad om het advies op te volgen.

Het is de moeite waard om programmeertalen te gaan bestuderen met de theorie van deze talen - ten eerste moet de toekomstige "lay-outontwerper" het concept van deze talen en hun functies begrijpen, het verschil leren tussen HTML en XML, enz.

In het leerproces is het noodzakelijk om mediabronnen te gebruiken: tegenwoordig zijn er veel educatieve sites waarop informatie in een verteerbare vorm wordt gepresenteerd, en daarom zal het leren van een taal niet alleen voordelen, maar ook plezier opleveren.

Oefening. Nadat je de 'theoretische basis' hebt bestudeerd, moet je onmiddellijk beginnen met oefenen - een notitieblok of een editor zoals Kladblok++ moet 24 uur per dag geopend zijn op de computer.

Een programmeertaal zal - net als Engels of Frans - zich niet ontwikkelen tenzij je hem oefent.

De laatste tijd organiseren verschillende internetbronnen steeds vaker holivars over het onderwerp: is HTML een programmeertaal of niet. Zoals gewoonlijk zijn er een aanzienlijk aantal argumenten ten gunste van beide standpunten, dus besloot ik voor mezelf een einde te maken aan dit onnodige dispuut.

Definitie van een programmeertaalProgrammeertaal - formeel tekensysteem, ontworpen voor het opnemen van computerprogramma's. De programmeertaal definieert de set lexicaal, syntactisch en semantisch regels definiëren verschijning programma's en acties, die zal worden uitgevoerd door de artiest (computer) onder haar controle.

Dit is wat er op Wikipedia staat, en de meeste andere bronnen gebruiken deze definitie volledig of drukken deze vrijelijk uit zonder verlies van betekenis. Laten we de componenten van de definitie van een taal eens nader bekijken:

• Een formele taal is een reeks eindige woorden (lijnen, kettingen) over een eindig alfabet.
• Een gebarensysteem is een systeem van uniform geïnterpreteerde en geïnterpreteerde berichten/signalen die tijdens het communicatieproces kunnen worden uitgewisseld. Soms helpen tekensystemen het communicatieproces te structureren, zodat het enige mate van geschiktheid krijgt in termen van de reacties van de deelnemers op bepaalde ‘tekens’. Taal wordt meestal aangehaald als voorbeeld van een gebarensysteem (zowel in geschreven vorm als, in het geval van natuurlijke talen, in de vorm van spraak).
• Computerprogramma - een reeks instructies die bedoeld zijn om door een besturingsapparaat te worden uitgevoerd computer.
• Woordenschat is een reeks woorden van een bepaalde taal, een deel van een taal of woorden die een bepaalde persoon of groep mensen kent.
• Syntaxis is de kant van een programmeertaal die de structuur van programma's beschrijft als sets symbolen (meestal gezegd - ongeacht de inhoud). De syntaxis van een taal staat in contrast met de semantiek ervan. De syntaxis van een taal beschrijft ‘pure’ taal, terwijl de semantiek betekenissen (acties) toekent aan verschillende syntactische constructies.
• Semantiek in programmeren is een discipline die de formalisering van de betekenissen van programmeertaalconstructies bestudeert door de constructie van hun formele wiskundige modellen. Het volgende kan worden gebruikt als hulpmiddelen voor het construeren van dergelijke modellen: verschillende middelen bijvoorbeeld wiskundige logica, λ-calculus, verzamelingenleer, categorietheorie, modeltheorie, universele algebra. Formalisering van de semantiek van een programmeertaal kan zowel worden gebruikt om de taal te beschrijven, de eigenschappen van de taal te bepalen, als voor formele verificatie van programma's in deze programmeertaal.
• Taal is een gebarensysteem dat conceptuele inhoud en typisch geluid (spelling) met elkaar in verband brengt.

Meer in eenvoudige taal het zou als volgt kunnen worden vermeld:

Een programmeertaal is een reeks vooraf gedefinieerde, uniforme en begrijpelijke instructies voor de uitvoerder (lees: tolk/compiler/computer/programmeur), bedoeld om opeenvolgend te worden geschreven met het doel ze uit te voeren door een bepaald apparaat dat deel uitmaakt van een computer. Ook moet de programmeertaal een aantal kenmerken hebben: er moeten instructies zijn beperkt aantal, en iedereen zou ze moeten kennen; instructies moeten op een bepaalde manier worden gestructureerd om te verkrijgen bepaalde resultaten, en iedereen zou ervan moeten weten; er moeten regels zijn voor het schrijven van instructies en iedereen moet deze kennen; Elke constructie van de taal moet op ondubbelzinnige wijze correleren met wat er geschreven is en wat moet worden aangeduid.

Het bleek zo omslachtig en lelijk, maar zonder moeilijke woorden. Op deze definitie komen we later terug.

Soorten programmeertalen

Ook wordt vaak gebruik gemaakt van de indeling in talen op laag en hoog niveau. Deze typen verschillen in de “dikte van de laag” tussen de processor en de programmeur. Spreken in eenvoudige woorden- V talen op laag niveau elke instructie vertegenwoordigt één of een klein aantal processorinstructies, en in taal op hoog niveau Elke instructie bestaat uit een grote reeks processoropdrachten.

Laten we de definities eens nader bekijken verschillende soorten volgens Wikipedia:

• Aspect-georiënteerd programmeren (AOP) is een programmeerparadigma gebaseerd op het idee om functionaliteit te scheiden om de modularisering van een programma te verbeteren.
• Gestructureerd programmeren is een sdie gebaseerd is op het presenteren van een programma in de vorm van een hiërarchische structuur van blokken. In de jaren ’70 van de 20e eeuw voorgesteld door E. Dijkstra, ontwikkeld en aangevuld door N. Wirth.
• Procedureel programmeren is programmeren in een imperatieve taal, waarin opeenvolgend uitgevoerde instructies kunnen worden samengevoegd tot subroutines, dat wil zeggen grotere integrale code-eenheden, met behulp van de mechanismen van de taal zelf.
• Logisch programmeren is een programmeerparadigma gebaseerd op automatisch bewijs van stellingen, evenals een sectie van discrete wiskunde die de principes van logische gevolgtrekking van informatie bestudeert op basis van gegeven feiten en gevolgtrekkingsregels. Logisch programmeren is gebaseerd op de theorie en het apparaat van wiskundige logica, waarbij gebruik wordt gemaakt van wiskundige resolutieprincipes.
• Objectgeoriënteerd programmeren (OOP) is een programmeerparadigma waarin de belangrijkste concepten de concepten van objecten en klassen zijn. In het geval van prototypingtalen worden prototypeobjecten gebruikt in plaats van klassen.
• Functioneel programmeren is een tak van de discrete wiskunde en een programmeerparadigma waarin het rekenproces wordt geïnterpreteerd als het berekenen van de waarden van functies in de wiskundige zin van laatstgenoemde (in tegenstelling tot functies als subroutines bij procedureel programmeren).
• Een programmeertaal met meerdere paradigma's is in de regel een programmeertaal die specifiek is ontwikkeld als hulpmiddel voor programmeren met meerdere paradigma's, dat wil zeggen waarvan de visuele mogelijkheden aanvankelijk bedoeld waren om te worden geërfd van verschillende, meestal niet-gerelateerde talen. .
• Een esoterische programmeertaal is een programmeertaal die is ontworpen om de grenzen van de ontwikkeling van programmeertalen te verkennen, om de potentiële implementatie van een bepaald idee (het zogenaamde “proof of concept”, Engelse proof of concept) te bewijzen, als een softwarekunstwerk. , of als grap (computerhumor).

Imperatieve en declaratieve aanpak
Alle programmeertalen zijn verdeeld in twee groepen: declaratief en imperatief.

Vanuit wiskundig oogpunt is een programma in een imperatieve programmeertaal een algemene oplossing voor een bepaald probleem, met andere woorden, een antwoord op de vraag “hoe moet je dat doen?” Dit is een reeks opdrachten die de uitvoerder moet uitvoeren.

Een programma in een declaratieve programmeertaal is een combinatie van een probleem dat binnen de programmeertaal is geformaliseerd en alle stellingen die nodig zijn om het op te lossen; Een specifieke reeks acties wordt uitgevoerd door een compiler, of vaker een tolk: een programma dat programmacode in realtime uitvoert zonder deze in machinecode om te zetten.

Turing-volledigheid In de berekenbaarheidstheorie wordt een uitvoerder (een reeks computerelementen) Turing-compleet genoemd als er een berekenbare functie op kan worden geïmplementeerd. Met andere woorden: voor elke berekenbare functie is er een computerelement (bijvoorbeeld een Turing-machine) of een programma voor de uitvoerder, en alle functies die door een reeks rekenmachines worden berekend, zijn berekenbare functies (misschien met enige codering van invoer- en uitvoergegevens). ).
De naam komt van Alan Turing, die een abstracte rekenmachine heeft uitgevonden: de Turing-machine, en vele functies heeft gedefinieerd die door Turing-machines kunnen worden berekend.
Met andere woorden: taal is dat wel Turing voltooid, of een berekenbare functie die u nodig hebt, in deze taal kan worden geschreven en door de uitvoerder ervan kan worden opgelost.

Niet Turing compleet Er bestaan ​​ook talen, maar omdat ze voornamelijk voor academische doeleinden zijn gemaakt, zijn ze weinig bekend en worden ze niet veel gebruikt.

Abstract

1. Korte geschiedenis WWW

2. HTML-taal - webdocumenten bouwen:

a) Webdocumentsjabloon

b) tekstopmaak

c) alinea-opmaak

d) werken met afbeeldingen van afbeeldingen:

I. achtergrondafbeeldingen

II. statische en dynamische beelden

f) kozijnen:

I. Verticale kozijnen

II. Horizontaal kader

III. Geneste frames

Alternatieve manieren voor documentvoorbereiding

1. Korte geschiedenis Wereldwijd Web

Het is algemeen bekend dat vooral het internet een enorme opslagplaats is voor allerlei soorten informatie. Vóór de verschijning Werelddiensten Wide Web (WWW) navigatie op internet op zoek naar de benodigde informatie was niet handig te noemen. Om een ​​bestand van een FTP-server te ontvangen, moest u de clienttoepassing afzonderlijk downloaden. Tegelijkertijd moest je je wachtwoord onthouden, je moest door talloze mappen navigeren op zoek naar het gewenste bestand, en vergeet niet om het te installeren voordat u het ontvangt juiste modus overdrachten; ken talloze commando's voor het werken met FTP-servers, enz. Als u een conferentie wilde bekijken, moest u een andere toepassing starten, die een eigen set opdrachten had voor het lezen, doorsturen en opslaan van berichten van conferenties. Dit alles was lastig.

Ongeveer vijf jaar geleden werd een poging ondernomen om de informatie te ordenen Internetnetwerken. Dit leidde tot de opkomst van de World Wide Web-service ( Wereld wijde web), geboren in het European Nuclear Research Centre in Zweden. Het WWW-idee is gebaseerd op het zogenaamde hypermedia documenten of webdocumenten, ook wel webpagina's genoemd, ontworpen om orde te brengen in de organisatie en het ophalen van gegevens. Deze documenten kunnen zowel tekst als niet-tekst bevatten tekst informatie(bijvoorbeeld afbeeldingen, geluid) en links. Links zijn verwijzingen waarmee u vrijelijk van de ene plaats in een document naar een andere plaats kunt gaan, of er zelfs naar kunt verwijzen afzonderlijk document, misschien wel aan de andere kant van de wereld. Hoewel webdocumenten een grote verscheidenheid aan informatie kunnen bevatten, en niet alleen tekst, worden ze bijna altijd hypertekst genoemd ( hypertekst) documenten, wat in het algemeen niet helemaal waar is.

Op het scherm ziet een typisch webdocument eruit als een reeks tekst met mogelijk verschillende illustraties. U kunt door het document bladeren, de inhoud bekijken en snel door het document of door andere documenten navigeren met behulp van koppelingen.

Met de komst WWW-netwerk Het internet begon tekst en afbeeldingen te dienen, met behulp van een muis werd het mogelijk om de wereld rond te reizen en gemakkelijk te vinden noodzakelijke informatie met een simpele point-and-click. Het is gemakkelijk geworden om bestanden te downloaden en conferenties te lezen. Dit is de reden waarom de WWW-service wereldwijd populair is geworden en wijdverspreid wordt gebruikt. Elke dag op internet verschijnen grote hoeveelheden Webservers en duizenden nieuwe documenten worden gepubliceerd.

Om webdocumenten op het WWW te bouwen, wordt een speciale taal gebruikt, HTML genaamd, die staat voor HyperText Markup Language - een hypertext opmaaktaal, een taal voor het opmaken van gegevens. Gebaseerd op de Standard Generalized Markup Language (SGML), definieert HTML de opmaak en organisatie van gegevens in webdocumenten. Het bepaalt niet hoe tekst precies op het scherm wordt geplaatst; het definieert de structuur van de gegevens. Een webdocument kan meer bevatten dan alleen tekstuele informatie, en dus de taal HTML is correcter zou HyperMedia Markup Language worden genoemd, maar wordt in de literatuur vrijwel altijd gebruikt afkorting HTML. Een document gemaakt in HTML is regulier bestand in ASCII-formaat. Het is gebaseerd op speciale descriptors (tags), die de opmaak van gegevens in elk webdocument bepalen. Om HTML-documenten op het World Wide Web te bekijken, heeft u uiteraard een speciaal programma nodig software. Dergelijke programma's worden browsers genoemd (van het Engelse . bladeren– doorbladeren, bladeren). Met hun hulp kunt u webpagina's downloaden en bekijken, op het WWW navigeren, enz. IN huidige moment Er zijn een behoorlijk groot aantal browsers, waarvan de meest populaire Microsoft-browsers zijn Internet Explorer, Netscape Navigator en NCSA Mozaïek. Nadat de browser het HTML-bestand heeft gelezen, gebruikt hij descriptors om de gegevens in het document te interpreteren en dienovereenkomstig op het computerscherm weer te geven. 1 toont een voorbeeld van een webdocument:

Fig.1 Voorbeeld van een webdocument

De HTML-taal evolueert snel. Tijdens het ontwikkelingsproces verwierf het nieuwe mogelijkheden en verloor het weinig gebruikte en verouderde mogelijkheden. Momenteel de huidige officiële versie HTML-taal is versie 3.2, waarin tools zijn ontwikkeld voor het maken van webdocumenten. Vergeleken met HTML 2.0 biedt de nieuwe versie nieuwe functies zoals tabellen, tekstomloop rond afbeeldingen en insluiten Java-applets en andere mogelijkheden.

Tot op heden, behalve officiële versie taal zijn er ook versies van HTML van Microsoft en Netscape, die ook extra functies ondersteunen die niet beschreven zijn in de specificatie voor de officiële versie van HTML. Om op te lossen bij het weergeven van documenten die zijn samengesteld met behulp van elementen onofficiële versies HTML-taal, de bovengenoemde bedrijven nemen ondersteuning op in hun producten alternatieve versie taal. Versie 4.0 van de taal, genaamd Dynamic HTML, is onderweg en belooft verbeteringen aan oude en opwindende nieuwe functies voor het ontwerpen van webdocumenten. Het W3C (World Wide Web Consortium) stelt deze versie van de taal al als standaard voor. Er zijn opties nieuwe versie talen van Microsoft en Netscape, die echter nog steeds niet met elkaar compatibel zijn. Dit artikel onthult de belangrijkste manieren om documenten uit de taal te construeren HTML-versies 3.2 van Netscape Communications.

2. HTML-taal. Webdocumenten bouwen

Zoals hierboven vermeld, wordt de opmaak van een document in HTML gespecificeerd door speciale descriptors. Een descriptor is een opdracht voor het formatteren van gegevens en staat tussen punthaken “”. Er zijn openings- en sluitingshandvatten, waartussen de op te maken tekst wordt geplaatst. Openingsdescriptors specificeren de opmaakmethode, terwijl tweede descriptors deze overschrijven. Het verschil tussen deze descriptoren is dat in de afsluitende descriptor de naam wordt voorafgegaan door een schuine streep. Bijvoorbeeld beschrijvingen. Er zijn ook handgrepen waarbij geen sluitmogelijkheid vereist is.

HTML is niet hoofdlettergevoelig, dus alle descriptors kunnen in hoofdletters of hoofdletters worden opgegeven. kleine letters. De browser interpreteert ze ondubbelzinnig in elke spelling.

Als u naar de brontekst van een typische webpagina kijkt, ziet u zoiets als het volgende:

documenttitel

tekst

tekst

tekst

tekst

Tussen de descriptoren bevindt zich het gehele document zelf. Descriptoren en definiëren de reikwijdte van het instellen van de documenttitel. De titel van het document wordt tussen het paar geplaatst. De inhoud ervan is zichtbaar in de titel van het browservenster. De headerinformatie wordt door sommige webrobots gebruikt om gegevens te indexeren tijdens het crawlen van WWW-bronnen. In dit gebied kunt u bijvoorbeeld informatie over de auteur invoeren, korte beschrijving document. Tussen de descriptoren staan ​​de gegevens die door de browser op het scherm worden weergegeven. Descriptoren en bevatten gegevens over de auteur die op het scherm worden weergegeven, bijvoorbeeld de voor- en achternaam van de auteur, zijn e-mailadres, datum van creatie en wijziging van het document, enz.

Strikt genomen is geen van de bovenstaande descriptoren verplicht bij het maken van documenten, maar ze helpen documenten te structureren en hun definitie is een teken goede stijl bij het maken van webpagina's.

Tekst opmaken

Bij tekstopmaak wordt tekst weergegeven in een specifiek lettertype of met specifieke kenmerken.

Om tekst op te maken, moet u een regel of regels tekst tussen een paar handvatten plaatsen. Het volgende is een basislijst met descriptoren en de resultaten van tekstopmaak:

Als u bijvoorbeeld een bepaalde regel cursief op het scherm wilt weergeven, moet u het volgende in de hoofdtekst van het webdocument invoeren:

Deze tekst is cursief geschreven

Als gevolg hiervan zal de browser het volgende weergeven:

Deze tekst is cursief geschreven

Descriptoren kunnen in elke volgorde met elkaar worden gecombineerd, bijvoorbeeld de combinatie

Deze tekst is vet en cursief gedrukt

zal het volgende resultaat opleveren:

Deze tekst is vet en cursief gedrukt

Sommige webdocumenten bevatten knipperende tekstregels die bedoeld zijn om de aandacht van de gebruiker te trekken. Voor deze doeleinden wordt de descriptor gebruikt:

Dit is knipperende tekst

Deze Netscape-taalextensie wordt echter zelden gebruikt en kan binnenkort verouderd raken.

Lettertypen worden vaak gebruikt bij het ontwerp van webpagina's. verschillende maten. Met behulp van descriptors kunt u een regel uitvoeren met een andere lettergrootte dan normaal tekst, waarbij n een getal van 1 tot en met 7 is dat de lettergrootte bepaalt ten opzichte van normaal. De volgende tekst staat dus in de hoofdtekst van het document

Deze tekst is vier maten groter dan normaal

het scherm ziet er als volgt uit:

Deze tekst is vier maten groter dan normaal.

Opgemerkt moet worden dat paren van descriptoren En, en zijn ook elementen van de HTML-versie van Netscape en worden daarom mogelijk niet door andere browsers ondersteund.

Alinea's opmaken

Tekstinformatie die op webpagina's wordt geplaatst, is georganiseerd in paragrafen. Een alinea begint met een descriptor en eindigt met een afsluitende descriptor.

, maar dit laatste is optioneel. HTML-code voorbeeld:

Eerste paragraaf

Tweede paragraaf

Als gevolg hiervan verschijnt het volgende resultaat op het scherm:

Eerste paragraaf

Tweede paragraaf

Bij het samenstellen van een document moet er rekening mee worden gehouden dat de browser spaties tussen woorden en regeleinden negeert bij het opmaken van tekst, zodat hij alleen de tekst die tussen de descriptoren staat als een alinea beschouwt. Geforceerde regeleinde wordt ingesteld door de descriptor
, die geen sluitingsoptie heeft. Voorbeeldcode:

Eerste regel

Tweede lijn

Als gevolg hiervan zal de browser het volgende weergeven:

Eerste regel

Tweede lijn

Als u tekst met het vereiste aantal spaties en regeleinden wilt weergeven, moet u deze omsluiten tussen AND-descriptors. Dit wordt vaak gebruikt om vermeldingen weer te geven brontekst programma's. In dit geval wordt de tekst weergegeven in een monospace-lettertype.

Kopteksten maken

Koppen van verschillende niveaus worden gespecificeerd met behulp van descriptoren en , waarbij n een getal is van 1 tot en met 6. De grootste kop wordt gespecificeerd door de descriptor, de kleinste door de descriptor. Bijvoorbeeld:

Dit is een kop van niveau 1

Dit is een header van niveau 3

Dit is een kop van niveau 6

Als gevolg hiervan zal het scherm het volgende weergeven:

Dit is een kop van niveau 1

Dit is een header van niveau 3

Dit is een kop van niveau 6

Koppen zijn een van de meest gebruikte documentontwerpelementen op het WWW.

Lijsten maken

In HTML is het mogelijk om drie soorten lijsten te definiëren: genummerde lijsten, ongenummerde lijsten, definitielijsten. Het begin en einde van de lijst worden gespecificeerd door speciale descriptors, en vóór elk element van de lijst wordt een descriptor gespecificeerd

, die geen sluitingsoptie heeft.

Genummerde lijst:

Lijstitem

Lijstitem

Lijstitem

Resultaat:

Ongeordende lijst:

Lijstitem

Lijstitem

Lijstitem

Resultaat:

* Lijstitem

* Lijstitem

* Lijstitem

Definitielijsten zijn tekstgroepen van elk twee elementen, waarbij het tweede element zich rechts van het eerste bevindt. Dergelijke lijsten worden doorgaans gebruikt ter verduidelijking diverse concepten. Voorbeeld:

Eerste gedefinieerd concept

Uitleg van het eerste concept

Tweede gedefinieerd concept

Verklaring van het tweede concept

Resultaat:

Het eerste concept dat moet worden gedefinieerd.

Uitleg van het eerste concept.

Tweede gedefinieerd concept.

Verklaring van het tweede concept.

Koppelingen

Links zijn een van de basiselementen van de HTML-taal. Links bieden de gebruiker snel en handige manier om naar de ene of de andere plaats in een document of zelfs naar een ander document te gaan. In plaats van bijvoorbeeld door een lang webdocument te scrollen op zoek naar het gewenste fragment, kunt u met een simpele muisklik direct naar de gewenste locatie gaan (als hiervoor uiteraard een overeenkomstige link beschikbaar is). Als er twee zijn verschillende documenten, dan is het, om toegang te bieden van het ene document naar het andere, niet nodig om ze samen te combineren; het volstaat om een ​​link in het ene document naar het andere te maken en alles komt neer op een simpele muisklik.

Op het scherm verschijnen koppelingen als een of meer regels tekst, gemarkeerd in een andere kleur en onderstreept met een dunne lijn. Als u de muiscursor naar dit gedeelte van de tekst verplaatst, verandert deze in een afbeelding van een wijsvinger en nadat u op deze plaats hebt geklikt, volgt u deze link.

Het HREF-attribuut verwijst naar de naam van het label in het huidige document.

In dit geval is het uiteraard noodzakelijk om in het document het label aan te geven waarvoor de link zal worden ingesteld. Hiervoor wordt de descriptor gebruikt met attribuut:

Dit is een merkteken

Op het scherm valt het label, in tegenstelling tot de links, niet op tussen de rest van de tekst.

Als u naar een label in een ander document moet navigeren, zal het bovenstaande voorbeeld enigszins veranderen:

De URL kan relatief of absoluut zijn. Bovendien kan een link niet alleen naar een document verwijzen, maar ook naar afbeeldingen, binaire bestanden, geluidsbestanden enz. Het gedrag van de browser bij het volgen van een bepaalde link is afhankelijk van de browser specifieke instellingen. Dus als de link naar een document verwijst, wordt het gedownload, maar als het een audio- of videobestand is, wordt het afgespeeld. Als dit binair bestand, zal de browser aanbieden om het naar de lokale schijf te kopiëren.

Afbeeldingen insluiten

Door het gebruik van afbeeldingen kunt u webdocumenten kleurrijk ontwerpen; de combinatie van tekst en afbeeldingen geeft elke pagina mooi uitzicht en zichtbaarheid.

Gebruik de descriptor om illustraties in een document in te voegen :

Het attribuut specificeert de naam van het afbeeldingsbestand. De bestandsnaam kan verwijzen naar een lokaal bestand of verwijderd bestand, waarvoor u de bijbehorende URL moet opgeven. Het bestand kan een statische afbeelding zijn en grafisch formaat, begrepen door de browser, of dynamisch beeld, gepresenteerd in GIF89A-formaat. In het laatste geval wordt het bestand als animatie in het browservenster weergegeven.

Het ALT-attribuut specificeert tekst die in het browservenster wordt weergegeven in plaats van een afbeelding als de browser van de gebruiker bijvoorbeeld geen afbeeldingen ondersteunt of de optie om afbeeldingen te laden is uitgeschakeld. Dit attribuut is optioneel, maar het gebruik ervan wordt als een goede stijl beschouwd bij het samenstellen van webdocumenten.

Vaak komt het bij het voorbereiden van pagina's met behulp van afbeeldingen voor dat de gewenste afbeeldingsgrootte niet samenvalt met de werkelijke afbeelding. U moet bijvoorbeeld een afbeelding in een bepaald gebied met een bepaald formaat plaatsen. Om dit te doen, moet u de attributen WIDTH en HEIGHT gebruiken, die de vereiste afbeeldingsafmetingen in respectievelijk breedte en hoogte instellen. Als u bijvoorbeeld een grote afbeelding in een gebied van 100 pixels hoog en 200 pixels breed wilt plaatsen, moet u het volgende in de hoofdtekst van het document schrijven:

De volgorde van deze attributen kan willekeurig zijn.

De overvloed aan afbeeldingen in het document verbetert het enerzijds algemeen beeld, aan de andere kant, verlengt de laadtijd aanzienlijk. Om een ​​compromis te vinden tussen de snelheid waarmee een document wordt geladen en de duidelijkheid ervan, nemen ontwerpers van webpagina's vaak hun toevlucht tot deze techniek: ze plaatsen de afbeelding in een kleiner formaat op de pagina en maken er een link naar zichzelf van. Als u op zo’n afbeelding klikt, zal de browser deze downloaden en weergeven originele maten. De linkafbeelding wordt in het document als volgt beschreven:

Een interessante mogelijkheid is om tekst rond een afbeelding te “wikkelen”. Dit is erg populaire manier ontwerp van webpagina's. In dit geval wordt de afbeelding op het scherm bijvoorbeeld links en onderaan omgeven door tekst. Tekstomloop wordt bereikt met behulp van het ALIGN-attribuut, dat parameters heeft zoals:

LINKS – de tekst bedekt de afbeelding vanaf linksonder.

RECHTS – tekst omringt de afbeelding van rechtsonder

TOP – de afbeelding wordt rechtsboven omgeven door tekst

ONDER – de afbeelding wordt rechtsonder omgeven door tekst

MIDDEN – de afbeelding wordt midden rechts omgeven door tekst

Wanneer u bijvoorbeeld de webpagina maakt die wordt weergegeven in Fig. 1 werd de volgende vermelding gebruikt in de hoofdtekst van het document, waarin de afbeelding wordt beschreven:

Afbeeldingen kunnen ook worden gebruikt als documentachtergronden. Alle tekst en illustraties in het document worden door de browser boven op de achtergrondafbeelding weergegeven. Achtergrondafbeeldingen worden heel eenvoudig als volgt gegeven:

Als de afbeeldingsgrootte niet groot genoeg is om het hele browservenster te vullen, zal de browser de afbeelding eenvoudigweg vermenigvuldigen totdat het venster volledig gevuld is.

Lijsten

Een van de nieuwste innovaties in de officiële versie van de HTML-taal zijn de zogenaamde frames. Bij het gebruik van frames is het browservenster verdeeld in verschillende subvensters, waarin u elk webdocument kunt weergeven en onafhankelijk van andere vensters kunt scrollen. Een goed ontworpen framestructuur kan de documentnavigatie aanzienlijk vergemakkelijken en de perceptie van informatie verbeteren. Een voorbeeld is elektronische versie boek of tijdschrift, wanneer u in het ene venster sectie-links van de inhoud kunt selecteren en in het volgende venster informatie kunt bekijken die rechtstreeks verband houdt met een specifieke sectie uit de inhoud.

Er zijn twee soorten framedocumenten: framebevattende documenten en eenvoudige documenten. Framebevattende documenten definiëren de structuur van het framedocument zelf, d.w.z. geef gegevens op over hoe het browservenster in subvensters wordt verdeeld. Dergelijke documenten bevatten links naar andere documenten. Gewone documenten zijn documenten die geen gegevens bevatten die frames definiëren.

De structuur van een framebevattend document ziet er over het algemeen als volgt uit:

titel

Tekst

Instelgebied framestructuur

Zoals uit het voorbeeld blijkt, wijkt de structuur van een dergelijk document enigszins af van de structuur regulier document. De aanwezigheid van descriptoren en in plaats van en is wat een framedocument onderscheidt van een gewoon document. Het gebruik van descriptoren is een ander teken van goede stijl. Daartussen specificeert u de tekst die wordt weergegeven in een browservenster dat geen frames ondersteunt.

Hieronder ziet u een voorbeeld van een framedocument:

Uw browser ondersteunt geen frames!