01 de 07
Col·loqueu els fitxers en una carpeta nova
El Bloc de notes de Windows és un programa bàsic de processament de textos que podeu utilitzar per escriure les vostres pàgines web. Les pàgines web són només text i podeu utilitzar qualsevol programa de processament de textos per escriure el vostre HTML. Aquest tutorial us guiarà pel procés.
El primer que cal fer en crear un nou lloc web al Bloc de notes és crear una carpeta independent per emmagatzemar-la. Normalment, emmagatzema les vostres pàgines web en una carpeta anomenada HTML a la carpeta "Els meus documents", però podeu emmagatzemar-los on vulgueu.
- Obriu la finestra Els meus documents
- Feu clic a Fitxer > Nou > Carpeta
- Assigneu un nom a la carpeta my_website
Nota important: designeu les carpetes i fitxers web que utilitzin totes les lletres en minúscules i sense espais ni signes de puntuació. Tot i que Windows us permet utilitzar espais, molts proveïdors d'allotjament web no ho fan, i us estalviaràs temps i problemes si el nom dels fitxers i carpetes és correcte des del principi.
02 de 07
Desa la pàgina com a HTML
El primer que heu de fer en escriure una pàgina web al Bloc de notes és desar la pàgina com a HTML. Això us estalvia temps i problemes més endavant.
Igual que amb el nom del directori, utilitzeu sempre totes les lletres minúscules i sense espais ni caràcters especials en el nom del fitxer.
- Al Bloc de notes, feu clic a Fitxer i, a continuació, Desa com.
- Aneu a la carpeta on s'estalvien els vostres fitxers del lloc web.
- Canvieu el menú desplegable Guardar com a Tipus a tots els fitxers (*. *).
- Assigneu un nom al fitxer. Aquest tutorial utilitza el nom pets.htm.
03 de 07
Comenceu a escriure la pàgina web
El primer que heu d'escriure al vostre document HTML del Bloc de notes és el DOCTYPE. Això indica als navegadors quin tipus d'HTML esperarà. Aquest tutorial utilitza HTML5.
La declaració doctype no és una etiqueta. Explica a l'ordinador que un document HTML5 està arribant. Va a la part superior de cada pàgina HTML5 i pren aquest formulari:
Una vegada que tingueu el DOCTYPE, podeu començar el vostre HTML. Escriu tant el principi
etiqueta i l'etiqueta final i deixeu espai per als vostres continguts del cos de la vostra pàgina web. El document del bloc de notes hauria de ser així:
04 de 07
Crea un cap per a la teva pàgina web
El cap d'un document HTML és on es guarda la informació bàsica sobre la vostra pàgina web, com ara el títol de la pàgina i, possiblement, les etiquetes meta per a l'optimització del motor de cerca. Per crear una secció de capçalera, afegiu-la
etiquetes en el document de text HTML del Bloc de notes entre les etiquetes.
ElIgual que amb el
etiquetes, deixeu espai entre ells perquè tingui espai per afegir la informació del cap.
05 de 07
Afegiu un títol de la pàgina a la secció principal
El títol de la vostra pàgina web és el text que es mostra a la finestra del navegador. També és el que s'escriu a les adreces d'interès i als preferits quan algú guarda el vostre lloc. Guardeu el text del títol entre el
tags usingtags. No apareixerà a la mateixa pàgina web, només a la part superior del navegador.
Aquesta pàgina d'exemple es titula "McKinley, Shasta i altres mascotes".
ElEl
McKinley, Shasta i altres mascotes
No importa quant de temps tingui el vostre títol o si abasti diverses línies al vostre codi HTML, però els títols més curts són més fàcils de llegir i alguns navegadors retallen els més llargs a la finestra del navegador.
06 de 07
L'entitat principal de la vostra pàgina web
El cos de la vostra pàgina web s'emmagatzema al fitxer
etiquetes Aquí és on es posa el text, titulars, subtítols, imatges i gràfics, enllaços i tot el contingut. Pot ser el temps que vulgueu.
Aquest mateix format es pot seguir per escriure la vostra pàgina web al Bloc de notes.
El capçal del títol es dirigeix aquí. Tot allò que hi ha a la pàgina web va aquí
07 de 07
Creació d'una carpeta d'imatges
Abans d'afegir contingut al cos del vostre document HTML, heu de configurar els vostres directoris per tenir una carpeta d'imatges.
- Obriu la finestra Els meus documents .
- Canvieu a la carpeta my_website .
- Feu clic a Fitxer > Nou > Carpeta.
- Indiqueu les imatges de la carpeta.
Emmagatzema totes les imatges del vostre lloc web a la carpeta d'imatges perquè pugui trobar-les més tard. Això facilita la càrrega quan calgui.