Tag: Aprende Internet

Como Utilizar Kompozer

En los anteriores blogs, hemos visto como construir tu propia página web utilizando HTML. Hoy vamos a ver como construir una página web con un constructor de páginas web (también llamados editores WYSIWYG) el cual nos ayudará a conseguir una página más detallada y sofisticada.

 

Hay constructores de web que puedes comprar como Microsoft Frontpage o Adobe Dreamweaver, ambos tienen versiones en Español. Sin embargo también hay editores gratis que te pueden servir igual de bien. En el blog de hoy vamos a ver como utilizar Kompozer. Vete a la página http://kompozer.softonic.com/descargar si tu sistema operativo es Windows, o a la página http://kompozer.uptodown.com/mac si usas Mac.

 

En ambos casos pincharás el boton Descargar.

 

Windows:


 

Mac:

Una vez que lo hayas descargado, verás el icono de Kompozer:


 

Haz doble clic y el programa se abrirá sin más.

 

Y esto es lo que veremos:


 

 

 

WYSIWYG es el nombre que se le da a este tipo de editor, y las siglas quieren decir: What You See Is What You Get, es decir, lo que ves es lo que hay. Con esto quieren decir que lo que veas en la página de arriba va a ser lo que se vea en el sitio web.

 

Si utilizamos el ejemplo de página web que construimos en el blog sobre html, se vería así:


 

 

Para ver el código fuente de la página, haz clic en el icono “Código fuente” , en la esquina izquierda inferior de la página.

 

 

Como puedes ver, esto es el código que escribimos utilizando html en el blog 19:


 

 

También puedes buscar un archivo dentro de tu ordenador, y abrirlo haciendo clic en el

icono donde pone Abrir:


 

 

Vamos a ver un par de cosas que podemos hacer utilizando kompozer.

 

Si quieres cambiar el color del texto, resalta el texto que quieres cambiar:


 

Haz clic en el recuadro de colores:


 

 

Escoge el color que prefieras y pincha Aceptar:


 

 

Y tu texto cambiará de color:


 

 

 

Para cambiar el tamaño del texto, tendrás que una vez más resaltar el texto que quieres cambiar.

El la casilla “Titulo1” podrás escoger el tamaño que te vaya mejor:


 

 

 

 

Para cambiar el tipo de letra, una vez más resalta el texto a cambiar y escoge tu preferida de la casilla “Anchura Variable”:


 

Si quieres incluir un enlace en tu página, escoge y resalta el texto donde quieras poner el enlace, por ejemplo:

 

ve a la casilla “Enlace”:

 

Introduce el enlace al que quieras mandar a tus clientes, y haz clic en Aceptar:

 

Para insertar una tabla, ve al icono “Tabla” en la parte superior de la página:


 

Donde podrás escoger el tamaño de tu tabla:

 

Y se verá así:

 

 

Si quieres borrar algo en tu página, haz clic en el icono “Deshacer”:


 

Y si cambias de parecer y quieres volver a ponerlo, haz clic en “Rehacer”:

 

 

Para incluir una imagen, resalta la imagen (ctrl+c), dentro de tu ordenador, que quieras incluir. La imagen puede provenir de tus archivos, de tu sitio web o del internet, siempre y cuando tengas permiso para utilizarla. Escoge en la página que estamos construyendo, donde quieres la imagen y pegala (ctrl+v).

 

Una vez que hayas terminado la página, la puedes publicar utilizando el icono “Publicar”:

 

 

Rellena toda la información y haz clic en Publicar:


 

Si este sistema te parece demasiado complicado, siempre puedes subir la página utilizando FileZilla, como vimos en el blog último.

 

Bueno y esto es todo por hoy! No tengas miedo, metete en Kompozer y empieza a diseñar tus páginas web, ya verás que simple te parece una vez que te hayas familiarizado con el programa.

 

Como subir archivos a tu sitio Web.

En las anteriores lecciones vimos como escoger, comprar y alojar un dominio. También estudiamos como hacer nuestra primera página web y echamos un largo vistazo a los elementos html más comunes. En la lección de hoy vamos a ver como hacer para que esa página web que construiste aparezca bajo tu dominio.

 

La forma más fácil de subir archivos (o páginas web) a tu servidor, para ser vistas en tu sitio web, es utilizando un cliente de Protocolo de Transferencia de Archivos (en inglés se conoce como FTP client). Hay multitud de FTPs que puedes utilizar. Hay FTP básicos que vienen incluidos en los sistemas operativos de los ordenadores, por ejemplo, en Windows, DOS, Linux, etc. Pero estos FTP integrados no son la mejor manera de transferir archivos. También existen otros FTP que te puedes bajar de la red, como por ejemplo, FileZilla, CuteFTP, WordWide FTP, SmartFTP, etc. Estos suelen ser más completos y más fáciles de usar. Y afortunadamente hay muchos buenos y gratis que te puedes bajar.

 

Yo, personalmente utilizo FileZilla, es gratis, te lo puedes bajar facilmente y funciona muy bien. Para bajartelo, busca Filezilla en google y verás varios sitios web donde te lo puedes descargar. Te llevarán a una página parecida a la de abajo, donde podrás pinchar en el enlace ‘Descargar’.

