Html lees de eerste stappen. Eerste stappen in coderen

HTML-zelfstudie voor dummies... Auteur - Natalia Allenova

Van de auteur:

"Ik heb deze gids geschreven met beginners in gedachten, en ik herinner me hoe ik zelf begon. Dit is geen droge samenvatting van alles op een rij, dit is een poging om aan associaties te werken, om alles makkelijker te onthouden te maken. Op sommige plaatsen heb ik vervelende momenten niet kunnen vermijden, maar ik heb geprobeerd en zal ernaar streven om alles wat geschreven is van tijd tot tijd aan te vullen en te corrigeren."

De makkelijkste.
4 - "Schilder het zelf. Verander de kleur van de tekst."
5 - "Hoe de achtergrondkleur van een pagina te veranderen. Een beetje over de ethiek van kleuren."
6 - "Alinea's en DIV's. Tekst leren uitlijnen".
7 - "Wat zijn kopteksten en hoe de grootte van letters in te stellen".
8 - "Cursief, vet, onderstreept en andere."
9 - "Standaardlettertypen. Hoe u uw eigen lettertype schrijft".
10 - "Wat is een pad? Afbeeldingen invoegen".
11 - "Wat kan er met de afbeelding worden gedaan. De afbeelding als achtergrond van het document, enz.".
12 - "Over de worstenliefhebber en de geforceerde onderbreking van de tekst die rond de afbeelding stroomt."
13 - "Link en hoe ermee om te gaan".
14 - "Link naar e-mail. Hint naar tekstlink".
15 - "Kan een foto een link zijn".
16 - "Waar te gaan, waarnaar te verwijzen. Nieuw venster bij het klikken op de link."
17 - "Kaarten. Hoe maak je een link onderdeel van een afbeelding".
18 - "Kaarten. Hoe maak je van een deel van een afbeelding een link 2".
19 - "Kaarten. Hoe maak je een deel van de afbeelding een link 3".
20 - "Bladwijzer. Hoe maak je een link in het document".

Tafels.
21 - "Leren tabellen maken".
22 - "Leren om tabellen te maken" vervolg.
23 - "Tabellen, verticale uitlijning (valign)".
24 - "Tabellen, cellen leren uitrekken (rijspan, colspan)".
24-2 - "Aanvullend hoofdstuk. Antwoorden op huiswerk".
25 - "Tabellen, wat is cellpacing en cellpadding. Wat te doen met ruimte".
26 - "Geneste tabellen en enkele nuances".
27 - "Over het raamwerk van tafels, en uiteindelijk mopperen over tafels".
28 - "Een eenvoudige site maken met tabellen".

Aanvullend.
29 - "Speciale tekens of hoofdpijn".
30 - "Over lijnen. Eenvoudig en handig".
31 - "Inspringingen (marges) van het document, bovenmarge, linkermarge, margebreedte, margehoogte verwijderen".
32 - "Over lijsten. Ongeordende lijsten".
33 - "Geordende lijsten. Opmerking: Wat is een specificatie en een consortium".
34 - "Specifieke tags, kruipende tekstregel".

Kaders.
35 - "Inleiding. Waarom zijn ze (frames) nodig."
36 - "Leren om frames te maken".
37 - "Leren frames maken" vervolg.
38 - "Leren om frames te maken" vervolg.
39 - "De schuifbalk verwijderen, de frames verwijderen, de breedte van de framemarges aanpassen".
40 - "Als je op de link klikt, opent het document in een ander frame, in het volledige venster."
41 - "Het laatste hoofdstuk over frames. Wat is een IFrame".

Gegroet, beste lezers! Vandaag zullen we het hebben over de "hypertext opmaaktaal". Waarom iedereen het zou moeten weten, en hoe je de eerste stappen in html zet. Als een ontwerper geen vreemde talen kent, is dat niet het ergste. Het ergste is wanneer hij niet eens basiskennis van html heeft. In dit geval loopt hij het risico voor altijd een 'buitenlander' in de webindustrie te blijven.

Taal is belangrijk

Ben je aan het praten? Stel je die van jou ook eens voor!

