Cosas que debemos saber antes de iniciar un proyecto web

Lecturas para webmasters principiantes.

¿Que es Internet?

Internet es un conjunto de redes de comunicación independientes interconectadas que funcionan como una red única de alcance mundial. Sus orígenes se remontan a 1969 aunque en la década de los 90 con el desarrollo de la World Wide Web (WWW) comenzó a tomar la forma con la que la conocemos.

Existen, variedad de servicios y protocolos en Internet.

La Web (WWW)
El envío de correo electrónico (SMTP)
La transmisión de archivos (FTP y P2P)
Las conversaciones en línea (IRC)
La mensajería instantánea
La transmisión de contenido y comunicación multimedia -telefonía (VoIP), televisión (IPTV)-, los boletines electrónicos (NNTP),
El acceso remoto a otras máquinas (SSH y Telnet) o los juegos en línea.

¿Que es un dominio?

Toda información que consultemos en Internet está siendo transmitida o bien está alojada físicamente en una unidad de memoria de una computadora conectada a la red. Estas computadoras están identificadas por un número conocido como IP que permite que otras computadoras puedan acceder mediante diferentes protocolos a extraer información.

Un nombre de dominio no es más que una representación memotécnica de estas IPs que de lo contrario serían imposibles de recordar.

Diferentes organismos internacionales se ocupan de distribuir el reparto de los dominios de primer nivel de los cuales los más conocidos son .com, .net y .org.

Cuando compramos un dominio compramos el derecho a utilizar una determinada combinación alfanumérica por un determinado plazo de tiempo como por ejemplo www.aassaapp.com como dirección para que los internautas puedan acceder a nuestra información si necesidad de memorizar una extensa clave numérica. También existen dominios de segundo nivel como .com.ar y .com.es algo más complejos de recordar pero por lo general más baratos (Ej. www.asadosargentinos.com.es ).

Cuando somos propietarios de un dominio podemos usar subdominios o directorios para organizar la información que subimos a la red. Un subdominio es un prefijo separado del dominio por un punto por ejemplo www.migrantes.aassaapp.com es un subdominio asignado por www.aassaapp.com para un portal sobre temas de migración, la posibilidad de usar subdominios depende del servicio que brinde la empresa a la que se lo compres (No olvides tener esto en cuenta a la hora de comparar un dominio ya sea que lo compres por separado o en conjunto con un plan de hosting).

Un directorio es una extensión de un dominio consistente en un agregado después del mismo separado de este por una barra (/) por ejemplo www.aassaaapp.com/migrantes es un directorio que contiene una simple archivo de redirección al mismo portal del ejemplo del subdominio, cuya url principal esta en el directorio poco practico www.aassaapp.com/wordpress a causa de un error del webmaster (es importante que utilicemos directorios lo más descriptivos posibles). La utilización de directorios se distribuye desde el host a cuya raíz esta direccionado el dominio por lo cual es imprescindible contar un con host con acceso ftp para distribuir mediante directorios la información a la que se accede mediante nuestro dominio.

¿Que es una URL?

Cada página web y cada documento que la conforma son encontrados mediante una url, también los documentes que estén sueltos en Internet pueden ser accesibles mediante una URL. Las URLs están formadas por: el nombre del ordenador que proporciona la información (dominio Ej.: aassaapp.com), el directorio donde se encuentra, (Ej.:yohagoweb) el nombre del archivo (Ej.: fcphp1.1.php) y el protocolo a usar para recuperar los datos. (ej.: http) Este ejemplo nos da como resultado la url de un formulario de contacto de YoHAgoWeb Ejemplo completo: http://aassaapp.com/yohagoweb/fcphp1.1.php que a causa de la configuración del servidor también es accesible desde http://www.aassaapp.com/yohagoweb/fcphp1.1.php en la mayoría de los navegadores ya no es necesario incluir el protocolo http ya que es el que funciona por defecto por lo tanto si un navegante escribe en la barra de direcciones de su navegador: aassaapp.com/yohagoweb/fcphp1.1.php accederá al formulario de contacto de yohagoweb, pero no olvidemos que la url correcta de este formulario es http://aassaapp.com/yohagoweb/fcphp1.1.php.

¿Que es hosting?

El alojamiento web (en inglés web hosting) es el servicio que provee a los usuarios de Internet un sistema para poder almacenar información, imágenes, vídeo, o cualquier contenido accesible vía Internet. Los proveedores de host son compañías que proporcionan espacio en un servidor a sus clientes.

¿Que es una página web?

Una página es lo que vemos al insertar una url en el navegador, pude ser un simple texto estático, un conjunto de texto, imágenes y documentos multimedia o un documento formado por el servidor a demanda del navegante de acuerdo a una programación previa (estas últimas son las conocidas como páginas dinámicas.)

¿Que es un sitio web?

Un sitio web es un conjunto de páginas bajo un mismo dominio y normalmente con coherencia de contenido.

¿Que es un portal web?

Un portal de Internet es un sitio web cuyo objetivo es ofrecer a los navegantes, de forma centralizada, el acceso a una serie de recursos y de servicios, entre los que suelen encontrarse buscadores, foros, documentos, webmail, compra electrónica, posibilidad de obtener su propia página o blog etc.

¿Que es un blog?

Un blog es una página web de actualización frecuente y con el contenido organizado cronológicamente, normalmente los artículos (llamados posts) más nuevos aparecen primero, los autores deciden si permiten o no la publicación de artículos o los comentarios de los mismos por terceros. En principio los blogs eran diarios personales publicados en Internet, los primeros fueron realizados por programadores relacionados a Internet y en ellos relataban los devenires de sus proyectos.

Ahora con el desarrollo de las herramientas CMS como wordpress la delimitación de blog ya no es tan clara ya que sistemas originalmente pensados para la constricción y administración de blogs alcanzan tal flexibilidad que nos permiten fusionar portales blogs y foros con enorme facilidad de tal manera que tomamos las características necesarias de cada concepto que más de adapten a nuestro proyecto sin prejuzgar si se trata de un blog un portal o un foro.

