martes, 11 de febrero de 2014
Practica 1.2 introducción del HTML
1-¿Que
entiende por HTML?
Define cada una de las letras que
conforman la palabra HTML? * Hyper
Text MarkupLanguage
H: Hyper
T: Text
M: Markup
L: Language
2-¿Quien
invento el HTML?
*En
1989 por Tim Berners-Lee
3-¿Cual era
el objetivo al crear el lenguaje HTML?
Para la creación de sitios web
http://es.html.net/tutorials/html/lesson2.php
4-¿Menciona cuatrocaracterísticas
del lenguaje HTML?
Elementos
Cada elemento de un documento HTML consta de una marca de
comienzo, un bloque de texto y una marca de fin. <MARCA>bloque de
texto</MARCA>. Por ejemplo, <H1>Titular de nivel 1</H1>
Estos elementos se denominan contenedores, porque contienen
un bloque de texto entre las dos marcas. También existen elementos vacíos, que
no afectan a bloques de texto y, por tanto, no contienen marca de fin.
Por ejemplo, línea 1 <BR> línea 2
Atributos
Muchos elementos tienen atributos que definen propiedades
del elemento: <MARCA ATRIBUTO="VALOR"> bloque de texto
</MARCA>. Por ejemplo, <H1 ALIGN="CENTER">Titular de nivel
1 centrado</H1>
Es recomendable encerrar los valores de los atributos entre
comillas dobles. En algunos casos es además obligatorio (por ejemplo, si
contienen espacios en blanco).
Distinción
entre mayúsculas y minúsculas
HTML no distingue entre mayúsculas y minúsculas. Cuando es
importante hacerlo, cosa que puede ocurrir con los valores de algunos atributos
(por ejemplo, nombres de ficheros), es preciso encerrar el valor entre comillas
dobles. Por ejemplo, <IMG ALT="" SRC="BolaRoja.gif">
Comentarios
Los comentarios se escriben en HTML de la siguiente forma:
<!-- Esto es un comentario -- >. Los caracteres de inicio del comentario,
<!-- deben ir juntos, pero se permiten espacios entre los -- y el > del
final. Los comentarios pueden expandirse varias líneas, aunque no es
conveniente porque algunos visualizadores pueden no interpretarlos.
Interpretación
de espacios, tabulaciones y retornos de carro
Los espacios, tabulaciones, líneas en blanco y retornos de
carro del documento HTML se ignoran, tomándose como un único espacio en blanco.
Esto permite añadir espacios para aumentar la claridad del documento. Cuando se
quiere forzar un espacio en blanco, se hace de la siguiente forma:
Estructuración
HTML es un lenguaje estructurado. Existen unas reglas
estructurales sobre dónde pueden y no pueden ir los elementos. Por ejemplo,
Ciertos elementos
no pueden contener otros elementos. Por ejemplo, no es correcto colocar un
titular dentro de otro. Además, tampoco tiene sentido hacerlo.
<H1><H2>Texto</H2></H1>
Los elementos no
se pueden solapar. No es correcto escribir
<EM><H1>Texto</EM></H1>
Estructura
de un documento HTML
<HTML>
<HEAD> ... Encabezamiento del documento </HEAD>
<BODY> ... Cuerpo del documento </BODY>
</HTML>
Elementos más importantes del encabezamiento: TITLE y META.
<TITLE>Título de la página</TITLE>
<META NAME="descripción" CONTENT="Página
dedicada al diseño eficiente de páginas web para internet mediante el lenguaje
HTML y otras herramientas auxiliares">
<META
NAME="keywords" CONTENT="web diseño HTML hipermedia">
<META
HTTP-EQUIV="refresh" CONTENT="5;
URL=http://dominio/pagina2.html">
<META
HTTP-EQUIV="expires" CONTENT="Fri, 05 Jan 2001 13:00:00
GMT">
El cuerpo
del documento viene a continuación del encabezamiento, y contiene todo el texto
y material del documento que se va a mostrar.
<BODY
BGCOLOR="color" BACKGROUND="fichero imagen"
TEXT="color"
LINK="color" VLINK="color" ALINK="color">
...
</BODY>
El formato de los colores se puede especificar de dos
maneras distintas:
·
Mediante
el nombre del color. Por ejemplo, aqua, black, blue, fuchsia, gray, green,
lime, maroon, navy, olive, purple, red, silver, teal, white, yellow (y otros
124 colores extendidos).
·
Mediante
la intensidad, en hexadecimal, de los componentes RGB (rojo, verde, azul) del
color: #RRGGBB (siendo 00 la intensidad nula y FF el máximo brillo).
5-¿Menciona
siete reglas básicas que debes seguir para el diseño de una página web?
1.- Trazar un esquema de apartados y secciones de la web,
con todo aquello que se te ocurra (con papel y lápiz). Luego ordenarlo todo
para elaborar el esquema final (aunque podrá cambiar ir cambiando después).
2.- Hacer un "boceto" de la página que deseas, a lápiz!
Usa colores para darle forma y buen aspecto.
3.- Obtener un espacio para la página web en algún
"Servidor", ya sea de pago o gratuito.
4.- Crear una "carpeta" en el disco duro, donde
guardar los archivos de la nueva página web.
6.- "Instalar" el programa de diseño y
"configurar" el sitio web en él.
1.-Tu página
tiene que cargar rápido
Tan solo tienes 10 preciosos y escasos segundos para
despertar su interés antes de que se marchen. Tus visitantes y probablemente tu
tampoco esperarías 30, 40, ni 50 segundos hasta que el sitio cargue, en
Internet el tiempo pesa y mucho, cuando navegamos en la red se pierde la
paciencia rápidamente, así que lo mejor es asegurarse que tus paginas sean
gráficamente ligeras para que no convierta tu sitio web en un sitio “pesado”.
2.-Despierta
su Interés dándole lo que está buscando
Tu visitante antes de comprar va primero que todo en busca
de información, el “Que Hay Aquí Para Mi”, dales precisamente eso información,
pero no cualquier información dales contenido que no pueda conseguir en tu
competencia, es por eso que tus contenidos no pueden ser mas de lo mismo que tienen
los demás, debes enfocarlo desde un punto de vista novedoso, que lo haga fresco
y original. De esta manera sentirán que tu sitio tiene eso que están buscando y
que solo tú puedes ofrecerle.
3.-Pon a la
vista lo que ofreces
Enséñales claramente y desde un primer momento los productos
o servicios que vendes, si tus prospectos no están seguros de que va tu sitio
web, se confundirán se marcharan y es muy poco probables que les recuperes.
4.-Atrápalo
con un titulo poderoso
Si pones un titulo que llame poderosamente su atención,
atraerás su interés por ver que es lo que tienes para el, y permanecerá mas
tiempo lo que aumenta la posibilidad de que puedas venderle tus productos o
servicios.
5.-Da para
recibir
¿Quieres que tus Prospectos se Suscriban a tu Boletín?,
entonces ofréceles contenido gratis y relevante, es la mejor manera de ganarte
su confianza, la confianza es un paso previo muy importante antes de que
decidan comprar tus productos o servicios. Posterior a la suscripción también
puedes enviarle información periódicamente, bien sea cursos, seminarios e
incluso software gratis que apoye y le sirva como una herramienta de
complemento a la información relevante de su interés.
6.-Diseño
sencillo pero elegante
Un sitio web sencillo no tiene por que ser poco atractivo,
al contrario de los que mucha gente piensa, los sitios web que más
oportunidades de negocios tiene y que mas venden actualmente en la red son
precisamente aquellos que son sencillos pero elegantes. Muy importante sin
errores gramaticales, un lugar con errores ortográficos denota poca
profesionalidad y genera rechazo y desconfianza en los usuarios. No debe tener
colores de fondo chillones, debe ser agradable a la vista y sus textos con un
tamaño adecuado y fácil de leer para todo el mundo.
7.-Ponle un
mapa a tu sitio
Si tu sitio web es muy grande lo mejor es tener un mapa del
sitio para facilitarle conseguir a tus usuarios lo que están buscando.
8.-Información
Básica
Siempre, hay que incluir el nombre, la dirección, y
teléfonos en nuestro sitio web. Resulta asombrosa la cantidad de negocios que
circulan por la red que dan la impresión de estar huérfanos o acéfalos, carecen
de información básica del responsable, lo cual genera sin duda desconfianza y
poca credibilidad para el usuario, también hay que un e-mail de contacto de ser
posible en todas y cada una de las paginas que componen el sitio.
9.-FAQs
Si tienes que responder a las mismas preguntas una y otra
vez, lo mejor es hacer una página con las respuestas a esas preguntas frecuentes,
tus visitantes solo tienen que consultarlas para despejar rápidamente sus dudas
relacionadas con tus productos o servicios.
10.-Ofréceles
un Glosario de Términos
Una excelente manera de que tus prospectos vuelvan una y
otra vez a tu negocio es poner a su disposición, un glosario de términos con la
información que necesitan, volverán una y otra vez a consultar sus dudas y
tendrás más posibilidades de ofrecerles tus productos o servicios.
Conclusión
El sitio web debe estar diseñado para atrapar y despertar el
interés del usuario desde un primer momento, y de esta manera el prospecto pase
el mayor tiempo posible dentro del sitio web, de cara a que logres que pueda
ver tus productos o servicios, y antes de que piense que lo que esta buscando
esta en otra parte y se marche.
Fuente:
Omar Jareño.
8/2/2014
Luis armando Monroy
632
Practica 1.3 Elementos básicos HTML
Practica 1.3
Elementos básicos HTML
1-
Bloc de notas? Es un editor de texto simple incluido en los sistemas operativos de Microsoft desde 1985. Su funcionalidad
es muy sencilla. Algunas características propias son:
·
Inserción de hora y fecha actual pulsando F5, en formato "HH:MM
DD/MM/AA".
·
Inserción de hora y fecha actual automática si el documento comienza por
".LOG".
·
Ajuste de línea.
2- Buscadores? Un buscador
es una página web en la que se ofrece consultar una base de datos en la cual se
relacionan direcciones de páginas web con su contenido.
3- compatible? Es
la cualidad de ser compatible, de poder concurrir en buenas condiciones con
algo o alguien.
4
estructura de página web?
<html>
<head></head>
<body>
</body>
</html>
<head></head>
<body>
</body>
</html>
5- Etiquetas?
·
<html>: define el inicio
del documento HTML, le indica al navegador que lo que viene a continuación debe ser interpretado como código HTML.
Esto es así de facto, ya que en teoría lo
que define el tipo de documento es elDOCTYPE, que significa la
palabra justo tras DOCTYPE el tag de raíz.
·
<script>: incrusta un script en una web, o llama a uno mediante src="url del script". Se recomienda incluir el tipo MIME en el atributo type, en el caso de JavaScript text/javascript.
·
<head>: define la cabecera del documento HTML; esta cabecera suele
contener información sobre el documento que no se muestra directamente al usuario como, por ejemplo, el título de la
ventana del navegador. Dentro de la cabecera<head> es posible encontrar:
·
<title>: define el título de
la página. Por lo general, el título aparece en la barra de título encima de la
ventana.
·
<link>: para vincular el
sitio a hojas de estilo o iconos. Por ejemplo:<link
rel="stylesheet" href="/style.css" type="text/css">.
·
<style>: para colocar el
estilo interno de la página; ya sea usando CSS u otros lenguajes similares. No es
necesario colocarlo si se va a vincular a un archivo externo usando la etiqueta <link>.
·
<meta>: para metadatos como
la autoría o la licencia, incluso para indicar parámetros http (mediante http-equiv="") cuando no se pueden
modificar por no estar disponible la configuración o por dificultades con
server-side scripting.
·
<body>: define el contenido
principal o cuerpo del documento. Esta es la parte del documento html que se
muestra en el navegador; dentro de esta etiqueta pueden definirse propiedades
comunes a toda la página, como color de fondo y márgenes. Dentro del cuerpo <body> es posible encontrar numerosas
etiquetas. A continuación se indican algunas a modo de ejemplo:
·
<h1> a <h6>: encabezados o
títulos del documento con diferente relevancia.
·
<table>: define una tabla.
·
<tr>: fila de una tabla.
·
<td>: celda de una tabla
(debe estar dentro de una fila).
·
<a>: hipervínculo o enlace, dentro o fuera del sitio web. Debe definirse el
parámetro de pasada por medio del atributo href. Por ejemplo:<a href="http://www.example.com"
title="Ejemplo" target="_blank" tabindex="1">Ejemplo</a> se representa como Ejemplo).
·
<div>: división de la
página. Se recomienda, junto con css, en vez de <table> cuando se desea alinear contenido.
·
<img>: imagen. Requiere
del atributo src, que indica la ruta en la que se
encuentra la imagen. Por ejemplo: <img src="./imágenes/mifoto.jpg" />. Es conveniente, por
accesibilidad, poner un atributo alt="texto alternativo".
·
<li><ol><ul>: etiquetas para
listas.
·
<b>: texto en negrita (etiqueta
desaprobada. Se recomienda usar la etiqueta <strong>).
·
<i>: texto en cursiva (etiqueta
desaprobada. Se recomienda usar la etiqueta <em>).
·
<s>: texto tachado (etiqueta
desaprobada. Se recomienda usar la etiqueta <del>).
·
<u>: Antes texto subrayado. A partir de
HTML 5 define porciones de texto diferenciadas o destacadas del resto, para
indicar correcciones por ejemplo. (etiqueta desaprobada en HTML 4.01 y
redefinida en HTML 5)13 14
La mayoría de etiquetas deben cerrarse
como se abren, pero con una barra («/») tal como se muestra en los siguientes
ejemplos:
·
<table><tr><td>Contenido
de una celda</td></tr></table>.
·
<script>Código de un script
integrado en la página</script>.
6- Hipertexto?
Es una
herramienta de software con estructura no secuencial que permite crear,
agregar, enlazar y compartir información de diversas fuentes por medio de
enlaces asociativos.
7 lenguajes HTML?
Se basa
en la sintaxis SGML (Standard Generalized Markup Language). Esto quiere
decir que los diferentes elementos (párrafos, encabezamientos, tablas, listas,
...) de un documento para la WWW se señalan intercalando etiquetas que indican
al navegador cómo debe mostrarlo.
8 marcas (tag)?
Marca
o marcas que se dejan en un texto para que luego sean interpretadas,
generalmente para realizar alguna acción sobre el mismo texto marcado. Por
ejemplo, el lenguaje HTML se basa en la aplicación de múltiples etiquetas
para dar formato y darle características a un texto. Este texto es interpretado
y mostrado por un navegador. Ver: etiqueta
HTML.
9 –navegadores-?
Es permitir
la visualización de documentos de texto, posiblemente con recursos multimedia
incrustados. Además, permite visitar páginas web y hacer actividades en ella,
es decir, podemos enlazar un sitio con otro, imprimir, enviar y recibir correo,
entre otras funcionalidades más.
10- Pagina web?
es un documento o información electrónica capaz de contener
texto, sonido, vídeo,
programas, enlaces, imágenes, y muchas otras cosas, adaptada para la llamada World Wide Web, y que puede ser accedida mediante un navegador.
11- Plataformas?
Es un
sistema que sirve como base para hacer funcionar determinados módulos de hardware o de software con los que es compatible.
http://es.wikipedia.org/wiki/Plataforma_(inform%C3%A1tica)
12- Sitos web?
es una
colección de páginas de internet relacionadas y comunes a un dominio de
Internet o subdominio en la World Wide Web en Internet.
13 -servidor web?
es un programa
informático que procesa
una aplicación del lado del
servidor, realizando conexiones
bidireccionales y/o unidireccionales ysíncronas o asíncronas con el cliente y generando o cediendo una
respuesta en cualquier lenguaje o Aplicación del lado del
cliente.
14 -vinculo?
Significa unión o atadura
de una persona o cosa con otra. Se usa también para expresar: unir, juntar o
sujetar con ligaduras o nudos. Se refiere a atar duraderamente.
Camaleón 59.8
Suscribirse a:
Comentarios (Atom)