Hoe vaak ben je niet tegengekomen dat het ontwerp van de site tot in de kleinste details is uitgedacht, maar dat het resultaat uiteindelijk te wensen overlaat? Dit betekent dat jij en je browser verschillende talen spreken. Wanneer een ontwerper hiermee wordt geconfronteerd, begint hij duidelijk te beseffen: een site is geen set van mooie, matrijzen en afbeeldingen.

Een kwaliteitsbron is in de eerste plaats een competente code. En om het te begrijpen, moet je het bestuderen. Er zijn veel slimme tutorials om een ​​beginner te helpen html helemaal opnieuw te begrijpen.

We weten allemaal dat het in de praktijk meteen makkelijker is om iets nieuws te leren. Een gratis online cursus “ Basis HTML en CSS ". De bron helpt u de basisprincipes van lay-out, de wetten, kenmerken en eigenschappen van de code te begrijpen.

Je hoeft geen tonnen saaie literatuur voor programmeurs te lezen, of hoger onderwijs te gaan volgen in het veld. De interactiviteit van de cursus stelt je in staat om de vaardigheden onmiddellijk te consolideren, het behaalde resultaat te zien en de mentor zal helpen als er zich problemen voordoen.

Over problemen gesproken. Nieuwelingen hebben vaak codeerfouten. Het is belangrijk om te onthouden dat met alles rekening wordt gehouden: spaties, punten en komma's. Een extra bord of het ontbreken daarvan leidt tot onjuiste weergave van informatie. Je moet dit dus heel goed in de gaten houden.

Oefening is de sleutel

Het beste is dat je voor het maken van een website geen ingewikkelde nodig hebt. Je kunt gewoon langskomen. Open kladblok en schrijf erin:

Hallo Wereld!
Mijn naam is (naam), dit is mijn eerste pagina!

Sla vervolgens alles op als html-document, het is belangrijk dat de extensie html is. Hoe je dat doet? Klik in het document op "bestand" en vervolgens op "opslaan als", stel in het veld "bestandsnaam" in: index.html... Na al deze operaties blijft het om het meest interessante te doen! Klik met de rechtermuisknop op ons document en open het met elke browser.

Voila! Je hebt een pagina geschreven, en dit is nog maar het begin!

Zoals je kunt zien, is de code verantwoordelijk voor de inhoud van de pagina. Met andere woorden, voor. In de regel is één persoon verantwoordelijk voor het ontwerp van het hulpmiddel, terwijl een andere persoon verantwoordelijk is voor de lay-out. Maar de gulden middenweg is wanneer één persoon weet hoe hij een afbeelding moet zetten en tekenen.

Dit helpt misverstanden tussen twee mensen te voorkomen, om uiteindelijk het product te krijgen dat de ontwerper bedoeld heeft.

Hoe en waar studeren?

Voor velen is het aantal tags en alleen hun naam angstaanjagend. Alsof je in een land bent waar ze een onbekende taal spreken. Je kunt niet zonder een woordenboek, of liever, zonder een leerboek voor dummies. Cursussen zijn zeker goed, maar je kunt gewoon niet zonder een boek waarin alles staat beschreven en waar je op elk moment naar kunt kijken. De tutorial kan worden gedownload of online worden bestudeerd.

De praktijk leert dat de online versie een aantal voor- en nadelen heeft. Het nadeel is dat om toegang te krijgen tot het materiaal, je niet zonder internet kunt. Positief is dat online publicaties regelmatig worden bijgewerkt. Daarin vindt u alle relevante informatie tot nu toe.

Allenova Natalya Vyacheslavovna schreef een verstandig, gedetailleerd boek over html ( kijk maar). De structuur van de publicatie stelt u in staat om geleidelijk te bewegen en complexere algoritmen te beheersen op basis van eenvoudige elementen. Theorie en praktijk worden prettig gecombineerd en vullen elkaar aan.

Hier vindt u antwoorden op specifieke vragen: hoe te creëren? Hoe te bouwen? Hoe een afbeelding invoegen? Geen abstracte redenering over gaan waar ik niet weet waarheen. Veel studieboeken falen hierin, met hen ben je ofwel een theoreticus of een beoefenaar voor wie niets werkt. Mee eens, dit zijn niet de meest veelbelovende vooruitzichten.

