Aprendiendo HTML con ZetLaX

Definir variables y constantes en PHP

2011-11-02T16:29:00.000-06:00

VARIABLES

Para definir variables en PHP es necesario comenzar con el signo de dolar, estás variables no pueden comenzar con un número ni con espacio, podemos definir una variable de la siguiente forma:

$hacerEscalaGrises;
$hacerAlgo;
$3voy; --> Incorrecto no puedes comenzar con número
$voy corriendo; -->Incorrecto no puede tener espacios.

Lo que les puedo recomendar que cuando creen una variable utilicen la primera palabra con un verbo de la acción de la variable y que comience con minúscula y la segunda palabra que sea con mayúscula, está es la manera en que los programadores de todo el mundo usan habitualmente las variables otra forma es colocando un _ "guion bajo".

Ejemplos:

$obtenerNombre;

$traer_Datos;

CONSTANTES

Las constantes tienen las mismas características que las variables solo que las constantes no cambian su valor durante la ejecución del programa. Para declararlas se realiza de la siguiente manera:

declare("PI", "3.14159");

declare("mi_Nombre","ZetLaX");

11. Cuadro de texto

2011-10-27T21:13:00.000-05:00

Se trata del elemento más utilizado en los formularios. En el caso más sencillo, se muestra un cuadro de texto vacío en el que el usuario puede escribir cualquier texto:

Figura 8.2. Ejemplo de etiqueta input (type=text)

A continuación se muestra el código HTML correspondiente al ejemplo anterior:

Nombre <br/>
<input type="text" name="nombre" id="nombre" value="" />

El atributo type="text" es donde indicamos que es una caja de texto, name="nombre" es el nombre que tendrá la caja de texto, value="" indica que la caja de texto "" tendrá en su caja de texto, el id="nombre" esté es igual que el name y es bueno indicarlo porque algunos navegadores utilizan el id y otros utilizan el name para identificar al control o elemento de la página.

10. Elementos de un formulario

2011-10-27T21:08:00.000-05:00

Los elementos de formulario como botones y cuadros de text. La mayoría de controles se crean con la etiqueta <input>, por lo que su definición formal y estos pueden ser sus atributos y/o características de los elementos:

<input>	Control de un formulario
Atributos comunes	básicos, i18n, eventos y foco
Atributos específicos	`type = "text \| password \| checkbox \| radio \| submit \| reset \| file \| hidden \| image \| button"` - Indica el tipo de control que se incluye en el formulario `name = "texto"` - Asigna un nombre al control (es imprescindible para que el servidor pueda procesar el formulario) `value = "texto"` - Valor inicial del control `size = "unidad_de_medida"` - Tamaño inicial del control (para los campos de texto y de password se refiere al número de caracteres, en el resto de controles se refiere a su tamaño en píxel) `maxlength = "numero"` - Máximo número de caracteres para los controles de texto y de password `checked = "checked"` - Para los controles checkbox y radiobutton permite indicar qué opción aparece preseleccionada `disabled = "disabled"` - El control aparece deshabilitado y su valor no se envía al servidor junto con el resto de datos `readonly = "readonly"` - El contenido del control no se puede modificar `src = "url"` - Para el control que permite crear botones con imágenes, indica la URL de la imagen que se emplea como botón de formulario `alt = "texto"` - Descripción del control
Tipo de elemento	En línea y etiqueta vacía
Descripción	Se emplean para insertar un control en un formulario

9. Formularios en XHTML

2011-10-27T20:51:00.000-05:00

HTML es un lenguaje de marcado cuyo propósito principal consiste en estructurar los contenidos de los documentos y páginas web. Sin embargo, HTML, también incluye elementos para crear aplicaciones web. El estándar HTML/XHTML permite crear formularios para que los usuarios interactúen con las aplicaciones web.

Los años transcurridos desde la publicación de los estándares de HTML y XHTML ha provocado que no estén disponibles todos los elementos utilizados por los formularios más vanzados y modernos. No obstante, HTML/XHTML incluye los suficientes elementos de formularios para crear desde los formularios sencillos que utilizan los buscadores hasta los formularios complejos de las aplicaciones más avanzadas.

