8) [Blogger] Configuración del Blog

Filed under: , , , by: NaNo

Diseñando Nuestra Página Principal:
La página principal de tu blog es un elemento muy importante. Es la página de bienvenida y debe ser creado para hacer que los visitantes se sientan cómodos, así como darles un acceso rápido y sencillo a las diversas partes del blog y las que usted desea asegurarse de que vean. Antes de publicar su primer post, es importante que vea el diseño del mismo para asegurarse que sus visitantes encuentren todo de una manera fácil.
Evite engordar su página de inicio con demasiada información y demasiados elementos. Asegúrese de que su diseño permita que sus lectores encuentren la información más valiosa y sus enlaces.
Siga estos pasos para seleccionar y elegir que elementos desea que se publiquen en su página principal del blog:

1) Desde el Escritorio de su cuenta en Blogger, acceder a "Diseño".

2) Si usted desea tener una nueva plantilla, pinche en "Seleccionar Plantilla Nueva".

Esta página abre otra en la que se encuentran los diseños básicos que ofrece Blogger.

3) Seleccione la opción "Elementos de la Página" para editar la página de inicio.
Después de haber elegido un tema (plantilla), usted podrá escoger que "gadget" se verá en su blog.
4) Pinche y despaze los elementos alrededor de la página.
Moviendo los elementos en la pantalla para llevarlas a nueva ubicación en la página de inicio.

5) Click en un elemento específico para editarlo independientemente de los demás.
Por ejemplo, usted puede clickear en "Perfil" para editarlo y personalizarlo. Además usted podrá crear otros elementos y añadir nuevos gadgets a la página de inicio.

6) Selecciona un Gadget de la lista y colócala en tu blog.
Una nueva ventana se abrirá y te mostrará todos los gadgets existentes en blogger. Mas adelante, hablaremos detalladamente de cada uno de ellos.

7) Click en el botón de "Vista Previa".
No se asuste en probar los gadgets, al hacer click en el botón de vista previa, usted verá una imagen preliminar de cómo se vería su blog con dicho gadget, si no le gusta el resultado pues simplemente escoge otro y no se verá por sus visitantes hasta que usted pinche en "Guardar".


Más Información...

7) [Blogger] Introducción al tablero Blogger

Filed under: , , , by: NaNo

Desde tu escritorio de Blogger, puede acceder a todos los controles de tu blog. Los principales elementos de este tablero se describen en la siguiente lista:
  • Gestionar Blogs: En esta sección se enumeran los blogs existentes con enlaces a cada uno, donde se puede escribir mensajes nuevos, cambiar la configuración del blog, revisar el diseño del blog, o incluso ver el blog online. Cada uno de estos opciones se analizará en detalle más adelante en los siguientes post. También puede hacer click en el vínculo Crear un blog para iniciar otro blog que se añade a la lista de Gestión de Blogs.

  • Lista de Lectura: Las últimas entradas de blogs que tú estás como seguidor (seleccione el botón Agregar para agregar los blogs que te gustan), el Blog de Blogger Buzz y también la lista de los blogs más importantes que pertenecen al equipo de Blogger.

  • Ver Perfil, Editar Perfil, Editar Foto: Estos links abren otra página en donde podrás editar las opciones de tu Perfil, las cuáles serán mostradas en la página principal de tu blog.

  • Mi Cuenta: Este link abre tu página de tu cuenta principal, donde podrás editar los datos del mismo como tu cuenta de email y tu password.

  • Dispositivos Móviles: Sigue este link para ver las opciones de postear con tu móvil, más adelante explicaremos esto más detenidamente.

  • Herramientas y Recursos: Puede acceder a AdSense de Google y Google Reader de las cuentas directamente desde el panel de Blogger.

  • Recursos de Ayuda: La función de Ayuda en línea para Blogger es bastante útil.
    Son Grupos de Google dedicados a prestar ayuda a los usuarios de Blogger que se puede acceder haciendo click en los enlaces en la sección de Recursos de ayuda en el tablero de Blogger. También puede acceder a la ayuda haciendo click en el vínculo de la sección Gestionar Blogs o el enlace en la esquina superior derecha de cualquier página de tu cuenta de Blogger.

Más Información...

6) [Blogger] Mis primeros pasos en Blogger

Filed under: , , , by: NaNo

Empezar un blog gratuito en Blogger es muy fácil. No hay necesidad de preocuparse por encontrar y pagar por alojamiento del sitio Web, descargar o cargar la plataforma o pagar para registrar un nombre de dominio. Blogger se encarga de todas los tareas administrativas por usted. Todo lo que tienes que hacer es visitar el sitio web de Blogger, crear una cuenta de Google, puedes elegir el nombre de un blog y una plantilla, y ya estás listo para iniciarte en la blogesfera.

Mis primeros pasos:

Creando una cuenta en Google:
Antes de empezar con un blog, es necesario crear una cuenta de Google para acceder a la plataforma de Blogger.
Para crear tu cuenta de Google (y el blog de Blogger), siga estos sencillos pasos:

1) Visita la página oficial de Blogger ( Blogger Home).
2) Hacer click en el botón: "Crear un Blog".
Este es el formulario para rellenar tus datos:
3) En la casilla de dirección de email, deberas tipearla 2 veces ya que la segunda es la confirmación.
La dirección de email no necesariamente debe ser una dirección de Gmail, puedes usar cualquier tipo de correo ya sea de Hotmail o de Yahoo para crearte una cuenta en blog.
La razón de esta solicitud es por si es que te olvidas después tus datos, ya que podrán enviártelos a tu email en caso de olvido.

4) Rellena la casilla de passwords, y vuelve a rellenar en la casilla de "volver a escribir contraseña".
Si lo deseas, podrás cambiar tu contraseña en el futuro si así lo deseas. Abajo aparece un campo que dice "Fortaleza de la contraseña", esto quiere decir de cuán segura es nuestra clave. Preferentemente debemos usar una letra capital (Mayúscula) y algunos números por razones de seguridad.

5) Tipea tu nombre para mostrar.
Este nombre es el que se muestra debajo de cada post, indicando el autor de dicho post.

6) Tipea las letras en la casilla de Verificación.
Este código de seguridad lo ha puesto Google para asegurarse que los que se inscriban a nuevos blogs sean seres humanos y no sistemas automatizados de spam.