Natuurlijk, om een ​​website te maken, moet je tags in meer detail bestuderen. Hiermee zouden er geen problemen moeten ontstaan, het world wide web biedt een enorm aantal bronnen van html-referentieboeken. De voordelen van dergelijke mappen zijn dat u een tag in de zoekbalk van de site kunt invoeren, de betekenis ervan kunt achterhalen, hoe en waar deze wordt toegepast. Met andere woorden, het is een soort interactief woordenboek.

Wie zelf een website wil maken, kan niet alleen met html-kennis. We zullen wel moeten, maar dat is een heel ander verhaal. Als je na het maken van de eerste pagina een volwaardige website wilt bouwen, dan raad ik je aan je te abonneren op mijn updates. Hier kunt u veel nuttige informatie vinden om u te helpen de webindustrie te begrijpen.

/ Html-tutorial. Stap 13.

Html-tutorial voor dummies. De makkelijkste.

De vermakelijke en leerzame les van de worstliefhebber is voorbij en we gaan door naar de volgende les waarin we het over links zullen hebben.

Onze pagina kan uit meerdere documenten bestaan. Een daarvan is de belangrijkste (index.html) - deze wordt als eerste geopend en moet op uw website op internet staan. U kunt de rest van de documenten een naam geven die u maar wilt (photos.html, about_me.html, my_pets.html, friends.html, gh516hgd.html). Ze kunnen allemaal in één map (map) staan, of ze kunnen in verschillende staan.

We koppelen deze documenten door middel van links. Dus vanaf de hoofdpagina kunnen we, door de links te volgen, naar de pagina met foto's gaan, vanaf deze pagina kunnen we teruggaan naar de hoofdpagina, of bijvoorbeeld naar de pagina met onze gedichten, enz.

Laten we eerst een nieuw document maken (in ons voorbeeld prf.html) in dezelfde map (map) waar ons hoofddocument index.html zich bevindt. Verzin zelf de inhoud van het document, hiervoor heb je al voldoende kennis.

Laat prf.html een document zijn met uw foto's. Dan kunnen we, zonder gewetenswroeging, van de zin "zie mijn foto's" een link naar prf.html maken:

zie mijn foto's

(1) - mijn foto's
(2) - mijn foto's
(3) - mijn foto's

In het geval (1) het document in dezelfde directory (map) staat als het document waarin we linken naar prf.html, in het geval (2) het document in de / photos subdirectory staat, in het geval (3) we linken naar de site http : //www.homepage.ru, waar het document staat dat we nodig hebben.

De eerste twee voorbeelden (1) en (2) worden relatieve paden genoemd. (3) - absoluut, d.w.z. volledig gespecificeerd, inclusief de naam van de site (in ons geval - http://www.homepage.ru/). We gebruiken het absolute pad wanneer we naar de pagina's van andere mensen linken, we gebruiken het relatieve pad wanneer we naar documenten op onze site linken.

Voor alle links in ons document kunnen we kleuren voorschrijven: link - de kleur van een eenvoudige link, alink - de kleur van de actieve link (ingedrukt), vlink - de kleur van de reeds bezochte link.

Net als de kleur voor alle tekst in het document, schrijven we de linkkleuren voor in ... In ons voorbeeld zijn de kleuren voor een eenvoudige link, actief en bezocht, hetzelfde, maar ze kunnen verschillen - de keuze is aan jou.

Zoals je kunt zien, niets ingewikkelds.

Zoals u zich herinnert, kunnen we verschillende kleuren instellen voor verschillende tekstblokken in ons document ( ). Voor tekstlinks kunnen we ook een andere kleur instellen - dit doe je met de tag en het kleurattribuut:

zie mijn foto's

Opmerking, - is in de tag geschreven, als u anders schrijft, kunt u uw link niet een andere kleur geven dan de kleur van andere links in het document.

Laten we nu verder gaan met de volgende stap en doorgaan met het verkennen van de links.

Tekst (veel spaties) tekst tekst (veel spaties) tekst tekst (veel spaties) tekst

Er is één opmerkelijk kenmerk: de tekst die erin is ingesloten, wordt met ruimteprecisie weergegeven, net zoals u deze in een notitieblok typt.  Deze tag kan voor jou bijvoorbeeld handig zijn bij het opmaken van gedichten.
Er kunnen meerdere tags tegelijk op één stuk tekst worden toegepast:

 tekst

In ons voorbeeld is de tekst monospaced, vet en cursief (zoals dat :).  Wees niet bang om verschillende combinaties van tags te gebruiken, experimenteer, maar wees slim :)
We hebben dus nog een paar tags die we op deze sport onder de knie moeten krijgen voordat we verder gaan.
Onderstreepte tekst wordt ingevoerd met de tag :

  Onderstreepte tekst  
