Hvad betyder html, og hvordan opretter man en html-fil? Html hvad det er og hvad det spises med.

Hej venner. Med denne artikel vil jeg starte en række lektioner og materialer dedikeret til programmeringssproget hypertekst markup sprog HTML.

Denne serie af artikler vil blive opdateret med 1 lektion hver uge. I dem vil jeg beskrive detaljeret specifikt tekniske punkter vedrørende selve sproget og dets samspil med andre teknologier pga i vores større og mere kraftfulde web eksisterer og arbejder alt sammen. Nå, lad os starte den første lektion, skal vi?
Så lad os starte som forventet med en definition for at afklare, hvad vi skal arbejde med, og hvad vi skal studere.

Hvad er HTML?

HTML(" HyperText Markup Language") - Det er et hypertekstopmærkningssprog. Okay, definitionen er cool, men hvilken slags opmærkning er dette, og hvilken slags hypertekst er det? Nå, lad os tage tingene i orden. Først og fremmest i I dette tilfælde Vi markerer teksten, som vi først udskriver derefter, uanset hvor, det vigtigste er, at vi har denne tekst på vores computer. Hvad betyder tekstmarkering? Nå, det er enkelt, dette er dens banale formatering, som for eksempel her:

Hmmm... hvorfor er jeg på kanten? Hvorfor satte de mig der, hva'?

Åh, jeg er så vigtig, bare lidt fed.

Ikke liv, men en sort streg

  1. Og så videre.

Dette er blot et eksempel på den samme markup, vi fandt ud af det. Hvad er så hypertekstuelt ved denne tekst og HTML? Nå, vi skal nok starte med selve sprogets historie:

Langt, langt væk i 1986...

Troede du, jeg ville fortælle dig alt dette? Heh... Jeg må hellere dele et link til materialet til sidst, så du, hvis du ønsker det, kan sætte dig mere ind i dets historie. Artiklen er ikke gummiagtig, men korthed er talentets søster... ja, ja.

Hvorfor kaldes det hypertekstsprog? Fordi det giver dig mulighed for at oprette forbindelse enkelt netværk mange dokumenter på internettet via hyperlinks. Jeg tror ikke, jeg vil forklare dig, hvad hyperlinks er, du gik på en eller anden måde til min blog ved at klikke på en lignende inskription.

Lad os fortsætte...

Hvad er tags i HTML

Tags er mærker i sidekoden, der bruges til at fortælle browseren, hvordan den skal vise din hjemmeside.

Alle tags har samme format: de begynder med "<» и заканчиваются знаком ">".

Som regel har alle tags 2 skriveformater - åbningsmærke: og lukning: . Forskellen er, at den afsluttende har en skråstreg "/".

Alt indhold placeret mellem åbnings- og afslutningstags er indholdet af tagget.

HTML har også tags, der både er åbnings- og lukketags. Disse tags indeholder ikke tekst, men er mærker, for eksempel ser et linjeskift således ud:
.

Så vi dækkede kort, hvad HTML er. Så hvordan kan du begynde at lære det? For at gøre dette skal du studere og skrive

HTML er tags, og intet andet end tags. Til lære HTML du skal studere forskellige tags og prøve at oprette websider ved hjælp af dem.

I fremtiden vil mine artikler om dette emne hjælpe dig med dette. Åh, jeg glemte næsten... her er den lovede historie.

hjemmeside Indholdsrettigheder forbeholdes.

Har du hørt om html? Eller måske har du hørt om html-sider på internettet? Faktisk er det enkelt. HTML er ganske enkelt et af programmeringssprogene og ikke det mest komplekse af dem.

HTML er en forkortelse for HyperText Markup Language, som oversættes som hypertext markup language.
Indhold:

HTML bruges til at få sider på internettet til at se ud præcis, som du kender dem:

  • smukt designede tekster,
  • med fed eller kursiv,
  • bare sort eller flerfarvet,
  • med aktive links til andre sider på webstedet eller bloggen,
  • med video, lyd og mange andre interessante funktioner.

Grundlæggende er html bagsiden af ​​siderne på mange websteder. Ofte er deres smukke design skabt ved hjælp af HTML markup-sproget. Ellers kaldes dette også at oprette sider ved hjælp af html-layout.

Hjemmesider kan også oprettes på andre programmeringssprog, for eksempel PHP.