7) Selecciona la casilla de "Acepto los Términos de Servicio".
Tu puedes hacer click en dicho link, para que puedas leer todo el documento completo de dichos términos.

8) Click en el botón continuar.
Después de hacer esto, aparecerá una nueva ventana en donde se te pedirá que le pongas un nombre a tu blog, así:

Escogiendo un nombre de dominio:
Como sabrás, el uso de Blogger es gratuito, y por lo tanto, el nombre de dominio que decidas ponerle a tu blog irá acompañado del sub-dominio : blogspot.com, es decir, si decides ponerle de nombre "carros", el nombre de tu blog será: carros.blogspot.com o también www.carros.blogspot.com

1) Tipea el nombre de tu Blog:
El nombre de tu blog aparecerá en la parte superior del mismo, y tus visitantes tendrán una idea de los temas que posteas. Cabe mencionar que este título lo podrás cambiar más adelante si así lo deseas.

2) Tipea el nombre de dominio y dale click en "Comprobar la disponibilidad":
Google tiene alrededor de 14 millones de blogs indexados en su base de datos, así que no necesariamente el nombre que quieres podrás ponértelo a tu blog. Deberás tratar de ingresar varios nombres (si es el caso) hasta que uno de ellos esté en la condición de "disponible". Es importante saber que no necesariamente el Título y el nombre de dominio deben coincidir, pueden ser diferentes.
Cabe mencionar que más adelante también podrás cambiar este nombre de dominio si así lo deseas, y por supuesto, deberá estar disponible, caso contrario no podrás usarlo.

3) Click en el botón continuar:
Una vez concluído este paso, se nos mostrará una ventana en donde nos pedirá que escojamos una determinada plantilla para ponerla a nuestro blog, así:

Seleccionando un plantilla Básica:
Blogger proporciona una variedad de plantillas libres para tu blog, no obstante, estas son muy simples y no tienen muchos acabados. Al comienzo, será suficiente escoger cualquiera ya que después la podremos cambiar por la que queramos.

1) Escoge una plantilla desplazando con la barra horizontal:
Tu puedes ver una previsualización de cada plantilla en una imagen pequeña.

2) Selecciona la casilla de selección:
Este paso le dice a Blogger que plantilla has escogido.

3) Click en el botón continuar:
Tu Blog fue creado!. Ya eres parte de la Blogesfera!. Más adelante veremos como postear y a familiarizarnos con las herramientas que nos ofrece Blogger para armas nuestros post.

Más Información...

5) [Blogger] Empezando un Blog

Filed under: , , , by: NaNo

En Noviembre del 2008, Technorati, el popular sitio de búsquedas de blogs, había indexado alrededor de 112.8 millones de blogs. Esta es una considerable cantidad de blogs, lo que quiere decir que existe muchos usuarios que tienen por hábito el blogeo.
La decisión de iniciar un blog es bastante fácil, pero es importante comprender que la decisión significa algo más que escribir algunos post que puedes recomendar a tus amigos en línea. Blogear puede tener efectos de gran alcance - algunas buenas y algunas malas.

Entendiendo porqué las personas Blogean:

  • Por diversión: Muchas personas escriben en su blog sólo por diversión. Ellos solamente desean expresar sus ideas y compartir opiniones con sus amigos o familiares en línea, conversar acerca de las personas de las que se han enamorado o simplemente tener el hábito de bloggear.

  • Para ayudar a las personas o marcar la diferencia: Muchos de los blogs son escritos con la intención de ayudar a las personas o cambiar la manera de pensar de ellos acerca de un tema. Si estos bloggers quisieran influir en las opiniones de los démas o compartir consejos sobre la crianza de los hijos, las posibilidades de este tipo de blogs son infinitas.

  • Para establecerte como una persona experta en un determinado campo: Muchas personas escriben en sus blogs para desarrollar una reputación en sus campos con alguien de parecida experiencia. Mediante el establecimiento de ti mismo como un experto o al menos como alguien que es brillante en un campo específico, puede abrirte las puertas para nuevas oportunidades de ascenso profesional y mucho más.

  • Para crear una Empresa: Con frecuencia las empresas inician blogs no sólo para construir ganancias, sino también satisfacer las necesidades de los clientes y aumentar la fidelidad de los clientes.
    El objetivo para los blogs de negocios es típicamente para proporcionar el contenido que hace que los clientes se sientan valorados, lo que debería traducirse en ventas.

  • Para generar ingresos: Muchas de las personas comienzan un blog para generar ingresos pasivo por la inserción de avisos publicitarios en sus blogs, como una monetización por sus esfuerzos.

Más Información...

4) [Blogger] Blogeando con Blogger

Filed under: , , , by: NaNo

Blogger ha estado por mucho más tiempo que cualquier otra plataforma de blogs.
Eso significa que las personas están familiarizados con él y se sienten cómodas con él. Blogger trabaja con cualquier navegador Web, está disponible en una multitud de idiomas y es libre de utilizar, las barreras que nos separan de él son inexistentes.

Los primeros pasos:
Cualquier persona puede iniciar un blog en Blogger y ser parte de la blogosfera en menos de cinco minutos. Es verdad. Para empezar a utilizar un blog de Blogger, sólo tienes que visitar la página principal de Blogger. A continuación, sigue estos tres pasos sencillos:

1) Crearse una Cuenta.
2) Ponerle nombre al Blog.

3) Escoger una plantilla (template).


Las Herramientas necesarias:
Para iniciar un blog en Blogger, sólo necesita una computadora y una conexión a Internet. Sin embargo, más que un blog, usted podría encontrar que desea experimentar con diferentes métodos y capacidades de los blogs. Por ejemplo, puede que quiera invertir en una cámara digital para que pueda tomar sus propias imágenes para cargar en tu blog. Alternativamente, es posible que desee comprar una cámara de vídeo digital e intentar su mano en los blogs de vídeo ya que los blogs también pueden servir como medios de comunicación.
Lo importante para recordar es que su blog crecerá con usted. Iniciar con lo básico. A medida que se sienten más cómodos con Blogger y con sus blogs, en general, no tenga miedo a probar las nuevas herramientas y otras cosas nuevas.
La creación de un podcast puede parecer imposible ahora, pero usted irá adquiriendo más experiencia a medida que empieze a bloggear.

Más Información...

3) [Blogger] Comparando Blogger con otras plataformas

Filed under: , , , by: NaNo