Tags en de tekst weergeven in een doorgestreept lettertype, u kunt ze allemaal gebruiken, er is geen fundamenteel verschil tussen:

 Doorgestreept 

Doorgestreept 
Label verschijnt in grote letters en in kleine lettertjes ten opzichte van de hoofdtekst:

 Klein
Normale tekst 

Groot 
Sup- en Sub-tags - definieer superscripts en subscripts.  Boven - boven, onder - onder.  Waar kunnen ze van pas komen?  Nou, bijvoorbeeld bij het schrijven van een formule - H 2 O (alles wat we van school halen :).
Superscript sup
abonnement sub 

Van de auteur: alles begint ooit.  Dus je hebt eindelijk besloten om de wetenschap van het bouwen van sites onder de knie te krijgen.  U moet beginnen met de html-taal.  Het is erg belangrijk om met vertrouwen de eerste stappen daarin te zetten, anders kun je struikelen en de studie niet voortzetten.  Vandaag zal ik je vertellen hoe je de taal zo eenvoudig en effectief mogelijk kunt leren.
 
Iedereen heeft altijd iets voor de eerste keer.  Net zoals een klein kind op een dag zijn eerste stappen moet zetten, moet jij, iemand die heeft besloten om een ​​site te bouwen, voor het eerst in deze wereld duiken.  Om de onderdompeling zo aangenaam mogelijk te maken, raad ik aan om de meest eenvoudige en begrijpelijke weg te volgen.
 
Hoe ben ik begonnen en wat moet je hiervan begrijpen
 
Ik vind het erg handig en nodig om te vertellen hoe ik html heb geleerd.  Allereerst wil ik je meteen opvrolijken zodat je niet denkt dat html leren een space shuttle bouwen is.  Nee, alles is veel gemakkelijker.  Om deze taal onder de knie te krijgen, hoef je bovendien geen basiskennis te hebben.  Je kunt absoluut nul zijn in het onderwerp, zelfs de voor de hand liggende dingen niet begrijpen.
 
Dus de eerste stap om aan de slag te gaan, is begrijpen dat het eenvoudig is.  Html is inderdaad ongelooflijk eenvoudig.  In principe hoef je maar een paar dingen uit te zoeken:
 
Hoe verloopt het proces van het maken van een website in het algemeen en waarom is daar html nodig?
 
Wat is de structuur van het document, in welke delen het is verdeeld?
 
Wat tags en attributen zijn, wat ze zijn en hoe ze te gebruiken
 
Nou, al het andere is je kennis al aan het oppoetsen.  Dit is geen technologie waarbij je 14 dagen achter de computer moet zitten en theorie moet studeren, en dan gewoon iets begint te begrijpen en begint te oefenen.  De eerste oefening kan namelijk al in het eerste uur van de studie worden gestart.
 
Dus hoe heb ik deze taal geleerd?  Ik gebruikte de diensten van Yandex en Google, waar ik de relevante informatie invulde (zoiets als het bestuderen van html).  Ik zag meteen 1 site, waar 15 html-lessen waren in volgorde van complicatie.  Ik kocht, het betekent, een notitieboekje van 48 vellen, raapte mezelf bij elkaar en begon te studeren, bijna elke letter in een notitieboekje op te schrijven en de tags te gebruiken die ik zojuist 300 keer per dag leerde.
 