Den britiske videnskabsmand Tim Berners Lee udviklede HTML-sproget i 1986-1991 i Schweiz. Grundlæggende giver html dig mulighed for at skabe enkle, men smukke dokumenter. Senere blev multimediefunktioner (video osv.) og understøttelse af arbejde med hypertekst (til oprettelse af hyperlinks) tilføjet til html.

Velkendte browserprogrammer blev skabt til at arbejde med HTML, såsom:

I starten var browserens hovedfunktion netop at fortolke HTML-kode og vise det visuelle resultat på brugerens skærm.

Hvad er en html-side?

Dokumenter, filer, sider oprettet i html-sproget har filtypenavnet .html eller .htm. For eksempel kan en html-side (eller html-fil eller html-dokument) have et navn som:

  • test.html,
  • html,
  • html eller
  • title.html.

Strengt taget er test.html filnavnet (eller sidenavnet), hvor

  • test er filnavnet, og
  • .html er en filtypenavn (eller sidenavnsudvidelse), der normalt blot kaldes "udvidelse".

I dag er ordet "format" blevet en mere almindelig mulighed i stedet for ordet "udvidelse". Derfor betyder udtrykket "html-format", at filen (eller siden) er skrevet i html-sproget, og navnet på en sådan fil er html-udvidelse. Midler,

filen med navnet test.html er i html-format.

Windows-operativsystemet skjuler filtypenavne (det vil sige filformater) som standard. Programmørerne gjorde dette "ikke af ond vilje", men for at beskytte brugeren mod tankeløst skiftende filtypenavne. Du kan gøre filtypenavne åbne som standard. I Windows 7 for at gøre dette:

  • klik på Start-knappen,
  • Åbn kontrolpanelet,
  • find mappeindstillinger,
  • Åbn fanen Vis, rul helt ned til bunden og
  • fjern markeringen i feltet ud for indstillingen "Skjul udvidelser for kendte filtyper",
  • Klik på "OK".
Ris. 1. Åbn alle filtypenavne

Hvis du nu slår op og ser på adresselinjen i din browser, vil du der se navnet på den side, du læser i øjeblikket, og i slutningen af ​​navnet er der .html. Dette er et eksempel på en html-blogside, der er lagt ud på internettet. Normalt har en blog (site) mange html-sider. For eksempel er hver artikel på denne blog en separat html-side.

Der er også en-sides sider på internettet, der kun består af en html-side. Det kunne for eksempel være

  • Internet visitkort af en person eller virksomhed, eller
  • en side, der sælger et produkt eller en tjeneste via internettet.

HTML-sproget udvikler sig konstant og i dag findes der flere versioner af det, startende fra HTML 2.0 den 22. september 1995 og slutter med den seneste version HTML sprog 5 af 28. oktober 2014. HTML 5.1 er planlagt til udgivelse i september 2016.

Hvad er HTML-tags?

HTML er et sprog til markering af dokumenter ved hjælp af tags. Tags er omgivet af trekantede parenteser "< >" Tags kan parres eller opløses.

  • For eksempel gør "b"-mærket omgivet af trekantede parenteser teksten fed

tekst med fed skrift

Resultatet vil se således ud: tekst med fed skrift

  • Og "i"-tagget gør teksten kursiv.

tekst i kursiv

Som et resultat får vi: tekst i kursiv

  • Der er også et mærke til at bryde strengen "br".
  • Ved at bruge "a href"-tagget fremhæves et hyperlink.
  • Tag for dokumenttitel – . Dette er den tag, der åbner dokumentet. Det er parret i den forstand, at det kræver et afsluttende tag med en skråstreg.
  • Efter titlen kommer hoveddelen, som er placeret mellem åbningsmærket og lukkemærke

    . Dette mærke er ligesom hovedmærket et par: du skal åbne det og huske at lukke det.

I parrede tags er et afsluttende tag med en skråstreg nødvendig, fordi det annullerer (mere præcist, korrekt fuldfører) handlingen af ​​det åbne tag.

Der er mange HTML-tags, og du kan nemt finde HTML-tutorials på internettet.

Sådan opretter du en html-fil

Det er meget nemt at oprette en html-side (eller html-fil) på din computer og køre din oprettelse i en browser.

1) Åbn Notesblok (en simpel teksteditor, der følger med Windows). Du kan finde det på din computer ved at indtaste forespørgslen: Notesblok i søgelinjen.

