Tot el que el visitant veu a les pàgines del lloc és visualitzat pel navegador segons les instruccions detallades que li envia el servidor. Aquestes instruccions s'anomenen el codi html de la pàgina i estan formades per "etiquetes" separades que descriuen el tipus, l'aspecte i la ubicació de cada element individualment. Per col·locar qualsevol element nou (per exemple, una imatge) en una pàgina, heu d'afegir una instrucció corresponent (una etiqueta) al seu codi font. Penseu en la manera més senzilla de fer-ho.
Instruccions
Pas 1
Si utilitzeu qualsevol tipus de sistema de gestió de contingut, és molt probable que inclogui un editor de pàgines. Primer, cal obrir la pàgina desitjada en aquest editor. Més opcions són possibles. En el millor dels casos, l'editor de pàgines tindrà un "mode visual", és a dir, "mode WYSIWYG" (el que veieu és el que obteniu - "el que veieu és el que obteniu"). En aquest mode, no haureu de tractar amb cap codi HTML original. La pàgina de l’editor tindrà el mateix aspecte que al lloc, n’hi haurà prou amb ficar el ratolí al lloc desitjat i prémer el botó “inserir imatge” al tauler de l’editor.
Pas 2
Com a resultat, s’obrirà un quadre de diàleg en què haureu de seleccionar la imatge desitjada. Si encara no l’heu carregat, també hi ha un botó per seleccionar una imatge a l’ordinador i penjar-la al servidor. A més, en aquest diàleg podeu establir el color i l’amplada del marc al voltant de la imatge, la distància i el color del farciment entre el marc i la imatge, el text de la descripció d’eines. No cal especificar les dimensions aquí, però per raons d’accelerar la càrrega de la pàgina i evitar la distorsió del disseny, encara és millor fer-ho. Quan s'omplin tots els camps obligatoris del diàleg, feu clic a "D'acord" i deseu la pàgina editada.
Pas 3
Atès que no hi ha un estàndard únic per als sistemes de control, el procediment per inserir una imatge en el mode visual del vostre sistema pot variar lleugerament, però el principi serà el mateix. Per la mateixa raó, és possible que el mode WYSIWYG no aparegui al sistema de gestió del vostre lloc. Tot seguit, heu d’editar el codi font de la pàgina en HTML (HyperText Markup Language - "llenguatge de marcatge d’hipertext"). Haureu d’inserir una etiqueta al lloc adequat al codi que indiqui al navegador que mostri la imatge aquí. En la seva forma més senzilla, hauria de ser així: Aquí teniu la "adreça relativa" de la imatge: en aquesta adreça, el navegador s'ha de posar en contacte amb el servidor per obtenir-ne el fitxer d'imatge. Si l'adreça és relativa, el navegador assumirà que el fitxer es troba a la mateixa carpeta de servidor que la pàgina (o en una subcarpeta). Però, per no equivocar-vos, és millor especificar l '"adreça absoluta": per exemple, així: Naturalment, perquè el servidor pugui trobar i enviar la imatge al navegador, s'ha de carregar a la pàgina especificada ubicació. La manera més senzilla de fer-ho és mitjançant el gestor de fitxers, que es troba en tots els sistemes de gestió de contingut, així com al tauler de control de la vostra empresa d’allotjament. També podeu fer-ho mitjançant el protocol FTP (File Transfer Protocol - "fitxer protocol de transferència"), mitjançant un programa especial - FTP-client. N’hi ha molts, tant de pagament com gratuïts, per exemple, Cute FTP, FlashFXP, WS FTP, etc. Però, per descomptat, la instal·lació, el domini i la configuració del programa trigaran temps, de manera que un gestor de fitxers per descarregar tot el que necessiteu un navegador és una opció més fàcil.
Pas 4
A més de l'adreça de l'etiqueta html de la imatge, podeu especificar informació addicional: "atributs" de l'etiqueta. Per exemple, l'atribut alt="Imatge" conté el text de la descripció emergent que apareix quan passeu el cursor del ratolí per sobre de la imatge: es pot substituir per l'atribut - title: - La mida del rectangle en què hauria de ser el navegador mostrar la imatge es defineix mitjançant els atributs d’amplada i alçada: - L’atribut de vora especifica l’amplada de la vora al voltant de la imatge (en píxels): si es fa un enllaç a la imatge, el navegador dibuixarà una vora blava al voltant. Per desfer-se’n, configureu el valor de la vora a zero: - Els altres dos atributs contenen informació sobre la quantitat de sagnat de la imatge dels elements adjacents (a partir de línies de text, altres imatges, etc.) - hspace estableix la mida de la sagnia horitzontal (esquerra i dreta), vspace - vertical (inferior i superior):