Para crear un formulario de manera sencilla se realiza de la siguiente manera:

</form>

Donde:

La mayoría de formularios utilizan sólo los atributos action y method. El atributo action indica la URL de la aplicación del servidor que se encarga de procesar los datos introducidos por los usuarios. Esta aplicación también se encarga de generar la respuesta que muestra el navegador.

El atributo method establece la forma en la que se envian los datos del formulario al servidor. Este atributo hace referencia al método HTTP, por lo que no es algo propio de HTML. Los dos valores que se utilizan en los formularios son GET y POST. De esta forma, casi todos los formularios incluyen el atributo method="get" o el atributo method="post".

Hacer una tabla con HTML...

2011-10-10T19:17:00.000-05:00

<html>
<head>
</head>
<body>
<table border="1">
<tr> <td>
Nombre</td>
<td> Apellido</td>
</tr>
<tr>
<td>Edwin Zair</td>
<td>Mercado</td>
</table>
</body>
</html>

Asi se visualizaría:

Nombre	Apellido
Edwin Zair	Mercado

Que podemos resaltar de esto:
para comenzar la tabla ponemos <table> para cerrar la tabla </table>
<tr> Indica una fila
<td> indica una columna

Existen muchos atributos o especificaciones que puedes colocar en una tabla los estudiaremos poco a poco.

8. Cap. 2: Saltos de Línea br

2011-09-30T23:54:00.000-05:00

Para incluir una nueva línea en nuestro documento y lograr que el texto que sigue se muestre en una línea posterior, se utiliza la etiqueta <br>. La etiqueta <br> lo podríamos ver en cierta manera como si presionáramos un ENTER (INTRO).

Está etiqueta es de las pocas etiquetas que no encierran ningún texto, de forma que la etiqueta se abre y cierra de forma consecutiva.

Para este tipo de etiquetas HTML, nos permite que una etiqueta se está abriendo y cerrando al mismo tiempo de la siguiente manera <br/>

Ejemplo:

Así se visualiza en el navegador:

7. Cap. 2: Resaltado básico de texto.

2011-09-22T08:05:00.000-05:00

Una vez que tenemos un texto el cuál puede estar estructurado con párrafos y secciones, un paso importante para que los usuarios visualicen mejor la información realizamos el resaltado del mismo texto. Entre estos resaltados básicos podemos poner de ejemplo, palabras en destacado o cursiva, anotaciones y correcciones, enlaces a otros documentos externos, palabras subrayadas, entre otras.

Las etiquetas que nos llamaran mucho la atención son <em> y <strong> ya que son básicas son muy utilizadas en los párrafos o sea cursiva y negrita. Este tipo de etiquetas marcan al usuario que dicho texto es importante y que le debemos mostrar más atención.

Visualicemos el siguiente ejemplo:

Así se ve en el navegador:

Realizar el siguiente ejemplo para practicar:

Esto está fuera del curso...

2011-09-20T15:19:00.000-05:00

Bueno esta página esta muy cool pueden visitarla esto no tiene que ver con el curso pero sii desean pueden hacerlo.

http://www.boosterblog.es

6. Cap. 2: Títulos en HTML

2011-09-16T07:49:00.000-05:00

Títulos

En HTML encontramos etiquetas para lograr estructurar nuestro texto con títulos. Estos títulos delimitan cierto tamaño y estos van enumerados del 1 al 6. De mayor a menor quiere decir que el 1 tiene mayor nivel que el 6.

Ahora mostraremos un pequeño ejemplo para ver cómo se trabaja con títulos, si desea probarlo puede hacerlo:

Como podemos observar en el ejemplo (código) colocamos 3 títulos un título <h1>, <h3> y <h4> los cuales en nuestro navegador se visualizan de la siguiente manera:

Pará tener un poco de práctica puede realizar un ejemplo como el siguiente:

5. Cap. 2: Ejemplos Párrafos en HTML

2011-09-16T00:53:00.000-05:00

Párrafos.

Esta podría ser una de las etiquetas más comúnmente utilizada para el uso de texto, la etiqueta <p> nos permite definir los párrafos que forman el texto de nuestra página. Para delimitar el texto en párrafos debe realizarse de la siguiente forma como se muestra a continuación:

