Foros del Web » Creando para Internet » Diseño web »

Hablemos de Lenguajes

Estas en el tema de Hablemos de Lenguajes en el foro de Diseño web en Foros del Web. Para los que se inician en esto del diseño web. (Los primeros 5 posts van a estarse editando) Programación o etiquetado ¿? Programación es un ...
  #1 (permalink)  
Antiguo 12/05/2009, 16:59
Avatar de Rafael
Modegráfico
 
Fecha de Ingreso: marzo-2003
Mensajes: 8.954
Antigüedad: 14 años, 9 meses
Puntos: 1802
Hablemos de Lenguajes

Para los que se inician en esto del diseño web. (Los primeros 5 posts van a estarse editando)

Programación o etiquetado ¿?

Programación es un conjunto de instrucciones que se escriben para que sean ejecutadas. El diseño web, desde el punto de vista meramente de diseño gráfico no incluye instrucciones, solamente etiquetado.

Un ejemplo simple:
Etiquetado:
<rojo>Esto es un texto rojo</rojo>

Programado:
<rojo comportamiento=onMouseOver.this.rojo>Cuando pases el mouse acá el texto será rojo</rojo>

La diferencia es que la programación está orientada a que sucedan cosas cuando el usuario haga cosas. El etiquetado solamente identifica cosas. (perdón por tanto cosas, pero es para hacerlo coloquial)

Última edición por Rafael; 12/06/2010 a las 08:34
  #2 (permalink)  
Antiguo 12/05/2009, 17:00
Avatar de Rafael
Modegráfico
 
Fecha de Ingreso: marzo-2003
Mensajes: 8.954
Antigüedad: 14 años, 9 meses
Puntos: 1802
Respuesta: Hablemos de Lenguajes

¿Quién es quién...?

Etiquetado

HTML: El lenguaje básico para internet, es un lenguaje de etiquetado (markup). Simplemente marcas secciones de textos o bloques como <p>"esto es un párrafo"</p> y <h1>"esto es un título"</h1>.

XML: Es un lenguaje mucho más abierto que el html. En aquel tienes un cierto número de etiquetas específicas: párrafos, títulos, tablas... pero en xml puedes inventar tus propias etiquetas. El ejemplo <rojo>Texto rojo</rojo> es una etiqueta xml válida, porque se me pegó la gana, pero no existe en html.
Ciertamente no ocupas xml como tal en páginas web (normales), sino html, pero es importante saber que esto existe.

XHTML: Ajá, ¿por qué saber que existe la cosa anterior? Pues porque el Xhtml es una variación del html pero basado en la correcta sintáxis del XML, donde hay que escribir las cosas bien. Html permite anidar chueco, xhtml no, entre otras cosas.
Html: <p><b>Texto en bold</p></b>
Xhtml <p><b>Texto en bold</b></p>

Pues hasta ahí no hay nada de programación. Puro etiquetado.

Update: Esto lo escribí en el 2009. En el 2013 el Xhtml ya está obsoleto, pero buenas prácticas aprendidas funcionan con el HTML5.


Programación

JavaScript:Cuando ves que pasan cosas en una página de internet, un menú que se abre cuando pasas el ratón en un link, los formatos que puedes usar en este mismo foro, al usar el modo avanzado para escribir un post, y cosas así, el primer lugar donde revisar es un posible JavaScript. Hay una variante llamada Jscript. Pero a grandes rasgos lo podemos considerar Javascript. Casi todos los navegadores pueden interpretar este lenguaje directamente, a diferencia de los que siguen.

Update2: Algunos efectos de menús bonitos y cosas que salen volando, animaciones son ya elaboradas con Css3.

ActionScript:Es el lenguaje utilizado para que sucedan cosas dentro de Flash. A diferencia del Html, Css y JavaScript, ActionScript es propiedad de una empresa y hay que utilizar software propietario para elaborarlo. Cabe aclarar que Flash es una cosa aparte del html, por eso hay que instalar el flash player en nuestra computadora de manera independiente al navegador, aunque interactúe completamente con la página html que lo contiene.


¿Dónde es dónde...?

De tu lado

En tu pc puedes ver páginas Html y htm (Que son lo mismo). Quizá uses estilos con Hoja de estilos; Css, y quizá tengas un comportamiento por ahí JavaScript. Ya usaste algo de Flash, ActionScript. Estos lenguajes son procesados en la computadora del usuario, "Lenguajes del lado del Cliente", pero hay otros que se trabajan en el servidor donde se hospeda la página "Lenguajes del Lado del Servidor".