2) Kopier og indsæt følgende tekst i Notesblok:







Hej! Dette er min første HTML-side.

Anden linje, hurra!



3) Vigtigt punkt, uden hvilken html-filen ikke virker: i Notepad gemmer vi filen strengt(!) i html-format, som vist på skærmbilledet. For nemheds skyld kan du gemme filen på skrivebordet på din computer.


Ris. 2. Vær opmærksom på filtypen og gem filen i html-format

1 i fig. 2 - Klik på "Desktop" for at gemme html-filen der.
2 i fig. 3 - Åbn rullemenuen ud for "Filtype".
3 – Vælg "Alle filer" i denne menu.
4 – indtast et hvilket som helst navn (jeg har 001) og efter punktumet vær sikker(!) indtast html.
5 i fig. 2 – klik på "Gem".

4) På skrivebordet finder vi filen 001.html:

Ris. 3. HTML-fil på skrivebordet

Min standardbrowser er Google Chrome, så filikonet ligner ikonet for denne browser. Hvis der er en anden standardbrowser, vil 001.html-filen have et andet ikon.

Vi klikker på filen (fig. 3) 2 gange med musen og som et resultat ser vi vores første side i html i browseren:


Ris. 4. Tjek hvordan html-siden ser ud i browseren

Vi har således en lokal html-side i den forstand, at den kun er tilgængelig fra din, lokal computer. For at siden skal være tilgængelig for andre, skal den uploades til internettet. Mere præcist, placer den, som altid er tilgængelig: 24/7/365 (24 timer i døgnet, 7 dage om ugen, hele året rundt). Så vil enhver internetbruger kunne se sådan en side.

Så html er et ganske interessant sprog, og hvis du i fremtiden tænker på at oprette og vedligeholde din egen hjemmeside eller blog, så er det tilrådeligt at vide mindst minimum sæt tags brugt i html-sproget.

Rejser på tværs af vidderne Internettet, var du i stand til at bemærke, hvor forskellige design og muligheder for websider. Men ikke alle af jer ved, at al denne mangfoldighed er implementeret på grundlag af sprog HTML.

Alt, hvad du ser på siden - tekst, billeder, tabeller og andre elementer, der udgør det semantiske indhold på websiden, kaldet indhold, er oprettet ved hjælp af markup-sprog HTML. Klik Højreklik hold musen hen over en hvilken som helst webside, og vælg elementet i rullemenuen "se HTML-kode" eller « Kilde» – der kommer en teksteditor frem med symboler og ikoner, du ikke forstår – det er hvad det er HTML-side kode.

Ethvert WWW-dokument kan indeholde stiliseret og formateret tekst, grafik og hyperlinks til forskellige internetressourcer. For at realisere alle disse muligheder blev det udviklet særligt sprog beskrivelser af WWW-dokumenter kaldet HyperText Markup Language (HTML), det er, Hypertext Markup Language.

HTML-beskrivelsen af ​​en webside er et sæt instruktioner, der fortolkes af et browserprogram.

Et dokument skrevet i HTML er tekstfil, der indeholder den faktiske tekst, der fører information til læseren, og markup-tags. Tags er defineret af standarden HTML, sekvenser af tegn, der er instruktioner til browseren.

Ifølge disse instruktioner placerer programmet tekst på skærmen og inkluderer billeder, der er gemt separat grafiske filer, og danner hyperlinks med andre dokumenter eller internetressourcer. En HTML-fil får således kun udseendet af et webdokument, når den fortolkes af browseren.

Men i standard HTML er der en væsentlig ulempe. For eksempel, for at beskrive layoutet af afsnit i indhold og deres design, er det nødvendigt at beskrive disse egenskaber for hvert afsnit, selvom der er 10 eller 20 afsnit på én side. Og forestil dig, at webstedet kan have 100 sider. Som et resultat skal du indsætte det samme stykke HTML-kode på siden tyve eller to hundrede gange, hvilket øger filstørrelsen.

Hvilken hovedpine for programmører! For at gøre livet lettere for fattige webmastere blev de opfundet Cascading Style Sheets (CSS)- cascading style sheets.