Blogger ha cambiado significativamente en los últimos años. Las nuevas funcionalidades se añaden continuamente para asegurarse de que Blogger se reserve su posición como líder del mercado.
Otros programas de software de blogs han ido y venido con diversas amenazas a Blogger, pero el equipo detrás de Blogger sigue mejorando el producto ofreciendo mejoras y nuevas tecnologías. La siguiente lista describe algunas plataformas de otros blogs:

Wordpress:
El mayor rival de Blogger es WordPress, que es conocida por su amplia variedad de plug-ins y add-ons, como formularios de contacto y sitemaps, que permiten a los usuarios a personalizar sus blogs que se adaptan a sus necesidades individuales. Blogger ofrece la personalización, pero WordPress gana la carrera en términos de dar a los usuarios más variedad de personalización. Los inconvenientes de Wordpress son dos:

1) La versión libre es muy limitada en comparación a la versión en que los usuarios tienen que pagar para tener su propio dominio y su propio servicio de hosting.
2) La versión libre no permite a los usuarios a que puedan generar ingresos con sus blogs.
TypePad:
TypePad aunque es fácil de usar, no es libre. Los usuarios pagan una tarifa mensual para usar TypePad. Ofrece un nivel de personalización, tales como las plantillas y el diseño (aunque inferior al que si tuvieras Wordpress en tu propio Hosting), pero su uso tiene un coste.
MovableType:
El mayor inconveniente del programa son la caras licencias que los usuarios tienen que pagar para utilizarlo. El proceso de instalación no es tan simple como en otras plataformas de blogs, y
sus características no son tan vastas. En la columna de a lado, es muy fácil añadir varios blogs en la misma cuenta con MovableType, lo que hizo popular el equipo de los blogs en el pasado (aunque Wordpress está ganando terreno en este mercado).
LiveJournal:
Los usuarios deben pagar una cuota mensual para utilizar LiveJournal, que proporciona un número limitado de características y opciones de personalización.
MySpace:
MySpace ofrece una opción de blogs, pero es muy diferente de Blogger y muchos de los otros programas de plataformas de blogs, ya que gran parte del éxito de un blog de MySpace viene de la audiencia de los miembros de MySpace que se convierten en sus "amigos". MySpace es más una red social con una plataforma de blogs en lugar de una exclusiva plataforma para bloggear, como Blogger.
Xanga:
Muy similar a MySpace, Xanga es un sitio de redes sociales con un opción integrada de blog en lugar de una exclusiva plataforma para bloggear, como lo es Blogger.

Más Información...

2) [Blogger] Descubriendo los beneficios de Blogger

Filed under: , , , by: NaNo

Son tantas las opciones que existen en la red acerca de blogs, entonces nos preguntamos, cuál es lo que diferencia a Blogger? :
Ciertamente, ya que Google compró Blogger, la facilidad de integración con otros Productos de Google y las mejoras que se añaden constantemente a Blogger la convierten en una opción viable para cualquier usuario de Blogger.
Talvés el mayor atractivo que posee Blogger es su extremada facilidad con la que se puede hacer muchas cosas tales como postear, insertar imágenes o videos, agregar una nueva plantilla, etc. y su precio inexistente para usarlo.
A continuación se enumera los principales aspectos de Blogger por los cuáles sobresale frente a los demás:

Es Gratuito:
Usted puede estar seguro de que un principiante o un blogger ocasional esté intrigado por la plataforma libre de Blogger. Gran parte de la popularidad de Blogger puede ser atribuido al viejo comentario: "¿Por qué pagar por algo cuando lo puede conseguir gratis?.
En otras palabras, ¿por qué invertir en otro programa de software de blogs cuando Blogger puede darme las mismas características, sin costo alguno?
Para muchos usuarios de Blogger, esta pregunta es fácil de responder, y Blogger es la opción obvia.

Es Fácil de Usar:
Cuando se trata de plataforma de blogs ¿cuál es mas fácil de usar que Blogger?.
Iniciar una cuenta de Blogger, la personalización de tu blog y publicación del contenido de tu blog son tareas sencillas, gracias a la base WYSIWYG (lo que ves es lo que obtienes) que no requiere ningún editor técnico o conocimientos para utilizar que usted está familiarizado con la funcionalidad del tratamiento de texto. Aunque el aprendizaje del uso de software de blogs podrían parece intimidante, Blogger le quita gran parte de las tareas difíciles, permitiéndole convertirse en un miembro de la Blogoesfera.

Posee un sinfín de Características:
Blogger viene repleta de características y ventajas para los usuarios. A diferencia de otros programas de plataformas de blogs que requieren un pago para que los usuarios posean características adicionales, Blogger tiene una riqueza de herramientas, como Google AdSense, los canales, encuestas, y pases de diapositivas.
Con el poder de Google atras de Blogger, nuevas actualizaciones han sido integradas dentro de la plataforma para hacerla más facil que nunca.
Tu puedes estar seguro de que Google no ha terminado todavía. Usted puede estar al tanto de las actualizaciones de Blogger en el blog de Blogger Buzz.
Blogger Buzz

Es Versátil:
Para los usuarios que desean una experiencia más personalizada para los lectores de su blog, Blogger ofrece versátiles opciones de dominio y hosting. Los usuarios pueden optar por utilizar
sus propios nombres de dominio para sus blogs (por ejemplo, MyBlog.com) y no los tradicionales de Blogspot (por ejemplo, MyBlog.blogspot.com ).
Esta opción es muy popular para los negocios y poder crear una experiencia de marca perfecta para sus lectores y clientes.

Es flexible:
Blogger ofrece opciones para todos los bloggers con experiencia y con diferentes niveles de objetivos. Si usted entiende de HTML o no, puede utilizar Blogger. Los usuarios también tienen una variedad de opciones que tienen a su disposición, tales como los podcasts de audio a través de blogs, los blogs móviles (moblogs), blogs de vídeo (vlogging), blog por correo electrónico,y mensajería de voz a través de sus blogs.
En resumen, Blogger hace casi imposible decir no al blog! .

Puede Ayudarte a conseguir Ingresos:
Muchos Bloggers están interesados en conseguir ingresos con su Blog. En otras palabras, quieren tener la posibilidad de ganar dinero (ya sea pasivo o activo) a través de sus blogs.
Algunas plataformas de blogs gratuitos, tales como WordPress no permiten que pongamos publicidad en los blogs. Blogger no sólo permite Monetización, sino que lo alienta a través de Google Adsense, que es uno de los más populares servicios de publicidad en línea.
Como Blogger y Google Adsense pertenecen a Google, no es de sorprenderse que Google Adsense esté integrado al programa de Blogger.
Con unos cuantos clicks, podemos insertar anuncios y obtener ingresos casi inmediatamente.

Está expuesto al Espíritu de la Comunidad
:
Los usuarios de Blogger constituyen una única comunidad en línea que comparte la pasión por
los blogs y su interés en aprender a usar todas las características y accesorios disponibles que puedan a través de Blogger. A medida que crezca tu blog, el trabajo en red con la comunidad Blogger puede ser un recurso muy valioso para usted.
Una búsqueda en Technorati (una popular herramienta de búsqueda de Blogs) devuelve numerosos blogs de Blogger.

Más Información...

1) [Blogger] Entendiendo la conexión con Google

Filed under: , , , by: NaNo

En el año 2003, Google nóto el crecimiento de Blogger y le hizo una oferta de compra a Pyra Labs de la plataforma de sus blogs . Google se había hecho conocido en el mundo en línea como el potente motor de búsqueda que fue ampliando su alcance a fin de incluir publicidad en línea y mucho más. De hecho, Blogger puede considerarse uno de los primeros en una cadena de adquisiciones realizadas por parte de Google para extender su marca y su fuerza en el mercado en línea.
Resulta que fue el momento perfecto para Google y Blogger por lo que de cientos de miles de usuarios rápidamente se convirtieron en millones de personas. Google se benefició de los accesos a millones de clientes y los usuarios de Blogger se beneficiaron de una serie de rediseños y actualizaciones de la plataforma que hizo más fácil su utilización y le añadió funcionalidad más que nunca.
Esas mejoras y rediseños permitirían a la nueva versión de Blogger mantener su posición como líder en un mercado que fue creciendo más y más y que fue más competitivo cada día. La plataforma de google fue considerada la "Herramienta para principiantes" y continuó atrayendo a más personas que la usaran.
Los usuarios de Blogger pueden ahora aprovechar la potencia de Google y sus numerosos productos. Teniendo en cuenta la disponibilidad de aplicaciones de Google, los usuarios de Blogger pueden incorporar publicidad fácilmente en sus blogs, publicar el contenido desde sus teléfonos móviles, subir o insertar videos y enviar sus RSS feeds a sus lectores.
Aquí les dejo varias aplicaciones de Google que tú puedes incorporar en tus blogs:

Google Docs: Con Google Docs, los usuarios pueden crear documentos, hojas de cálculo,y presentaciones. Google Docs ayuda particularmente cuando queramos publicar presentaciones en nuestro Blog.

Blogger Mobile: Si tu usas un dispositivo móvil en EEUU, tu puedes publicar contenido directamente desde tu móvil. En los post posteriores os enseñaré a publicar desde tu móvil.

Google Earth: Es una Herramienta perfecta para crear mapas para tu Blog.

Gmail: Es un excelente programa de correo libre que puede ser accesado desde cualquier computadora. Para los Blogs, encontramos la función "Mail-To-Blogger" que explicaremos más adelante.

Google Groups: Tu puedes unirte a Google Groups que te interesen con el fin de compartir información con personas con ideas afines. Asimismo, también puedes iniciar un grupo en Google Groups. Cabe mencionar que estas actividades traen tráfico a tu blog.

Picasa: Cuando tu "subes" imágenes a Blogger, ellas son almacenadas en tu cuenta de Picasa, que viene gratis con Blogger. Tu también puedes organizarlas y editar tus imágenes usando Picasa.

FeedBurner: Es el más popular de la web en gestión de contenido en línea. Usted puede compartir el feed de su blog para sus lectores usando Google Reader. Más adelante también le dedicaremos varios post al FeedBurner.

Google ToolBar: Usando la barra de Google ayuda a ahorrar tiempo, porque las tareas a realizar se hacen con un sólo click del ratón. Además, encontramos otra función como "Blog This", que es un método sencillo que permite crear una entrada en el blog sin tener que visitar la página blogger.com

Google Reader: Te permite suscribirte a los blogs y seguir sus feeds desde cualquier pc y ciertos dispositivos móviles.

Youtube: Tu puedes subir videos a Youtube e insertarlos en tu Blog, o también puedes usar Youtube para buscar videos de otros usuarios y compartirlos en tu Blog. Más adelante te mostraré como insertar los videos de Youtube en tu Blog.

Google Video: Es un motor de búsqueda de video, así como también un sitio donde podemos subir videos e incrustarlo en nuestro blog.

Google Adsense: Es un sistema de avisos que tu puedes usar para exponer ads(anuncios publicitarios) en tu blog para generar ingresos. En los post siguientes haré un completa guía para usar este fabuloso servicio.

Orkut: Tu puedes usar el sitio de redes sociales Orkut para promover tu blog.

Más Información...

0) [Blogger] Entendiendo a Blogger

Filed under: , , , by: NaNo

Veo que has tomado la decisión de iniciar un blog.
Blogger es una herramienta perfecta para ayudarte a publicar tus pensamientos, ideas y opiniones como parte de la creciente blogosfera. Blogger no sólo es fácil de usar, sino también tiene el poder de una de las marcas más fuertes del mundo detrás de ella: Google.
Iniciar un blog puede parecer intimidante al principio, pero los blogs son una de las formas más sencillas para obtener tus ideas.
Sí? Iniciar un blog para el negocio o sólo por diversión, Blogger ofrece las herramientas, las características y el apoyo que usted necesita para ser un buen blogger.
Para colmo, Blogger es completamente gratuito para su uso.
En los siguientes post, te mostraré lo que Blogger puede hacer por usted para ayudarle a sacar el máximo provecho a su blog.
Es posible que se sorprenda de lo mucho que esta libre plataforma de blogs tiene para ofrecer.

Más Información...

35) [KompoZer] Consejos Finales

Filed under: , , by: NaNo

Siguiendo las indicaciones del W3C (consorcio internacional que se ocupa de normalizar el uso del HTML) Doctype debe ser el primer elemento que abra un documento. Esto quiere decir que debería preceder a <HTML>.Se trata de una marca que no necesita cierre y cuya función es facilitar información al servidor Web que aloja la página.
La información facilita por DOCTYPE se refiere al tipo de documento visualizado además de ser necesaria para la comunicación entre navegador y servidor. DOCTYPE se debe escribir de forma estándar:

