Programación Web
plantillas HTML programación de un sitio Web dinámico website design website designer
design website website design service website designs
website designing
website designers
real estate website design website designing software website layout design design a website design websites website design company website design software ecommerce website design corporate website design
professional website design
Flash website design affordable webite design

design your own website

cheap website design


designed websites

Es momento de presentar algunas nociones básicas sobre la programación de sitios Web. Ofrecemos una introducción al complejo mundo de la programación y sus tecnologías, como una forma de brindar orientación y de que Ud. acceda a los conceptos indispensables para comprender cómo se concreta y funciona un sitio Web.

HTML / XHTML / CSS

Todos los sitios Web se realizan en base a dos lenguajes de marcación, HTML o XHTML. Un lenguaje de marcación o de marcas es un lenguaje informático que permite estructurar el texto de un sitio Web. Un lenguaje de este tipo codifica un texto, lo que significa que, además del texto propiamente dicho, incluye marcas o etiquetas en las que se incluye información sobre la estructura del mismo. Se denomina lenguaje de marcación, entonces, porque emplea marcas que indican de qué manera organizar el contenido de un sitio Web.

HTML

El lenguaje de marcación más popular para realizar sitios Web es el HTML (HyperText Markup Language, o lenguaje de marcas hipertextuales). Las etiquetas son instrucciones sobre cómo organizar los datos (texto e imágenes) y cómo presentarlos. Estas descripciones se escriben entre corchetes triangulares (<>) en el contenido mismo de un sitio. A su vez, la mayoría de estas marcas deben abrirse y cerrarse en la parte correspondiente del texto. Así, por ejemplo, para señalar un párrafo nuevo hay que colocar la siguiente marca: <P> el párrafo en cuestión </P>;. Para cerrar una etiqueta se coloca una barra: /.

Las principales marcas para estructurar un documento son las siguientes:

<HTML>

Establece el comienzo del documento HTML para que el navegador que lo interpretará lo identifique como tal.

<HEAD>

Establece la cabecera del documento, la cual incluye información sobre éste que no se muestra en el navegador. La cabecera contiene las siguientes marcas:

business website design<TITLE> Señala el título.

designing a website<LINK> Señala las hojas de estilo (si la presentación se separa del texto).

<BODY>

Señala el cuerpo o contenido principal de un documento. Dentro del cuerpo hay otras etiquetas, por ejemplo:

website design templates<H1> hasta <H6> Marca un título o encabezado, en diferentes tamaños (de menor a mayor).

Florida website design<P> Señala un nuevo párrafo.

website design services<TABLE> Indica la presencia de una tabla.

graphic design websites<A> Señala que hay un hipervínculo, interno o externo al sitio Web.

website design and hosting<DIV> Establece el inicio de un área en el sitio.

webpage<IMG> Señala la presencia de una imagen.

webpage design<i> Indica que la tipografía va en itálica (cursiva).

website design firm<b> Indica que la tipografía va en negrita.

Es importante señalar que en muchos casos quienes emplean HTML para la realización de un sitio Web utilizan etiquetas presentacionales, tales como las relacionadas con la tipografía. En el mismo HTML no sólo se estructura el texto sino también se marca cómo debe presentarse ante los usuarios: colores, fondos, alineamiento, tipografías, cuerpo de la letra, etc. Actualmente los diseñadores Web prefieren, sin embargo, separar la estructura de un texto (párrafos, títulos, imágenes, listas, hipervínculos, entre otros aspectos) de la presentación del mismo, y para ello se emplean hojas de estilo, tal como explicamos luego.

Por otra parte, para realizar un sitio Web empleando HTML se necesita un editor de textos (aquel que acepta textos sin formato), tal como el Notepad, Wordpad, Textpad o GNU Emacs, o se requiere de programas especiales para editar HTML, tales como el Dreamweaver de Adobe o el Microsoft FrontPage. Estos dos programas que permiten realizar sitios Web se llaman editores WYSIWYG, What You See Is What You Get o lo que ves es lo que obtienes. A diferencia de los editores de texto, estos programas permiten ver lo que se está haciendo a medida que se edita con HTML.

XHTML

El lenguaje de marcación XHTML (eXtensible HyperText Markup Language) es una reformulación del HTML, que busca convertirse en el estándar que lo reemplace para hacer sitios Web. Este lenguaje se emplea sólo para estructurar la información de un documento, no para incluir instrucciones sobre su presentación y visualización. El XHTML sigue la tendencia propuesta por la W3C (World Wide Web Consortium, organización que regula los estándares de Internet), según la cual es necesario separar el texto de su forma de presentarlo, como un modo de hacer sitios Web más accesibles.

Así, los aspectos de diseño gráfico se incluyen en las llamadas hojas de estilo, realizadas, por ejemplo, en lenguaje CSS (Cascading Style Sheets). De esta manera, un mismo texto puede tener diferentes estilos para distintos medios: computadoras, PDAs, teléfonos celulares, sintetizadores de voz, impresoras, etc. Esto aumenta la accesibilidad de los sitios, entendiendo por accesibilidad la facilidad para que un dispositivo sea accedido por todas las personas, especialmente aquellas con discapacidades diferentes, ya que un sitio Web en el que el texto y la presentación están separados puede ser leído por un dispositivo de lectura en voz alta o por el sistema Braille de forma más sencilla. Además, un mismo texto puede tener diseños muy diferentes aún en un mismo medio.