Filezilla

 

 

 

Sigue las instrucciones para instalar el programa, es muy sencillo. Una vez que te hayas instalado el programa, te aparecerá la siguiente ventana:

Filezilla

 

Vamos a verla más detalladamente:

 

En el recuadro rojo, a la izquierda, donde pone ‘Local site’ es un navegador donde sale la información de tu propio ordenador.

 

En el recuadro azul, a la derecha, donde pone ‘Remote site’, es donde va a salir los archivos de tu sitio web.

 

Para entrar en Filezilla, tienes que rellenar la información en las casillas que hemos resaltado con el recuadro verde, en la parte superior de la página. Normalmente, con casi todas las compañías de alojamiento, en la casilla que pone ‘Host’ vas a meter el nombre de tu sitio web: ejemplo.com.

 

En la casilla ‘Username’ vas a introducir el nombre de usuario que utilizas para tu cuenta en la compañía de alojamiento, y en la casilla ‘Password’, también pondrás la contraseña que utilizas para tu cuenta en la compañía de alojamiento. (Esto es el caso en las compañías de alojamiento que utilizan el sistema C-Panel, que vimos en el blog dedicado a como escoger tu compañía de alojamiento. Hostgator, la compañía que uso yo utiliza este sistema. Si quieres hacerte cliente de Hostgato, en la página de recursos de aprendeygana.org tengo un enlace donde encontrarás un cupón de descuento.)

 

Después de rellenar estas tres casillas, sólo hace falta hacer clic en ‘Quickconnect’, y en el lado derecho de la página verás los archivos de tu sitio web.

 

De los archivos que vas a ver, vas a escoger el archivo que se llama public_html ó a veces se llama www, en algunas compañías de alojamiento tendrás los dos, que apuntan básicamente al mismo sitio. En la foto los hemos resaltado con un recuadro rojo. Vas a hacer doble clic en public_html para abrirlo. Y verás los archivos de tu sitio web, como en la imagen de abajo. Como tu sitio web aún esta vacio, solamente verás un par de archivos.

 

¿Te acuerdas de la página web que hicimos en la lección 17? Pues ahora es cuando la vamos a necesitar pues vamos a subirla a tu sitio web utilizando FileZilla. Selecciona el archivo index.html y arrastralo al recuadro Filename, abajo derecha:

Si ahoras vas a tu sitio web, verás la página index.html en tu página de inicio.

Puedes utilizar FTP para subir toda clase de archivos, fotos, videos, etc. a tu sitio web, y ya ves lo simple que es.

 

Elementos de HTML, parte 3

Para poder escribir las diferentes lenguas del mundo en HTML, se han ideado una tabla de caracteres que se van a escribir utilizando un código especial para cada uno.
Por ejemplo, la ñ española se escribiría de la siguiente manera: ñ
España se escribiría: España

Otro ejemplo, para escribir una frase entre comillas, se utilizaría el siguiente código: "
“Htlm no es complicado”, se escribiría: "Html no es complicado"

Veamos una lista de esos códigos especiales de mayor utilización en Español.

Á : A mayúscula, acento agudo: Á
É: E mayúscula, acento agudo: É
Í: I mayúscula, acento agudo: Í
Ñ: Eñe mayúscula: Ñ
Ó: O mayúscula, acento agudo: Ó
Ú: U mayúscula, acento agudo: Ú
Ü: U U mayúscula, diéresis: Ü
á: a minúscula, acento agudo: á
é: e minúscula, acento agudo: é
í: i minúscula, acento agudo: í
ó: o minúscula, acento agudo: ó
ú: u minúscula, acento agudo: ú
ü: u minúscula, diéresis: ü

¿ : Abrir interrogación: ¿
?: Cerrar interrogación: ?
¡: Abrir exclamación: ¡
!: Cerrar exclamación: !
#: Signo de número: #
$: Dólar: $
%: Tanto por ciento: %
&: Ampersand: &
‘ : Apóstrofe: '
( : Cerrar paréntesis: (
) : Abrir paréntesis: )
* : Asterisco: *
+ : Signo más: +
, : Coma: ,
- : Guión: -
. : Punto : .
/ : Barra de división: /
0 – 9: Dígitos del al 0-9: 0 – 9
: : Dos puntos: :
; : Punto y coma: &#59;
< : Menor: &#60;     Igual= : &#61;    > : Mayor: &#62;
@ : Arroba: &#64;
A – Z: Letras A-Z: &#65; – &#90;
: Barra inversa: &#92;
_ : Subrayado: &#95;
a – z : Letras a-z: &#97; – &#122;
Espacio sin separación: &#160;
¢ : Centavo: &#162;
£ : Libra Esterlina: &#163;
¥ : Yen: &#165;
© : Copyright: &#169;
ª : Doña: &#170;
® : Registrado: &#174;
° : Más-menos: &#177;
² : Dos superíndice: &#178;
³ : Tres superíndice: &#179;
¹ : Uno superíndice: &#185;
¼ : Un cuarto: &#188;
½ : Un medio: &#189;
¾ : Tres cuartos: &#190;
⅛ : Un octavo: &#8539;
⅜ : Tres octavos:&#8540;
⅝ : Cinco octavos: &#8541;
⅞ : Siete octavos :&#8542;

