Scribd Logo
Importer

Bienvenue sur Scribd !

  • Diseño de Pagina Web

    Transféré par

    yahir7325
    30 vues17 pages

    Titre original

    Diseño de pagina web

    Copyright

    © Attribution Non-Commercial (BY-NC)

    Formats disponibles

    DOCX, PDF, TXT ou lisez en ligne sur Scribd

    Avez-vous trouvé ce document utile ?

    Ce contenu est-il inapproprié ?

    Signaler ce document

    Droits d'auteur :

    Attribution Non-Commercial (BY-NC)
    Téléchargez comme DOCX, PDF, TXT ou lisez en ligne sur Scribd
    Signaler comme contenu inapproprié
    30 vues17 pages

    Diseño de Pagina Web

    Transféré par

    yahir7325

    Droits d'auteur :

    Attribution Non-Commercial (BY-NC)
    Téléchargez comme DOCX, PDF, TXT ou lisez en ligne sur Scribd
    Signaler comme contenu inapproprié
    sur 17

    Diseo de pagia web

    Elementos bsicos de la pagina web


    El lenguaje de marcado de hipertexto es el lenguaje estndar para describir el contenido y la apariencia de las paginas en www.Es un lenguaje de marcacin diseado para estructurar textos y presentarlos en forma de hipertexto que es el formato estndar de las paginas web. HTMML Dinmica, otorga un conjunto de tcnicas que permiten crear sitios web interactivos utilizando una combinacin de lenguaje HTML estatico,un lenguaje interpretado por parte del cliente (como java script) es decir se puede trabajar con aplicaciones que aparte de contener objetos y exentos se procesan por el cliente dentro del agregado web

    Pasos para crear un sitio web


    1.- Define el objetivo- debes determinar exactamente porque quieres crear una pagina 2.-Determina la estructura del sitio-Haz una lista de todas las cosas que quieres incluir .Prepara un mapa estructural del sitio web. 3.-Decide la apariencia de la pagina-Haz el diseo y el diagrama de la ubicacin de los objetos de la pagina hasta que tengas algo que te guste. 4.-Considera el diseo-Para esto debes tener en cuenta lo siguiente. *Que tu pagina sea compatible con diferentes navegadores *La excelente pagina que has pasado horas diseando pueda tardar horas en cargase, si ese es el caso los invitados no esperaran e irn a otra parte. 5.-Escoger el editor 6.-Busca y junta los objetos-imgenes,logos,animaciones,sonidos,pelculas que se vean al utilizar en tu pagina web. 7.-Crea el cdigo para cada objetivo y guardadocon extencion .html 8.-Abra el navegador tu pagina elaborada y ahora como funciona tu cdigo

    9.-Para eventuales modificaciones,no es necesario volver a abrir cada vez el navegador. *Vuelve al editor del texto *Modificar el cdigo html *Guarda el archivo *utilizar el men ver actualizar elnavegador y oprima f5 para ver la pagina con los cambios

    10.-Publica la pagina web

    Encabesados del documento


    Hay 6 niveles de titulo <h> titulo principal con letras mas grandes </h> <h2> </h2> <h3> </h3> <h4> </h4> <h5>. </h5>

    Atributo Align
    El atributo align tiene 4 valores: left, rigth, center, justify

    Cuerpo del documento


    El marcador body tiene los sig, atributos importantes: Bgcolor =valor hexadecimal que corresponde a un color, define el color del fondo que se aplica a toda la pagina Ejemplo<Body Bgcolor = #00ffff> es lo mismo como <Body Bgcolor=Cyan> Background(=imagen) define una imagen como mosaico de fondo de la pagina : <Body Background=carro.jpg>

    <Body text=#f0000> o <Body Link=red> Define el color del vincula visitado <Body vlink=ffff00> o <Body vlink=yellow> Define el color del vinculo visitado <Body Alink=#0000ff> o <Body Alink=blue> Define el color del vincula activo

    <Html> <Body bgcolor=#0000ff text=h00008b link #98fb98 vlink=ff4500> <body> <html> Esto significa color de fondo azul oscuro del vincula verde pardo del vincula activado blanco del vincula visitado rojo naranja Evita que la imagen de fondo se desplace: <body background=carro.jpg Bg properities=fixed> Leftmargin= (valor en pixeles) define el margen izq de la pagina Tocpmargin=(valor en pixeles)-define el largo superior de la pagina Margin#E16ht(=valor en pixeles)-define la altura del margen de la pagina Marginwidth(=valor en pixeles)-define el anchor de la pagina

    Treabajo con texto


    <p> Nuevo prrafo>/p> <p align=left>prrafo alineacin a la izquierda</p> <p align=center>prrafo centuado</p> <p align=rigth>prrafo alineado a la derecha </p> <br> nueva lnea <Hr>Dibuja una lnea horizontal <pre>texto preformateado </pe> se utiliza para desplegar el texto exactamente como fue escrito guardando, espacios, tabulaciones etc.

    Estilos lgicos
    <em>texto con nfasis</em> <strong>texto strong</strong> <code>cdigo con espacio igual entre las lecturas>/code> <samp>incluye salida </samp> <kbd>despliega una definicin</dfn> <abbr>texto abreviado</abbr> <cite>citacin</cite>

    Estilos fsicos
    <b>texto en negritas</b> <i>texto inclinado</i> <u>texto subrayado</u> <s>texto tachado</s> <big>texto con letras mas grandes</big> <small>texto con letras mas pequeas</small> <blin>texto parpadeante</blink> <marquee>texto que se mueve</marquee> <sub>texto super ndice</sub> <ttt>texto con anchira igual de las letras como la maquina

    Alineacion del texto <Div>


    Tambien puede ser definida mediante el marcador esto etiqueta agrupa los objetos dentro de ella y crea una subdivisin en el documento en la que se mantiene una misma alineacin.Puede ser alineado a la izquierda a la derecha centrada o justificado Ejemplo <Div align=alright>Esto es un texto alineado a la derecha</Div> Convinacion de formato de texto <I><u><b> texto negritas sibrayado e inclinado <I><u><b>

    Para cambiar el tipo de tamaa y color del tecto se utiliza el marcador funt. Color.- Define el color del texto. Valor con numero hexadecimal Size.-Define el tamao Face.-Define el tipo de letra Ejemplo <Front color=#00ff00 size=5 face=arial>Texto coloreado, tamao 5 y tipo de letra arial</font> Para dar movimiento de texto se usa el marcador<marquee>

    Atributos
    Behavior-Muestra el comportamiento de sroll o slide Bgcolor-Numero#rr66bb o nombre del color destinado Direction-muestra la direccin del movimiento down,left,right,up Heigh-muestra la altura del texto en porcentaje Loop-determina el color del movimiento del texto un numero

    Lista con vietas


    <ut> <li>primer objetivo en la lista </li> <ul>

    Atributos
    Ultype=disc> <ultype=disc> <ultype=square> Especifica el tipo de vieta (cuadro,circulo.disco)entre las diferentes tipos <li type=disc> <li type=circle> <li type=square>

    Lista enumerada
    <ol> <Li>primer objeto en la lista </li> <Li>segundo objeto en la lista </li> </ol>

    Imagen Para incluir una imagen en las paginas web utilizamos el marcador <img>.La sintaxis es: <img src>=amigos,jpg> (la imagen tiene que estar en la misma carpeta donde tenemos la pagina web) Atributps

    WIDTH:Determina el ancho de la imagen en piroles Height:Determine la altura de la imagen Para cambiar las dimensiones de la imagen utiliza <imgsrc=mariposa.gif width=140 height=100 Border:Muestra un marco alrededor de la Ejemplo: <imgsrc=mariposa.gif width=140 height=100 border> Align: alinea y acomoda los elementos de html <Div align=left> o <Div align=right> o <Div align=center> <img src=mariposa.gif> </div>

    Para poner texto por un costado de la imagen <p><img src=nia.jpg>texto</p> <p><img src=nia.jpg>align=top>texto en la parte superior</p> <p><img src=nia.jpg>align=middle>texto en la parte media</p> <p><img src=nia.jpg>align=bottom>texto en la parte inferior</p> <p>texto izquierdo<imgsrc=nia.jpg>texto derecho</p> Sonido yvideo <embered src=chiste.mpg> <embed src=chiste.waw>

    Hipervinculos

    Para crear un hipervnculo se usa el marcador <a> y <la> que viene dando de la palabra anchor el recurso se muestra en el atributo principal hrdef la sintaxis para el hipervnculo <a name =inicio> </a> <a href = #inicio> da clic aqu para ir al inicio </a> Hipervnculo externo <La Href = prueba. Html> Texto 1 <La> este es un vinculo que nos abre la otra pagina existente <La Href=Http:// www.google.com> texto 1 <La> este es un vinculo que nos dirige a un sitio web

    Tablas
    Para crear una tabla se utiliza los siguientes marcadores <table> crear tabla <tr> indica inicio de una tabla <td> indica inicio de una celda asi se tornan las columnas <Html> <Head> <title> tablas </title> </head> <body> <Table border=2> <td> <td> Enero </td> <td> Febrero </td> <td> Marzo </td> </tr>

    <td> Abril </td> <td> Mayo </td> <td> Junio </td> </tr> <td> Julio </td> <td> Agosto </td> <td> Septiembre </td> </tr> <a HREF=curriculum. HTML> curriculum </a>

    Vous aimerez peut-être aussi