CSS fungerer på en anden, mere bekvem og økonomisk måde. For at designe afsnit i webstedets indhold skrives en kode eller designstil én gang. Denne kode eller stilbeskrivelse er gemt i separat fil. Yderligere er det kun nødvendigt når HTML hjælp marker teksten i afsnit, og CSS sørger for deres design. Koden er reduceret tiere og hundredvis af gange.

Det er meget praktisk at placere beskrivelser af stilarter i en separat fil, især hvis webstedet har mere end én side. For eksempel at ændre indretning alle afsnit på webstedet, skal du blot ændre koden i typografiarket.

CSS sammen med HTML kan gøre underværker, alt sammen takket være arbejdsdelingen i at skabe websider. Sideelementer er markeret på HTML baseret, og det visuelle design af elementerne er givet ved hjælp af CSS-tabeller

Tabeller CSS stilarter - et forsøg på at adskille detaljerne i sidedesignet fra dets struktur og indhold.

Indtil videre er dette et kinesisk brev til dig. Men jeg vil ikke foregive at være en guru og skrive endnu en tutorial "Hvad er HTML og CSS". Du vil finde en hel masse lignende informationer på internettet, plus mange udgivne lærebøger. Hvis du vil gå dybere ind i emnet, er flaget i dine hænder. Vær ikke bange, HTML Og CSS er meget enkle, og enhver tekande kan mestre dem. Men der er ingen grund til at skynde sig ind i dette endnu.

Ved egen erfaring Jeg ved, at det er bedre ikke at overbelaste tekandens hjerne med unødvendig information, ellers er det, dvs. hjernen vil koge før tid. Tro ikke på de smarte fyre på forskellige websteder, der hævder, at oprettelse af et websted skal starte med at lære HTML og CSS. Jeg har gode nyheder til dig – du behøver ikke selv at skrive HTML-koden, pga kloge mennesker kom op med CMS .

Hvad er HTML, og hvad er det til? - 3,7 ud af 5 baseret på 3 stemmer

Inden jeg begynder at studere, foreslår jeg at overveje, hvad html er, og hvad det er beregnet til.

HTML står for Hyper Text Markup Language, som kan oversættes til hypertext markup language. Internetsider oprettes med dette sprog.

HTML er ikke et programmeringssprog. Den er beregnet til mærkning tekstdokumenter. Det vil sige, at vi i det store og hele bruger det til at formatere teksten.

Så hvordan kan vi redigere tekst ved hjælp af HTML? Faktum er, at HTML-sproget består af tags. Hvert tag bestemmer, hvordan teksten på din side vil se ud.

For at sige det på en anden måde, giver hvert tag en specifik kommando til din browser (det program, som du ser internetsider med), browseren forstår denne kommando og viser færdiglavet tekst formateret på en bestemt måde på din skærm.

Derfor kan du ikke se selve koden, browseren viser færdig formateret tekst og grafik på din skærm. Hvis du selv vil se html kode og tags, som den tekst, du læser, er formateret med, så gå gennem din Internet browser Explorer til menupunktet > Vis og fra rullelisten vælg punkt > Kilde. Se på billedet.

Som et resultat åbnes et vindue, der indeholder koden. Svarende til den du kan se på det andet billede. Du kan scrolle og se på denne kode, den består hovedsageligt af tags, som i de fleste tilfælde har tekst indeni. Uden at gå i detaljer kan vi således sige, at hvert tag bestemmer, hvor, hvordan, hvilken skrifttype, hvilken farve din tekst vil se ud.

Men faktisk kan HTML-tags mere end blot formatere tekst med dem kan du indsætte et billede på en side, oprette tabeller, oprette links og meget mere.

Hvert tag gør sin egen ting visse funktioner og for at lære at oprette websider, skal du vide, hvad dette eller hint tag er til. Jeg tror, ​​at nu forstår du lidt, hvad html er.

Lad os først se på, hvad et tag er. For at sige det meget enkelt, så består tags af alm engelske tegn eller ord, kun disse bogstaver og ord er designet på en bestemt måde.

Hvert mærke består af vinkelbeslag,< >hvori visse symboler er placeret. De fleste af dem består af åbning og lukning.

For eksempel tag - åbning, og- lukning. Som du kan se, adskiller de sig ved tilstedeværelsen af ​​en skråstreg / i det afsluttende symbol. Hvis du placerer et ord imellem dem, f.eks. Hej så vil det blive vist med fed skrift. Alt, hvad der er omgivet af vinkelparenteser i dette tilfælde, vises ikke på skærmen, men er en slags kommando til browseren om, at det ord, der er indesluttet mellem disse tags, skal vises med fed skrift.