Las Etiquetas de HTML más comunes, parte 2.

Bienvenidos de vuelta a nuestra pequeña lección sobre las etiquetas más comunes de HTML.

Estabamos describiendo las etiquetas que separan texto.

Otro separador de bloques de texto es <HR> , éste es un elemento vacío, por lo tanto no necesita </HR>. HR quiere decir Horizontal Rule, o linea horizontal. Y se ve de la siguiente manera:


A este elemento se le pueden añadir los parámetros de longitud (WIDTH) y anchura (SIZE).  Por ejemplo:

<HR WIDTH= 600 SIZE= 6>


También se pueden utilizar los parámetros ALIGN=CENTER (por defecto) o ALIGN=LEFT (se alinea a la izquierda) y ALIGN=RIGHT (se alinea a la derecha).
Si se quiere utilizar un recuadro para enmarcar texto, el elemento que hay que utilizar es:<FIELDSET></FIELDSET>

Dentro de <FIELDSET> se puede utilizar el elemento <LEGEND> .  Este elemento sirve para insertar un titulo en la linea superior del recuadro.
Y se escribe de la siguiente manera:

<FIELDSET>
<LEGEND> Aqui va el titulo que se quiera poner<LEGEND>
Aqui va el texto que se quiera poner dentro del recuadro
<FIEDSET>

 

Con la etiqueta <LEGEND> también se pueden utilizar los parámetros LEFT (por defecto), RIGHT y CENTER.

El siguiente elemento es el que nos deja hacer tablas: <TABLE></TABLE>

Dentro del elemento <TABLE> hay varios otros elementos:

Las tablas se pueden empezar con un titulo <CAPTION>
Las filas (row) se definen por: <TR></TR>
Las cabeceras (header) se definen por : <TH></TH>
Las celdas de datos (data) se definen por: <TD></TD>
El ancho de los bordes de la tabla se define por : <BORDER> (por defecto 0)
El número de píxels que separan las celdas, una de la otra se define por: <CELLSPACING> (por defecto es 2)
El número de píxels que separan el borde de la celda del contenido: <CELLPADDING> ( valor defecto es 1)
La alineación horizontal de los datos dentro de la celda, éstos pueden ser: LEFT (izquierda), RIGHT (derecha) o CENTER (centro): <ALIGN>
La alineación vertical de los datos, éstos pueden ser: TOP (arriba), BOTTOM (abajo) o MIDDLE (centro):                                                                                                            <V ALIGN>                                                                                                                                                                                                                                                                    <ROWSPAN> define la altura o anchura de una celda <TD> o cabecera <TH>, altura o anchura se miden por el número de filas.                                                                                                                                                                                                                                                                                 <COLSPAN> define la altura o anchura de  una celda <TD> o cabecera <TH>, en este cas la altura o anchura se miden por el número de columnas.

Un ejemplo de una tabla:

 

<TABLE BORDER>
<TR>
<TH>LINEA1</TH> <TH>LINEA2</TH> <TH>LINEA3</TH>
</TR>
<TR>
<TD>A</TD> <TD>B</TD> <TD>C</TD>
</TR>
<TR>
<TD>D</TD> <TD>E</TD> <TD>F</TD>
</TR>
</TABLE>

LINEA1 LINEA2 LINEA3
A B C
D E F

 

En el siguiente blog veremos las etiquetas que debemos utilizar para incluir acentos y otros elementos.

Las Etiquetas de HTML más comunes, parte 1.

Los documentos HTML se comprenden de dos partes, la Cabecera <HEAD> y el Cuerpo <BODY>

Elementos de la Cabecera del documento:

<HEAD></HEAD>

Esta es la primera etiqueta que se utilizará en un documento html. Entre <HEAD> y </HEAD> reside la información sobre el documento. Generalmente esta información no es visible cuando se navega por el documento.

<TITLE></TITLE>

Cada documento debe de tener un elemento <TITLE> que proporciona el título del documento que usualmente se verá en la parte superior de la ventana del buscador. Esto es lo que el navegador guarda en Bookmarks, lo que se ve cuando se imprime el documento, y también lo que el ordenador guarda en su caché (disco dentro del ordenador donde el navegador guarda las páginas visitadas) y mostrará cuando la página sea llamada de nuevo.

<META></META>

Esta etiqueta es para incluir información sobre el sitio web que no se verá en el sitio web. Por ejemplo:

<META NAME=”author” CONTENT=”Name”> indicaría el nombre del autor.

<META NAME=”keywords CONTENT=”keyword keyword keyword”> indicaría las palabras clave que queramos incluir para que los buscadores puedan identificar nuestro sitio más fácilmente.

<META NAME=”description” CONTENT=”This is a site”> esto indicaría un breve resumen de tu sitio que sería utilizada por los navegadores para contestar una búsqueda.

<META HTTP_EQUIV=”Refresh” CONTENT=”10”> esto indica al visualizador que vuelva a cargar la página activa a los 10 segundos.

También puedes impedir que la página sea guardada por el caché del ordenador:

<META HTTP_EQUIV=”Expires” CONTENT=”no-cache”>

O que la página sea eliminada nada más recibida:

