NVU 

 
ELEMENTOS BÁSICOS DUNHA PÁXINA WEB  
 
Independentemente do programa que se use para a creación de páxinas Web, estas 
poden conter os mesmos elementos, a saber:  
• Texto: estático ou en movemento.  
• Imaxes: fixas ou animadas.  
• Sons.  
• Secuencias de vídeo.  
 
TEXTO  
 
O texto, compoñente fundamental das páxinas Web, xerámolos tecleando (aínda 
que tamén se pode copiar desde calquera outro programa e pegalo).  
Hai unha serie de regras que debemos ter en conta con respecto ó texto:  
 
• O seu obxectivo é a lexibilidade (parece una obviedade, pero non é inusual 
encontrar páxinas en Internet que practicamente non se poden ler).  
 
Nas páxinas Web hai que reservar o subraiado exclusivamente para os enlaces. En 
xeral, a cursiva é o formato apropiado para titulares e funciona ben para enfatizar. Cando 
queiras destacar unha palabra, emprega negrita ou cursiva. o uso abusivo de demasiados 
estilos produce un efecto estrambótico. Reserva os tipos de negrita e letra grande para os 
titulares, os cales deben destacar sobre o resto da páxina.  
En resumen, podemos darlle ó texto distintas aparencias, pero debemos ter a 
precaución de utilizar tipos de letra que resulten claramente lexibles para que non resulte 
pesada a lectura das túas páxinas. Un aspecto a ter en conta é que o texto debe contrastar 
claramente co fondo que elixas para as túas páxinas e que os tipos de letra (fontes) que se 
utilicen garantan a lexibilidade do mesmo.  

  1
 NVU 
Por outra parte, se empregamos unha fonte que o navegante da nosa páxina non 
ten no seu equipo non a verá exactamente como a deseñamos. Cada carácter, en calquera 
fonte, consta dunha letra, un número ou un símbolo xunto cunha certa cantidade de 
espazo branco arredor. As fontes proporcionais e de ancho fixo defiren na cantidade de 
espazo que ocupa cada carácter.  
As proporcionais se denominan así porque cada carácter ten un ancho diferente 
(como acontece co texto deste escrito) e, polo tanto, emprega unha cantidade de espazo 
proporcional ó seu tamaño. A cantidade de espazo que unha palabra ocupa nunha liña 
depende de qué letras conten, non de cantas letras conten.  
 
Exemplo: Times New Roman é unha fonte proporcional, polo que a letra “i” ocupa 
menos espazo que a “w” : iiiiiiiiii wwwwwwwwww (non ocupan o mesmo espazo dez 
letras “i” que dez “w”). As fontes de ancho fixo empregan letras que ocupan unha 
cantidade igual de espazo. Por exemplo: Courier é unha fonte de ancho fixo, polo que dez 
“i” ocupan igual que dez “w” : iiiiiiiiii wwwwwwwwww. Esta fonte ten a aparencia 
do texto dunha máquina de escribir ou dun telegrama.  
 
Para organizar o texto en pantalla é preferible utilizar táboas e prescindir do uso de 
tabuladores e sangrías. Tampouco debe abusarse da utilización de viñetas. A forma de 
traballar con táboas e viñetas é moi similar que con calquera procesador de textos.  
 
 
 
 
 
 
 
 

  2
 NVU 
EXERCICIO: Abre a páxina index.htm se non a tes aberta (recordamos que se atopa 
na carpeta C:\Documents and Settings\Nombre_de_usuario\Mis Documentos\webtic). 
Ó igual que calquera programa, NVU memoriza as últimas páxinas abertas no Menú 
Arquivo, opción Páxinas recentes. 
 

 
 
Cando teñas a páxina aberta escribe:  
“Cómo inserir un texto” (como cabeceira)  
Tipo de letra: Helvetiva, Arial.  
Tamaño: 37 pto. Para isto, na barra de ferramentas utilizamos o botón de Aumenta 
o tamaño da letra.  
Negrita e cursiva.  
Xustificación: Centrada (isto se pode facer na barra de ferramentas).  
Pon como fondo de páxina calquera color que contraste co color de letra que 
seleccionas (por exemplo: amarelo claro).  
Despois escribe “Estou realizando un taller de NVU e isto é o primeiro que escribo. 
Resulta practicamente igual que facelo co procesador de textos. De feito, unha opción 
podería ser seleccionar este trozo de texto, copialo no portapapeis e pegalo en NVU”.  

  3
 NVU 
Posteriormente, copia ese trozo que escribiches e pégao un pouco máis abaixo. O 
segundo parágrafo o xustificamos (por defecto a aliñación dos parágrafos en NVU é á 
esquerda).  
Cando o teñamos feito, pincha na pestana Vista previa da parte inferior da ventá e 
comprobará a aliñación dos dous parágrafos (ver figura de abaixo). 
 

 
 
 
SANGRADO DE PARÁGRAFOS  
 
Para sangrar parágrafos podes utilizar a tecla Tab do teu teclado (ó igual que 
acontece co procesador de textos), ou el botón Sangrar texto da barra de ferramentas.  
Tamén podemos tabular “artificialmente” un parágrafo mediante espazos sen salto. 
É, como o seu nome indica, un espazo que non produce salto (é un tipo particular de 
espazo que está considerado un carácter en si mesmo en lugar de ser, simplemente, un 
espazo entre caracteres). Para ser más específico, los espazos simples que se obteñen ca 
barra espaciadora non son considerados esenciais pola maioría dos navegadores; se 
colocas un puñado de espazos en branco, un tras outro, para intentar dar formato a un 
texto, nalgúns navegadores só se mostrará un espazo. 
 
INSERTAR IMAXES  
 