Der er naturligvis mange tags, og hver af dem udfører sine egne specifikke funktioner. Alle andre tags og hele HTML-koden som helhed fungerer omtrent efter samme princip. Når du anmoder om et dokument fra internettet, downloader din browser html-koden, fortolker den korrekt og viser færdig formateret tekst, grafik, tabeller osv. på din skærm.

Formålet med denne lektion var at give dig en idé om, hvad HTML er; i de næste lektioner vil vi begynde at studere dette markup-sprog. For at gøre det nemmere for dig at lære materialet, anbefaler jeg, at du begynder at studere lektionerne med de enkleste, og gnidningsløst går videre til mere komplekse, for eksempel i følgende rækkefølge: i begyndelsen skal du studere, hvordan et dokument bruges til at indstille og producere, lære at sætte osv. til mere komplekst.

Til at skabe HTML-sider du kan bruge specielle programmer, såsom, eller du kan oprette sider ved hjælp af en simpel tekst editor, som er tilgængelig i enhver version af Windows.

Når du opretter en hjemmeside, er den første ting du skal forestille dig, hvordan websiden er dannet. Dette er en slags "fundament" i webstedsopbygning. Derfor, før du går dybere ind i at studere mere komplekse teknologier Når du opretter hjemmesider, anbefales det at have mindst grundlæggende kendskab til HTML. I denne lektion vi mødes HTML, lad os ordne det HTML dokument struktur og på praktiske eksempler Lad os konsolidere den erhvervede viden.

Hvad er HTML?

HTML står for HyperText Markup Language. Dette sprog er ansvarligt for præcis, hvordan hypertekst vil blive vist på webstedets sider. Lad os nu finde ud af, hvad hypertekst er? Det er ingen hemmelighed, at en enkelt webside kan indeholde mange forskellige typer information, det være sig tekst, nogle tabeller, grafer, videoer, lyd osv. Så al denne information kan kaldes i ét ord - hypertekst.

Bemærk, at HTML er et opmærkningssprog, ikke et programmeringssprog. I givet sprog Der er ingen logiske funktioner og det er umuligt at lave nogen matematiske beregninger på det. HTML-sider har en forlængelse .html eller .htm og behandlet af browsere - IE, Mozilla Firefox, Google Chrome, Yandex Chrome, Opera osv.

Lad os nu finde ud af, hvordan browseren forstår hvad og hvordan den vises på en webside? Det er meget enkelt. Hypertekstmarkeringssproget HTML har indbyggede kommandoer kaldet tags. Det er af dem, at browseren er orienteret.

HTML dokument struktur

Nogen HTML-dokument(webside) skal have en bestemt struktur. Dette vil undgå mulige problemer når du åbner sider i browsere. Lad os som et eksempel se på en side, der indeholder følgende HTML-kode:

HTML dokument struktur ...

Lad os se på, hvad der er inkluderet i denne struktur i rækkefølge:

1. Det første, der går i et HTML-dokument, er versionsindikationen (første linje). For korrekt drift skal denne linje angives, når websiden lægges ud.

3. Derefter kommer området for toppen af ​​siden (header). Taget bruges til dette . I overskriften angiver vi navnet på vores side ved at placere sidetitlen mellem tags Og. Dernæst er kodningen af ​​HTML-dokumentet angivet (femte linje). Dette gøres for at vise det kyrilliske alfabet korrekt. Lukning af sidehovedområdet med et tag.

4. Metatag "beskrivelse" - et resumé af siden, beregnet til søgemaskiner. Dette tag er vigtigt for søgemaskineoptimering og skal udfyldes.

5. Metatag "søgeord" - søgeord, der kan vises på siden. Dette tag er også beregnet til søgemaskiner. Dette tag bruges sjældent i dag.

6. Brødteksten på siden åbner med et tag og lukker derfor med mærket

. Brødteksten på en webside indeholder normalt hovedindholdet - tekst, video, lyd og anden information.

Vi har således besvaret spørgsmålet om, hvad HTML er, og studeret strukturen af ​​et HTML-dokument. Oplysningerne modtaget i denne lektion er grundlæggende begreber, du kan ikke undvære dem. Vi vil tale om mere komplekse ting i andre lektioner.