<!DOCTYPE HTML PUBLIC ="-//IETF//DTD HTML 4.0//EN">

Esta línea proporciona algunos datos sobre el documento:

HTML PUBLIC: El documento es público.

IETF: El tipo de HTML público está gestionado por la Internet Engineering Task Force.

DTD HTML 4.0: La versión de HTML soportada es la 4.0.

EN: El idioma del documento es el inglés.

El uso de DOCTYPE no es obligatorio y puede omitirse. Seguramente su uso ayuda al servidor web a interpretar correctamente el documento, pero su ausencia no condiciona la correcta visualización.

Más Información...

34) [KompoZer] Publicar Nuestra Web

Filed under: , , by: NaNo

Una vez configurado el sitio de publicación tal y como se describió en el apartado precedente, podremos publicar páginas en Internet y editar las ya publicadas. Para ello es recomendable que previamente se visualice la ventana del Administrador de sitios (Menú Ver – Mostrar/Ocultar – Administrador de sitios).
Publicar es similar a cuando guardamos las páginas en nuestro disco duro, con la diferencia que se guardaran en un servidor, el que configuramos en el administrador de sitios. Con el botón Publicar (o menú Archivo/Publicar ) colocaremos las pagina en Internet (si queremos también podemos guardarla en nuestro disco duro, como hemos hecho hasta ahora).

Como puedes comprobar, cuando pulsamos el icono aparece un panel en el que podemos especificar varios datos:

• Seleccionar el sitio de publicación si tenemos varios creados.
• Incluir el título de la página y el nombre con el que se publicará, aunque estos datos se extraerán de la propia página.

Desde el Administrador de sitios también podremos modificar las páginas ya publicadas en Internet, basta con seleccionar el archivo que queremos modificar y se bajara directamente de Internet a nuestro programa de edición, KompoZer.
Una vez modificada, volveremos a publicarla para que aparezca con los nuevos cambios realizados.

Más Información...

33) [KompoZer] Publicación de Páginas Web

Filed under: , , by: NaNo

KompoZer está pensado para trabajar directamente sobre el sitio web en Internet, aunque también puede trabajar con archivos en el sistema local.

Configuración de publicación

Para organizar todos los archivos, lo primero es crear un sitio web. Para ello, seleccionar la opción de menú Editar/Configuración de publicación, o bien, desde el panel izquierdo Administrador de sitios de KompoZer, seleccionar el botón Editar sitios, se mostrará una ventana para gestionar los sitios web:
En la zona izquierda se muestran los sitios definidos, y en la zona derecha, las propiedades del sitio seleccionado.
Para crear un nuevo sitio, seleccionar el botón Nuevo sitio, los campos de la derecha se pondrán en blanco para que sean rellenados:

Nombre del sitio: Nombre del sitio que se va a crear (Tutorial Kompozer). Es un texto que se va a mostrar en la lista de sitios y cuando haya que seleccionarlo.
Dirección HTTP de su página inicial: URL de la página de inicio del sitio web.
En caso de que se desee trabajar en el sistema local, la dirección será de tipo file:///home/usuario/sitioweb/index.html;
Nombre de usuario: Nombre del usuario. Esta información la suministra el servidor donde se aloja la página.
Contraseña: Contraseña del usuario. Esta información la suministra el servidor donde se aloja la página.

Para eliminar un sitio, selecciónelo de la lista y pulse el botón Eliminar sitio.
Para establecer un sitio predeterminado, selecciónelo de la lista y pulse el botón Seleccionar como valor predeterminado. El nombre del sitio se pondrá en negrita indicando que es el predeterminado.

Una vez definido el sitio web, en el panel de la izquierda se mostrarán todos los archivos y sub-carpetas existentes. Haciendo doble pulsación sobre un archivo, se abrirá en una solapa nueva de la zona de trabajo. Si se hace pulsación doble sobre una carpeta, se mostrará el contenido de la misma.

Más Información...

32) [KompoZer] Estilos en Capas

Filed under: , , by: NaNo

Como hemos dicho en el apartado anterior, vamos a aprender a aplicarle estilos a las capas.

Para personalizar una capa tendremos que crear un nuevo estilo, en mi caso, se llama #encabezado, y aplicarle todas las propiedades que queramos aplicarle a la capa:
Luego, solo tendremos que modificar mediante la vista del código fuente, el nombre de la capa.
Esto se consigue agregando dentro de la etiqueta div el comando id=”nombredelacapa”:

Ahora, observamos los resultados obtenidos en el modo vista preliminar:

Más Información...

31) [KompoZer] Referencia HTML de CSS

Filed under: , , by: NaNo

Introducción:

Las Hojas de estilo en cascada o estilos CSS (Cascade Style Sheet) permiten controlar el diseño y el aspecto de las páginas aumentando las posibilidades en cuanto a colores, tipos, tamaños y posicionamiento de cualquier tipo de objeto html, ya sea texto, imagen, tabla o campo de formulario (lo que sea que se pueda identificar con una etiqueta html).
Se puede definir una hoja de estilo como una colección de reglas que afectan a la apariencia de un documento o parte del mismo.

Las ventajas que presenta el uso de CSS son:

Control sobre el diseño de la página: Con los estilos CSS se separa el contenido de la página web, un documento .html, de todas las reglas referidas a su diseño y aspecto, que están separadas en un documento externo he independiente con extension .css.

Actualización automática del diseño: Empleando hojas de estilo se puede modificar la hoja de estilo individual y cambiar la apariencia de un sitio web completo.

Discreción: Los navegadores más antiguos no pueden entender las reglas de las hojas de estilo pero no dan errores, simplemente las ignoran. De este modo no se mostrarán los efectos de diseño asignados pero sí el texto básico de las páginas y la apariencia del HTML.

Terminología empleada en CSS

Para comprender el funcionamiento de las hojas de estilo en cascada es necesario conocer los términos empleados en las mismas:

Propiedad: Una propiedad es una característica de un elemento que puede verse modificada mediante una hoja de estilo. Por ejemplo color o text-transform. Estas propiedades son muy numerosas permitiendo cambiar muchas características que hasta ahora no era posible.

Valor: Valor es el dato que se asigna a una determinada propiedad. Por ejemplo #FFFFFF es un valor para el color y uppercase es un valor de la propiedad text-transform.