Para inserir unha imaxe no documento seleccionar a opción de menú Inserir >> 
Imaxe, se mostrará a seguinte caixa de diálogo, con diversas solapas: 

  4
 NVU 
 
 
 
 
 
 
 
 
 
 
 
 
• Ubicación: indicase de onde tomar a imaxe, pulsando no botón Elixir 
arquivo. Tamén se indica o texto alternativo que se mostrará da imaxe e un 
texto de axuda cando se pase o rato por encima.  
• Dimensións: pódese cambiar o tamaño da imaxe.  
• Aparencia: establécense as distancias entre a imaxe e o texto, así como a 
aliñación do texto arredor da imaxe.  
• Enlace: pódese establecer un hipervínculo para a imaxe.  
• Botón Edición avanzada: para establecer opcións avanzadas como atributos 
HTML, eventos de JavaScript, estilos, etc.  
 
Unha vez inserida a imaxe, pódense establecer as súas propiedades facendo dobre 
pulsación sobre ela, seleccionando a opción de menú Formato >> Propiedades da imaxe 
ou a través do menú contextual.  
 
 
 

  5
 NVU 
EXERCICIO: vamos a aprender a inserir imaxes de varios tipos. Unha imaxe fixa, un 
gif animado e unha imaxe de fondo será a próxima proposta.  
 
As imaxes funcionan máis ou menos como nun procesador de textos. Nas páxinas 
Web soen utilizar os formatos seguintes:  
 
• GIF. Para debuxos e imaxes con poucos colores. Este formato nos permite elixir 
un color transparente e facer animacións.  
 
• JPEG ou PNG. Para fotos e imaxes que requiren máis calidade. Non obstante, 
non permite transparencias nin animacións.  
 
Antes de nada vamos a crear unha carpeta para incluír nela todas as imaxes da nosa 
Web na carpeta webtic, de xeito que a ruta quede da maneira seguinte C:\Documents 
and Settings\Nombre_de_usuario\Mis Documentos\webtic\imagenes, os arquivos de 
imaxes poderemos descargalos desde Internet ou ben copialos en dita carpeta desde a 
ubicación que teñan no noso ordenador.  
Unha vez feito isto, para inserir una imaxe nunha páxina, procederemos tal e como 
se comentara ó comezo deste apartado, mostrándose a continuación unha pantalla como 
a seguinte, tendo dúas opcións:  
A primeira será inserir unha imaxe desde a carpeta imaxes que comentamos 
previamente, para o que faremos clic en Elixir arquivo… 
 

  6
 NVU 

 
 
Nesta pantalla seleccionaremos a imaxe que queremos engadir na nosa Web.  

  7
 NVU 
A segunda será indicar unha dirección url onde se atope a imaxe a inserir. Por 
exemplo, buscamos unha imaxe da Catedral de Málaga no banco de imágenes del CNICE. 
 

 
Unha vez seleccionada a imaxe, facemos clic sobre ela co botón dereito do rato, 
despregándose o menú emerxente podemos observar a continuación e elixindo a opción 
Copiar a ruta da imaxe. 
 

  8
 NVU 

 
 
Una vez copiada la ruta da imaxe, volvemos á ventá do noso editor NVU e no 
apartado Ubicación da 
imaxe “pegamos” a 
ruta da imaxe que 
queremos inserir, tal e 
como observamos a 
continuación. 
 
 
 
 
 
 
 

  9
 NVU 
Completamos igualmente los campos Título emerxente (neste caso “Catedral de 
Málaga”) e Texto alternativo, quedando a imaxe inserida na páxina que estamos creando 
tal e como vemos a continuación. 
 

 
 
AVISO: Realizando a inserción de imaxes desta maneira, temos o risco de que cando 
a imaxe deixe de estar ubicada no servidor correspondente, non apareza na nosa Web 
pois a ruta da mesma cambiou. 
 
IMAXES COMO FONDO DE PÁXINA  
 
Agora colocaremos unha imaxe de fondo de 
páxina. Para elo pinchamos sobre a páxina en Formato 
>> Colores e fondo de páxina... 
 
Despois, no cadro de diálogo que se nos mostra 
pinchamos en Imaxe de Fondo; activamos a casilla 
Imaxe de fondo e pinchamos no botón Elixir arquivo.... 
 

  10
 NVU 

 
 
Como vimos antes, a primeira ventá que se nos abre é na que aparece a nosa Web 
(C:\Documents and Settings\Nombre_de_usuario\Mis Documentos\webtic\imagenes). 
Dentro da carpeta “imaxes” seleccionamos o arquivo que desexemos ter como fondo de 
páxina. 
Se a imaxe é máis pequena que a zona de visualización dunha páxina (como nesta 
imaxe elixida para o fondo), a repite en forma de mosaico ocupando toda a pantalla. Por 
iso as imaxes de fondo sempre hai que seleccionalas ben para que non dificulten a lectura 
do texto. 

  11
 NVU 

 
Isto mesmo que describimos para o fondo da páxina serve para o fondo dunha táboa 
que poñamos nela.  
 
VER O NOSO TRABALLO  
 
Unha vez que temos creada a nosa páxina, podemos visualizala desde o programa 
navegador. Para isto arrancamos o navegador por defecto que teñamos no noso 
ordenador desde NVU de varias formas:  
 
1. Seleccionando la opción Visualizar páxina no navegador desde o menú Arquivo.  
 
2. Pinchando o botón situado na Barra de ferramentas.  
 
Tamén se pode abrir desde o navegador seleccionando o arquivo da nosa páxina 
Web.  
Hai que ter en conta que cada vez que realices modificacións na túa páxina, 
poderanse ver reflectidos os cambios no programa navegador, polo que se gardará a 
páxina antes de vela.  

  12