<META HTTP_EQUIV=”Expires” CONTENT=”0”>

O que la página expire inmediatamente al entrar en el caché, esto se hace poniendo una fecha ya pasada:

<META HTTP_EQUIV=”Expires” CONTENT=”thur, 7 April 2011 17:55:43 GMT”>

Puedes poner todos elementos <META> que te interesen, pero sin repetirlos.

El segundo componente de un documento HTML es le cuerpo o <BODY>, y es donde va el contenido del documento:

<BODY>

Entre estas dos etiquetas va el texto del documento.

</BODY>

Dentro del elemento <BODY> podemos utilizar varios elementos diferentes para describir como el documento va a ser reproducido. Estos son los elementos bloque:

<H1> </H1> Tamaños de Titulares, estos son diferentes tamaños de letras y van de 1 (mayor) a 6 (menor), estos elementos no se pueden utilizar en el mismo párrafo, cada elemento H necesitará su propia linea.

Esto es H1

Esto es H2

Esto es H3

Esto es H4

Esto es H5
Esto es H6

 

Otra forma de cambiar los tamaños de las letras es utilizando el elemento <FONT></FONT>

Se pondrá el valor que se le quiera dar, del 1 al 7, el valor por defecto suele ser el 3. Se pueden utilizar diferentes atributos del elemento <FONT> en la misma linea, en el mismo párrafo. Se escribirá de la siguiente manera:

<FONT SIZE=1></FONT>

<FONT SIZE=2></FONT>, etc.

Si se quiere cambiar el valor por defecto (3) de todo el documento se puede utilizar el elemento <BASEFONT SIZE=valor>: en donde dice valor, se pondrá el número del tamaño requerido. Este valor se mantendrá hasta que aparezca otro elemento <BASEFONT SIZE=valor> con otro tamaño.

 

También se puede utilizar el elemento <FONT> para cambiar la tipografía o fuente de la letra, por ejemplo:

<FONT FACE=”arial”> texto </FONT>

<FONT FACE=”Applegothic”> texto </Font>

Se pueden utilizar los atributos de tamaño, de fuente y de color al mismo tiempo:

<FONT FACE=”Apple Chancery” SIZE= 7 COLOR=”red”> texto </Font>

 

Lista de colores:

<FONT COLOR=”red”></FONT> : rojo

<FONT COLOR=”blue”></FONT> : azul

<FONT COLOR=”navy”></FONT> : azul marino

<FONT COLOR=”green”></FONT> : verde

<FONT COLOR=”yellow”></FONT> : amarillo

<FONT COLOR=”lime”></FONT> : lima

<FONT COLOR=”magenta”></FONT> : rosa

<FONT COLOR=”purple”></FONT> : morado

<FONT COLOR=”cyan”></FONT> : azul turquesa claro

<FONT COLOR=”brown”></FONT> : marrón

<FONT COLOR=”black”></FONT> : negro

<FONT COLOR=”gray”></FONT> : gris

<FONT COLOR=”white”></FONT> : blanco

Hay muchos mas colores que se reconocen por un valor numérico y de letras individual para cada uno:

Tabla de colores html

 

Estos se escribirían de la siguiente manera:

<FONT COLOR=”660000”></FONT>

 

 

<P></P> Denota un párrafo. Se puede utilizar con los atributos:

<P ALIGN= left> Alineación izquierda

<P ALIGN= center> Alineación centro

<P ALIGN= right> Alineación derecha

 

<BR></BR> Se usa cuando se quiere dejar una línea vacía entre dos párrafos.

BR quiere decir Break en inglés, que significa romper o hacer una pausa.

Se utilizaría de la siguiente forma:

 

<P> texto a texto a texto a texto a texto a texto a texto a texto a texto a texto a texto a texto a texto a <BR>

texto b texto b texto b texto b texto b texto b texto b texto b texto b texto b texto b texto b texto b texto b </P.

 

<DIV></DIV> es parecido a <BR> pues se utiliza para demarcar divisiones en un documento. La diferencia es que <DIV> tiene los atributos: left/right/center, que dictaminan donde se va a poner el texto, y que el elemento <DIV> necesita ser cerrado </DIV>.

<DIV ALIGN=left></DIV> texto comienza a la izquierda

<DIV ALIGN=center></DIV> texto comienza centro

<DIV ALIGN=right></DIV> texto comienza a la derecha

 

Si vas a citar un párrafo extenso, deberías utilizar el elemento <BLOCKQUOTE></BLOCKQUOTE> esto sirve para presentar párrafos como si estuviesen tabulados.

En nuestro siguiente blog seguiremos explicando las etiquetas de html más comunes.

 

Cómo Construir Una Página Básica En HTML

¿Qué es HTML? Wikipedia lo describe como ‘Lenguaje de Marcado de Hipertexto’. Lo que nos interesa saber a nosotros es que HTML es el lenguaje de programación más utilizado y el más simple que hay.

HTML utiliza etiquetas de acción (también llamados elementos) para dar instrucciones. El símbolo ‘<’ denota el principio de la etiqueta de acción y el símbolo ‘>’ denota el final de la etiqueta de acción. Todo el código html va escrito dentro de estos símbolos. Éstas etiquetas de acción son lo que diferencian el código del texto en un documento html. Estas etiquetas pueden estar llenas o vacías. Las etiquetas llenas se hacen escribiendo la instrucción correspondiente seguida del texto al que se quiere aplicar la instrucción y se termina repitiendo la instrucción pero con una / antes de la misma. Por ejemplo si se empieza un documento con el elemento <html> para mostrar que va a ser un documento html, se pondría al final del documento </html> para mostrar que es el final del documento. Para los elementos vacíos, no es necesario poner la instrucción con la barra al final porque estos elementos no producen un efecto sobre el texto. Son elementos que normalmente se utilizan para separar bloques de texto.

Para escribir tu página en html, vete a Notepad en windows, un programa que viene instalado ya en los ordenadores, o si quieres un programa más completo, puedes bajarte Notepad++ gratis del internet haciendo una búsqueda en google de ‘Notepad++ descarga gratis’. Si tienes un ordenador apple, te puedes bajar ‘Textwrangler’.

Para abrir un documento en Windows, haz clic con el botón derecho del ratón, y escoge ‘Nuevo’ y del menú escoge ‘documento’. Verás un pequeño ícono en la pantalla, el siguiente paso es cambiarle la terminación al documento para que termine en html. Haz doble clic en el recuadro del nombre y cambialo de .txt a .html, por ejemplo: index.html. El ordenador te va a preguntar si estás seguro, haz clic en Si, y ya está, ya tienes tu primera página html.  (La vamos a llamar index por que asi se llaman las paginas de inicio de los sitios web.)

(Para llevar este paso a cabo es necesario que las extensiones o terminaciones de tus documentos sean visibles en tu ordenador. Para Windows XP tienes que ir a Herramientas (Tools) > Opciones de Carpeta (Folder Options) > Ver (View) y asegurarse que la opción de esconder extensiones no está marcada.)

Abre la página que acabamos de crear en Notepad haciendo clic con el botón derecho del ratón y escogiendo abrir con notepad.

Lo primero que hay que hacer es poner la etiqueta <HTML> para mostrar que es un documento html, y seguidamente cerrar la etiqueta escribiendo </HTML> para no olvidarnos más tarde. Las siguientes instrucciones las escribiremos entre estos dos elementos. Lo siguiente que vamos a escribir es <HEAD>, </HEAD> este elemento no es necesario, pero sirve para escribir información sobre tu página (como una descripción o palabras clave) para utilización de los buscadores y <TITLE>, </TITLE> para el titulo que será utilizado por los buscadores, seguido por <BODY>, </BODY> donde escribiremos el texto, después del elemento del texto podemos incluir otros elementos que describen como queremos que se vea el texto, por ejemplo, si ponemos la etiqueta <DIV ALIGN=CENTER> </DIV>, esto posicionaría el texto en el centro de la página. Para incluir una frase titula, utilizaríamos el elemento <H1>, </H1>. Para denotar un párrafo pondríamos <P>, esta etiqueta es vaciá, no hace falta cerrarla. En los elementos de párrafo, también puedes añadir descripciones como: <P ALIGN=CENTER> que centraría este párrafo. Otro elemento que vamos a añadir va a ser el elemento <B> </B> que pondría el texto en negrita, o <I></I> que lo pondría en cursiva.

<HTML>

<HEAD>

<TITLE> Nuestra Primera Página en HTML </TITLE>

</HEAD>

<BODY>

<DIV ALIGN=CENTER>

<H1>Aprende fácilmente a escribir utilizando html</H1>

<P>

Párrafo 1: Aquí escribirías tu texto. xxx xxxx xxxx xxxx xxx xxxxx xxxxx xxxxx xxxx xx xxxx xxxx xxx xxx xxx xxxxx xxxxx xxxx xxxxx xxxxxx xxxxx xxxxxx xxxx xxxxx xx xxxx x xxxxxxxxx xxxxxxx xxxxxxxx xxxxxxxxx x

<P>

Párrafo 2: Y más texto xxxxx xxxxxxxx xxxxxxx xxxxxxxx x xxxxxxxxxx xxxxxxx xxx x xxxxxxxx xxxxxxxxx xxxxxx xxxxxxxx xxxxxxxx xxxxxxxx xxxxxxxxx xxxxxx xxxx x xx xxxxxxx xxxxxxxxxx xxxxxxxxxxxxxxxxxxxxx xxxxxxxxxxxxxxxx

<P ALIGN=CENTER>

<B><I> Empieza ya a utilizar html.</B></I>

</DIV.>

</BODY>

</HTML>

Esta página se vería de la siguiente manera:


Aprende fácilmente a escribir utilizando html

Párrafo1: Aquí escribirías tu texto xxxx xxxx xxxx xxxx xxx xxxxx xxxxx xxxxx xxxx xx xxxx xxxx xxx xxx xxx xxxxx xxxxx xxxx xxxxx xxxxxx xxxxx xxxxxx xxxx xxxxx xx xxxx x xxxxxxxxx xxxxxxx xxxxxxxx xxxxxxxxx x