El ejemplo anterior lo podemos visualizar en nuestro navegador de la siguiente manera:

Podemos observar que los párrafos nos ayudan a delimitar el texto. Al colocar la etiqueta <p> y cerrarla mediante </p> podemos observar que se crea una especie de espacio o margen ya que al insertar el párrafo se crea por default para permitirnos diferenciar los párrafos en el texto.

Para practicar puedes crear este ejemplo que he encontrado en la web utilizando párrafos:

4. Capítulo 2. Texto en nuestra página Introducción.

2011-09-16T00:33:00.000-05:00

Capítulo 2.Texto en nuestra página.

Cómo ya hemos de saber las páginas HTML habitualmente están conformadas por texto, ya que estás páginas cuentan con gran cantidad de texto es importante conocer los elementos y etiquetas que define el lenguaje HTML para tratar el manejo de texto.

Cómo ya vimos anteriormente esté lenguaje nos permite colocar o estructurar el texto de varias formas por ejemplo anteriormente ya vimos que podemos utilizar párrafos, negritas, cursiva, entre otras cosas.

Para estructurar el texto, se basa en poder indicar o delimitar las diferentes zonas y/o secciones que componen el texto. Una vez realizada esta tarea podemos marcar otras cosas como darle mayor o menor importancia al texto ó otras funciones.

Nuestro próximo post veremos hablaremos sobre el párrafo.

3. Cap. 1: Sintaxis de las etiquetas (reglas XHTML)

2011-09-14T02:39:00.000-05:00

HTML era un lenguaje el cuál te permitía escribir sus sintaxis de distintas formas, las etiquetas podían ser escritas en mayúsculas y mínusculas, las etiquetas podían no encerrarse entre comillas y el orden en que se cerraban no era el correcto y no ocurría nada.

Todos estos aspectos viéndolo de una manera global podemos decir que era mejor, pero que ocurre si analizamos mejor la situación al ocurrir estas cosas obtenemos un código con mucho menor orden, y el día que se requiera aplicar cambios se complica mucho más ya que no lleva un orden adecuado.

A continuación se muestran 5 especificaciones básicas que añade el XHTML a diferencia del HTML:

1.- Las etiquetas se deben cerrar de acuerdo a como se abren:

Ejemplo incorrecto:

<p><strong>esto esta en negritas </p> </strong>

Ejemplo correcto:

<p><strong> esto está en negritas </strong></p>

2.- Los nombres de las etiquetas siempre deben escribirse en minúsculas.

<p></p>, <em></em>, <a></a>

3.- El valor de los atributos siempre se encierra entre comillas.

<a href=”http://compuroo.blogspot.com” >Enlace a mi blog </a>

4.- Los atributos no se pueden comprimir.

5.- Todas las etiquetas deben cerrarse siempre:

En XHTML se deben cerrar siempre todas las etiquetas que utilicemos por ejemplo en HTML la etiqueta <br> de esa forma estaría correcta en XHTML las etiquetas que no se cierran las cerramos así <br/> con una diagonal después del nombre de la etiqueta.

by: ZetLaX http://compuroo.blogspot.com

2. Cap. 1: Ver código fuente de página web

2011-09-14T02:36:00.000-05:00

Si ya ha logrado ver la primera página en su navegador, ahora pruebe a pulsar sobre el menú ver, código fuente y podrá ver el código HTML de la página que está visualizando en el navegador. De hecho de esta manera se puede ver el código fuente de cualquier página de Internet mediante la opción ver > código fuente. Pruebe a ver el código fuente de su página preferida y verás cuantas etiquetas pueden llegar a utilizar en esa página completa.

Ahora analizaremos las etiquetas más importantes del código que acabamos de probar:

<html>: Nos limita entre el comienzo y el final de un documento HTML, Ninguna etiqueta puede colocarse antes o después de esta etiqueta <html></html> con una sóla excepción que visualizaremos más adelante. Se definen la cabecera y el cuerpo del documento y todo lo que sea colocado fuera es ignorado.