Declaración: Una declaración esta formada por una propiedad y su valor. La declaración comienza por el nombre de la propiedad seguido de dos puntos y a continuación del valor de la propiedad. En nuestro ejemplo color: #FFFFFF; y text-transform: uppercase; son dos declaraciones.

Selector: Un selector es una etiqueta estándar de HTML o un nuevo nombre escrito por nosotros al cual se le quiere asignar una declaración. Por ejemplo: p, H1, strong son selectores del HTML.

Regla de estilo: Una regla es un selector junto con la declaración, por ejemplo, H1{color:rojo}.
Al crear reglas es posible agrupar selectores y declaraciones. Un ejemplo de regla con dos declaraciones sería:
strong { color: #FFFFFF; text-transform: uppercase; }
Para separar las declaraciones se utiliza punto y coma.

También se pueden agrupar los selectores como en este ejemplo :
H1,H2{color:rojo;font-family:arial}
Tanto los h1 y h2 serán mostrados de color rojo y tipo de letra arial. En este caso se utiliza la coma para separar los selectores.

Hoja de estilo: Una hoja de estilo es un conjunto de reglas que definen completamente el aspecto de todos los elementos de la página.

Colocación de las reglas de estilo:

Las reglas de estilo pueden ir colocadas:

1) Dentro de una etiqueta individual:
<etiqueta STYLE="propiedad1:valor;...;propiedadN:valor"> ...texto... </etiqueta>
Estas reglas sólo afectan a una etiqueta particular. No se utilizan las llaves para escribir las declaraciones sino que se escriben entre comillas dentro del modificador STYLE. Este tipo de colocación es el que implementa KompoZer a las capas en cuanto a tamaño y demás cuando las modificamos mediante la interfaz gráfica.

2) Afectando a toda la página:
Van colocadas dentro del HEAD de la página, entre dos etiquetas <STYLE type="text/css"> ..reglas...</STYLE> y afectan a todas las etiquetas del mismo tipo que aparezcan a lo largo de la página.

3) En un archivo externo llamado hoja de estilos cuya extensión es .CSS
Lo más interesante es coger todos los estilos que vayamos a utilizar en un web y extraerlos a un archivo externo en donde almacenamos esas reglas de estilo. Esos archivos tienen extensión CSS.
Para vincular las páginas al formato definido en el archivo CSS hay que colocar en cada una de ellas una etiqueta como esta dentro del HEAD:

<LINK REL="stylesheet" TYPE="text/css" HREF="archivo.css">
Donde archivo.css contiene las reglas de estilo.

De esta forma conseguimos establecer el formato uniforme para todas las páginas y además cualquier cambio que hacemos en la hoja de estilos se ve reflejado de forma inmediata en todas las páginas que usen esta hoja de estilos. Es por eso que es la opción más utilizada.

Usar hojas de estilo en cascada

KompoZer dispone de un editor de hojas de estilo denominado CaScadeS (CSS,Cascade Style Sheets). CaScadeS puede ser utilizado para producir tanto hojas de estilo internas como externas. A diferencia de los estilos incrustados, las hojas de estilo internas o externas ayudan a mantener separadas la información del contenido de la del estilo.CaScadeS permite dos modos de edición de hojas de estilo:

a) Modo para principiantes: Este modo permite crear reglas asociadas a selectores de clase o selectores de tipo de elemento.

b) Modo avanzado: Este modo permite crear reglas sin restricciones.
Para proporcionar estilo al documento html que se edita, CaScadeS puede iniciarse haciendo clic en el menú Herramientas y seleccionando Editor CSS, apareciendo la siguiente ventana a continuación.
En KompoZer contamos con un botón específico para activar la Hoja de estilos CSS, se trata del icono CasCadeS:

Para crear una hoja de estilo interna :

1) Dejaremos por defecto la opción URL(ninguna, incrustado en el documento.
(Opcional) Rellenaremos la información sobre Lista de medios y Título de la hoja de estilo.

2) Haremos clic en Crear hoja de estilo.

Para crear una hoja de estilo externa :

1) Pulsamos el icono Exportar hoja de estilos y cambiar a la versión exportada:
2) Seleccionamos el fichero en cuestión, Si no existe ya, se creará un nuevo fichero en el sistema de archivos local. Es recomendable, al guardarlo, asignarle el nombre completo (nombre.css)
(Opcional) Rellenaremos la información sobre Lista de medios y Título de la hoja de estilo.

3) Activaremos comprobar al crear una hoja de estilo alternativa si ésta es una alternativa.

Consejo 1: Guardaremos siempre el documento html antes de agregar una hoja de estilo local. Guardaremos también el documento inmediatamente antes de cerrar el editor CSS.
Consejo 2: Utilizaremos el botón Recargar del panel de la izquierda si la hoja de estilo no se descarga inmediatamente.

Crear reglas de estilo

Después de crear una o más hojas de estilo para el documento html, se pueden crear reglas para cada hoja de estilo de forma individual. Para usar una hoja de estilos concreta al crear o modificar reglas, selecciónela en el panel de la izquierda haciendo clic sobre ella con el botón izquierdo del ratón. El panel de la derecha mostrará entonces los detalles de la hoja de estilo en la pestaña General. Para crear reglas nuevas:

1) Haremos clic en el botón Regla del panel de la izquierda.

2) El panel de la derecha mostrará opciones para especificar el tipo de regla a crear.

Elegiremos una entre las siguientes:
• Estilo con nombre (introduzca abajo el nombre de la clase)
• Estilo aplicado a todos los elementos del tipo (introduzca el tipo abajo)
• Estilo aplicado a todos los elementos coincidentes con este selector

3) Rellenaremos el nombre de la regla.

4) Haremos clic en Crear regla de estilo.
En la parte derecha de esta pantalla de Hoja de estilos CSS, aparerá el elemento creado con el proceso anteriormente descrito.
Las reglas pueden ser definidas usando las pestañas de estilo (Texto, Fondo, Bordes, Caja, Aural) del panel de la derecha. Para ver todas las definiciones de una regla de estilo, seleccionaremos en el panel de la izquierda y haremos clic en la pestaña General del panel de la derecha. La pestaña General mostrará todas las definiciones aplicadas a la regla.

Más Información...

30) [KompoZer] Hojas de Estilo (CSS)

Filed under: , , by: NaNo