¿Que es un buscador?

Un buscador es una herramienta que nos permite encontrar contenidos en Internet mediante palabras clave, hay distintos tipos de buscadores pero los más usados son los buscadores genéricos como google, yahoo, o msnsearch, no debemos confundir los buscadores o las barras de búsqueda insertadas en diferentes páginas y utilidades con la barra de direcciones de nuestro navegador que es la que usamos cuando conocemos la url del sitio a cual queremos acceder. Si tienes dudas al respecto te recomiendo leer el siguiente post: Como encontrar una página Web

¿Que es indexar en buscadores?

Cuando una página es nueva los buscadores no la conocen, es decir que no figura en las bases de datos de los mismos, indexar una página significa que el buscador toma conocimiento de la existencia de dicha página y la incluye es su base de datos.

Si bien algunos buscadores como google tienen formularios para proponer la indexación de páginas, esto no es necesario, por lo general los administradores de los buscadores no prometen resultados concretos de esta manera, es un hecho que la forma mas efectiva y rápida de indexar páginas es conseguir links en páginas ya indexadas de esta manera cuando los buscadores pasan por estas en busca de novedades encuentran estos links e indexan las páginas linkeadas.

¿Que es posicionar en buscadores?

Que una página este indexada no implica que se pueda encontrar en un buscador con las palabras o frases que al editor de esta le interese, posicionar significa lograr un lugar predominante en los resultados de búsqueda mediante determinadas palabras o frases.

No me voy a extender ahora en técnicas de posicionamiento ya que la intención de este post es aclarar terminologías y conceptos. Pero desde ya vale la pena aclarar que esto depende solamente de tu buen hacer y que si tú sitio o blog es nuevo partes desde posición cero en los buscadores y no esperes resultados decentes antes de los tres meses.

Comienza por poner contenido donde las palabras calves sean predominantes sin exagerar y por conseguir links en páginas de temática similar y estarás por buen camino.

YoHagoWeb, El chiringuito de los webmasters principiantes.

Como encontrar una página Web

Introducción: El objetivo de Internet es ser fácil de usar.