del otro lado

Un Servidor http://es.wikipedia.org/wiki/Servidor no es solamente una computadora que hospeda una página en algún lugar, sino que tiene un programa llamado Servidor Web http://es.wikipedia.org/wiki/Servidor_web (a poco), o sea el que entrega (sirve) las páginas cuando se solicitan. El ejemplo más conocido y usado es Apache http://www.apache.org/.

Adicionalmente hay otros lenguajes que corren en estos servidores, el más usado es Php http://www.php.net/.

Este es usado por ejemplo, para procesar información enviada por un formulario Html para enviarla a un correo electrónico, para generar páginas automáticamente desde bases de datos, para procesar solicitudes a estas bases, contadores, etc...

Estos archivos pueden ser semejantes a uno html con algunos JavaScripts metidos, solo que la extensión debe ser .php en vez de .html, para que el servidor entienda que debe buscar código específico para procesarlo de manera especial.

Algunos de estos lenguajes son:
Php
Python
Asp
Perl
ColdFusion
Java (del lado del servidor)


y ¿Contenido y forma...?

Por un lado la estructura la defines con el HTML que ya comentamos. Esta estructura, junto con el mismo texto forman el contenido.

Pero hay que separar contenido de la forma. La forma, el cómo se ve tu sitio, está definido por una hoja de estilos.

CSS: Como diseñador este es donde hay que poner atención, este es un lenguaje para dar estilo (forma) al etiquetado html.
"Tal título debe tener una letra grande y roja, y cargado a la derecha, con una letra bonita..."
h1 {size: big; color: red; text-align: right; font-family: vivaldi;}

Última edición por Rafael; 12/11/2013 a las 08:34
  #3 (permalink)  
Antiguo 12/05/2009, 17:00
Avatar de Rafael
Modegráfico
 
Fecha de Ingreso: marzo-2003
Mensajes: 8.954
Antigüedad: 14 años, 9 meses
Puntos: 1802
Respuesta: Hablemos de Lenguajes

Datos y datos

En el servidor, una de las principales aplicaciones es trabajar con una base de datos (bdd). Tu correo electrónico está en una bdd, las palabras que buscas en un diccionario en linea, la búsqueda de Yahoo o Google, las noticias de un servicio de información.

Cada sistema de base de datos tiene su propio lenguaje. Uno común es MySql. Este normalmente trabaja en conjunto con otros, por ejemplo Php, que a su vez recibe los datos del html, quizá del Javascript.

Las bases de datos pueden estar catalogados como lenguajes de peticiones (query languages).

Otro sistema de base de datos común es Postgre Sql.


Y de aquí y de allá
Hay tecnicas que combinan varios de los lenguajes que ya mencionamos, por ejemplo Dhtml combina JavaScript con Html y Css para generar páginas con animaciones, pero hay otras que van más allá.

Ajax puede utilizar JavaScript para tomar datos de un servidor e interactuar más efectivamente, con estos datos, con el usuario.

Última edición por Rafael; 27/06/2010 a las 11:41
  #4 (permalink)  
Antiguo 12/05/2009, 17:01
Avatar de Rafael
Modegráfico
 
Fecha de Ingreso: marzo-2003
Mensajes: 8.954
Antigüedad: 14 años, 9 meses
Puntos: 1802
Respuesta: Hablemos de Lenguajes

Herramientas

¿Y qué necesito para trabajar con lenguajes?

Editor
Para la mayoría de estos lenguajes necesitas 1 herramienta instalada en tu computadora, un block de notas.

En la práctica un block de notas a veces no es suficiente, por lo que hay los llamados editores de código, estos lo que hacen normalmente es primero resaltar en diferentes colores lo que es etiqueta o instrucciones y lo que es texto plano <estoEsEtiqueta>Esto es texto plano</estoEsEtiqueta>

Algunos otros quizá nos ayuden a completar alguna instrucción o revisarlas, de manera semejante a un corrector ortográfico.

Y existen los llamados editores gráficos o "Lo que ves es lo que tienes" (wyswyg por sus siglas en inglés), aunque en muchos casos generan un código no muy adecuado.