El lenguaje XHTML puede ser interpretado por la mayoría de las últimas versiones de los navegadores (Opera, Mozilla Firefox, Netscape, entre otros), aunque las versiones más viejas interpretan el XHTML como HTML. Un obstáculo importante para que el uso de XHTML se popularice es que el navegador Internet Explorer (de Microsoft) no lo lee. Sin embargo, dado que el XHTML responde cabalmente al estándar señalado por la W3C, continúa con su expansión.

Algunas diferencias que presenta el XHTML en comparación con el HTML son las siguientes: las etiquetas deben estar todas cerradas, deben ir en minúsculas y se deben emplear comillas para los atributos. Además, las imágenes deben llevar siempre un texto descriptivo, también para aumentar la accesibilidad de los sitios Web.

website designer

CSS

El CSS (Cascading Style Sheets) es uno de los lenguajes de estilo más utilizados. Las hojas de estilo, como explicamos anteriormente son instrucciones relacionadas con la presentación visual de un contenido. Por lo general son un archivo anexo al archivo de texto, ya que si bien se pueden incluir en el archivo HTML, esto resulta menos funcional.

El lenguaje CSS se emplea para la presentación de documentos escritos en HTML o XHTML. Permite especificar cómo se mostrará cada parte del texto -color, fuente, cuerpo, alineación, fondo, volumen de voz, etc.-. El CSS se organiza en capas que coinciden con las divisiones del texto en HTML. Cada capa tiene indicaciones específicas. El CSS incluye estas propiedades: de fuentes; de color y fondo; de texto (alineación, espaciado de palabras); de caja (margen, borde, relleno); de clasificación (listas, visualización).

Los beneficios de utilizar este lenguaje de estilo son varios. Por una parte, la actualización tanto de los contenidos como de los aspectos gráficos es más sencilla si texto y presentación están separados. Se pueden hacer modificaciones fácilmente, por ejemplo, de color, de fondo y de tipografía. Por otra, el grado de accesibilidad es mayor, dado que los usuarios pueden configurar la hoja de estilo de un sitio Web adecuada a sus necesidades. Así, las personas no videntes pueden emplear un sintetizador de voz o el sistema Braille con facilidad, dado que estos dispositivos funcionan mejor si el texto y la presentación visual están separados. También un sitio Web puede disponer de diferentes hojas de estilo, una para cada tipo de dispositivo (computadora, teléfono celular, impresora, etc). Por último, al emplear el lenguaje de estilo CSS u otro, el archivo de HTML tiene un tamaño menor y los navegadores pueden leer más sencillamente un sitio Web.

Programación Web Sitio Web estático

Un sitio Web estático es aquel cuyo contenido no cambia con frecuencia, ni presenta animaciones ni interactúa con los usuarios. Por eso a un sitio de este tipo se lo denomina estático. Un sitio Web realizado sólo en base a HTML y XHTML es estático. En este caso las actualizaciones las realiza una persona (generalmente el diseñador web) con una frecuencia reducida (ya que hacer cambios implica recargar el sitio), a través de un editor de texto o de un editor WYSIWYG.

Los sitios Web estáticos tienen, como todos los sitios, una dirección nominal (URL) con la cual los usuarios los buscan mediante su navegador. Ud. puede preguntarse cuál es el modo en que se llega a ver un sitio Web. Pues bien, el navegador pide a los servidores Web un sitio (el pedido se denomina http, es decir, HyperText Transfer Protocol, protocolo de transferencia de información) a través de su dirección (URL), el servidor le envía al navegador el código de HTML o XHTML correspondiente, y éste se encarga de interpretar dicho código y permitir la visualización de un sitio en pantalla.

plantillas HTMLSitio Web dinámico

Aquí Ud. podrá saber por qué hoy en día los sitios Web dinámicos son los más populares. Un sitio dinámico puede presentar animaciones, sonido, videos, interactividad, foros, encuestas, chat, personalización y actualización constante de la información. El contenido -el texto, las imágenes, los formularios y cuadros- puede cambiar en distintos contextos y ante diferentes usuarios. Existen diferentes tecnologías para dar dinamismo a un sitio web: Flash, Javascript, ASP, ASP.NET, Perl y PHP son algunas de las más empleadas.

El dinamismo de un sitio puede estar en su presentación o aspecto visual, en su capacidad de carga de la información, o en ambas partes. En el primer caso se emplean tecnologías tales como Flash o Javascript para incorporar a sitios hechos en HTML sonido, videos, textos cambiantes y animaciones. Estos dos lenguajes, al igual que el HTML y el XHTML son denominados “del lado del cliente” (client-side), ya que son interpretados por la computadora receptora y no por el servidor de un sitio. Esto quiere decir que para que un usuario pueda acceder a un sitio Web dinámico su navegador debe ser capaz de leer Flash o Javascript, de lo contrario, no podrá visualizar el sitio correctamente. Cuando el usuario escribe la dirección de un sitio de estas características a través de un navegador, el servidor del sitio recibe el pedido y envía un código a ser interpretado por el navegador. Pueden surgir inconvenientes si el navegador no soporta Flash o Javascript.

