Geschiedenis van de creatie en ontwikkeling van HTML

Wij hebben vrijgelaten nieuw boek"Contentmarketing in sociale netwerken: Hoe je in de hoofden van je abonnees kunt kruipen en ze verliefd kunt maken op je merk.”

Abonneren

HTML is een taal hypertext-opmaak.

De taal wordt gebruikt om webpagina's te organiseren. Laten we een analogie maken. Je koopt een krant. Daarin zijn diverse artikelen gepubliceerd. Elk artikel heeft een titel en bevat foto's. En de tekst wordt in verschillende kolommen getypt. Dit is de structuur van een krantenpagina.

Op de website gebeurt alles op dezelfde manier. Te doen juiste structuur artikelen - inhoud - u moet tekstopmaaktaal gebruiken.

Waar is HTML voor?

HTML wordt gebruikt om de browser te vertellen hoe een pagina op het scherm moet worden weergegeven.

De taal is alomtegenwoordig. Dit universele remedie om inhoud op de pagina te ontwerpen. Het kan in elke browser worden gebruikt. Als u code in een programmeertaal schrijft, moet u enkele functies, operators, gegevenstypen, enzovoort kennen.

HTML bestaat uit een reeks tags (opdrachten) en attributen (eigenschappen). Ze zijn gemakkelijk te onthouden en referentiemateriaal is altijd beschikbaar.

Wat is HTML-code

Code bestaat uit instructies aan de browser hoe de pagina moet worden weergegeven. Er is een structuur die altijd gevolgd moet worden. Als er bijvoorbeeld slechts één H1-koptekst op een pagina staat, wordt de belangrijkste informatie in secties geplaatst, enz.

Er zijn drie instrumenten in de taal.

Er zijn twee soorten tags: gekoppeld en enkelvoudig.

  • - gekoppelde tag, openen en sluiten. Ze handelen op basis van de tussen hen geplaatste tekst.
  • Een enkele tag, deze heeft invloed op de tekst die erna komt, vóór de volgende tag.

Structuur van de HTML-code op de pagina

We zeiden dat de structuur van elk HTML-document altijd hetzelfde is. Hieronder sommen we de benodigde elementen op.

  • ! - geeft aan dat het document HTML gebruikt.
  • ... - alle paginacode wordt in deze tag geplaatst. Alles wat er niet in wordt geplaatst, wordt niet door de browser herkend en niet weergegeven.
  • ... is een gepaarde tag die technische informatie bevat, bijvoorbeeld over de codering van het document.
  • ... is de titel van de pagina, deze wordt in de hoofdsectie geplaatst. Elke pagina moet een eigen unieke naam hebben.
  • ... is bedrijfseigen informatie. Het verbindt individuele stijlen met de pagina - css, enz. Het wordt niet aan de gebruiker getoond.
  • ... - paginatekst. Alle basisinformatie is opgenomen in deze tag.
  • ...- hyperlinks.
  • - afbeeldingen.
  • ... - vetgedrukte tekst.
  • ...- cursief.
  • Er kan een onbeperkt aantal elementen in het lichaam aanwezig zijn.

    Zo ziet een deel van de paginacode voor een van onze blogposts er bijvoorbeeld zo uit.

    Hoe vaker u tags gebruikt, hoe sneller ze worden onthouden. U kunt altijd een directory vinden met alle tags, attributen en hun betekenis.

    Lezing 2. HTML-basisprincipes. Kenmerken van HTML5.

    1. Geschiedenis van de ontwikkeling van de html-taal

    In 1989 stelde Tim Berners-Lee aan de leiding van het International Center for High Energy (CERN) een project voor voor een gedistribueerd hypertekstsysteem voor, dat hij noemde Wereldwijd Web (WWW), Wereld Wijde Web. Het oorspronkelijke idee van het systeem was om een ​​hypertekstnavigatiesysteem te gebruiken om de hele set te combineren informatiebronnen CERN tot een verenigd informatiesysteem.

    Een van de componenten van de technologie voor het creëren van een gedistribueerd hypertext-systeem World Breed web werd de hypertext-opmaaktaal HTML (HyperText Markup Language), ontwikkeld door Tim Berners-Lee op basis van de standaard voor opmaaktaal voor gedrukte documenten - SGML (Standard Generalized Opmaaktaal, een standaard gegeneraliseerde opmaaktaal). Daniel W. Connolly schreef er een Document Type Definition voor - een formele beschrijving van de HTML-syntaxis in SGML-termen.

    HTML-ontwikkelaars konden twee problemen oplossen:

      ontwerpers van hypertekstdatabases voorzien van een eenvoudige manier om documenten te creëren;

      maken dit hulpmiddel krachtig genoeg om het huidige begrip van de gebruikersinterface van hypertekstdatabases te weerspiegelen.

    Het eerste probleem werd opgelost door te kiezen voor een taggingmodel voor de documentbeschrijving. Dit model wordt veel gebruikt in systemen voor het voorbereiden van documenten voor afdrukken.

    Met de HTML-taal kunt u een elektronisch document markeren dat op het scherm wordt weergegeven met een ontwerp op afdrukniveau; het resulterende document kan een grote verscheidenheid aan labels, illustraties, audio- en videofragmenten, enzovoort bevatten. De taal bevat ontwikkelde tools voor het maken van verschillende niveaus van koppen, lettertypeselecties, verschillende lijsten, tabellen en nog veel meer.

    Het tweede belangrijke punt dat het lot van HTML beïnvloedde, was dat het als basis werd gekozen platte tekst nieuw bestand.

    Een hypertekstdatabase in het WWW-concept is dus een verzameling tekstbestanden, gemarkeerd in de HTML-taal, die de vorm van informatiepresentatie (markup) en de structuur van verbindingen tussen deze bestanden en andere informatiebronnen (hypertekstlinks) definieert. Hypertekstlinks, die verbindingen tot stand brachten tussen tekstdocumenten, begonnen geleidelijk een grote verscheidenheid aan informatiebronnen te verenigen, waaronder geluid en video; Als gevolg hiervan ontstond een nieuw concept: hypermedia.

    Deze aanpak veronderstelt de aanwezigheid van een ander onderdeel van de technologie: een taaltolk. In de hele wereld Webfuncties tolken zijn verdeeld over de hypertext-database-webserver en de gebruikersinterface. De server biedt naast toegang tot documenten en het verwerken van hypertextlinks ook de voorverwerking van documenten, terwijl de gebruikersinterface taalconstructies interpreteert die verband houden met de presentatie van informatie.

    Versies

    HTML 4.01 (veranderingen, belangrijker dan het op het eerste gezicht lijkt) - 24 december 1999;

    ISO/IEC 15445:2000 (zogenaamde ISO HTML, gebaseerd op HTML 4.01 Strict) - 15 mei 2000.

    HTML5 - in ontwikkeling. Het einde van de ontwikkeling is gepland voor 2014.

    Er is geen officiële HTML 1.0-specificatie. Vóór 1995 waren er veel onofficiële HTML-standaarden. Om de standaardversie anders te maken, kreeg deze meteen een tweede nummer.

    Versie 3 werd in maart 1995 voorgesteld door het World Wide Web Consortium (W3C) en bood veel nieuwe functies, zoals het maken van tabellen, het omwikkelen van tekst rond afbeeldingen en het weergeven van complexe wiskundige formules, ondersteuning gif-formaat. Hoewel deze standaard compatibel was met de tweede versie, was de implementatie ervan moeilijk voor browsers uit die tijd. Versie 3.1 werd nooit officieel voorgesteld, en de volgende versie van de HTML-standaard was 3.2, waarin veel van de innovaties van versie 3.0 werden weggelaten, maar niet-standaardelementen werden toegevoegd die worden ondersteund door de Netscape Navigator- en Mozaïek-browsers.

    IN HTML-versies 4.0 was er sprake van enige "opschoning" van de standaard. Veel items zijn gemarkeerd als verouderd en verouderd. verouderd). Met name het lettertype-element, dat wordt gebruikt om lettertype-eigenschappen te wijzigen, is gemarkeerd als verouderd (in plaats daarvan worden CSS-stijlbladen aanbevolen).

    In 1998 begon het World Wide Web Consortium te werken aan een nieuwe opmaaktaal gebaseerd op HTML 4 maar consistent met XML-syntaxis. Vervolgens nieuwe taal genaamd XHTML. De eerste versie van XHTML 1.0 werd op 26 januari 2000 goedgekeurd als aanbeveling van het World Wide Web Consortium.

    De geplande versie van XHTML 2.0 was bedoeld om de compatibiliteit met oudere versies van HTML en XHTML te verbreken, maar op 2 juli 2009 kondigde het World Wide Web Consortium aan dat de XHTML2 Working Group eind 2009 zou aflopen. Alle verdere ontwikkeling van de XHTML 2.0-standaard werd dus opgeschort.

    Het World Wide Web Consortium ontwikkelt momenteel HTML-versie 5. Op 20 november 2007 verscheen een concept-taalspecificatie op internet.

    Ik begin waarschijnlijk bij het begin...

    De HTML-taal is niet inherent een programmeertaal. Het is een opmaaktaal voor hypertekstdocumenten. Met andere woorden, hij is verantwoordelijk voor de ordening in het document van uw teksten, tekeningen, tabellen... bedoeld voor het leven op internet. Het is onmogelijk om hem te dwingen te berekenen hoeveel twee keer twee is, dat is er niet logische functies, maar het is mooi en vooral gemakkelijk om de informatie te plaatsen dat twee en twee gelijk is aan vier - dat is gemakkelijk. Deze taal wordt gelezen met behulp van programma's die u kent, browsers (browsers) genaamd, die “weten” standaard commando's html-taal, en door ze te ‘kauwen’, worden documenten op de computermonitor weergegeven in de vorm waarin de webmaster, de auteur van het document, ze wil presenteren.

    Nu over commando's - ze worden descriptors genoemd, maar vaker - tags.

    Laten we teruggaan naar onze eerste pagina... dus schreven we:



    Mijn eerste pagina


    Hallo wereld!!!


    Dit is dus wat er tussen staat: ze worden tags genoemd. Ze zijn niet zichtbaar voor de lezer die naar uw pagina kijkt, maar zijn duidelijk zichtbaar voor de browser, die, nadat hij een tag is tegengekomen, dit begrijpt als een signaal dat dat zo zal zijn. een document zijn dat moet worden gelezen en weergegeven op de monitor in de juiste vorm.. maar de tag zegt dat het document is geëindigd en dat er niets meer van nodig is, dat wil zeggen van de browser, en dat het met een gerust geweten kan rusten.

    Dus wat hebben we geschreven? en hoe leest de browser het?

    Browser-gedachten:

    - het begin van het document.. er is weer veel werk..
    - kijk naar het Engelse woordenboek en vertaal “hoofd”…er is geen probleem met zaagsel in mijn hoofd!! ... hier is de basisservice-informatie over het document. Dus wat willen ze van mij?
    - “titel” betekent... je moet de naam ervan in de koptekst van het venster schrijven:
    Mijn eerste pagina - De ketel is weer aan het trainen..
    - de hele naam is voorbij.. je kunt verder..
    - ja, en buiten de naam houden we geen onzingedachten meer in ons hoofd..
    - De ‘body’ van het document, alles wat hieronder staat, wordt aan het publiek getoond
    Hallo wereld!!! - wat leuk! Al genoeg!!!

    - verplaats de tekst naar volgende regel.. Ik kan zelfs raden wat erin zal zitten...
    Mijn naam is (jouw naam hier), dit is mijn eerste pagina! - nou ja, dat is het wel.. iets origineler kunnen ze niet bedenken..
    - dat is alles? Niets anders laten zien?
    - Nou, dat is het einde!! Niet wakker maken, niet omdraaien, bij brand eerst eruit halen!!

    Dit is ongeveer hoe het lezen van onze pagina werkt. Zoals u kunt zien, is de browser een nogal wispelturig type, dus hij moet duidelijke en nauwkeurige commando's geven, anders zal hij vloeken.. en hardop.. en laten we daarom het volgende onthouden dingen:

    1) Het is noodzakelijk om voor eens en voor altijd te onthouden dat als er een openingstag is, er ook een slottag moet zijn

    Al zijn er uitzonderingen, zoals onze tag
    - het vereist geen afsluiting omdat er alleen staat dat men ermee moet schrijven nieuwe lijn. Probeer trouwens nog een paar van dezelfde toe te voegen vóór de regel "Mijn naam is.." en je zult zien dat het resultaat merkbaar is gedaald. (Nou, bewaar de wijzigingen natuurlijk in Kladblok, en druk op de knop “vernieuwen” in de browser)

    2) Alle documenten moeten de volgende codesjabloon hebben:

    - begin van document
    - begin van het hoofd
    - het hoofd sluiten
    - begin van het lichaam
    - sluiting van het lichaam
    - einde document

    Deze tags zijn verplicht! Ze moeten altijd voor elk worden geschreven nieuwe pagina, en alleen in die volgorde! Probeer niet alles op zijn kop te zetten...

    3) Over de bestelling:

    De openings- en sluitingstag is een soort container, een doos waarin andere tags kunnen worden opgeslagen - kleinere dozen... daarom zou het document er volgens de logica als volgt uit moeten zien:




    inhoud


    Als je bijvoorbeeld zo schrijft:




    inhoud



    Het zal onzin blijken te zijn die niet in je hoofd past, de 'grote' is al gesloten en de 'kleine' 'steekt eruit', die in het 'midden' opgesloten zit, en de ' inhoud” is overal verspreid. Het is zelfs voor iemand moeilijk om zich voor te stellen wat er over de browser wordt gesproken. Structureer de code van uw pagina duidelijk, anders werkt niets.

    Nou, we hebben geleerd hoe we eenvoudige tekst kunnen schrijven, er is een begin gemaakt! in het volgende hoofdstuk zal ik vertellen wat je ermee kunt doen..

      Wanneer u een website schrijft, maak dan een map op elke geschikte plaats op uw harde schijf, noem deze hoe u maar wilt, zolang het maar duidelijk is... sla uw pagina's op in deze map en geef ze betekenisvolle namen... opties zoals aaa. html, 123.html zal tot verwarring en verwarring leiden... Aan in dit stadium Dit advies lijkt misschien niet praktisch, maar het zal uw werk in de toekomst veel gemakkelijker maken. Stel je bijvoorbeeld minstens 20 tot 30 van dergelijke bestanden voor waarvan je de namen in gedachten moet houden om er kruisverwijzingen naar te kunnen maken. Bestel eerst!

      Bij het schrijven van code raad ik u aan om u aan een “goede schrijfstijl” te houden, dat wil zeggen, tags op een “ladder”-manier te schrijven, waarbij de ene tag in de andere is genest. Na verloop van tijd zul je begrijpen dat het lezen van code als volgt is geschreven:



      Mijn eerste pagina


      Hallo wereld!!!

      Mijn naam is Carlson, dit is mijn eerste pagina!

      Veel makkelijker dan dit:



      Mijn eerste pagina


      Hallo wereld!!!

      Mijn naam is Carlson, dit is mijn eerste pagina!

      En nog meer dan dit:

      Mijn eerste paginaHallo wereld!!!
      Mijn naam is Carlson, dit is mijn eerste pagina!

      Hoewel dit een kwestie van gewoonte is... is het toch beter om te wennen aan het “leesbaar” schrijven.

    Iedereen gebruikt internet en iedereen surft op verschillende sites, en waarschijnlijk zou iedereen zijn website graag op internet willen plaatsen, maar dit is niet eenvoudig, daar zijn veel redenen voor. Om echter een kwaliteitswebsite te kunnen hosten, hoeft u alleen maar de basisprincipes te kennen “ WEB-programmering", wat de HTML-taal is. In dit artikel zullen we kijken naar de belangrijkste elementen, tags, attributen en zelfs de eerste webpagina schrijven.

    Hyper Tekstopmaak Taal - "HTML" ( hypertext opmaaktaal) beschouwen velen het al lang niet meer als slechts een programmeertaal. Omdat het hele concept van HTML omvat verschillende methoden ontwerp van hypertext-documenten, ontwerp, hypertext-editors, browsers en nog veel meer. Een gebruiker die deze taal beheerst, krijgt het vermogen om serieuze dingen te doen eenvoudige methoden en, belangrijker nog, snel, dat erin moderne wereld als zeer goed beschouwd!

    In de HTML-taal kun je je eigen multimediaproducten maken en deze op cd's distribueren, en al deze producten, gemaakt in de vorm van sets HTML-pagina's, vereisen niet de ontwikkeling van gespecialiseerde software, omdat alles wat nodig is voor het werken met gegevens ( Webbrowsers) zijn onderdeel geworden van de standaardsoftware op de meeste personal computers.

    • Element ( element) - ontwerp HTML-taal. Dit is een object dat gegevens bevat en ervoor zorgt dat deze op een specifieke manier kunnen worden geformatteerd. Elke webpagina is een verzameling elementen. Een van de belangrijkste ideeën van hypertekst is de mogelijkheid om elementen te nesten.
    • Label ( label) - begin- of eindmarkeringen van een element. Tags definiëren de grenzen van de actie van elementen en scheiden elementen van elkaar. In de tekst van een webpagina worden tags tussen punthaken geplaatst en wordt de eindtag altijd gevolgd door een schuine streep.
    • Attribuut - een parameter of eigenschap van een element. Met andere woorden, het is een variabele die dat wel heeft standaard naam en waaraan een bepaalde reeks waarden kan worden toegekend: standaard of willekeurig. Er wordt verwacht dat tekenattribuutwaarden tussen rechte aanhalingstekens staan, maar in sommige browsers kunt u de aanhalingstekens weglaten. Dit komt omdat het attribuuttype altijd vooraf bekend is. Attributen bevinden zich in de starttag en zijn van elkaar gescheiden door spaties.
    • Een hyperlink is een stukje tekst dat verwijst naar een ander bestand of object. Hyperlinks zijn nodig om navigatie van het ene document naar het andere mogelijk te maken.
    • Kader ( kader) - deze term heeft twee betekenissen. De eerste is het documentgebied met zijn eigen schuifbalken. De tweede waarde is één afbeelding in een complex ( geanimeerd) grafisch bestand(lijkt op een still uit een film). Het is ook mogelijk in plaats van de term 'frame' in de gespecialiseerde literatuur en gelokaliseerd softwareproducten Mogelijk komt u de term ‘frame’ of ‘frame’ tegen.
    • Een HTML-bestand of HTML-pagina is een document dat is gemaakt in de vorm van hypertekst op basis van de HTML-taal. Dergelijke bestanden hebben de extensie htm of html.
    • Applet ( applet) - een programma dat in de vorm naar de clientcomputer wordt overgebracht apart bestand en gelanceerd bij het bekijken van een webpagina.
    • Script of script ( script) is een programma dat is opgenomen in een webpagina om de mogelijkheden ervan uit te breiden.
    • Verlenging ( verlenging) - een element dat niet is opgenomen in de taalspecificatie, maar wel wordt gebruikt, waardoor het mogelijk wordt een nieuwe te maken interessant effect opmaak.
    • CGI ( Gemeenschappelijke toegangspoort Interface) - gemeenschappelijke naam voor programma's waarmee u, als ze op een server worden uitgevoerd, de mogelijkheden van webpagina's kunt uitbreiden. Zonder dergelijke programma's is het bijvoorbeeld onmogelijk om interactieve pagina's te maken.
    • HTML-code is een hypertextdocument in zijn oorspronkelijke vorm, waarbij alle elementen en attributen zichtbaar zijn.
    • Een webpagina is een document (bestand) dat in hypertekstformaat is opgesteld en op het World Wide Web is geplaatst.
    • Website ( plaats) - een reeks webpagina's die zich op één plek bevinden en met elkaar verbonden zijn.
    • Browser ( browser) - een programma voor het bekijken van webpagina's.
    • () - bestanden kopiëren van de server naar de clientcomputer.
    • URL( Uniforme bronzoeker) of uniform resource locator, het adres van een object op internet, d.w.z. Een typische URL voor WWW ziet er als volgt uit: http://www.naam.domein/bestandsnaam.

    Alle elementen van taal kunnen in drie groepen worden verdeeld. De eerste omvat de elementen die de structuur creëren hypertekstdocument. Het gebruik van dergelijke elementen is een noodzakelijke formaliteit die niet kan worden verwaarloosd. De tweede groep bevat elementen die opmaakeffecten creëren. Het gebruik ervan wordt bepaald door de specifieke vereisten voor het document, de verbeeldingskracht en competentie van de ontwikkelaar bevat elementen waarmee u kunt beheren software geïnstalleerd en actief op de clientcomputer. Vaak worden dergelijke elementen automatisch gemaakt wanneer een ontwikkelaar een hypertext-editor of een soortgelijk programma gebruikt om een ​​object in een document in te voegen.

    Hoewel de HTML-specificatie een standaard is, worden er nieuwe elementen aan de taal toegevoegd ( extensies). Daarom zijn sommige webpagina's handiger om te bekijken met bepaalde browsers. Extensies worden alleen gemaakt door bekende bedrijven die zich ontwikkelen software voor WWW, en gewone gebruikers kunnen hun webpagina's verbeteren door middel van programmeren. Met applets kunt u verwijderen HTML-beperkingen en geef ruimte aan de verbeelding van de ontwikkelaar.

    HTML-versies

    De eerste versie van de HTML-taal werd begin jaren 90 ontwikkeld door Tim BenersLee voor een van de populaire Mozaïekbrowsers uit het verleden. Maar toen waren noch de browser, noch de HTML zelf gevonden goed gebruik. HTML+ verscheen in 1993 en ook deze versie bleef vrijwel onopgemerkt. Maar de HTML-taal werd wijdverspreid dankzij versie 2.0, die in juni 1994 verscheen. En vanaf dat moment is de populariteit van WWW over de hele wereld toegenomen. De standaarden in versie 2 zijn zo ingeburgerd geraakt dat ze nog steeds worden gebruikt.

    HTML-versie 3.0, die ongeveer een jaar later verscheen, introduceerde de mogelijkheid om te tekenen wiskundige symbolen (Integrale tekens, oneindigheid, breuken, haakjes, enz.) met behulp van taalelementen. Maar de ontwikkeling van dit project vertraagde en kreeg geen verdere verspreiding.

    In 1996 verscheen HTML-versie 3.2. Het was een briljante beslissing; het volstaat te vermelden dat er frames in de taalspecificatie zijn geïntroduceerd, die nu erg populair zijn geworden onder website-ontwikkelaars. Tot op de dag van vandaag ondersteunen alle browsers deze versie van HTML.

    Officiële HTML 4-specificatie ( Dynamische HTML) werd ontwikkeld in 1997. Op dat moment was het al duidelijk dat de verdere ontwikkeling van hypertekst zou plaatsvinden via webprogrammering. Dit bleek veel effectiever dan het introduceren van nieuwe elementen in de taal.

    Structuur van webpagina's

    Hieronder staat de code van de webpagina, die is geschreven in HTML, en met deze pagina als voorbeeld zullen we de structuur ervan analyseren, maar eerst kopiëren we alle code naar een gewone pagina tekst notitieblok en klik op “Opslaan als” en sla het bestand op met html-extensie, d.w.z. na de naam write.html

    Structuur van een webdocument Ga naar het einde van het document Kop 1 Kop 2 Kop 3 Kop 4 Kop 5 Kop 6 De eerste link vindt u hier Zou hier gevestigd moeten zijn
    eenvoudig webtekst pagina's.
    En ik zal hier bijvoorbeeld invoegen
    diverse overschrijvingen,
    zodat jij dat kunt
    duidelijk waarnemen
    hoe werkt het voor jou
    koppelingen in het document,
    anders als u een grote resolutie heeft,
    U merkt gewoon niet dat de links worden gevolgd

    HTML-documentnotatie. Een van de principes van de taal is het nesten van elementen op meerdere niveaus. Dit artikel is de buitenste, omdat de hele webpagina zich tussen de begin- en eindtags moet bevinden. In theorie kan dit element als een formaliteit worden beschouwd. Het heeft de attributen versie, lang en dir, die dat zijn in dit geval zelden gebruikt en staat iemand het nesten toe van HEAD, BODY FRAMESET en andere elementen die de algehele structuur van een webpagina bepalen. Uiteraard eindigen al dergelijke documenten met een eindtag.

    < head >

    Het titelgebied van een webpagina. Met andere woorden, het eerste deel. Hetzelfde als vorig onderdeel, HOOFD dient alleen om te vormen algemene structuur document. Dit element kan de attributen lang en dir hebben.

    < title >

    Een element voor het plaatsen van de titel van een webpagina. De tekstregel in dit element verschijnt niet in het document, maar in de titelbalk van het browservenster. Dit element heeft een grote invloed op de promotie in de zoekmachine, omdat zoekmachines betalen speciale aandacht op TITEL-tag. Mijn advies: doe nooit te veel lange tekst in deze tag ( 65 tekens is voldoende).

    Dit element bevat service-informatie die niet wordt weergegeven bij het bekijken van een webpagina. Er zit geen tekst in in de gebruikelijke zin, dus er is geen eindtag. Elk META-element bevat twee hoofdattributen, waarvan de eerste het gegevenstype definieert en de tweede de inhoud.

    < body >

    Dit element combineert hypertekst, die de webpagina zelf definieert. Dit is het zichtbare deel van het document dat door de autopagina wordt ontwikkeld en door de browser wordt weergegeven. Dienovereenkomstig moet de eindtag van dit element aan het einde van de webpagina worden gevonden. Binnen het BODY-element kunt u alle elementen gebruiken die bedoeld zijn voor het ontwerpen van webpagina's. Je kunt veel attributen in de starttag van het BODY-element plaatsen die dienen om de hele pagina in te stellen. Laten we ze in volgorde bekijken.

    Een van de handigste kenmerken van deze tag, die van invloed is op het ontwerp van de pagina, is

    background="pad naar achtergrondbestand"

    Een eenvoudiger achtergrondontwerp komt neer op het instellen van de kleur

    bgcolor="#FFFFFF"

    De achtergrondkleur wordt aangegeven met drie cijfers van twee cijfers hexadecimale getallen, die de intensiteit van rood, groen en bepalen blauwe kleuren(rbg).

    Omdat u de achtergrond van de pagina kunt wijzigen, kunt u ook de kleur van de tekst wijzigen. Voor dit doel is er het volgende attribuut

    tekst="#RRGGBB"

    Gebruik het volgende attribuut om de tekstkleur van hyperlinks in te stellen

    link = "#RRGGBB"

    U kunt ook een kleurwijziging opgeven voor de laatst geselecteerde hyperlink van de gebruiker

    Kopelement. Er zijn zes niveaus van kopjes, die als volgt worden aangeduid.
    Rubriek
    Rubriek
    Rubriek
    Rubriek
    Rubriek
    Rubriek

    Kop van niveau 1 is de grootste en kop van niveau 6 biedt de kleinste kop. Voor koppen kunt u een attribuut gebruiken dat de uitlijning links, midden of rechts specificeert:

    align=”links” align=”center” align=”rechts”

    Gebruik de tag om een ​​nieuwe alinea te maken

    En om naar een nieuwe regel te gaan zonder een alineatag te maken
    d.w.z. er vindt overdracht plaats. Het is niet nodig om deze tags te sluiten. Natuurlijk, als je de tag niet gebruikt

    Het ALIGN-element, waarmee de uitlijning van alinea's kan worden ingesteld:

    Links

    Gecentreerd

    Rechts

    Tekst tussen deze elementen wordt in de breedte uitgelijnd

    Horizontale lijn ( horizontale regel) is een veel voorkomend element. Ten eerste omdat het heel gemakkelijk en handig is om een ​​pagina in delen te verdelen. Ten tweede omdat de keuze van dergelijke ontwerpelementen voor de auteur van de pagina erg klein is. Het element heeft geen eindtag, maar heeft een aantal attributen voor links, midden, rechts, uitvulling:

    • uitlijnen = "links"
    • uitlijnen = centreren
    • uitlijnen = "rechts"
    • align=”rechtvaardigen”

    Een HTML-document kan erg omslachtig zijn en niet erg handig voor de gebruiker die snel naar het gewenste gedeelte van het document moet gaan. Om dit te doen, kunt u het hyperlinkmechanisme gebruiken. Plaats hiervoor de juiste markeringen op de juiste plaatsen in de tekst.

    Vrije tekst

    In dit geval krijgt een bepaalde regel van het document een naam, en daarom kan er een hyperlink worden gemaakt naar een ander deel van het document, of zelfs naar een ander document, die naar dat label leidt.

    Afbeeldingen invoegen ( foto's) in een HTML-document wordt de volgende tag gebruikt ( gepresenteerd volledige beschrijving kenmerken van deze tag):

    Lijsten

    (lijst) zijn ontwikkeld in HTML, ongetwijfeld beïnvloed door het succes teksteditors. Een lijst verschilt in de eerste plaats van gewone tekst doordat de gebruiker niet hoeft na te denken over het nummeren van de items: HTML neemt deze taak op zich. Als de lijst wordt aangevuld met nieuwe items of wordt ingekort, wordt de nummering automatisch voortgezet. In geval van ongenummerd HTML-lijsten plaatst markeringen voor elk item: cirkels, rechthoeken, ruiten en andere afbeeldingen. Uiteindelijk krijgt de lijst een fatsoenlijke vorm. Er zijn twee groepen van dergelijke tags: sommige definiëren algemeen beeld lijst ( en kunt u attributen opgeven), en anderen vragen het interne structuur. U kunt standaardattributen in lijsten gebruiken. Er zijn verschillende soorten lijsten.

    De meest voorkomende is ongenummerde lijst (ongeordende lijst). Het wordt hieronder weergegeven:

    • Lijstitem 1
    • Lijstitem 2
    • Lijstitem 3

    Het ul-element is een soort accentuering van een lijst. Hiermee kunt u de ene lijst van de andere scheiden. Het li-element vertegenwoordigt elk van de items.

    Tafels

    Ze zijn een van de meesten noodzakelijke middelen gegevens op een webpagina formatteren. Het belangrijkste gemak is dat de browser de hele tabel tekent. De grootte van het frame kan automatisch worden aangepast aan de grootte van het browservenster en uiteraard aan de grootte van de tekstregels en afbeeldingen in de tabelcellen. Naast al het andere kunt u met tabellen veel ontwerpproblemen oplossen: delen van een pagina ten opzichte van elkaar uitlijnen, afbeeldingen en tekst naast elkaar plaatsen, kleurenschema's beheren, enzovoort. Bij het maken van tabellen wordt het principe van nesten toegepast: binnen het hoofdtabelelement (TABLE) worden een aantal elementen gemaakt die rijen definiëren (TR), en binnen deze elementen zijn er elementen om elke cel in de rij te beschrijven (TD, E).

    Om de structuur van een bestaande tabel te begrijpen of te ontwikkelen nieuwe tafel, is er één regel die bepaalt dat de volgorde van de elementen de tabel van boven naar beneden en van rechts naar links beschrijft. Als een TABLE-element bijvoorbeeld wordt gevolgd door een TR-element, geeft dit aan dat er een nieuwe tabelrij wordt gedefinieerd. Alles achter dit element wordt op één lijn geplaatst (van rechts naar links). Dit kan een reeks TD-elementen zijn ( cellen), een andere tafel enzovoort. Nadat het verschijnt nieuw onderdeel TR, de beschrijving zal beginnen volgende regel, etc. tot het einde van de tabel (tag).
    De tabel kan horizontaal worden uitgelijnd met behulp van het align-attribuut:

    • uitlijnen = "links" - links;
    • align="center" - in het midden;
    • align="right" - naar rechts.

    De tabelbreedte kan exact worden ingesteld in pixels of als percentage van de paginabreedte in het browservenster. Bijvoorbeeld: breedte=400 of breedte=50%

    Er worden twee attributen gebruikt om het uiterlijk van het frame te bepalen. Het feit is dat de browser een afbeelding van het frame maakt en de driedimensionaliteit ervan simuleert ( convex) met behulp van verschillen in verlichting van de gezichten

    Scenario's

    Bijna alle webmasters willen dat hun pagina's op de site staan moderne uitstraling, waren multifunctioneel, mooi en dynamisch. Met standaardmiddelen HTML is niet mogelijk, dus gebruik verschillende middelen: applets, objecten, trapsgewijze stijlbladen enzovoort. Maar het meest populaire en wijdverspreide type ( receptie) is het gebruik van scripts.

    Een script is een programmacode die is opgenomen in de paginatekst van het formulier brontekst en wordt uitgevoerd door de browser wanneer de pagina wordt bekeken. Het script kan worden geschreven JavaScript, ontwikkeld door Netscape, of daarop Visuele basis Script ( VBScript), ontwikkeld door Microsoft.

    Met deze tag kunt u de tekst van het scriptprogramma scheiden van andere pagina-informatie. De SCRIPT-tag moet een taalkenmerk bevatten, dat de taal specificeert en de volgende waarden kan aannemen:

    • javascript - code in JavaScript;
    • vbscript - code in VBScript-taal.

    Het type attribuut kan ook het taaltype aangeven, hoewel het gebruik ervan niet vereist is. Om niet alle regels te overtreden, kunt u de volgende definitie in het element plaatsen:

    type="tekst/javascript"

    Een van de coolste kenmerken van scripts is de mogelijkheid om de inhoud van een pagina te wijzigen als gevolg van de uitvoering van het programma. Maar dit is slechts een kenmerk, geen regel. Met behulp van het defer-attribuut (dat geen waarden accepteert) kunt u de browser ‘vertellen’ dat dergelijke wijzigingen niet zullen worden aangebracht. In sommige gevallen zorgt dit ervoor dat de pagina sneller laadt.

    Van de standaardattributen kunt u het charset attribuut gebruiken.

    SCRIPT-tag ( of een aantal van dergelijke elementen) kan zich in het HEAD-element of in het BODY-element bevinden. Als het script zich binnen het BODY-element bevindt, is het ook mogelijk dat een browser die het SCRIPT-element niet ondersteunt, de programmacode als platte tekst beschouwt en op het scherm weergeeft. Om dit te voorkomen, wordt de scriptcode als commentaar ingevoerd:

    -
    -
    -

    Alle moderne browsers Herken deze techniek en negeer commentaartekens. Als u een opmerking in de tekst van het script moet invoeren, wordt hiervoor een andere notatie gebruikt: aan het begin van de regel worden twee schuine strepen // ingevoerd.
    Programmacode Het script wordt uitgevoerd wanneer de pagina wordt geladen, d.w.z. wanneer de inhoud nog steeds zichtbaar is op het scherm. Hieronder ziet u een voorbeeld van het eenvoudigste scenario ( een bericht in het venster weergeven).

    -
    -
    -
    - Gewoon een script
    -
    - alert("Je hebt je eerste script geschreven!")
    -
    -
    -
    -

    Dit eenvoudige pagina, maar het bevat een script van één regel. Door te gebruiken waarschuwingsmethode Er wordt een bericht weergegeven vóór het laden. En het blijft hangen totdat de gebruiker op de knop OK klikt, het downloaden gaat niet verder.
    Het is mogelijk dat de pagina wordt bekeken in een browser die geen scripting ondersteunt; hiervoor is het NOSCRIPT-element voorzien. Moderne programma's meningen negeren de inhoud ervan. Dit element kan op verschillende manieren worden gebruikt. Om te beginnen kunt u er als volgt een advertentie in weergeven: “ Uw browser kan het script dat nodig is om deze webpagina te bekijken niet uitvoeren!"Ten tweede kun je binnen het element een vereenvoudigde versie van de pagina ontwikkelen, zonder scripts. Ten derde kunt u een link naar een ander HTML-document maken. Het NOSCRIPT-element moet een eindtag hebben.

    We hebben dus gekeken naar de basis van zo’n WEB-programmeertaal als HTML. Zelfs na het lezen van dit korte artikel heb je al een idee en zelfs de mogelijkheid om in deze taal te programmeren. Ik wens je veel succes!

    We hopen dat dit artikel nuttig voor u zal zijn. Veel leesplezier!

    Korte achtergrond

    Lang geleden, bijna aan het begin van de beschaving (tot de jaren zeventig van de twintigste eeuw), was er geen internet. Dat was er helemaal niet.

    Met de komst van computers ontstond er een verlangen en behoefte om ze op de een of andere manier te verenigen, en vier grote Amerikaanse universiteiten namen deze taak op zich. Er zijn ongeveer 7 jaar verstreken vanaf de creatie van het concept tot het historische moment:

    Op 29 oktober 1969 vond een communicatiesessie plaats tussen de eerste twee knooppunten van het ARPANET-netwerk, op een afstand van 640 km: aan de Universiteit van Californië en aan het Stanford Research Institute. Een wetenschapper in Los Angeles maakte op afstand verbinding met een computer op Stanford. Een Stanford-collega zag de op het scherm ingevoerde karakters op het scherm verschijnen en hij bevestigde de verzending van elke letter telefonisch. Zo begon het tijdperk van computernetwerken.

    Het internet was lange tijd alleen bedoeld voor specialisten en diende vooral voor uitwisseling technische documentatie en e-mails. Voor een eenvoudige gebruiker er was daar niets te doen. En pas begin jaren 90 van de vorige eeuw was er een revolutie “voor de internetmensen!” 🙂

    1991

    De Brit Timothy John Berners-Lee van CERN in Genève heeft de hypertext-opmaaktaal uitgevonden, ook bekend als HyperText Markup Language, ook bekend als HTML, ontworpen voor het opmaken en opmaken van World Wide Web-documenten.

    O ja! Sir Tim ontwikkelde ook een mondiaal hypertextproject (nu ken je het als het World Wide Web). Eigenlijk is HTML ontstaan ​​tijdens het werken aan dit project.

    HTML-taal

    Ik geloof dat alle webontwikkelaars 6 augustus met recht als hun professionele vakantie kunnen beschouwen :)

    Wat vond je van de eerste webpagina? 🙂 Ik denk dat de meesten van jullie het niet wilden lezen, laat staan ​​dat je er lang in wilde blijven zitten. De makers begrepen ook dat dit nog maar het begin was, en daar gaan we:

    Juni 1993 - HTML 1.2

    In deze versie zijn van de veertig en een cent tags al maar liefst drie tags verschenen die hintten naar een soort visueel ontwerp van het document (bijvoorbeeld vetgedrukt en cursief). De overige tags dienden uitsluitend voor logische opmaak.

    1994 - W3C opgericht

    Sir Tim Berners-Lee richtte het World Wide Web Consortium (W3C) op. De missie van het W3C was en blijft

    Ontketen het volledige potentieel van het World Wide Web door protocollen en principes te creëren die de ontwikkeling van het netwerk op de lange termijn garanderen

    Een grote eer voor deze jongens is het feit dat HTML met een single is uitgebracht basisset tags en attributen en webpagina's werden wat we vandaag de dag kennen. Stel je eens voor, halverwege de jaren negentig, meerdere grootste producenten De software was van plan om hun eigen versies van HTML uit te brengen met hun eigen tagnamen. Wat een puinhoop zou het nu zijn in webontwikkeling! Bijvoorbeeld vacatures: “Wij zijn op zoek naar een lay-outontwerper om websites in te makenMozilla Firefox", "Wij hebben dringend een lay-outontwerper nodig voorRand", "We hebben een lay-outontwerper nodig voorKindle»… in één woord, dankzij W3C :)

    22 september 1995 – Versie 2.0

    Ontwikkelings- en goedkeuringsproces nieuwe versie was erg ontspannen, en de enige merkbare verbetering in de nieuwe versie was:

    • Zoekopdrachten: bijvoorbeeld zoeken op trefwoorden.
    • Formulieren voor het overbrengen van gegevens van een computer naar een server: voer bijvoorbeeld uw geboortedatum in of selecteer een van de verschillende opties in een vragenlijst.
    Maart 1995 – het werk aan HTML 3.0 begon

    De eerste versie van de standaard bevatte veel interessante dingen:

    • tags voor het maken van tabellen,
    • het markeren van wiskundige formules,
    • tekst die rond afbeeldingen loopt, enz.

    Bij HTML maken 3.0-ontwikkelaars vroegen zich af hoe ze de discrepantie konden oplossen tussen de ideologie van structurele markup en de behoeften van gebruikers die veel meer geïnteresseerd waren in verschijning webpagina's.

    En zodat deze tegenstrijdigheid het origineel niet verandert HTML-eigenschappen besloten de makers van de derde versie ondersteuning toe te voegen voor een nieuwe tool die werd gebruikt om webpagina's te ontwerpen.

    17 december 1996 – CSS

    CSS (Cascading Style Sheets) en in het Russisch - hiërarchische stijlspecificaties. Ik denk dat het niet duidelijker is geworden?)) Als het volledig in het Russisch is, dan zijn dit stylesheets die bijgevoegd zijn HTML-document en dienen voor het visuele ontwerp van bepaalde delen van het document.

    Dus het CSS-systeem:

    • is formeel niet afhankelijk van HTML,
    • het heeft zijn eigen syntaxis, anders dan HTML,
    • Het wordt niet beïnvloed door de ideologische beperkingen van HTML,
    • Hiermee kunt u weergaveparameters instellen voor elke HTML-tag.

    MET met behulp van CSS De maker van een webpagina kon eindelijk gemakkelijk het lettertype en de grootte van wat dan ook veranderen, en wat belangrijk is, is dat dit niet mogelijk werd door het introduceren van een aantal nieuwe tags, maar door een mechanisme te gebruiken dat de interpretatie van reeds bestaande tags beïnvloedde. bestaande labels HTML.

    Om de wonderen te demonstreren die CSS kan doen, creëerde de Canadees Dave Shea een CSS Zen Garden - een plek waar honderden webontwikkelaars mediteren door dezelfde HTML-pagina met totaal verschillende CSS-stijlen uit te typen.

    De invloed van Microsoft

    Ondertussen, in een sterrenstelsel ver, ver weg... merkte Microsoft de snelle omzetstijging van Netscape op Navigator-browsers en natuurlijk kon ik niet opzij blijven staan. MS heeft de Mozaïek-browser enigszins opnieuw ontworpen en begon zijn eigen verkenners uit te brengen, die aanvankelijk niet erg populair waren bij gebruikers (en niet alleen in eerste instantie;)).

    In augustus 1996 werd een versie gemaakt Internet Explorer 3.0 De browser bood destijds belangrijke innovaties en won aan populariteit, waardoor de browsermarkt in tweeën werd verdeeld tussen Netscape Communications en Microsoft.

    En tegelijkertijd Microsoft-tijd nam W3C onder zijn hoede.

    14 januari 1997 – HTML 3.2

    Versie 3.2 verscheen een maand nadat CSS was goedgekeurd en was al volledig aangepast voor interactie met stylesheets.

    Het heeft veel van de innovaties van versie 3.0 weggelaten, maar niet-standaard elementen toegevoegd die worden ondersteund door de Netscape Navigator en Internet Explorer 3 browsers.

    18 december 1997 – HTML 4.0

    In deze versie zijn elementen uit eerdere versies. Veel tags zijn gemarkeerd als verouderd en worden niet aanbevolen voor gebruik. In plaats daarvan hadden CSS-stijlbladen moeten worden gebruikt.

    De nieuwe versie bevatte ondersteuning voor frames, scripts en een algemene implementatieprocedure verschillende objecten. Het verbeterde ook de tabellen en formulieren, wat onder andere zorgde voor een grotere toegankelijkheid voor mensen met een lichamelijke beperking.

    HTML 4 is ontwikkeld met hulp van experts op het gebied van internationalisering, waardoor het mogelijk is om documenten in elke taal te schrijven en deze eenvoudig over de hele wereld over te brengen.

    24 december 1999 – HTML 4.01

    In deze versie zijn objecten, vormen en afbeeldingen enigszins gecorrigeerd, bugs verholpen en, in het algemeen, meer stabiele versie, dat al meer dan 10 jaar door webontwikkelaars wordt gebruikt.

    WAT Werkgroep

    2004: Zwitserse programmeur Ian Hickson (destijds ontwikkelaar bij Opera) en verschillende vertegenwoordigers van bedrijven als Mozilla, Google en Apple opgericht werkgroep genaamd WHATWG ( Web Hypertekst Sollicitatie Technologie Werken Groep).

    De reden voor het creëren van een dergelijke gemeenschap was het feit dat het W3C destijds de interesse in HTML had verloren en XML begon te ontwikkelen, en op basis daarvan de uitbreidbare hypertext-opmaaktaal XHTML. We zullen niet in details treden, omdat... op op dit moment deze taal heeft zich niet meer ontwikkeld.

    Twee jaar lang werkten het W3C en de WHAT-werkgroep elk aan hun eigen project. Maar later werd duidelijk dat de WHAT-werkgroep enkele resultaten boekte, terwijl XHTML 2 nooit van de grond kwam.

    En in 2006 kondigde Tim Berners-Lee aan dat het W3C en WHATWG zouden samenwerken om HTML verder te ontwikkelen.

    28 oktober 2014 – HTML5
    • De nieuwe versie heeft de syntaxis strenger gemaakt in vergelijking met de vorige
    • Verbeterde ondersteuning voor multimediatechnologieën
    • Er verschenen 28 nieuwe structurele elementen, waardoor de code begrijpelijker werd
    • Er zijn nog enkele verouderde tags uitgesloten
    • Er is meer aandacht besteed aan ondersteunende scripts, zoals javascript

    Op dit moment gaat de HTML-ontwikkeling door...

    Het W3C heeft begin juni een werkende versie van versie 5.1 uitgebracht. Het consortium vraagt ​​iedereen om hun recensies en opmerkingen over deze versie te schrijven, omdat... HTML blijft, net als voorheen, een project waaraan veel zorgzame mensen die van punthaken houden, er tegelijkertijd aan werken.

    Misschien word jij binnenkort een van hen?

    En tot slot nog een momentje humor:

    Een optimist leert Engels, een pessimist leert Chinees en een realist leert HTML.

    Wees realistisch 😉