CREACIÓN DE LAS PAGINAS WEB
- ¿CUÁL ES EL ORIGEN DE LA PÁGINA WEB Y DE DONDE DERIVA DEL DICHO NOMBRE?
Web se remonta a la propuesta de Vannevar Bush en
los años 40 sobre un sistema similar: a grandes rasgos, un entramado de
información distribuida con una interfaz operativa que permitía el acceso tanto
a la misma como a otros artículos relevantes determinados por claves. Este
proyecto nunca fue materializado, quedando relegado al plano teórico bajo el
nombre de Memex.
Es en los años 50 cuando Ted Nelson realiza
la primera referencia a un sistema de hipertexto, donde la información es
enlazada de forma libre. Pero no es hasta 1980, con un soporte operativo tecnológico
para la distribución de información en redes informáticas, cuando Tim Berners-Lee propone
ENQUIRE
al CERN
(refiriéndose a Enquire Within Upon Everything, en
castellano Preguntando de Todo Sobre Todo),
donde se materializa la realización práctica de este concepto de incipientes
nociones de la Web.
2.¿QUÉS ES UNA PÁGINA WEB Y CUALES SON SUS ELEMENTOS?
Una página web es un documento que incluye un archivo HTML con texto, imágenes, videos, animaciones Flash, etc. Al conjunto de páginas web que suelen formar parte del mismo dominio o subdominio de Internet se lo conoce como sitio web. Dentro del sitio web, todas las páginas guardan alguna relación entre sí y están vinculadas mediante vínculos (también conocidos como enlaces, hipervínculos, hiperenlaces o links). Una
ventana muestra al usuario la información que desea, en forma de texto y
gráficos, con los enlaces marcados en diferente color y subrayados. Haciendo un
clic con el ratón se puede "saltar" a otra página, que tal vez esté
instalada en un servidor al otro lado del mundo. El usuario también puede
"navegar" haciendo pulsando sobre las imágenes o botones que formen
parte del diseño de la página.
3.¿CUÁLES SON LOS TIPOS DE PAGINA WEB EXISTENTES?
3.1 Página Web Estática.
3.3 Página Web Dinámica.
3.4 web estructurada.
3.5 Portal.
3.6 Página Web con Gestor de Contenidos.
4.¿QUÉ SIGNIFICA EL CODIGO O PARA QUE SIRVE HTML?
HTML es un lenguaje de marcado que se utiliza para el desarrollo de páginas de Internet. Se trata de la sigla que corresponde a HyperText Markup Language, es decir, Lenguaje de Marcas de Hipertexto, que podría ser traducido como Lenguaje de Formato de Documentos para Hipertexto.
5.¿QUÉ ES UN DOMINIO DE PAGINA WEB?
Un dominio en términos generales es un nombre que puede ser alfanumérico que generalmente se vincula a una dirección física que generalmente es una computadora o dispositivo electrónico.
Generalmente se utilizan para representar las direcciones de las páginas web’s. Puesto que Internet se basa en direcciones IP (Protocolo de Internet) que en terminos simples se puede decir que son los números de conexión de cada computadora que esta conectada a internet.
6.¿EN LA ACTUALIDAD PARA QUE SE UTILIZA LAS PAGINAS WEB?
Para promocionar sus productos, para informar a sus clientes, para ofrecer información, realizar ventas, compartir fotos, organizar los recursos de una empresa.
Desde el punto de vista de la utilidad una página web puede cubrir muchas necesidades. Todo depende de qué se necesite y cómo se diseñe.
Un portal de noticias y una tienda en línea de libros tienen en común que son una
página web, pero ambas se diseñan y gestionan de manera diferente, cubren necesidades distintas, y generan un retorno de inversión por caminos distintos. La interacción de los usuarios con la página es también distinta.
7.¿CÓMO DEBE SER CONFIGURADA UNA PAGINA WEB?
Para tener una página web correctamente configurada, además de los archivos básicos para su funcionamiento, es necesario añadir algunos archivos adicionales que ayudarán a la puesta en marcha de la web en el servidor e indicarle a Google que es lo que tiene que indexar de una página web.
1. El archivo .htaccess
El archivo htaccess.txt es un documento de texto especial que comenzó a usar Apache desde sus inicios y se utiliza para configurar una página web en el servidor mediante instrucciones. Se puede modificar mediante el editor de texto de Windows o cualquier otro programa para editar texto como Notepad++.
El uso de este archivo es muy extenso y va desde la restricción de seguridad en directorios hasta el control de la caché del servidor. En este artículo te voy a hablar de los 3 usos más comunes que puedes darle a este archivo para tener tu web configurada correctamente.
En un servidor remoto, para que el archivo htaccess.txt funcione correctamente es necesario renombrarlo como .htaccess.
a. Código de WordPress
Una vez instalado WordPress en un servidor remoto, dirígete a Ajustes >> Enlaces permanentes. En “Ajustes comunes” selecciona “Nombre de la entrada” y automáticamente WordPress asignará el texto /%postname%/ en el campo “Estructura personalizada”. Adicionalmente, WordPress creará el archivo .htaccess en el servidor con el siguiente código:
2 | <IfModule mod_rewrite.c> |
5 | RewriteRule ^index\.php$ - [L] |
6 | RewriteCond %{REQUEST_FILENAME} !-f |
7 | RewriteCond %{REQUEST_FILENAME} !-d |
8 | RewriteRule . /index.php [L] |
Con estas líneas de código ya se ha configurado el uso de WordPress para URL’s amigables.
b. Redirección del dominio sin www o con www
Esta regla se utiliza para forzar el uso del dominio con o sin las www. Esto es muy recomendable y “casi obligatorio” hacerlo ya que Google actualmente detecta las páginas con www y sin www como dos páginas diferentes y para el posicionamiento SEO lo considera como contenido duplicado siendo muy penalizable.
Si quieres tú dominio sin www (http://tudominio.com/) añade el siguiente código en .htaccess:
2 | RewriteCond %{HTTP_HOST} . |
3 | RewriteCond %{HTTP_HOST} !^www.tudominio.com\.com |
4 | RewriteRule (.*) tudominio.com/$1 [R=301,L] |
Si quieres tú dominio con www (http://www.tudominio.com/) añade el siguiente código en .htaccess:
2 | RewriteCond %{HTTP_HOST} ^tudominio.com [NC] |
3 | RewriteRule ^(.*)$ http: |
Aunque algunos programadores suelen recomendar el uso del dominio sin www por ser la URL más corta, a mi en lo personal me gusta con www. Desde mi punto de vista creo que es algo relativo y a gusto de cada quien ya que por los momentos no he encontrado diferencias con el uso de esta regla en sus dos variantes.
c. Redirección de una página interna
Otro de los motivos de penalización por parte de Google es el típico error 404. Este error es generado por algún fallo humano al momento de añadir un enlace en un texto y otras veces por alguna página interna que ha dejado de existir.
Para solventar este fallo y evitar ser penalizados por Google existe el redireccionamiento 301 que se puede configurar en .htaccess (solo para servidores que funcionen con Apache) añadiendo el siguiente código:
2 | redirect permanent /pagina-vieja/ http: |
(Si estás usando el redireccionamiento del dominio con www)
2 | redirect permanent /pagina-vieja.html http: |
(Si estás usando el redireccionamiento del dominio sin www)
En el formato .txt el símbolo “#” se utiliza para añadir comentarios. La primera línea, #Redireccion 301, es solo un comentario que indica lo que la siguiente línea de código va a hacer. Puedes buscar en Google más información sobre el archivo .htaccess para ver que otro tipo de funciones te puede brindar para configurar tu página web.
2. El archivo robots.txt
Este es un fichero de texto que se utiliza para configurar una página web y se aloja en la raíz del servidor para indicarle a los buscadores cuales son los “bots” que tienen acceso a rastrear la web y cuáles no. A diferencia del archivo .htaccess el archivo robots se aloja sin ser renombrado, es decir, el archivo tendrá el nombre robots.txt.
Los buscadores o “crawlers” son básicamente robots que acceden a los sitios webs para buscar información en ellas, indexarlas y mostrarlas luego en sus resultados de búsqueda.
Los robots más utilizados son:
- Googlebot: Es el nombre del crawler para el buscador de Google.
- Mediapartners-Google: Es el crawler de Google encargado de comprobar un página de destino como una Landing Page.
- Adsbot-Google: Es el crawler de Google encargado de revisar los anuncios de AdWords.
- Googlebot-Image: Es el robot que indexa las imágenes en Google.
- Bingbot: Es el crawler encargado de indexar las páginas de Bing.
La regla más básica para permitir a todos los robots rastrear una página viene dada por:
El * significa que se le permite la entrada a cualquier robot. Si solo deseas permitir el acceso a uno en específico, sustituye el * por el nombre del robot:
Si quieres restringir el rastreo de cualquier robot a tu web o a un directorio en concreto, escribe el nombre de este directorio a continuación de Disallow:
2 | Disallow: / (Se restringe el rastreo a todo tu sitio) |
2 | Disallow: /cgi-bin/ (Se restringe el rastreo al directorio /cgi-bin/) |
Es posible combinar varias instrucciones Disallow para un mismo robot pero nunca se podría combinar la instrucción que restringe a todo el sitio con un directorio a la vez:
Una instrucción adicional que puedes añadir al archivo robots.txt es el sitemap:
Uniéndolo todo en un solo archivo robots.txt, típico en una instalación de WordPress, quedaría de la siguiente manera:
4 | User-agent: Adsbot-Google |
7 | User-agent: Mediapartners-Google |
10 | User-agent: Googlebot-Image |
17 | Disallow: /cgi-bin/ (Algunos servidores lo suelen incluir) |
19 | Disallow: /wp-includes/ |
20 | Disallow: /wp-content/plugins/ |
21 | Disallow: /wp-content/cache/ |
22 | Disallow: /wp-content/themes/ |
23 | Disallow: /wp-login.php |
24 | Disallow: /wp-register.php |
3. Sitemap de Google
El sitemap.xml es un archivo que se utiliza para configurar una página web en el que se indican, mediante un formato específico, todas las páginas que componen tu sitio y que quieres que sean indexadas.
Este archivo, aunque no es obligatorio, es muy recomendable crearlo ya que, si no existe o no se indica lo contrario en el archivo robots.txt, los buscadores indexarán todo lo que encuentren en tu sitio web y en un futuro es posible que tengas problemas de indexación y errores 404.
El formato básico para la creación de un sitemap.xml viene dado por:
1 | <urlset xmlns="http://www.google.com/schemas/sitemap/0.9"> |
4 | <priority>1.0</priority> |
5 | <lastmod>2017-05-01</lastmod> |
6 | <changefreq>monthly</changefreq> |
10 | <priority>0.9</priority> |
11 | <lastmod>2017-05-01</lastmod> |
12 | <changefreq>monthly</changefreq> |
16 | <priority>0.9</priority> |
17 | <lastmod>2017-05-01</lastmod> |
18 | <changefreq>monthly</changefreq> |
22 | <priority>0.9</priority> |
23 | <lastmod>2017-05-01</lastmod> |
24 | <changefreq>monthly</changefreq> |
Cuando tienes una página web, es muy recomendable darte de alta en Google Search Console ya que te permitirá mantener tu web correctamente configurada y te avisará de posibles errores. Esta herramienta cuenta con un apartado para dar de alta el sitemap.xml de tu página web. Incluso tienes la posibilidad de crear varios sitemap si tu web es muy extensa y dividirlos en categorías, pdf, videos o como mejor lo prefieras.
Conociendo estas 3 técnicas fundamentales, podrás configurar una página web correctamente sin cometer errores. Estas técnicas son de gran utilidad y muy sencillas de implementar. Aunque ninguna es obligatoria, es muy recomendable crearlas y configurarlas correctamente para el buen funcionamiento de tu página web.