Aplicación para hacer pruebas
Necesitamos alguien que visualice lo que estamos escribiendo. Normalmente el navegador es suficiente, ahí vemos la página que estamos haciendo. Es recomendable hacer pruebas en varios navegadores, ya que estos reaccionan un poco (o endemoniadamente) diferente a ciertas instrucciones.

Probablemente un servidor
En otros casos, como en los lenguajes del lado del servidor, necesitamos... pues un servidor y el intérprete del lenguaje específico (ejemplo: apache+php). Podemos instalarlos localmente en nuestra computadora para desarrollar más rápidamente, incluso sin estar conectados a internet. Muchos podemos descargarlos de manera gratuita.

Y en otros más, como Flash necesitaremos comprar un programa propietario, además de instalar el respectivo plug in a mi navegador para ver el resultado.

Última edición por Rafael; 06/11/2011 a las 10:52
  #5 (permalink)  
Antiguo 12/05/2009, 17:02
Avatar de Rafael
Modegráfico
 
Fecha de Ingreso: marzo-2003
Mensajes: 8.954
Antigüedad: 14 años, 9 meses
Puntos: 1802
Respuesta: Hablemos de Lenguajes

Complementando un poco

Work with Frameworks, (Trabajemos con Frameworks)

Hay gente que se preocupa por nosotros, y ha elaborado rutinas o librerías que nos ayudan a hacer cosas interesantes de manera más fácil.
Supongamos que queremos que una imagen aparezca con una disolvencia y se mueva de arriba para abajo... bueno, se puede hacer en JavaScript... pero no tengo ni idea de cómo hacerlo... Pero con un Framework, la mayoría de las rutinas estarán definidas; quizá simplemente yo le indique la velocidad de la transición y la dirección del movimiento...

Algunos Frameworks útiles son JQuery y Mootools.

Otras cosas

Hay otros lenguajes como Java, o más recientemente Adobe Air, que a veces no requieren un navegador para poder trabajar. Estas pueden hacer aplicaciones independientes, que también pueden interactuar en internet.

Última edición por Rafael; 11/10/2010 a las 02:12
  #6 (permalink)  
Antiguo 13/05/2009, 00:00
Avatar de buzu  
Fecha de Ingreso: octubre-2006
Ubicación: San Francisco, CA
Mensajes: 2.168
Antigüedad: 11 años, 1 mes
Puntos: 122
Respuesta: Hablemos de Lenguajes

Buena iniciativa, solo mencionar que CSS no es un lenguaje de etiquetado o enmarcado o markup, es un lenguaje de estilos, o como algunos lo llaman, de formato. Es una categoría totalmente aparte.

Saludos.
__________________
twitter: @imbuzu
  #7 (permalink)  
Antiguo 13/05/2009, 10:42
Avatar de Rafael
Modegráfico
 
Fecha de Ingreso: marzo-2003
Mensajes: 8.954
Antigüedad: 14 años, 9 meses
Puntos: 1802
Respuesta: Hablemos de Lenguajes

Cierto, ya lo separé un poco de html y xml...
  #8 (permalink)  
Antiguo 13/05/2009, 13:20
 
Fecha de Ingreso: marzo-2009
Mensajes: 291
Antigüedad: 8 años, 8 meses
Puntos: 9
Respuesta: Hablemos de Lenguajes

Lei todo el post.. pero tengo una duda, si quiero iniciarme en este mundo.. deberia aprender primero html y sus variantes o puedo pasar directamente a css? que es recomendable?? gracias por el aporte..me aclaraste varias puntos, saludos
  #9 (permalink)  
Antiguo 13/05/2009, 13:27
Avatar de David
Moderador
 
Fecha de Ingreso: abril-2005
Ubicación: In this planet
Mensajes: 15.711
Antigüedad: 12 años, 7 meses
Puntos: 833
Respuesta: Hablemos de Lenguajes

No puedes pasarte directamente a CSS ya que la hoja de estilos la vas a usar para cambiar la presentación del contenido marcado con HTML.
__________________
Por favor, antes de preguntar, revisa la Guía para realizar preguntas.
  #10 (permalink)  
Antiguo 13/05/2009, 13:29
Avatar de lobo_php  
Fecha de Ingreso: noviembre-2007
Ubicación: Cali-Colombia
Mensajes: 1.869
Antigüedad: 10 años
Puntos: 75
Respuesta: Hablemos de Lenguajes