Podemos decir que Internet tal cual la conocemos ahora existe desde 1993 y aproximadamente a partir del `97 la red de redes es un sistema de comunicación masivo.

Desde la prehistoria de La WWW, una de las principales preocupaciones de los ideologos y diseñadores de La Red fue crear un entorno que nos facilite almacenar, catalogar y luego encontrar información.

Es un hecho que ya nos acercamos mucho a este objetivo, al menos en los países ricos la mayoría de los habitantes tienen acceso a Internet.

La gran capacidad de las computadoras y las líneas de Internet con que contamos han facilitado la creación de herramientas que hacen a la red de redes relativamente y en principio, fácil de usar para cualquier persona sin conocimientos previos, ya que tanto según quienes diseñan los sistemas operativos y softwares más usados y quienes estamos en primera línea ante los usuarios no dejamos de repetir que el sistema es intuitivo.

El webmaster en la burbuja.

En cuanto un webmaster salga un poco de la burbuja se dará cuanta de que esto no es tan simple, en contra de lo que suponemos muchas veces quienes visitan o desean visitar nuestras páginas, no tienen los conceptos mínimos ni manejan las herramientas más simples y elementales.

Esto lo he comprobado de tres maneras diferentes aunque en repetidas ocasiones 1) No fue un solo cliente el que al intentar mostrarle la primera versión publicada de un sitio me respondió “la página no funciona, google me dice que no la encuentra.” 2) visitando foros para webmasters principiantes he leído cantidad de posts reclamando a plataformas como blogger o a los mismos buscadores que sus blogs recién creados “no aparecen en Internet”: “cundo lo veo desde mi cuenta está ahí pero después mis amigos ponen la dirección en google y no aparece, algo funciona mal en google o en blogger” 3) También podemos observar esto en las estadísticas de nuestros sitio, si este posiciona moderadamente bien veremos cierto porcentaje de visitas que nos llegan por la búsqueda de nuestras URLs en los buscadores, lo que no sabremos nunca es canutos no llegan por poner la url en la barra de algún buscador y no en la barra de navegación, también recibo en mis páginas usuarios que buscan otras páginas insertando la url en un buscador, esto sucede por que mi posicionamiento es más fuerte que el de las páginas buscadas y por que muchos webmasters al ignorar esta situación olvidan posicionar su url o dominio como una de las palabras clave de la página.
En el mejor de los casos un usuario que buscando tu página insertando tu URL en un buscador como google llegue a una página como las mías por que en esta figure tu url es probable que en definitiva si llegue a tu página por que tengo la buena costumbre de linkear todas las URLs que publico, pero e encontrado en cientos de páginas cosas como www.midireccion.com sin linkear el texto correspondiente.

Poner una url en la barra de navegación y obtener determinada página como resultado, es una acción que se repite millones de veces al día, pero no encontrar una página conociendo la dirección por usar la barra equivocada, lamentablemente también ocurre millones de beses al día. Esta es mi mayor causa de estrés como webmaster, por eso me decidí a darle la lata a webmasters y usuarios con este tema.

Para los webmasters

Si consideras que hay un número importante de internautas que accederán a tu sitio mediante la URL por ejemplo por que realizas campañas publicitarias fuera de Internet, no olvides posicionar como una de tus palabras claves dicha URL, de esta forma evitarás perder las visitas de quienes confunden las barras de búsqueda con la barra de navegación.

Se considerado con los otros webmasters y los usuarios torpes y cuándo publiques una URL no olvides linkearlas: www.yohagoweb.blogspot.com (mal), www.yohagoweb.blogspot.com (bien).

Manda a tus internautas y clientes a leer el siguiente tutorial para usuarios de Internet principiantes o escribe uno.

Es una tendencia firme que en Internet la pasividad de los usuarios es cada vez menor, hay muchas herramientas que le permiten a un usuario convertirse en su propio webmaster y como. Las plataformas compiten entre si con el argumento de la facilidad (Haga su propio blog en minutos) Muchos usuarios con poca o nula experiencia se lanzan a webmasters sin saber lo que es una URL, incluso cuando ya tienen sus blogs publicados siguen sin saberlo. Por eso queda pendiente para la próxima semana un post para webmasters más que novatos donde hablaremos de lo que deberías saber antes dar el primer paso para tener tu propio sitio o blog, incluso antes de comprar host y dominios o antes de registrarte en una plataforma *gratuita.
Entre otros abordaremos un tema muy relacionado con el de este post: Diferencia entre indexación y posicionamiento en buscadores.

* Considero que en el mudo comercial, gratis no existe, casi siempre te pedirán algo a cambio, esto no está mal pero llamemos a las cosas por su nombre, por ejemplo host por intercambio.

Para los internautas.

No es lo mismo buscar que acceder. Los buscadores como google, yahoo o live search están diseñados para encontrar contenidos, incluso para encontrar páginas web cuando no contamos con la dirección o URL, pero No Todas Las Páginas Web Aparecen En Los Buscadores, si bien el objetivo de algunos de ellos como google es indexar toda la información de Internet y ciertamente con el tiempo todas las páginas son indexadas pero no todas posicionan en los primeros lugares.
La ley física de la impenetrabilidad es trasladable a esta situación, no le conozco excepciones y dice así: Dos cuerpos no pueden ocupar el mismo espacio. Por lo tanto es posible que la página o blog que buscas no aparezca en la primer página de resultados y si es nueva lo más probable es que directamente no aparezca (Esto No Es Un Mal Funcionamiento).

¿Entones como hago para encontrar el nuevo blog de mi amigo o la página que me acaba de hacer mi webmaster?

Es tan simple como aprender a diferenciar entre la barra de búsqueda y la barra de direcciones, Como ya dijimos aunque en ocasiones los buscadores te permitan encontrar determinada página web insertando en estos la dirección o url, estos no están diseñados para esto y usarlos de esta manera puede ocasionar confusiones, fracasos e incluso malentendidos.

Cuando cuentas con la dirección de una página, por ejemplo www.yohagoweb.blogspot.com no tienes por que buscarla en google, aunque es un mal ejemplo por que esta está bien posicionada y la encontrarías. Repito teniendo la URL (dirección) lo correcto es poner dicha dirección en la barra de navegación o barra de direcciones.

Las siguientes imágenes te ayudarán a diferenciar entre la barra de navegación y las barras de los buscadores.

Click sobre las imágenes para verlas más grandes.

En Mozilla firefox

En MS IE

En rojo la barra de direcciones o barra de navegación.
En verde las barras de búsqueda.

Cundo sepas la URL(dirección de una página) recuerda usar las resaltadas en rojo.

Quitar navbar de Blogger

Las condiciones de Blogger no prohíben quitar la navbar, si bien las opiniones oficiales en los grupos y blogs de Google son contrarias a que las quitemos. Las razones que argumentan son las herramientas que contiene: siguiente blog, denunciar blog, buscar y herramientas de administración.
Razones para quitarla:
1) Estética, La barra ocupa un lugar predominante, uno de los mas importantes a la hora del diseño en su lugar podemos poner nuestra propia barra de navegación o un bloque de links ya sea nuestro o de adsense, o podemos dejar que la cabecera quede más predominante. También hay que tener en caunta que la apariencia de la barra es poco configurable y mintras más trabajamos en mejorar y diferenciar la apariencia de nuestros blogs esto se hace más molesto.

2) La función siguiente blog es cada vez más peligrosa ya que puede llevar a nuestros usuarios a blogs con contenido no deseado o con malware.

3) Las funciones que si deseamos conservar de la barra las podemos reemplazar mediante links en alguna parte menos predominante de nuestro blog. No soy partidario de quitar la pasibilidad de que denuncien mi blog ya que no tengo nada que esconder por eso en YoHagoWeb incorporé el siguiente link al formulario para advertir a blogger sobre infracciones, recuerda que usar este formulario de manera maliciosa puede traerte malas consecuencias. Este es el link al formulario: http://help.blogger.com/?page=troubleshooter.cs&problem=&contact_type=main_tos&Submit=Submit

A tener en cuenta: Ya que la única presencia de blogger por defecto es la que está en la barra es recomendable añadir el logo de Blogger, si lo haces desde agregar elemento de página el logo está linkeado a la administración del blog.

Se puede ver el menú que puse en yohagoweb a cambio de la navbar abajo de todo en la columna derecha.

Añadir el siguiente código entre <head> y </head>

<style type="text/css">
#navbar-iframe {
height:0px;
visibility:hidden;
display:none;
}
</style>

Un anuncio en cada post de nuestro blog que podamos modificar desde un solo punto y se modifique automaticamente en todas los post, Parte 2.

En el post anterior hablábamos de como poner un anuncio en cada entrada de tu blogger, y poder modificarlo desde un solo punto para que se modifique en todos los post automáticamente, decíamos que por este ser un blog para webmasters principiantes lo hacíamos de la manera más fácil, mediante la configuración del blog, pero luego de meditar largamente sobre este tema, (5 minutos) llegué a la conclusión de que la dificultad de hacerlo sobre la platilla es muy poca y las ventajas muchas, bueno, son dos pero importantes: 1) Si lo hacemos de esta manera el mensaje aparecerá también en los posts publicados anteriormente a esta modificación. 2) no tendremos nunca que reacomodar este código en el post.

Para detalles mejor ver el post anterior http://yohagoweb.blogspot.com/2008/10/prueba-de-anuncio-que-se-repite-en_27.html

Ahora vamos a ver como poner el código del iframe directamente en la plantilla.

Se trata de ubicar el siguiente código en la plantilla de blogger (tienen que estar expandida las plantillas de artilugios) siempre guarda una copia de seguridad de tu plantilla usando el block de notas

<div class='post-body entry-content'>

<p><data:post.body/></p>

<div style='clear: both;'/> <!-- clear for photos floats -->

</div>

<div class='post-footer'>

y lo dejamos de la siguiente manera:

<div class='post-body entry-content'>

<p><data:post.body/></p>

<div style='clear: both;'/> <!-- clear for photos floats -->

</div>

<iframe name="I1" src="http://www.aassaapp.com/yohagoweb/marquee.htm" no=""
scrolling="no" width="605" frameborder="0" height="33"></iframe>

<div class='post-footer'>

El código del iframe va antes de:<div class='post-footer'>

Probando streeming

Este es el canal de televisión experimental de yohagoweb, se trata de ver que plataforma gratuita de streeming funciona mejor ya estamos probando ustreem en www.boletinargentino.blogspot.com Aquí estamos probando mogulus

Un anuncio o lista de lincks en cada post de nuestro blog que podamos modificar desde un solo punto y se modifique automaticamente en todas los post

Que bueno sería tener un anuncio o lista de lincks al pié o en la cabecera de cada post de nuestro blog que podamos modificar desde un solo punto y se modifique automáticamente en todas las entradas, no te preocupes esto no es una quimera, hay dos formas de hacerlo una mediante la plantilla de la cual hablaremos más adelante en otro post. Como este es un blog para webmasters principiantes primero abordaremos la forma más fácil de hacerlo aunque tiene el defecto de que solo funcionará en las entradas posteriores a la modificación.

Necesitarás un host donde puedas subir un archivo HTML.
Hay una función de blogger que pasa desapercibida para muchos bloggeros incluso no tan novatos y es la que usaremos para nuestro cometido.

Se trata de de la plantilla de entrada, desde tu panel de configuración/formato abajo de todo en formato encontraras un campo con el título Plantilla de entrada. Todo texto o código que incluyas en este campo saldrá en todos tus posts posteriores a la inclusión del mismo, pero cuando tengas que modificarlo estas modificaciones no se verán el los post anteriores a la modificación, pues hay una forma de modificar el texto de todos a la vez, se trata de no incluir en plantilla de página el texto definitivo por que en este caso como ya dijimos este texto quedaría fijado en los post y después tendríamos que modificarlo entrada por entrada.

La solución que pergeñamos desde YoHagoWeb y MisterTrufa es muy simple pero como ya dijimos requiere que de dispongas de un host, de todas maneras si te vas a dedicar un poco a internet es muy recomendable que tengas uno aunque uses plataformas como Blogger ya que siempre es bueno poder alojar funcionalidades que no disponemos en los blogs, no es momento de ahondar en este tema de los host cosa que también haremos en un próximo post pero desde ya te recomiendo que si no puedes pagarte un servicio de host mínimo para ti solo te juntes con otros bloggeros o webmasters principiantes que estén en las mismas circunstancias ya que para estos menesteres son necesarios pocos recursos pero fiables y los host gratis tienen limitaciones que complican la vida.(Un plan de host pagado entre tres o cuatro en cooperativa significa realmente poco dinero)

Vamos al grano.
Se trata de incluir un infame que llamará a una marquesina externa, usaremos el ejemplo de marquesina por que se trata de usar poco espacio en alto y de esta manera se puede incluir mucho texto en poco espacio pero podrás llamara cualquier archivo por lo cual podrás añadir textos fijos, imágenes, vídeos o lo que tu imaginación de deje pergeñar.
1) Desde el panel de configuración del blog buscas la pestaña formato e incluyes el siguiente código

<iframe src="aquí la url de tu marqusina" width="400(o el ancho de las entradas de tu blog)" height="33(aprox de acuerdo al tamaño de letra que pongs en la marquesina)" scrolling="no"></iframe>

Las frases entre paréntesis no son parte de código.

2) Ahora es cuando necesitaremos un host para subir un pequeño archivo HTML, recuerden que en este caso el ejemplo es con una marquesina pero puedes subir cualquier texto, imagen o video que quieras repetir en cada post, y con un poco más de habilidad podrás poner utilidades como encuestas, formularios, etc.

Este es un ejemplo de código de marquesina:

<marquee scrollamount="3" width="600">Aquí el texto que quieras reproducir en todos los post de tu blog.</marquee>

Recuerda adaptar el ancho del iframe y la marquesina a el ancho de las entradas de tu blog.

Es difícil conocer de antemano el nivel de los conocimientos de nuestros internautas por lo cual e decidido no agregar más aclaraciones pero iremos ampliando a base de las preguntas de los lectores.

Pulsando aquí podrás leer la segunda parte donde explicamos como hacerlo directamente en la plantilla es más conveniente.

Aquí abajo puedes ver un ejemplo de complementación de este truco.

Modificar ancho de blogs en Blogger

Blogspot es una plataforma de blogs enormemente flexible, si bien no permite en principio trabajar con páginas estáticas, barra de navegación, categorías, etc. Digo en principio porque su enorme flexibilidad le permite publicar un blog a cualquier persona que sepa leer y encender una computadora y por otro lado es un sistema enormemente permisivo en donde un diseñador o programador con buen conocimiento de html y css puede modificar un blogger casi a su entera voluntad.

Ya en YoHagoWeb hablamos de pequeños trucos de configuración, ahora comenzamos a tocar la plantilla con uno de los factores más fáciles de comprender pero tremendamente útil y necesario, Cambiar el ancho de nuestros blogs ya que muchas platillas de blogger son de ancho fijo y de la época en que la mayoría teníamos las pantallas en 800px, unos 5 años (que en internet son 5 siglos.)

En este caso trabajaremos con ancho fijo ya que siempre es lo recomendable para los principiantes.

Le podremos un acho de 900px pero haciendo tus propios cálculos, podrás adaptarlo a tus necesidades.

Trabajaremos sobre la plantilla: Minima Designer: Douglas Bowman , por ser la más simple y la que vienes por defecto, es la primera en la lista. Pero en estos detalles las platillas de blogger difieren muy poco, casi nada.

He dejado toda la primera parte en gris por que es solo para que sirba de referencia para encontrar la parte que nos interesa.

1) Lo primero es ir a tu panel de contro/diseño/edición de html

2) Siempre antes de modificar la plantilla pega una copia en el blok de notas y guárdala (Webmaster precavido sobrevive)

Has las modificaciones y dale al botón de modificar platilla que esta debajo de todo.

Si todo sale mal, me podés insultar en este formulario de contacto.

Este pos está redactado para responder una pregunta de www.cavehomosapiens.blogspot.com

<?xml version="1.0"
encoding="UTF-8" ?>

<!DOCTYPE html PUBLIC
"-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html
expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml'
xmlns:b='http://www.google.com/2005/gml/b'
xmlns:data='http://www.google.com/2005/gml/data'
xmlns:expr='http://www.google.com/2005/gml/expr'>

<head>

<b:include
data='blog' name='all-head-content'/>

<title><data:blog.pageTitle/></title>

<b:skin><![CDATA[/*

-----------------------------------------------

Blogger Template
Style

Name: Minima

Designer: Douglas
Bowman

URL:
www.stopdesign.com

Date: 26 Feb
2004

Updated by:
Blogger Team

----------------------------------------------- */

/* Variable
definitions

====================

<Variable
name="bgcolor" description="Page Background Color"

type="color" default="#fff" value="#333333">

<Variable
name="textcolor" description="Text Color"

type="color" default="#333" value="#ffffff">

<Variable
name="linkcolor" description="Link Color"

type="color" default="#58a" value="#ffff66">

<Variable
name="pagetitlecolor" description="Blog Title Color"

type="color" default="#666" value="#cc0000">

<Variable
name="descriptioncolor" description="Blog Description Color"

type="color" default="#999" value="#ffff66">

<Variable
name="titlecolor" description="Post Title Color"

type="color" default="#c60" value="#cc0000">

<Variable
name="bordercolor" description="Border Color"

type="color" default="#ccc" value="#333333">

<Variable
name="sidebarcolor" description="Sidebar Title Color"

type="color" default="#999" value="#cc0000">

<Variable
name="sidebartextcolor" description="Sidebar Text Color"

type="color" default="#666" value="#ffffff">

<Variable
name="visitedlinkcolor" description="Visited Link Color"

type="color" default="#999" value="#cc0000">

<Variable
name="bodyfont" description="Text Font"

type="font" default="normal normal 100% Georgia, Serif" value="normal normal
100% Georgia, Serif">

<Variable
name="headerfont" description="Sidebar Title Font"

type="font"

default="normal normal 78% 'Trebuchet MS',Trebuchet,Arial,Verdana,Sans-serif"
value="normal normal 78% 'Trebuchet MS',Trebuchet,Arial,Verdana,Sans-serif">

<Variable name="pagetitlefont"
description="Blog Title Font"

type="font"

default="normal normal 200% Georgia, Serif" value="normal bold 220% Georgia,
Serif">

<Variable name="descriptionfont"
description="Blog Description Font"

type="font"

default="normal normal 78% 'Trebuchet MS', Trebuchet, Arial, Verdana,
Sans-serif" value="normal normal 78% 'Trebuchet MS', Trebuchet, Arial, Verdana,
Sans-serif">

<Variable
name="postfooterfont" description="Post Footer Font"

type="font"

default="normal normal 78% 'Trebuchet MS', Trebuchet, Arial, Verdana,
Sans-serif" value="normal normal 78% 'Trebuchet MS', Trebuchet, Arial, Verdana,
Sans-serif">

<Variable name="startSide"
description="Side where text starts in blog language"

type="automatic" default="left" value="left">

<Variable
name="endSide" description="Side where text ends in blog language"

type="automatic" default="right" value="right">

*/

/* Use this with
templates/template-twocol.html */

body {

background:$bgcolor;

margin:0;

color:$textcolor;

font:x-small
Georgia Serif;

font-size/*
*/:/**/small;

font-size:
/**/small;

text-align:
center;

}

a:link {

color:$linkcolor;

text-decoration:none;

}

a:visited {

color:$visitedlinkcolor;

text-decoration:none;

}

a:hover {

color:$titlecolor;

text-decoration:underline;

}

a img {

border-width:0

}

/* Header

-----------------------------------------------

*/

#header-wrapper {

width:660px; ancho de la cabecera ( le
agregamos 200px) queda en 860)

margin:0 auto 10px;

border:1px solid
$bordercolor;

}

#header-inner {

background-position: center;

margin-left:
auto;

margin-right: auto;

}

#header {

margin: 5px;

border: 1px solid $bordercolor;

text-align: center;

color:$pagetitlecolor;

}

#header h1 {

margin:5px 5px 0;

padding:15px 20px .25em;

line-height:1.2em;

text-transform:uppercase;

letter-spacing:.2em;

font: $pagetitlefont;

}

#header a {

color:$pagetitlecolor;

text-decoration:none;

}

#header a:hover {

color:$pagetitlecolor;

}

#header .description {

margin:0 5px 5px;

padding:0 20px 15px;

max-width:700px;
ancho de la descripción del blog )le agregamos
200px) queda en 900

text-transform:uppercase;

letter-spacing:.2em;

line-height: 1.4em;

font: $descriptionfont;

color: $descriptioncolor;

}

#header img {

margin-$startSide: auto;

margin-$endSide: auto;

}

/* Outer-Wrapper

----------------------------------------------- */

#outer-wrapper {

width: 660px;
Ancho del cuerpo principal (le agregamos 200px) queda
en 860)

margin:0 auto;

padding:10px;

text-align:$startSide;

font: $bodyfont;

}

#main-wrapper {

width: 410px;
Ancho del cuerpo de los post. (le agregamos 200px)
queda en 610

float: $startSide;

word-wrap: break-word; /* fix for long
text breaking sidebar float in IE */

overflow: hidden; /* fix for long
non-text content breaking IE sidebar float */

}

#sidebar-wrapper {

width: 220px;
Ancho de la columna lateral (por el momento lo dejamos,
pero ya estas capacitado para tomar tu propia decisión al respecto) tengamos en
cuenta que estamos trabajando con ancho fijo calculando la configuración de
pantalla más usada por los internautas que es de 1025px de ancho, y en este caso
es recomendable trabajar con un ancho total máximo de 960px o como mucho 1000,
por lo tanto puedes agregarle unos pixels a la columna lateral. pero en este
caso también tendrás que agregar estos mismos px a #outer-wrapper {Ancho
del cuerpo principal

Repito, creo que con las pocas
explicaciones dadas hasta el momento, usando simple lógica ya podrás adaptar al
ancho de tu blog a tu gusto o necesidades

Primero decides el ancho total,
después adaptas el resto de los componentes y simplemente lo que quitas de un
lado lo agregas en el otro.

Ante cualquier duda o sugerencia
deja tu comentario en este post o usa nuestro

formulario de contacto,

Formulario de contacto php

Ya hemos hablado de los formularios de contacto que ofrecen algunos servicios
online, si tienes un host con php puedes tener tu propio formulario sin muchas complicaciones con la ventaja de estar libre de publicidad y no redireccionar una web externa que tu no quieras después del envío ni de agradecer el envío, aunque el código que presentaremos es un código público te agradecemos que reconozcas los créditos de YoHagoWeb no quitando el vinculo si es que copias el código tal cuál y agregándolo si solo sacas ideas para hacer el tuyo ya que nos hemos tomado el trabajo de adaptarlo para que lo puedas implementar fácilmente y te daremos
explicaciones para que puedas hacerlo adaptándolo a tu sitio.

Haciendo click aquí, puedes ver un ejemplo de formulario de contacto php como el que te ayudaremos a implementar, este es el ejemplo más simple (sin formato) solo con campos de nombre mail ycomentario (FormularioFCYHW1)

Solo necesitas el Block de notas o similar, un cliente FTP y un host con php.

Por razones técnicas hemos puesto este pequeño tutorial en una página externa a este blog, si quieres leerlo pulsa aquí

¿Qué es un favicon? ¿como se hace?

¿Qué es un favicon? ¿como se hace?

Es un icono, es decir, una pequeña imagen, que aparece enalgunos navegadores junto a la dirección de una página web. En Explorer 5 osuperior tendrás que añadir primero la página a favoritos) en firefox actualmente tiene menos dificultades.

El funcionamiento de los "faviconos" no resulta siempre deltodo predecible, ya que se comportan de manera diferente con cada navegador, pero esto se está solucionando con el tiempo y las nuevas generaciones de utilidades, intentare hacerlo de la manera los más simple posible por que en lo simple hay menos posibilidad de error.

¿Que necesito?

1. Un editor de imágenes que guarde en formato .ico. un .ico no es una imagen
   cualquiera con la extensión cambiada. Tienes que guardar la imagen
   con formato .ico. Hay muchos programas que lo hacen, y hay utilidades online como chuano.net ó genfavicon.com .


2. Un editor de páginas web, es decir, un editor de texto
   normal y corriente. Hay decenas de ellos que son gratuitos


3. Un cliente ftp para subir el icono a tu espacio web. El icono lo subes a la
   web exactamente igual que el resto de los archivos que forman tu web.

4. Por supuesto, un navegador que soporte faviconos (IE5 o superior, Mozilla
0.96 o superior, Netscape 6.2 o superior, para ver el resultado de tu trabajo.

¿Como se hace?

1) Crear el icono

El icono debe tener las
siguientes características:

• Dimensiones 16 píxeles x 16 píxeles;


• 16 colores (4 bits);


• Formato ICO,
  ningún otro. Aquí tienes utilidades online
  para generarlo.
  
  chuano.net ó genfavicon.com

2) Subir el .ico al servidor.

Por supuesto debe ser un archivo .ico y con dicha
extensión.

Debes ser conciente de la url donde lo colocas por que la
tendrás que insertar en el siguiente código.

3) Insertar el código

El código debe estar entre <HEAD>
y </HEAD>
del HTML de las páginas en donde quieres que se vea el icono.

<link rel="shortcut icon" href="http://www.tudominio.com/tufavicon.ico">

O si el icono esta alojado en la raiz

de la página donde quieres mostrarlo puedes usar simplemente


<link
rel="shortcut icon" href="tufavicon.ico">

Nota. Primero sube la imagen después prueba el funcionamiento insertando el código en una página y si funciona correctamente, adelante a ponerlos hasta en la sopa.

YoHagoWeb, el kiosco de las chapuzas para webmasters principiantes

Imprimir

Como subir tus webs mediante FTP

FTP es uno de los diversos protocolos de Internet, significa File Transfer Protocol (Protocolo de Transferencia de Archivos) es la herramienta adecuada para transferir grandes bloques de datos por la red.

Algunos servidores usan este sistema para ofrecer descargas si necesidad de identificarse en este caso hablamos de login anónimo o FTP anónimo.

Pero en este caso nos ocuparemos de como usar ftp privado para subir los archivos que conforman nuestras páginas web. FTP, es el protocolo mas usado para subir archivos a los servidores.

El cliente FTP

Un cliente FTP es el programa que usamos para conectarnos a nuestros servidores de host, para subir nuestros archivos ó para transferirlos desde el a nuestra PC.

Cual FTP usar

Hay muchos clientes ftp, la mayoría gratuitos y de estos algunos muy buenos por lo tanto no hay razones para pagar por uno, al final de este tutorial encontrarás una lista de algunos de ellos y donde puedes descargarlos.

Cómo subir archivos usando un cliente FTP

Supongamos que tienes una cuenta de host y te han mandado los datos a tu mail, estarán en el panel de administración, o los habrás copiado en el momento de registrarte, los datos son algo así:
host: ftp.dominio.com o ftp.usuario.dominio.com
usuario: tu nombre de usuario
contraseña: tu contraseña

En muchos de los programas tienes que insertar estos datos en una ventana que generalmente se abre en el menú conectar/nuevo servidor ó nuevo sitio, en FileZila hay unos cuadros en la parte superior, el puerto normalmente puedes dejarlo en blanco o probar con el 21. (si es distinto al 21 normalmente tu proveedor de host te lo aclarará de antemano).

Una vez conectado al servidor en la gran mayoría de los clientes ftp observarás dos ventanas, en la izquierda podrás ver los archivos que tengas en tu computadora y en la derecha veras el servidor.

1) Abre o crea en el servidor la carpeta donde vas a subir los archivos

normalmente tendrás que subir los archivos a una carpeta llamada httpdocs o publichtml que normalmente ya esta creada al contratar el host. En algunos casos es diferente pero seguramente te lo aclararan al momento de mandarte los datos del servicio contratado (este es uno de los factores que demuestran la importancia de contratas un servicio de alojamiento prestado en un idioma que comprendas, pero esto es otra película de la que hablaremos mas adelante)

El archivo principal de tu web, (el que tus visitantes verán al ir a tu url) deberá llamarse index.htm , index.html y en algunos casos puede llamarse default.php

si usas index.htm nunca hay error. Por lo tanto debes subir a la raíz de tu host (aquella carpeta llamada httpdocs o publichtml) el archivo destinado a ser tu página principal y debes subirlo con el nombre index.htm de esta manera los navegantes lo encontraran simplemente con escribir el nombre de dominio por ejemplo www.aassaapp.com , si tu intención es ubicar el archivo en un directorio de tu dominio por ejemplo www.aassaapp.com/irene debes crear dentro de public.html una carpeta llamada irene y subir el archivo irene a esta carpeta renombrado como index.htm , si te limitas a subir el archivo con su propio nombre por ej. irene.htm a la raíz del server la url quedaral tal como www.aassaapp.com/irene.htm como en el caso de www.aassaapp.com/asapform.htm . Para crear carpetas en el servidor normalmente hay dos maneras una mediante el menú de la ventana derecha del cliente ftp , normalmente nuevo o crear /carpeta ó directamente con el menú contextual el que aparece al presionar el botón derechos del ratón, claro está que deberás presionar el botón derecho cundo el puntero esté sobre la ventana del ftp correspondiente al servidor remoto.

2) Busca en tu pc los archivos que vas a subir, en la ventana izquierda de tu programa ftp verás todas las carpetas que tengas en tu disco duro, solo tendrás que explorar y seleccionar el o los archivos a subir, todos los archivos que vayan a una misma carpeta de tu servidor los puedes seleccionar y subir de una sola vez. Una vez seleccionados los archivos a subir solo tienes que buscar un botón que normalmente esta representado con una flecha que apunta a la derecha y suele ser verde pero esto cambia de acuerdo al programa que uses, no olvides seleccionar y abrir previamente la carpeta de destino en tu server.

Lista de programas ftp y donde puedes bajarlos.

FileZilla http://filezilla-project.org/download.php

Coffe Cup http://www.coffeecup.com/free-ftp

CoreFTP http://www.coreftp.com/download.html

WorldWide FTP http://www.ftpworldwide.com

Shuttle FTP Suite http://shuttle-ftp-suite.archivospc.com

Nicoftp http://hagoweb.orgfree.com/foro/viewtopic.php?f=33&t=41

YoHagoWeb El blog de los webmasters novatos

No veo los cambios que hago en mi phpbb3 (Actualizar caché en phpbb3)

¿Recuerdas cuando estabas creciendo que te dolían los huesos?. Lo que estamos viviendo con phpbb y su versión 3 es exactamente eso, dolor de crisis, crisis como síntomas de crecimiento, tenemos que acostumbrarnos a algunas diferencias y a algunas cosas nuevas, en opinión de este advenedizo en cuestiones web, la mayoría de los cambios en la versión 3 son para mejor, aunque algunos detalles como aprender a controlar el nuevo sistema de permisos nos está provocando algunas migrañas a unos cuantos, pero ahora nos ocuparemos de algo más simple. Borrar el caché para que podamos ver los cambios que realicemos en las plantillas de nuestro phpbb3 .
Este uno de los factores nuevos que está complicando la vida a muchos administradores de estos foros, a diferencia de la versión dos, la tres tiene un eficiente sistema de chacé que hace que cargue considerablemente más rápido, repito este es uno de los factores que observo que le está complicando la vida a muchos administradores y neodiseñadores de phpbb3, como quien escribe, pero en realidad es muy simple de solucionar, se explica practicante solo con las capturas a continuación.

Para ver las imágenes más grandes pulsa sobre las mismas.
Vas al: panel de administración/estilos/caché Una vez en caché, marcas los checkbox correspondientes a los archivos modificados y le das al botón "borrar chaché" (sin miedo , esto no tiene ningún peligro)

YoHagoWeb el blog de las chapuzas para webmasters principiantes.
Estamos construyendo un nuevo foro para webmasters principiantes principalmente dirigido a los sistemas dinámicos de administración de contenido www.hagoweb.orgfree.com/foro

Generado gratuito de formulario de contacto, muy facil.

1) Acceder a la url https://www.dw-formmailer.de/
marcar la opción generador de formularios.

Para ver la imágenes tamaño completo pulsa sobre las mismas.

2) Elegir el tipo de formulario deseado, la opción 1 Formulario de contacto con nombre, eMail, commentario, captcha es la más simple para usar como formulario de contacto, es la que vamos a usar para el ejemplo.

Marcar las cuatro opciones como muestra la imagen y seguir al paso 3

donde dice . name="recipient" value=" pon el mail donde quieras recibir los mensajes.


Usa esta pantalla para configurar los colores.

Copiá el código y pégalo en tu web.
Funciona en casi todos los tipos de páginas y blogs, pruebalo y si no funciona ubicado en un servidor externo, es facil ya que no requiere php ni base de datos ya que es un servicio externo.
Si tienes problemas para implementarlo ó te quedaron dudas deja tus preguntas como comentario en este post.

Nueva comunidad hispana wordpress (no oficial)

Nueva comunidad hispana wordpress (no oficial)

Desde www.aassaapp.com y www.mistertrufa.net estamos creando una comunidad hispana de wordpress, no somos grandes programadores ni diseñadores, debido a nuestra experiencia de uso en dicha plataforma estamos acumulando una cantidad de información y conocimiento que queremos compartir.

Por supuesto estamos abiertos a las sugerencias de los navegantes y a las aportaciones de los usuarios de wordpress.

Para comenzar estamos creando la comunidad en un espacio de nuestro Foro HagoWeb
con la siguiente url http://hagoweb.orgfree.com/foro/viewforum.php?f=7&sid=cf0ecdeec8864465d139e47580db48b1

Ya puedes encontrar los siguientes foros: Novedades, ¿que es worpress?, Chapuzas, En tu propio servidor, En alguna plataforma basada en Worpress mu, Otros sitios en Castellanos sobre Wordpress, Plugins, Instalación, configuración y modificación

Estos son algunos de los temas publicaos hasta hoy en: Comunidad hispana no oficial de wordpress

Novedades
¿que es worpress?
Chapuzas
Anuncia tus páginas hechas en wordpress
En tu propio servidor
En alguna plataforma basada en Worpress mu
Otros sitios en Castellanos sobre Wordpress
Plugins
Instalación, configuración y modificación
Instalar Wordpress en Castellano
Pagina principal en worpress
Una chapuza para integrar páginas dinámicas. (Probada en Wor
Introducción a WordPress
Cambiar la clave con MD5 en wordpress

Esperamos tu participación.

Añadir un formulario de contacto en wordpress.

1º descargaros el plugin de aquí, descomprimirlo y poner la carpeta de wp-contact-form donde todos los plugins, o sea en el directotio –> wp-content/plugins/

2º Ir a plugins y activar contact form

3º crear una nueva página en Wordpress, y llamarla por ejemplo contacto, en la cual basta con que introduzcáis lo siguiente:

<!--contact form-->

4º  Ir a Administración/Opciones/formulario de contacto Y configurar las opciones.
 Es imprescindible que configures la dirección de EMil
(en algunas plantillas los envía al mail de administración en otras hay que
configurarlo.

Publicáis y listo, ya podéis ir a ver como queda. Para ver un ejemplo pulsa aquí, y lo verás en la web de La poeta cubana Elba Rondón

Esta imagen es una captura de pantalla de la configuración del formulario de contacto, para verla más grande haga clik sobre la misma.

YoHagoWeb Las mejores chapuzas para webmasters principiantes.

Una chapuza para integrar páginas dinámicas. (Probada en Wordpress.)

¿Como puedo hacer para que uno de los botones de mi barra de navegación dirija a una url fuera de mi sitio?

Una chapuza para integrar páginas dinámicas. (Probada en Wordpress.)

Cada vez es más común usar sistemas de dinámicos de administración de contenidos para los sitios web, incluso entre los webmasters principiantes; ya que utilidades como Joomla, Drupal, ó Wordpress, incluso phpbb , de uso gratuito y normalmente de código abierto son cada vez más fáciles de implementar y dan mejores resultados.

Son muchas las ventajas de este tipo de sistemas; pero ahora nos ocuparemos de una de sus dificultades para los principiantes; estas plataformas traen todas las funciones y la presentación prefabricadas lo cual facilita enormemente (en un principio) la construcción de sitios web, para cambiar la presentación basta con aprender un poco de css y un poco más para personalizar 100% el estilo. Para modificar la estructura de las plantillas deberemos tener conocimientos algo avanzados de php y muy avanzados si queremos modificar funciones. Estas son las causas por la cual muchos iniciados en la web no logran tener absoluto control de sus webs dinámicas.

Poco a poco desde YoHagoWeb iremos profundizando en las herramientas necesarias para modelar a nuestro gusto y adaptar a nuestras necesidades los distintos sistemas de administración de contenido web. Pero como este es un blog para principiantes, novatos incluso para quienes ven una computadora por primera vez y ya quieren administrar sus propias páginas, vamos a comenzar por una serie de chapuzas que no requieren conocimiento alguno y que solucionan problemas recurrentes. (Si, siempre hay mejores maneras de hacer las cosas, siempre alguien tiene un auto más potente, un barco más largo y por 500€ un webmaster profesional le dedicaría un par de horas a tu web.)

Aquí estamos para encontrar soluciones funcionales y que requieran pocos conocimientos. Para revindicar la Chapuza como cosa no perfecta que funciona bien.

Nuestra primer chapuza responde a una pregunta recurrente en los usuarios de Wordpress.

¿Como puedo hacer para que uno de los botones de mi barra de navegación dirija a una url fuera de mi sitio?

Hemos encontrado una solución que no requiere tocar php ni ninguna modificación de la utilidad instalada. (Lo probamos en Wordpress y funciona a la perfección, No así en la plataforma wordpress mu que ofrese wordpress.com)

Se trata simplemente de crear una nueva página con el titulo de la web de destino

y en el campo de insertar códigos pegar y modificar o escribir el siguiente:

Para leer el código con más claridad pulse sobre el.

También puedes usar esta solución para desde tu barra de navegación dirigir directamente a una descarga. Solo tienes que poner como url la dirección del archivo por ejemplo archivo.zip ó http://misitio.com/lalala.mp3 , .

YoHagoWeb El blog de las chapuzas para webmasters principiantes.