Creadores
Páginas: 12 (2908 palabras)
Publicado: 25 de enero de 2013
Diseño web
HTML (hipertext markup lenguaje) Solo texto.
1995 → HTML 2.0
1999 → HTML 4.0
(XHTML)
2011 → HTML5.0
*W3C es quien rige la versión de HTML que debe usarse de manera estandarizada.
<etiqueta> → apertura
</etiqueta> → cierre
Ejercicio en block de notas (por default)
<html>
<head>
<title>bren-di</title> Encabezado:atributos globales
</head> ↓ no se ven en pantalla
<body>
mi <b>primera</b>
<i><u>pagina web</u></i>
</br>
esta es otra linea
<p> este es un parrafo</p>
<h1>titulo uno</h1>
<h2titulo dos</h2>
<h3>titulo tres</h3> Cuerpo
<h4>titulo cuatro</h4><h5>titulo cinco</h5>
<h6>titulo seis</h6>
<a href="paginados.html">ir a pagina dos</a>
</body>
<!-- comentario html -->
</html>
</br> → salto de línea (única que abre y cierra en sí misma).
<p></p> → párrafo
*Escribir doble salto de línea o poner un párrafo produce el mismo efecto visualmente.<h1>titulo uno</h1> → principal
<h2titulo dos</h2> Hasta seis títulos, van disminuyendo de jerarquía.
<h3>titulo tres</h3>
<h4>titulo cuatro</h4>
<h5>titulo cinco</h5>
<h6>titulo seis</h6>
<u></u> →subrayado
<b></b> → bold
<i></i> →itálica
<a></a> →insertar link(relativo).
Ej.:
<a href="paginados.html">ir a pagina dos</a>
↓ ↓
Hacia donde va nombre que se ve
(Todo esto antes que cierre el body)
Crear “pagina dos” en un archivo nuevo.
* Titulo “pagina dos”
* Link “volver” (hacia página uno)
<html>
<head>
<title>pagina dos</title>
</head>
<body>
<ahref="index.html">volver</a>
<a href="http://www.google.com"target="blank">ir a google</a>
<a href="mailto:bbren@hotmail.com">contacto</a>
</body>
</html>
<a href="http://www.google.com">ir a google</a>
↓
Link absoluto (hacia un sitio fuera del propio.
<a href="mailto:bbren@hotmail.com">contacto</a>
↓
Contacto: abreel servicio de correo predeterminado (Outlook)
<a href="http://www.google.com"target="blank"> →hacia una nueva pestaña (Ej.: google)
<a href="http://www.google.com"target="self"> →dentro de la misma pestaña
Inicio del ejercicio dentro de un sitio web real
*Programadores similares al dreamweaver con descarga gratuita:
* Titanium studio como navegador
* Aptana studio* Sublime text sólo editor
* Notepad
Trabajo en dreamweaver:
Definición del sitio:
Sitio → nuevo sitio → avanzado → Nombre del sitio Datos locales
→ Donde esta alojado (carpeta)
Acceso: FTP
Servidor: 200.58.115.153 (numero de IP)
Usuario: bren-di (nombre del dominio sin “.com.ar”) Datos remotos
Directorio: public_html
Contraseña: clave2012 (se puedepersonalizar)
Ventana → archivos (F8) → expandir (visualizar archivos remotos del lado izquierdo y locales del derecho)
→ conectar
→ del lado derecho, local (seleccionar documentos) → flecha azul (no archivos dependientes) → pasarlos al lado izquierdo.
*Para subir al sitio, hacerlo desde “vista remota”.
Crear carpeta “clasedos” del lado derecho → index.html
(xtml → preferencias → html4
Cambiar→ borrar todo y dejar solo <doctype html>
Segunda linea: <html>
(Para poder usar html5)
Ej:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
*códigos ACII: códigos específicos para cada símbolo por separado (Ej. Acentos)
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"...
HTML (hipertext markup lenguaje) Solo texto.
1995 → HTML 2.0
1999 → HTML 4.0
(XHTML)
2011 → HTML5.0
*W3C es quien rige la versión de HTML que debe usarse de manera estandarizada.
<etiqueta> → apertura
</etiqueta> → cierre
Ejercicio en block de notas (por default)
<html>
<head>
<title>bren-di</title> Encabezado:atributos globales
</head> ↓ no se ven en pantalla
<body>
mi <b>primera</b>
<i><u>pagina web</u></i>
</br>
esta es otra linea
<p> este es un parrafo</p>
<h1>titulo uno</h1>
<h2titulo dos</h2>
<h3>titulo tres</h3> Cuerpo
<h4>titulo cuatro</h4><h5>titulo cinco</h5>
<h6>titulo seis</h6>
<a href="paginados.html">ir a pagina dos</a>
</body>
<!-- comentario html -->
</html>
</br> → salto de línea (única que abre y cierra en sí misma).
<p></p> → párrafo
*Escribir doble salto de línea o poner un párrafo produce el mismo efecto visualmente.<h1>titulo uno</h1> → principal
<h2titulo dos</h2> Hasta seis títulos, van disminuyendo de jerarquía.
<h3>titulo tres</h3>
<h4>titulo cuatro</h4>
<h5>titulo cinco</h5>
<h6>titulo seis</h6>
<u></u> →subrayado
<b></b> → bold
<i></i> →itálica
<a></a> →insertar link(relativo).
Ej.:
<a href="paginados.html">ir a pagina dos</a>
↓ ↓
Hacia donde va nombre que se ve
(Todo esto antes que cierre el body)
Crear “pagina dos” en un archivo nuevo.
* Titulo “pagina dos”
* Link “volver” (hacia página uno)
<html>
<head>
<title>pagina dos</title>
</head>
<body>
<ahref="index.html">volver</a>
<a href="http://www.google.com"target="blank">ir a google</a>
<a href="mailto:bbren@hotmail.com">contacto</a>
</body>
</html>
<a href="http://www.google.com">ir a google</a>
↓
Link absoluto (hacia un sitio fuera del propio.
<a href="mailto:bbren@hotmail.com">contacto</a>
↓
Contacto: abreel servicio de correo predeterminado (Outlook)
<a href="http://www.google.com"target="blank"> →hacia una nueva pestaña (Ej.: google)
<a href="http://www.google.com"target="self"> →dentro de la misma pestaña
Inicio del ejercicio dentro de un sitio web real
*Programadores similares al dreamweaver con descarga gratuita:
* Titanium studio como navegador
* Aptana studio* Sublime text sólo editor
* Notepad
Trabajo en dreamweaver:
Definición del sitio:
Sitio → nuevo sitio → avanzado → Nombre del sitio Datos locales
→ Donde esta alojado (carpeta)
Acceso: FTP
Servidor: 200.58.115.153 (numero de IP)
Usuario: bren-di (nombre del dominio sin “.com.ar”) Datos remotos
Directorio: public_html
Contraseña: clave2012 (se puedepersonalizar)
Ventana → archivos (F8) → expandir (visualizar archivos remotos del lado izquierdo y locales del derecho)
→ conectar
→ del lado derecho, local (seleccionar documentos) → flecha azul (no archivos dependientes) → pasarlos al lado izquierdo.
*Para subir al sitio, hacerlo desde “vista remota”.
Crear carpeta “clasedos” del lado derecho → index.html
(xtml → preferencias → html4
Cambiar→ borrar todo y dejar solo <doctype html>
Segunda linea: <html>
(Para poder usar html5)
Ej:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
*códigos ACII: códigos específicos para cada símbolo por separado (Ej. Acentos)
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"...
Leer documento completo
Regístrate para leer el documento completo.