emmm css es sencillo debes aprender a poner las cosas con html y luego ponerle el estilo con css.
__________________
Cabuntu.org - Difundiendo Software Libre en Cali, Colombia
Usuario Linux # 483175
  #11 (permalink)  
Antiguo 13/05/2009, 16:43
Avatar de Rafael
Modegráfico
 
Fecha de Ingreso: marzo-2003
Mensajes: 8.954
Antigüedad: 14 años, 9 meses
Puntos: 1802
Respuesta: Hablemos de Lenguajes

Lo básico es html para estructurar tu contenido. Imagína el íncice de un libro te texto.

Capítulo I La naturaleza
-El universo
-La tierra

Capítulo 2 La Vida
-Evolución

Bueno, esa estructura la defines con Html

La forma la das con css

Capítulo I La naturaleza
-El universo
-La tierra

Capítulo 2 La Vida
-Evolución
  #12 (permalink)  
Antiguo 13/05/2009, 17:19
Avatar de pitufoweb  
Fecha de Ingreso: enero-2008
Ubicación: Un Mundo Raro
Mensajes: 1.148
Antigüedad: 9 años, 10 meses
Puntos: 181
Respuesta: Hablemos de Lenguajes

Cita:
Iniciado por Rafael Ver Mensaje
Cada sistema de base de datos tiene su propio lenguaje. Uno común es MySql. Este normalmente trabaja en conjunto con otros, por ejemplo Php, que a su vez recibe los datos del html, quizá del Javascript.
Hola, antes de todo quiero darte las gracias por la información que nos brindas.

Entiendo muy poco de programación así que no me hagas mucho caso.


Tengo entendido que MySql es un sistema y no un lenguaje. O tal ves es que no entendí bien.





Saludos
__________________
------------- " La felicidad no llega de afuera, nace desde dentro. " -------------
  #13 (permalink)  
Antiguo 13/05/2009, 21:16
Avatar de buzu  
Fecha de Ingreso: octubre-2006
Ubicación: San Francisco, CA
Mensajes: 2.168
Antigüedad: 11 años, 1 mes
Puntos: 122
Respuesta: Hablemos de Lenguajes

de hecho, pitufo web, tienes toda la razón. MySQL es un sistema de manejo de bases de datos, más concrétamente, es uno de los llamados RDBMS (Relational Date Base Managment System).

No se considera un lenguaje de programación ya que, técnicamente no puede usarlo para programar como es por ejemplo el caso de php.

Un lenguaje de programación es aquel que puedes usar para crear programas ya sean simples o complejos. En el caso de MySQl, este no nos sirve para crear programas, pero para gestionar bases de datos. MySQL es una"extención" de SQL (Structured Query Language) y su ubicación sería más acertada en query languages (literalmente: lenguajes de peticiones) que en lenguajes de programación.
__________________
twitter: @imbuzu
  #14 (permalink)  
Antiguo 16/05/2009, 14:06
Avatar de Rafael
Modegráfico
 
Fecha de Ingreso: marzo-2003
Mensajes: 8.954
Antigüedad: 14 años, 9 meses
Puntos: 1802
Respuesta: Hablemos de Lenguajes

Perfecto, ya actualizé esa sección con esa nueva nota, query languages.
  #15 (permalink)  
Antiguo 16/05/2009, 14:34
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: Hablemos de Lenguajes

Hola:

Muy buen aporte, todo bien explicado y clarito. Debería estar en las FAQ.

Saludos.

  #16 (permalink)  
Antiguo 16/05/2009, 21:29
Avatar de Rafael
Modegráfico
 
Fecha de Ingreso: marzo-2003
Mensajes: 8.954
Antigüedad: 14 años, 9 meses
Puntos: 1802
Respuesta: Hablemos de Lenguajes

Gracias.

Ya tiene un link:
http://www.forosdelweb.com/f91/pregu...4/#post1687220
En la sección: Quiero hacer mi página web ¿por dónde empezar? (Primeros pasos)
  #17 (permalink)  
Antiguo 17/05/2009, 14:32
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: Hablemos de Lenguajes

Hola:

Por no mirar antes de 'hablar'.

Saludos.

Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta

SíEste tema le ha gustado a 6 personas




La zona horaria es GMT -6. Ahora son las 03:57.