HOJAS DE ESTILO:

Introducción:

Vamos a ver qué son las hojas de estilos y cómo usarlas para dotar a los documentos que creemos de una apariencia personalizada. Es importante que sepamos que para poder sacarles todo el partido posible a las hojas de estilos, tenemos que tener ciertos conocimientos del lenguaje HTML. Así que no está de más tener a mano un manual básico de HTML.

Una hoja de estilos o CSS ("Cascade Style Sheet"), es un conjunto de reglas y características que, aplicadas a una página web o a un conjunto de ellas, pueden modificar su apariencia. De esta forma, podemos separar en cierta forma el diseño de la página de su contenido.
Gracias a las hojas de estilos podemos de alguna manera homogeneizar y automatizar el trabajo que supone el diseño de una Web.
Podemos definir un estilo para los títulos y otro para el texto, de forma que no tengamos que modificar cada vez el texto y los títulos para que tengan la apariencia que queramos.

Una hoja de estilos puede estar contenida en la misma página donde se utiliza o puede estar definida en un archivo aparte. De la segunda forma, podemos definir estilos para todo el sitio web, mientras que de la primera tendremos que escribir el mismo código en cada página cada vez que lo necesitemos. Por eso la primera se utiliza cuando se quiere aplicar algún efecto en particular y la segunda cuando ese efecto es el mismo para todas las páginas.

Existe una tercera posibilidad, y es especificar el estilo en la propia etiqueta HTML dónde queramos usarlo, con lo que el efecto sólo se producirá en ese lugar. Esto implica conocer código HTML y las propiedades que queramos cambiar.
Esto tendríamos que repetirlo para cada elemento del texto cuyo estilo deseamos cambiar. Por ello, al ser poco eficiente, se usa la primera forma o la segunda, antes mencionadas. Estas formas también requieren conocer HTML.
Por ello KompoZer nos facilita el uso de estilos por medio de las plantillas, que nos permite usar hojas de estilo con pocos conocimientos de HTML.

Más Información...

29) [KompoZer] Referencia HTML de CAPAS

Filed under: , , by: NaNo

Etiquetas DIV y SPAN:

Las etiquetas HTML que permiten el uso de las capas son DIV y SPAN. Todas las etiquetas HTML comprendidas entre las correspondientes etiquetas de apertura y cierre configuran la capa.
La etiqueta DIV dispone del modificador id que permite dar un nombre a la capa. Dar un nombre a una capa es fundamental para que los programas Javascript puedan acceder a la misma.
Las características de la capa se establecen con un estilo (style) dentro de la etiqueta DIV de apertura.
El uso de la etiqueta DIV y SPAN es similar, la diferencia es que la etiqueta DIV genera un salto de línea anterior y posterior a su contenido, mientras que la etiqueta SPAN no. La etiqueta SPAN se utiliza para, por ejemplo, crear una capa que contenga algo y se alinee entre dos palabras de un párrafo.

Crear capas:

En KompoZer crearemos capas mediante el botón Capa, es recomendable seleccionar primero el bloque que queremos colocar dentro de la capa antes de pulsar dicho botón.
Junto a este botón aparecen dos que nos ayudaran a definir la profundidad de la capa, es decir, colocarla arriba o debajo de otra. Dentro de las capas podemos incluir otras capas, imágenes, texto formateado, tablas…etc e incluso definirlas con un color de fondo o imagen de fondo.
Desde el menú Formato podemos activar la Rejilla de posicionamiento que nos ayudara a mover las capas y colocarlas más precisamente donde deseemos.
En este apartado, KompoZer puede resultarnos bastante incompleto frente a las demás alternativas, pero aún así, veamos como crear y modificar una capa:

1) Creamos algún contenido para no crear una capa vacía:

2) Seleccionamos el mismo, y pulsamos sobre el botón “Capa”:
3) Ahora, podremos modificar el tamaño de la misma, así como el contenido, mediante la interfaz gráfica:
Como podemos ver, al arrastrarla, nos ofrece información acerca del tamaño de la misma, esto nos permitirá ajustar el tamaño de la misma.

4) Ahora, dentro de la misma, podremos insertar todo el contenido que deseemos, tal y como hemos aprendido a lo largo de este tutorial:
Yo, por ejemplo, he insertado una imagen.
Hasta Aquí, hemos aprendido a crear la capa, y a introducir el contenido deseado dentro.
Mi recomendación es continuar leyendo este tutorial, ya que para aplicarle propiedades a los distintos elementos de las mismas, es necesario crear estilos CSS, los cuales estudiaremos en los siguientes post, ya que no existe, de momento, ningún menú que nos permita definir las características de las capas ni de sus elementos de forma directa.

Más Información...

28) [KompoZer] CAPAS

Filed under: , , by: NaNo

Introducción:

Una capa es un contenedor que tiene la peculiaridad fundamental de poder situarse en cualquier punto de nuestra página Web.
Una capa puede contener cualquier elemento HTML, texto, tablas, imágenes, incluso otras capas.
También podemos superponer variar capas, de tal manera que la capa que está por encima ocultará a la de abajo.

Otra propiedad de las capas es la visibilidad, como consecuencia de un evento, podemos mostrar u ocultar el contenido de una capa.

Por todas estas características, las capas tienen dos utilidades fundamentales:

1) Servir de contenedoras para situar una parte de documento en cualquier posición de la página.
2) Con la ayuda de código Javascript que se desencadena por eventos, permitir efectos dinámicos, por ejemplo menús desplegables, textos que aparecen al situar el ratón sobre un enlace, textos que se mueven siguiendo al puntero del ratón, etc.
En los siguientes post explicaremos el uso básico de las capas como elementos contenedores.

Más Información...

27) [KompoZer] FORMULARIOS

Filed under: , , by: NaNo

Para crear formularios con KompoZer, abriremos el programa e iremos a la opción Insertar / Formulario/ Definir formulario.
Entonces aparecerá la ventana Propiedades del formulario:

Rellenaremos los datos del Nombre de formulario; en el campo URL de la acción pondremos en principio: http://forms.melodysoft.com ya configuraremos el servicio para que envíe las encuestas que hagamos a los usuarios de nuestra web a un correo determinado; en método seleccionaremos la opción POST, es decir... Enviar; finalmente, pulsamos Aceptar.