Párrafo2: Y más texto xxxxx xxxxxxxx xxxxxxx xxxxxxxx x xxxxxxxxxx xxxxxxx xxx x xxxxxxxx xxxxxxxxx xxxxxx xxxxxxxx xxxxxxxx xxxxxxxx xxxxxxxxx xxxxxx xxxx x xx xxxxxxx xxxxxxxxxx xxxxxxxxxxxxxxxxxxxxx xxxxxxxxxxxxxxxx

Empieza ya a utilizar html.


Guarda la pagina index.html en el escritorio de tu ordenador pues la vamos a utilizar para mostrar como subir archivos a tu sitio web en una proxima leccion.  En nuestro siguiente blog, os daré una lista más completa de las etiquetas o elementos html. Prueba a hacer tu primera página en html, verás que no es tan complicado y puede llegar a ser, incluso, divertido. Y sobretodo, no te olvides de cerrar los elementos, que es lo más importante.

Cómo Construir Tu Sitio Web.

¿Por qué necesitas construir tu propio sitio web?

Si quieres tener un negocio en internet, la herramienta más importante, aunque no indispensable, es tu sitio web. Esta será tu presencia en la web, desde donde podrás mostrar tus productos y venderlos al público. Ahora te preguntarás, ¿y por que construir nuestro sitio web ahora, antes aún de haber desarrollado nuestro primer producto?

La respuesta es sencilla: para poder empezar a hacer el marketing de nuestro sitio web. En las lecciones anteriores decidimos que producto nos gustaría vender y también escogimos el nombre de dominio de nuestro sitio web. Con esta información ya podemos desarrollar nuestro sitio web y empezar a darlo a conocer. ¡Lo más importante para tener éxito con un sitio web es lograr que éste atraiga tráfico y para atraer ese tráfico es indispensable hacer un buen marketing! Así que cuanto antes puedas empezar, mejor.

Así que veamos, ¿que es un sitio web? Es una colección de información virtual a la cual se accede a través del internet. Un sitio web puede estar compuesto de una, o varias páginas web. El trabajo de los navegadores en los ordenadores es el de traducir los sitios web para que podamos verlos en la pantalla. Los navegadores tienen que traducir porque los sitios webs están escritos en lenguajes de programación. Hay varios lenguajes de programación diferentes, pero el que nos interesa a nosotros, porque es el predominante para la elaboración de páginas web, es el llamado HTML (Lenguaje de Marcado de Hipertexto). No es necesario saber como programar para construir nuestro propio sitio web, aunque siempre viene bien saber lo básico de HTML.

Ahora veamos las diferentes maneras de construir tu sitio web:

1- Lo puedes construir desde cero, pero para ello vas a tener que saber como escribir en un lenguaje de programación, como HTML. Esta opción, aunque parece muy complicada, no lo es tanto. HTML no es tan difícil como aparenta, y aunque no es necesario aprender HTML, siempre viene bien saber lo básico. En la próxima lección veremos como construir una página básica en HTML.

2- Utilizando un editor de HTML. Este es un programa que permite escribir la página como si se estuviese utilizando un simple procesador de textos, mientras que va generando el código fuente en HTML. Es decir, estos editores de texto con formato permiten escribir una página web viendo directamente el resultado final, como saldría en el ordenador. Esta función del editor de HTML se llama WYSIWYG (What You See Is What You Get = Lo que ves es lo que obtienes).

Hay multitud de editores WYSISWYG en el mercado, como por ejemplo, Dreamweaver, Amaya, Fontpage, Microsoft Word. Si no quieres gastar dinero en comprar un editor, hay uno gratis muy conocido que lo puedes bajar desde la página www.NVU.com, o en español te puedes descargar WebFácil.

3- Utilizando una plantilla o un constructor de sitios web. Una plantilla es básicamente un atajo, se trata de una página web que ya ha sido diseñada, y lo único que tienes que hacer es rellenarla con tu información. La ventaja de utilizar una plantilla, es que tu página web parecerá profesional y te ahorrará mucho tiempo.

Un constructor de páginas web es un programa de software o una aplicación que te bajas del internet. Se parece a un editor de HTML pero más sencillo en su utilización pues se basa mayormente en apuntar y hacer clic. Los constructores de páginas web utilizan plantillas. Hay muchos constructores de sitios web en el internet, para encontrarlos, haz una búsqueda en google. Yo suelo utilizar el que ofrece, gratis, mi servicio de hosting.

4- Utilizando un script (archivo de órdenes) o CMS (sistema de gestión de contenidos). El script es un programa usualmente simple, a veces un script se especializa en un tipo de sitio web en particular. Por ejemplo Butterfly Marketing. Este es un script para vender productos digitales, que hace a los clientes miembros y afiliados al mismo tiempo. Hay muchos scripts diferentes que se especializan en usos diferentes.

El CMS, es un programa que te permite crear y administrar el contenido de tu página web. El que a mi más me gusta es WordPress. Si tu hosting utiliza el c-panel (herramienta de administración de fácil uso) para su panel de control, podrás bajarte WordPress en un par de clics. Si quieres un hosting que te ofrece un panel de control c-panel, visita Hostgator.