<head>: Delimita la parte de la cabecera del documento. La cabecera contiene información sobre el propio documento HTML, como por ejemplo el titulo de la página y el idioma de la misma.

<body>: El cuerpo de la página El cuerpo encierra todos los contenidos que se le muestran al usuario, en general esta parte contiene cientos de etiquetas mientras que el <head> solo contiene algunas pocas.

<p>: Está etiqueta nos ayuda a separar nuestro texto en párrafos, para cerrar esta etiqueta tenemos que utilizar </p> simplemente.

<strong>: Nos permite colocar cierto texto en negritas. Para cerrar la etiqueta colocamos </strong>. Ejemplo:

<strong>esto esta en negritas</strong> esto no.

<br/>: Esta etiqueta lo único que hace es ayudarnos a dar un simple salto de línea.

By: ZetLaX http://compuroo.blogspot.com

1. Cap. 1: Ejemplo básico XHTML.

2011-09-14T00:52:00.000-05:00

Bueno continuando con nuestro curso, a continuación mostraremos un ejemplo muy básico para comprender lo que es XHTML ó HTML:

Si quieres probar este primer ejemplo, debes hacer lo siguiente:

1. Abres un editor de archivos de texto y creas un archivo nuevo (NotePad, bloc de notas, NotePad ++, etc.)

2. Teclea el código mostrado anteriormente tal como está en el ejemplo.

3. Guarda el archivo en la ubicación que desees, con cualquier nombre pero con la extensión .HTML. (ejemplo: Práctica1.html).

Nota: El editor de texto debe ser sin formato, que quiere decir esto que puedes utilizar Notepad ++, Bloc de notas, etc. Pero no puedes utilizar editores como Word, Open Office, etc.

Si utilizas sistema operativo Linux puedes utilizar Gedit, Kedit, Kate, etc.

Después de guardar nuestro archivo ya lo puedes abrir con cualquier navegador (Internet Explorer, Mozilla, Google Chrome). Así quedaría nuestro ejemplo, lo mostrare con Google Chrome:

Introduccion a HTML

2011-09-07T16:49:00.000-05:00

INTRODUCCIÓN.

HTML podemos decir que es uno de los lenguajes más utilizados para crear páginas web en Internet. Si observamos HTML es un lenguaje con el que se “escriben” la mayoría de las páginas web.

Los diseñadores utilizan HTML para crear sus propias paginas web, los programas que utilizan los diseñadores automáticamente generan páginas en HTML y los navegadores que utilizamos los usuarios muestran páginas web después de leer su contenido HTML. Una de las ventajas de HTML es que es muy sencillo de aprender y poder escribir por cualquier persona.

HTML proviene de las siglas HyperText Markup Lenguaje, el lenguaje HTML es un estándar reconocido en todo el mundo y las normas son definidas por el organismo llamado Word Wibe Web Consortium. Esté organismo define que el lenguaje reconocido universalmente y que permite publicar información de forma global.

HTML o más actual XHTML es un lenguaje de etiquetas, las páginas en HTML se dividen en dos partes importantes: la cabecera y el cuerpo. La cabecera incluye información sobre la propia página, como por ejemplo su título y su idioma. El cuerpo de la página incluye todos los contenidos, como párrafos de texto e imágenes.

En el cuerpo se coloca todo lo que el usuario ve en su pantalla y en la cabecera existe todo lo que no se ve (con la excepción de los títulos que si se pueden ver).

A continuación mostraremos, las partes esenciales del código HTML.

Figura 1.1: Este ejemplo contiene las etiquetas básicas.

Continuamos... By: ZetLaX...

Aprende a crear paginas.

2011-09-07T16:28:00.000-05:00

Este blog está dedicado al lenguaje HTML y ó XHTML básico. Porqué Aprende HTML con ZetLaX, ZetLaXno es ningún editor ni lenguaje ni mucho menos simplemente ZetLaX es la persona a la que le han permitido escribir en esté blog.

Estos solamente son pequeños datos tecnicos y ahora si comenzaremos a trabajar en lo que realmente nos interesa HTML y XHTML.

Saludos. Comenzamos oficialmente.