( 
)
Con la nueva subida de las tarifas de eBay hay que pensar en encontrar una manera de reducir el coste de publicación de los anuncios.
Una manera sencilla es utilizando el lenguaje HTML (HyperText Markup Language) y para la parte gráfica CSS (Cascading Style Sheets).
Suena complicado pero la verdad es que no lo es.
Yo lo he aprendido sin profesor.
Para empezar, crea un nuevo documento de texto (click derecho/Nuevo/Documento de texto).
Copia y pego el siguiente ejemplo en tu fichero.
<table style="width:100%; background-color:green; border-color:red; border-style:groove; border-width:5px; text-align:center; font-family:arial; font-size:22px; font-weight:bold; color:blue;">
<tr>
<td>
Ejemplo
</td>
</tr>
</table>
Observación: Todo lo que se encuentre entre comillas en style="" es CSS y se utiliza para dar el aspecto a la página, lo demás es HTML y se utiliza para la estructura de la página.
Ahora elige Archivo/Guardar como. Dale un nombre a tu archivo, por ejemplo anuncio.html. Es importante que lleve la extensión html.
Abre el archivo creado (si todo ha salido correctamente debería abrirse en tu navegador).
Podrás ver el texto Ejemplo en el centro (text-align:center) con letras de color azul (color:blue), tamaño 22 píxeles (font-size:22px), fuente Arial (font-family:arial) en un cuadro de color rojo (border-color:red), 5 píxeles de ancho (border-widht:5px) y estilo groove (border-style:groove) con el color de fondo verde (background-color:green).
Todos esos parametros se pueden cambiar a tu gusto:
text-align: center (centro), left (izquierda), right (derecha).
color, border-color, background-color: red (rojo), blue (azul), yellow (amarillo), green (verde), black (negro), white (blanco), gray (gris), etc. También puedes utilizar el formato hexadecimál para obtener un color más exacto: entre #000000 y #FFFFFF (ej: background-color:#06FA9B);
font-family: verdana, arial, helvetica, courier, sans-serif, etc.
border-style: groove, ridge, solid, dotted, dashed, double, inset, outset.
Prueba cambiarlos hasta que obtengas el rezultado que más te guste.
Para crear un anuncio bonito hace falta más que una linea.
Para pasar a la siguiente linea introducimos <br> como se puede ver en el siguiente ejemplo:
<table style="width:100%; background-color:green; border-color:red; border-style:groove; border-width:5px; text-align:center; font-family:arial; font-size:22px; font-weight:bold; color:blue;">
<tr>
<td>
Ejemplo
<br>
Una nueva linea.
</td>
</tr>
</table>
Para introducir una imagen debemos antes alojarla en un servidor gratuito (ej: imageshack.us).
El código que nos hace falta es <img src="http://direccion/nuestra_foto.jpg"> (ej: <img src="http://img75.imageshack.us/img75/6606/circuit9bkgbh7.jpg">).
Ya está. Tenemos un pequeño anuncio con 2 lineas de texto y una foto.
<table style="width:100%; background-color:green; border-color:red; border-style:groove; border-width:5px; text-align:center; font-family:arial; font-size:22px; font-weight:bold; color:blue;">
<tr>
<td>
Ejemplo
<br>
Una nueva linea.
<br>
<img src="http://img75.imageshack.us/img75/6606/circuit9bkgbh7.jpg">
</td>
</tr>
</table>
Para cambiar el estilo de una sola linea de texto tenemos que añadir el tag <span></span>. Esto cambiará el estilo de todo lo que se encuentre dentro de <span> y </span>.
<table style="width:100%; background-color:green; border-color:red; border-style:groove; border-width:5px; text-align:center; font-family:arial; font-size:22px; font-weight:bold; color:blue;">
<tr>
<td>
Ejemplo
<br>
<span style="font-family:comic-sans; font-size:18px; color:gray;">
Una nueva linea con su propio estilo.
</span>
<br>
<img src="http://img75.imageshack.us/img75/6606/circuit9bkgbh7.jpg">
</td>
</tr>
</table>
Mi ejemplo no rezulta ser tan bonito pero cambiando los colores verás que el rezultado es muy profesional y barato.
Puedes meter las fotos que tu quieras sin tener que pagar nada por ello.
No hace falta pagar por un diseño, tu puedes crear el tuyo.
Poquito a poco irás aprendiendo más HTML y CSS y verás lo facil que es crear anuncios profesionales.
Espero que te haya servido esta guía y que pronto puedas crear tu primer anuncio.
El lenguaje HTML con la ayuda de CSS puede servir también para crear páginas web, tiendas virtuales, etc.
Para cualquier duda ponte en contacto conmigo y te ayudaré con mucho gusto.
Un saludo, Luciano.
Una manera sencilla es utilizando el lenguaje HTML (HyperText Markup Language) y para la parte gráfica CSS (Cascading Style Sheets).
Suena complicado pero la verdad es que no lo es.
Yo lo he aprendido sin profesor.
Para empezar, crea un nuevo documento de texto (click derecho/Nuevo/Documento de texto).
Copia y pego el siguiente ejemplo en tu fichero.
<table style="width:100%; background-color:green; border-color:red; border-style:groove; border-width:5px; text-align:center; font-family:arial; font-size:22px; font-weight:bold; color:blue;">
<tr>
<td>
Ejemplo
</td>
</tr>
</table>
Observación: Todo lo que se encuentre entre comillas en style="" es CSS y se utiliza para dar el aspecto a la página, lo demás es HTML y se utiliza para la estructura de la página.
Ahora elige Archivo/Guardar como. Dale un nombre a tu archivo, por ejemplo anuncio.html. Es importante que lleve la extensión html.
Abre el archivo creado (si todo ha salido correctamente debería abrirse en tu navegador).
Podrás ver el texto Ejemplo en el centro (text-align:center) con letras de color azul (color:blue), tamaño 22 píxeles (font-size:22px), fuente Arial (font-family:arial) en un cuadro de color rojo (border-color:red), 5 píxeles de ancho (border-widht:5px) y estilo groove (border-style:groove) con el color de fondo verde (background-color:green).
Todos esos parametros se pueden cambiar a tu gusto:
text-align: center (centro), left (izquierda), right (derecha).
color, border-color, background-color: red (rojo), blue (azul), yellow (amarillo), green (verde), black (negro), white (blanco), gray (gris), etc. También puedes utilizar el formato hexadecimál para obtener un color más exacto: entre #000000 y #FFFFFF (ej: background-color:#06FA9B);
font-family: verdana, arial, helvetica, courier, sans-serif, etc.
border-style: groove, ridge, solid, dotted, dashed, double, inset, outset.
Prueba cambiarlos hasta que obtengas el rezultado que más te guste.
Para crear un anuncio bonito hace falta más que una linea.
Para pasar a la siguiente linea introducimos <br> como se puede ver en el siguiente ejemplo:
<table style="width:100%; background-color:green; border-color:red; border-style:groove; border-width:5px; text-align:center; font-family:arial; font-size:22px; font-weight:bold; color:blue;">
<tr>
<td>
Ejemplo
<br>
Una nueva linea.
</td>
</tr>
</table>
Para introducir una imagen debemos antes alojarla en un servidor gratuito (ej: imageshack.us).
El código que nos hace falta es <img src="http://direccion/nuestra_foto.jpg"> (ej: <img src="http://img75.imageshack.us/img75/6606/circuit9bkgbh7.jpg">).
Ya está. Tenemos un pequeño anuncio con 2 lineas de texto y una foto.
<table style="width:100%; background-color:green; border-color:red; border-style:groove; border-width:5px; text-align:center; font-family:arial; font-size:22px; font-weight:bold; color:blue;">
<tr>
<td>
Ejemplo
<br>
Una nueva linea.
<br>
<img src="http://img75.imageshack.us/img75/6606/circuit9bkgbh7.jpg">
</td>
</tr>
</table>
Para cambiar el estilo de una sola linea de texto tenemos que añadir el tag <span></span>. Esto cambiará el estilo de todo lo que se encuentre dentro de <span> y </span>.
<table style="width:100%; background-color:green; border-color:red; border-style:groove; border-width:5px; text-align:center; font-family:arial; font-size:22px; font-weight:bold; color:blue;">
<tr>
<td>
Ejemplo
<br>
<span style="font-family:comic-sans; font-size:18px; color:gray;">
Una nueva linea con su propio estilo.
</span>
<br>
<img src="http://img75.imageshack.us/img75/6606/circuit9bkgbh7.jpg">
</td>
</tr>
</table>
Mi ejemplo no rezulta ser tan bonito pero cambiando los colores verás que el rezultado es muy profesional y barato.
Puedes meter las fotos que tu quieras sin tener que pagar nada por ello.
No hace falta pagar por un diseño, tu puedes crear el tuyo.
Poquito a poco irás aprendiendo más HTML y CSS y verás lo facil que es crear anuncios profesionales.
Espero que te haya servido esta guía y que pronto puedas crear tu primer anuncio.
El lenguaje HTML con la ayuda de CSS puede servir también para crear páginas web, tiendas virtuales, etc.
Para cualquier duda ponte en contacto conmigo y te ayudaré con mucho gusto.
Un saludo, Luciano.
Guía creada el: 24/09/06 (actualizada el 20/01/12)
Gracias por votar. Si tu voto cumple nuestras 