WordPress es la forma más fácil y sencilla de hacer un sitio web, ¡y además es gratis! Este blog esta construido con WordPress. Lo mejor de WordPress es que te estructura y organiza tu sitio web, tiene sinfinidad de diferentes plantillas (themes), y gran cantidad de plugins (aplicación o complemento que aporta una función nueva). WordPress es conocido en todo el mundo por su facilidad de uso, hasta para principiantes. ¡Y ahora WordPress se puede bajar en español! Este es el enlace: http://es.wordpress.org En una próxima lección nos meteremos más de lleno en como construir un sitio web utilizando WordPress.

5- Y si no quieres utilizar ninguno de los métodos aquí descritos, siempre puedes contratar los servicios de una compañía de diseño de sitios web profesional.

Así que no esperes más, ¡estudia estos diferentes métodos y escoje el que mejor te vaya para empezar a construir tu sitio web!

Servidor de Alojamiento Para tu Sitio Web

Aunque parezca mentira, el alojamiento que vayas a escoger para tu página web es de gran importancia.

¿Que es alojamiento web?

El servidor de alojamiento es la compañía que hará posible que tu página web sea vista en el Internet. El servidor tiene una conexión dedicada a la web mucho más potente y fiable que las que tenemos en las casas. La misión del servidor de alojamiento es asegurarse de que tu página web esté disponible para aquellos visitantes que la quieran ver.

Por lo tanto es importante escoger un servidor de alojamiento de calidad por varias razones.

La primera, y obvia, razón es que si escoges una compañía de alojamiento mala o poco fiable, tú sitio web ya va a empezar su vida en la red con una gran desventaja. Si el servidor es de mala calidad, eso te puede engendrar una multitud de problemas, ¡y eso es lo último que quieres en cuanto has terminado de construir tu sitio web!

Lo que yo busco en un servidor de alojamiento de calidad es lo siguiente:

1- Tiene que tener los recursos y herramientas que te ayudarán a triunfar. Esto incluye pero no se limita a:

  • El ancho de banda tiene que ser lo bastante amplio (esta es la cantidad de información o de datos que se pueden enviar a través de una conexión de red en un período dado).
  • El espacio o capacidad de almacenamiento tiene que ser adecuado.
  • El panel de control es importante. A mi me gusta el sistema cpanel porque está lleno de herramientas y es fácil de usar.
  • Incluye un constructor de páginas web.
  • Y hace copias de seguridad instantáneas.

2- Es muy importante que tu servidor tenga un sistema de servicio técnico. No te puedo enumerar las veces que yo he tenido que pedir ayuda al servicio técnico de mi servidor. Sobretodo para esas personas que son novatos en el mundo de los ordenadores, un buen servicio técnico puede ser la diferencia entre el éxito y el fracaso.

3- Tiene que ser fiable. ¡Tienes que tener la certeza que tu conexión se va a mantener día sí y día también!

4- Y tiene que tener un precio asequible. Hoy en día es posible conseguir un servidor que ofrezca todo lo que hemos enumerado, y más, por un precio barato.

Cuando vayas a escoger un servidor, hay otros factores que también hay que tomar en consideración. El alojamiento web puede jugar un papel importante en el posicionamiento web de nuestra página. Hemos de escoger nuestro servidor dependiendo del público al que queramos alcanzar. Si nuestro dominio termina en .es deberíamos escoger un servidor basado en España (con la ip española, la ip (internet protocol) es una dirección numérica que se le asigna los ordenadores que comparten una red) para influenciar positivamente el posicionamiento en la web.

Una última advertencia, cada servidor va a alojar un gran número de dominios bajo un mismo ip, así que es importante tener la seguridad de que el servidor que vayas a usar no permita páginas de reputación dudosa en su red.

Yo trabajo con y recomiendo Hostgator , es un servidor basado en los Estados Unidos, y por lo tanto, en inglés. Si te decides a utilizar Hostgator, he conseguido un cupón que te dará una rebaja de $9.94. Teniendo en cuenta que los precios en Hostgator empiezan por $3.96 al mes, te salen más de los dos primero meses gratis.

Si necesitas un servidor en Español te recomiendo 1&1.

Espero que con esta información te resulte más sencillo escoger el servidor que más te convenga.

¡Hasta la próxima lección!

LA IMPORTANCIA DEL DOMINIO

El dominio es la dirección de tu sitio web. Cada dominio ha de ser único en Internet. Cada dominio se compone de tres partes. En el caso de www.aprendeygana.org, éstas son: www – world wide web or la red, medio de comunicación de texto, etc.; aprendeygana – nombre de la organización; .org- el tipo de organización. Los tipos de organización más comunes son .com, .net, .mil, .org y esos que determinan el país de origen, .es es España. El dominio se distingue de la URL (Uniform Resource Locator) de la siguiente manera:

URL: http://www.aprendeygana.org/index.html

Nombre de dominio: www.aprendeygana.org

Es importante tener nuestro propio dominio porque para montar un negocio con éxito en el internet, es importante tener nuestro propio sitio web. No es esencial tener un sitio web para ganar dinero en el Internet, pero si queremos desarrollar un negocio serio, con buenas perspectivas, se aconseja el tener un sitio web. Esto se debe a un par de razones, la primera es que no quieres estar dependiendo de los sitios webs de otros, y la segunda, porque teniendo un sitio web puedes ir estableciendo el patrimonio de tu marca en la red.