Deze zaak was ongelooflijk interessant.  Eigenlijk heeft deze manier van leren één probleem:
  
Toch ontbrak de training in videoformaat een beetje.  Het zou ideaal zijn als een levend persoon in de video nog eens zou uitleggen wat er in de tekst staat.
 
Dus in letterlijk 1 maand leerde ik de taal.  Niet helemaal natuurlijk.  Ik zal je zeggen dat je het niet van binnen en van buiten hoeft te bestuderen.  Vraag me nu bijvoorbeeld wat de dfn- of bdi-tag betekent?  Ik zal eens in het handboek kijken.  Maar dit weerhoudt me er niet van om gemakkelijk sites in html te maken, omdat 70-80% van de tags en attributen daarin uiterst zelden worden gebruikt en in standaardsituaties praktisch overbodig zijn.
 
De snelste manier om html op een hoog niveau te leren is een stappenplan
 
Eerlijk gezegd zie ik in mijn hoofd al een ideaal plan van hoe je de taal perfect kunt leren in slechts 1 maand, zelfs veel minder als je heel hard je best doet.  Op een gegeven moment bracht ik meer tijd door.
 
Het grote probleem van het studeren voor gratis informatie is dat vaak met zijn hulp niet alle relevante technieken en trucs worden onthuld.  Voeg dienovereenkomstig toe.  Informatie moet in andere bronnen worden gezocht.  Maar mensen zijn lui en vinden het vaak niet, waardoor hun kennis onvolledig blijft.
 
Gelukkig hoef je nergens meer naar te zoeken, ik kan je de snelste manier bieden om een ​​taal te leren, met gegarandeerd resultaat.  Alle lessen die je kunt volgen op onze website.
 
Nadat u de eerste stap hebt doorlopen, krijgt u een algemeen begrip van hoe de site is gemaakt.  Nadat u de volgende stap hebt doorlopen, zult u gemakkelijk de basistheorie van html kunnen begrijpen en zelfs eenvoudige webpagina's kunnen maken door er tabellen, afbeeldingen, formulieren, enz. op te plaatsen.
 
De volgende stap is volledige oefening.  U maakt namelijk een website.  Heel eenvoudig, want voor het eerst is dit precies wat je nodig hebt.  Het belangrijkste in deze fase is het leren toepassen van de opgedane kennis.  Zonder toepassing van kennis hebben ze inderdaad geen waarde.  Je wilt toch geen html leren om te pronken met je vrienden?  Hopelijk niet daarvoor.  Het doel is om te leren html als basistaal te gebruiken bij het maken van sites.
 
De volgende en laatste stap is het bestuderen van de meest relevante informatie over de nieuwe tags en functies die html5 heeft gebracht, en het verkennen van de nieuwe functies van css3.  Welnu, in de cursus zelf zul je eindelijk een krachtige doorbraak maken in het bouwen van sites: je verzint drie sites, elk ingewikkelder dan de vorige.  Oh ja, zelfs 4, want er zijn nog een paar lessen die je als bonus meekrijgt.
 
De laatste site die u ontwerpt, wordt een online winkel.  Voel je de kracht van zo'n training?  Nu ben je vol 0 (je weet misschien niet eens wat een tag is), en over 1 maand heb je een sjabloon voor een professionele online winkel.  Ik weet niet eens welk voorbeeld ik moet geven.  Het is alsof je op een vierwieler hebt gereden en daarna meteen op een BMW bent overgestapt.
 
Resultaat
 
Over het algemeen stelde ik de beste manier voor om een ​​taal te leren.  Het vraagt ​​natuurlijk wel een investering van je.  Zowel een investering van geld als een investering van tijd en moeite.  Maar dit is echt de kortste weg van beginner tot professional.
 
Misschien overdrijf ik, ik wil je niet bedriegen, want ze worden niet binnen een maand professionals, maar terwijl één persoon maanden en jaren over de sites dwaalt en gratis informatie verzamelt, kun je efficiënter handelen en het pad volgen van studie 15-20 keer productiever.