En el segundo caso, cuando el dinamismo de un sitio Web está en la capacidad de carga de la información, éste se suele crear mediante lenguajes “del lado del servidor” (server-side): ASP, ASP.NET, PHP y Perl, por ejemplo. Los sitios Web así creados también pueden incluir presentaciones en Flash y Javascript. Los lenguajes de este tipo son aquellos por los cuales es el servidor de un sitio y no el navegador del usuario el que ejecuta el documento en HTML o XHTML. Los sitios Web dinámicos de este tipo tienen la capacidad de actualizar constantemente la información de forma realmente sencilla.

Le presentamos una breve descripción de las principales tecnologías con las que se realizan sitios Web dinámicos:

Flash

Flash es un programa multimedia de Adobe que se utiliza para crear presentaciones animadas. Se trata de una aplicación “del lado del cliente” que es leída por los principales navegadores. Las animaciones se realizan a partir de vectores y de imágenes en base a píxeles (llamadas “raster graphics”) y pueden incluir audio y video. Este programa es uno de los más utilizados para animar sitios Web y permitir la interactividad.

JavaScript

JavaScript es un lenguaje de programación para crear sitios Web con presentaciones dinámicas. También se trata de una aplicación “del lado del cliente”, dado que es el navegador del usuario el que interpreta y ejecuta el lenguaje JavaScript, es decir, sus instrucciones. Esto significa que si el navegador no soporta este lenguaje el usuario no podrá visualizar las presentaciones dinámicas de un sitio Web. De todos modos, los navegadores más populares, tales como Internet Explorer o Netscape (especialmente en sus últimas versiones), leen JavaScript sin problemas.

Este lenguaje permite crear sitios con efectos especiales, elementos con movimiento y cambios de color, sonido, y también permite lograr sitios interactivos, con tablas de cálculo, personalización, agendas, calculadoras y otras formas de comunicación con el usuario. El lenguaje JavaScript es relativamente sencillo de utilizar. Las instrucciones se suelen incluir en el documento HTML, con la etiqueta <script>

ASP / ASP.NET

ASP (Active Server Pages) es un lenguaje de programación de Microsoft “del lado del servidor”, con el cual se realizan sitios Web dinámicos. Generalmente se comercializa junto con el servidor ISS (Internet Information Server). Se llama ASP clásico a las versiones 1.0, 2.0 y 3.0, es decir a las previas al ASP.NET. Al crear sitios con este lenguaje se combina HTML con las instrucciones ASP. También se pueden emplear tecnologías como Flash y JavaScript junto con ASP y HTML.

A partir del año 2002 Microsoft lanzó al mercado el lenguaje ASP.NET. Este lenguaje es más ordenado que el ASP, dado que se separa el contenido de un sitio de su comportamiento dinámico. Por otra parte, una restricción del ASP y del ASP.NET es que este lenguaje sólo puede ser ejecutado en el sistema operativo Windows.

PHP

Se trata de un lenguaje de programación que se emplea para la creación de sitios Web dinámicos. Su nombre proviene de PHP Hypertext Pre-processor, a la vez que PHP significa Personal Home Page. El código PHP se incluye dentro del HTML, con etiquetas especiales. Es una tecnología “del lado del servidor”, ya que éste es el que interpreta y ejecuta el código PHP de un sitio dinámico. El navegador solamente recibe la ejecución. Entre sus principales ventajas podemos señalar que:

programación de un sitio Web dinámicoEs un lenguaje que puede ejecutarse en diferentes sistemas operativos (Linux, Windows y Macintosh) y en los servidores más populares.

website designPermite programar sitios con contenido dinámico, combinándolo con los principales servidores de bases de datos, entre ellos MySQL. De esta manera los sitios desarrollados con PHP presentan no sólo un gran dinamismo sino también un excelente manejo de datos. Por ello este lenguaje es ideal para crear sitios Web catálogos.

website designerEs un lenguaje libre y, por ende, accesible a todas las personas.

Perl

Perl es un lenguaje de programación que actualmente se emplea para el diseño de sitios web, pero que en un principio se utilizaba para procesar texto. Su nombre significa Practical Extraction and Report Language, es decir, lenguaje práctico para la extracción e informe. Se trata de un lenguaje fácil de usar y muy eficiente, que tiene un excelente sistema de procesamiento de texto. Este lenguaje es una aplicación también “del lado del servidor” y, por otra parte, puede ejecutarse en el sistema operativo Linux.


design website

Visita nuestras páginas amigas

website design service

Web design help center

website designs

Web design service

website designing

Web design

website designers

web design 101

real estate website design

webdesigner

website designing software

website layout design

Diseñadores Web | Importancia Diseño Web | Diseño Grafico | Programacion Web | Navegabilidad | SEO | Contactar Diseñadores | Vinculos

design a website

Diseño Web por Log Technology