Ahora veamos qué tipo de dominio nos iría mejor. La mejor terminación, la más reconocida y popular es .com, por lo que resulta más difícil encontrar nombres libres con esta terminación. Los siguientes más populares son .net, .org, .info, .biz, y esos correspondientes a cada país.

En el blog anterior vimos cómo escoger el nombre de nuestro negocio, para escoger el nombre de nuestro dominio habremos de seguir las mismas pautas. El nombre del negocio y del dominio pueden ser iguales, aunque no es necesario, pero suele ser mejor si el dominio representa lo que es el negocio.

Cuidado con usar superlativos como: óptimo, novísimo, celebérrimo, rarísimo, etc. Éstos suenan tan exagerados que abaratan de cierta forma el nombre. Pero sí que es una buena idea usar adjetivos con garra, como: asombroso, fabuloso, instantáneo, etc.

Cuidado también con:

a- usar guiones, los dominios con guiones son menos valiosos. Aunque puede que los guiones sean de utilidad con el SEO (el posicionamiento en buscadores), pero esto lo veremos más adelante.

b- cometer errores de ortografía a posta.

c- usar abreviaciones, también resulta en un dominio menos valioso.

d- usar números.

e- hacer el dominio demasiado largo. Se recomienda que los dominios sean de tres palabras, cuatro sería el tope.

Como mencioné anteriormente, lo ideal sería atar el dominio con el nombre del producto o negocio. Si el nombre del producto es demasiado largo, acórtalo para el dominio.

Ten en cuenta que se pueden registrar unas cuantas variaciones del dominio, aunque no hace falta registrar más de una si no se quiere. Pero a veces vale la pena registrar tu dominio con diferentes terminaciones: www.ejemplo.es, www.ejemplo.com, www.ejemplo.net, sobretodo si te quieres asegurar de que nadie te quite el nombre.

¿Así que dónde buscar y registrar los nombres?

Yo recomiendo 1&1 Instant Web Pro. Si haces clic en el enlace abajo, te llevará directamente al sitio web de 1&1.



Alojamiento web, Hosting, registro de dominios y Servidores dedicados 1&1

¡Buena suerte y a buscar tu dominio!

¡Escoger Un Buen Nombre Es Esencial!

¡Hola! ¡Y Bienvenidos de vuelta a nuestro blog!

Espero que todos hayáis tenido unas muy buenas fiestas navideñas y que volváis llenos de ilusión a continuar esta aventura por el Internet.

Nos habíamos quedado en la importancia de establecer tu marca, lo siguiente que tenemos que discutir es la importancia de escoger el nombre idóneo para tu producto y/o sitio web.

¡Escoger un buen nombre es esencial! El nombre en sí, puede ser el factor de mayor importancia a la hora de vender el producto.

Así que, ¿que pasos tomar para encontrar el nombre perfecto?

No hay una fórmula precisa que nos asegure el nombre ideal, pero sí os puedo dar una serie de pasos que pueden hacer la búsqueda, quizás, más llevadera.

1- Busca adjetivos que describan tu producto con la técnica ‘lluvia de ideas’, es decir escribe en un papel todos los adjetivos que se te ocurran que puedan describir tu producto. No te cortes, por muy raros que sean, escríbelos.

2- Busca sinónimos del nombre de tu producto. Un buen sitio en la red para buscar es:

www.wordreference.com/sinonimos/

3- Además de los adjetivos que describen las características obvias,también enfoca tu búsqueda en los beneficios de tu producto. Haz una lista de los beneficios que ofrece tu producto.

4- Lee y relee la lista, y verte descartando esos nombres que no sean fáciles de pronunciar y de recordar.

5- Vuelve a leer tu lista y ahora descarta esos nombres que no tengan gancho: es bueno que tengan un pequeño elemento provocador, ¡pero que no llegue a ser polémico!

6- También puedes ir a http://es.answers.yahoo.com/ y pedir que te ayude la gente a encontrar el nombre ideal.

7- Plantéate también la posibilidad de añadir a tu nombre una etiqueta: ‘cómo hacer..’, o ‘guía práctica..’, o como utilicé yo para éste blog, ‘aprende a..’.

8- Otro método es el de reducir: a) escribe una descripción detallada de tu producto

b) condénsala a una frase solamente

c) y ahora reduce la frase a 4 palabras (o menos, nunca más) que describan tu producto y que puedas utilizar como nombre de tu negocio o sitio web.

9- Una vez que tengas una pequeña lista de posibles nombres, buscalos en google, escribiendo cada nombre entre comillas (por ejemplo “aprende y gana”) para averiguar si ya hay alguien usando el nombre.

10- Pregunta a la gente de tu entorno lo que piensan de los nombres, ¡no lo hagas públicamente en un foro o chat, no vaya a ser que te roben las ideas! Nunca se sabe, mejor prevenir….

Espero que esto haya sido de ayuda.

Buena suerte con vuestra búsqueda del nombre perfecto, y ¡hasta la próxima vez, donde veremos cómo buscar y comprar el dominio para vuestro sitio web!

certificado por
GuiaBlog
peugeot
Internet blogs
Köpenhamn flyg
Publicidad por tu blog con Boosterblog

directorio y promoción de blogs<


Increase your website traffic with Attracta.com

Publicar anuncios en España