Inmediatamente veremos que el programa ha creado un área punteada, como una celda de tabla de color celeste. Esto nos indica que el formulario está creado con el método de recogida de datos que le hemos especificado. Dentro de ese área comenzaremos a colocar los elementos que nos permitirán recopilar los datos que consideremos de interés para nosotros sobre los visitantes a nuestra web.

Para comenzar a crear los botones y los textos que nos servirán para recopilar información haremos lo siguiente. Hacemos clic con el ratón dentro de ese área punteada en celeste, escribimos por ejemplo Nombre y seleccionamos la opción Insertar/Formulario/Campo de Formulario. Rellenaremos la ventana que nos salga con los siguientes datos: elegiremos un campo de texto, lo nombraremos a efectos de poder reconocerlo posteriormente en el formulario y pulsaremos aceptar.

Nuestro formulario irá adquiriendo esta apariencia.
Posteriormente podemos repetir la operación para agregar otro campo que sea apellidos y dirección de email. Repetimos la misma operación anterior y nombramos a cada una según el dato que queramos recopilar.
Tras estos datos podremos colocar items para que el visitante elija una entre varias opciones o varias a la vez Colocamos la pregunta ¿Qué te parece esta web? y añadiremos los siguientes items, cada uno con su opción:

• Para conseguir estos items, recurriremos a Insertar/Formulario/Campo de Formulario y en el tipo elegiremos casilla de verificación.

A cada una de las casillas le asignamos el mismo nombre que pongamos en el formulario, en este caso son opiniones sobre nuestra web.
De forma que nuestro formulario va adquiriendo esta presencia:
Para acabar este sencillo formulario podemos colocar un cuadro de texto para que nuestro visitante nos escriba libremente alguna sugerencia o cualquier otra cosa que le solicitemos.
La mecánica para el cuadro de texto sería la siguiente: Insertar/ Formulario/Área de Texto.
Las propiedades de este área de texto serán las siguientes:

Y lo que obtendremos será algo parecido a esto:
Finalmente solo quedará insertar los botones que harán posible que el visitante envíe el formulario o limpie la información del mismo por si se arrepiente de enviarlo o por si se equivoca en la consignación de algún dato.
Para insertar los botones haremos lo siguiente: Insertar/Formulario/Campo de Formulario; seleccionaremos la opción botón de envío y botón de restablecimiento posteriormente, de forma que completemos el formulario.
A cada uno de los botones pondremos sus propiedades.

El formulario quedará de esta manera:

Más Información...

26) [KompoZer] Referencia HTML de Marcos

Filed under: , , by: NaNo

Etiquetas <FRAMESET> y <FRAME>:

La página del conjunto de marcos es la que contiene el código HTML con la estructura de los marcos. Divide la pantalla en secciones rectangulares (marcos) donde se van a mostrar páginas independientes.
Veamos un ejemplo de una página básica elaborada con frames:

<html>
<head>
<title>Prueba Frames</title>
</head>
<frameset rows="50,*" cols="*" >
<frame src="documento.htm" name="cabecera" scrolling="NO" noresize >
<frameset cols="150,*" >
<frame src="www.google.com.pe" name="google">
<frame src="wikipedia.es" name="wiki">
</frameset>
</frameset>
<noframes><body>Ooops!, tu navegador no soporta frames...</body></noframes>
</html>

Las etiquetas <FRAMESET>...</FRAMESET> indican dónde empiezan y dónde acaban los marcos, y el tipo y forma de estos. Entre una y otra irán las definiciones de los diferentes marcos o frames. Las etiquetas <FRAME> representan los marcos y sus atributos (página web que contienen, márgenes, scroll, etc.)

El body de la página está vacío, no tiene contenido. Las páginas de definición de marcos no nos interesan por su contenido, <body>, ya que sólo van a actuar de contenedor. No es necesario que aparezca la etiqueta <body>, pero es útil mantenerla: las etiquetas <NOFRAMES> </NOFRAMES> determinan el contenido de la página de marcos si se abre con un navegador que no permite visualizar marcos.

Toda página web con marcos se compone de:
• Una página de conjunto de marcos.
Páginas para cargar en cada marco creado.

Atributos de <FRAMESET>:

cols="...": Define el nº de columnas o marcos verticales que va a tener la ventana, y el ancho de cada uno de ellos.
rows="...": Define el nº de filas o marcos horizontales que va a tener la ventana, y el alto de cada uno de ellos.
frameborder="...": Define si los marcos creados van a tener borde o no.
border="...": En el caso de que se haya establecido frameborder="..." o no se haya especificado, este atributo nos permite definir el grosor del borde.
bordercolor="...": Establece el color de los bordes de los marcos.

Atributos de <FRAME>:

name="...": Asigna un nombre al marco para diferenciarlo. Este nombre cobrará importancia a la hora de determinar en que marco queremos que se abra un enlace, es decir , el destino de los enlaces.
src="...": Especifica qué pagina se va a cargar en el frame. La ruta de la pagina debe especificar su localización en el sitio web o una URL completa.
scrolling="...": Establece si el marco tendrá o no barra deslizadora cuando el contenido del marco exceda al tamaño de este.
noresize: Impide que el marco pueda ser redimensionado por el visitante arrastrando su borde. Si no se indica este atributo el marco podrá ser redimensionado.
marginwidth="...": Define el margen horizontal que queremos que haya dentro del frame, entre los límites de este y su contenido.
marginheight="...": Define el margen vertical que queremos que haya dentro del frame, entre los límites de este y su contenido.
bordercolor="...": Sirve para definir el color del borde del marco concreto al que se aplica.

Más Información...

25) [KompoZer] MARCOS

Filed under: , , by: NaNo

Introducción:

Los frames (marcos o cuadros) permiten dividir la ventana en varias más pequeñas, de modo que en cada una de ellas se carga una página html distinta. Las versiones más antiguas de los navegadores no tienen implementada esta característica, por lo que no podrán verlos.

Para crear una página con frames, tendremos que hacerlo desde el modo código, tecleando sentencias HTML, ya que Nvu / KompoZer aun no esta preparado para trabajar con frames.
A continuación, explicaremos los conceptos básicos para poder aplicarlos, en el apartado Referencia HTML.

Cuando se utilizan frames es muy habitual usar el atributo target en la etiqueta que define un vínculo (<A>), con este atributo especificaremos en que frame debe cargarse el destino del vinculo, es decir, la página vinculada.

Más Información...