Mi primer html

Como comenté en un principio, crearé código desde el nivel más básico, hay muchas páginas web que explican no tan bien y otras que al contrario lo hacen muy bien (espero estar en el segundo grupo).

Pueden revisar en el sitio web de librosweb, donde encontrarán documentación muy buena para incursionar, muchos conceptos quizá los saque de ahi, de hecho si fui aprendiendo más de html, css, javascript y php fue por ellos (mil gracias).

Primer Hola mundo en HTML, para crear nuestro primer html, necesitamos practicamente solo de un sistema operativo, ya que todos cuentan con un editor de textos, podemos crearlo con notepad en windows o con gedit en linux o algún programa similar.

crearemos un archivo al cual llamaremos: index.html, ahora bien dentro de este archivo pondremos el siguiente código: (la letra p dentro de los signos <> indica que es una etiqueta es decir que lo que pongamos entre estas etiquetas tendrá un modo de mostrarse asi como ciertos atributos y servirá para distintas acciones, para indicar que cerramos la etiqueta anteponemos el símbolo / a la letra p, de tal modo que nos quede así: </p>, la p viene de párrafo, ya iré expandiendome más en esto como vaya avanzando en el “curso” aunque no explicaré las 91 etiqeutas disponibles (a, abbr, acronym, address, applet, area, b, base, basefont, bdo, big, blockquote, body, br, button, caption, center, cite, code, col, colgroup, dd, del, dfn, dir, div, dl, dt, em, fieldset, font, form, frame, frameset, h1, h2, h3, h4, h5, h6, head, hr, html, i, iframe, img, input, ins, isindex, kbd, label, legend, li, link, map, menu, meta, noframes, noscript, object, ol, optgroup, option, p, param, pre, q, s, samp, script, select, small, span, strike, strong, style, sub, sup, table, tbody, td, textarea, tfoot, th, thead, title, tr, tt, u, ul, var.)

Si comentaré sobre las más comunes tenemos <a>,<img>,<table>,<div>,<li>,etc y según como vayamso avanzando iré utilizando otras menso usuales.

<p>¡Hola Mundo!</p>

Si hicimos esto con gedit, a la hora de abrirlo en nuestro navegador nos saldrá así:

¡Hola Mundo!

¿Por qúe razón sucede esto?, La frase del ejemplo anterior incluye el signo (¡). Si el editor HTML del diseñador utiliza la codificación UTF-8 (gedit lo usa por defecto), el entorno de desarrollo del programador también utiliza UTF-8, el servidor web sirve las páginas con esa codificación y el navegador del usuario es capaz de visualizar las páginas con formato UTF-8, el texto anterior se verá correctamente en el navegador del usuario.

Sin embargo, muchas veces no es posible que todos los procesos involucrados utilicen la misma codificación de caracteres. Por limitaciones técnicas o por decisiones de los diseñadores y programadores, los textos pueden pasar de codificación UTF-8 a codificación ISO-8859 en cualquier momento. Si se produce este cambio sin realizar una conversión correcta, el navegador del usuario mostrará caracteres extraños en todos los acentos y en todas las letras como la ñ y símbolos como el que hemos utilizado. (letras y símbolos que no son propios del idioma inglés).

Solución 1: (aparentemente la más sencilla) Si usamos gedit a la hora de guardar (guardar como), no lo hagamos con la codificación: (Localización actual (UTF-8)) sino con la siguiente: Occidental (ISO-8859-15), tengamos en cuenta que mi conputador esta configurado para la región de latinoamérica.

Solución 2: (la más recomendable) reemplazar el símbolo (¡) por el codigo #161 con un punto y coma como vemos aca:

<p<#161;Hola Mundo!</p>

A continuación una lista con los símbolos y caracteres que nos pueden traer problemas, asi como su respectivas entidades para reemplazarlos:

á: &aacute;
é: &eacute;
í: &iacute;
ó: &oacute;
ú: &uacute;
Á: &Aacute;
É: &Eacute;
Í: &Iacute;
Ó: &Oacute;
Ú: &Uacute;
ü: &uuml;
Ü: &Uuml;
ñ: &ntilde;
Ñ: &Ntilde;
¿: &#191;
¡: &#161;
<: &lt;
>: &gt;
&: &amp
": &quot;
': &apos;
(espacio en blanco): &nbsp;

¡HOLA MUNDO! :D

Anuncios

Una respuesta to “Mi primer html”

  1. Etiquetas básicas de html « Vamos Programando Says:

    […] Vamos Programando Por Cornejo Llanos César « Mi primer html […]

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s


A %d blogueros les gusta esto: