Mejores posteadores
Anks Satubi (163)
 
Anon (33)
 
Cris (31)
 
malula-21 (15)
 
patho131 (8)
 
Adri (8)
 
Hinata (7)
 
arens del desierto (3)
 
aitor (2)
 
Vizy (2)
 

Compañeros
Crear foro
Destino ninja
Últimos temas
» ficha de aitor
Dom Nov 07, 2010 11:06 pm por aitor

» Personajes Kanon
Dom Nov 07, 2010 10:25 pm por aitor

» Elije o te elijen
Lun Ago 09, 2010 5:03 pm por Adri

» ABC NUEVO y re lindo
Lun Ago 09, 2010 4:55 pm por Adri

» Pa matar el rato
Lun Ago 09, 2010 4:53 pm por Adri

» Cuenta atras
Lun Ago 09, 2010 4:49 pm por Adri

» Shiritori "palabras encadenadas"
Lun Ago 09, 2010 4:46 pm por Adri

» Taller de firmas ``Cris``
Lun Ago 09, 2010 4:36 pm por Adri

» Afiliacion informal de Organización KH.
Dom Abr 18, 2010 2:27 pm por Invitado

Navegación
 Portal
 Índice
 Miembros
 Perfil
 FAQ
 Buscar
Buscar
 
 

Resultados por:
 


Rechercher Búsqueda avanzada


GUIA MUY BUENA

Ver el tema anterior Ver el tema siguiente Ir abajo

GUIA MUY BUENA

Mensaje  Invitado el Mar Ago 04, 2009 4:58 am

HOLA LES DEJO ESTA GIA PARA CREAR WEBS

ESPERO Q NO SEA MUY COMPICADO...

Guia rápida para crear páginas web
Esta es la situación: tienes que hacer una página web personal o un proyecto lo que se dice ya, pero no sabes cómo empezar. Aquí va una guía rápida para tener una web en internet si meterse en muchos detalles.


Lo que hay que saber
Para hacer páginas web se usa HTML, un lenguaje de marcado muy simple que se crea con un editor de textos. Por ejemplo, una página simple sería la siguiente:


[Get Code]
<html>
<head>
<title>Mi primera página web</title>
</head>
<body>
¡Hola mundo!
</body>
</html>

El HTML es un conjunto de etiquetas como <strong>Esto va en negrita</strong> que dan formato a un texto. Para que un documento de texto sea HTML, basta con que esté encerrado entre etiquetas <html> y </html> y posea una cabecera limitada por <head> y </head> y una parte principal donde va el contenido encerrado por <body> y </body>, como en el ejemplo anterior. Dentro de <body> damos formato al texto con otras etiquetas como <p> para párrafos, <h1>, <h2>, <h3>, ... para cabeceras de título, etc. Otras etiquetas HTML comunes son:


[Get Code]
<!-- Esto es un comentario en HTML -->
<a href="http://www.google.com">Enlace a Google</a>
<strong><em>Texto en cursiva y negrita</em></strong>
<img src="image.jpg" width="220" height="100" /> <!-- Aqui va una imagen -->

Puedes aprender más HTML con estas guias:


Notas de (X)HTML (SIEpedia)
Tutoriales de W3Schools

aunque lo que sabemos ya es suficiente para seguir.


El HTML es un lenguaje marcado, que indica qué es cada cosa en un documento, un párrafo, un título, una tabla, etc, pero no cómo es o qué aspecto tiene. Aunque HTML tiene propiedades de estilo, para hacer webs actualmente se utiliza HTML sólo para marcado y para el estilo (colores, fuentes, formas, etc.) se usan hojas de estilo o CSS. Las hojas de estilo no son más que otro documento de texto que dice cómo es el aspecto del HTML y ese documento, de extensión .css debe llamarse desde el HTML con una líneas como


[Get Code]
<link rel="StyleSheet" href="estilo.css" type="text/css" media="all" />

el la parte <head> del documentoo incluirse en el propio HTML. Un ejemplo simple de documento CSS sería:


[Get Code]

body { background-color: #dddddd;}

h1,h2,h3 {color: green;}

p {
text-align: center;
color: black;
font-family: arial,verdana,helvetica;
}

que le da color de fondo gris claro a todo el documento (color hexagesimal #dddddd) pone de color verde todas las cabeceras y le da otras propiedades a los párrafos (etiqueta <p>). Las hojas de estilo tienen bastante más chicha y distintos navegadores a veces las interpretan un poco distinto debido a bugs. Lee más sobre CSS en los siguientes sitios:


Notas de CSS (SIEpedia)
Tutoriales de W3Schools
Guia CSS de htmlhelp.org

Manos a la obra
En principio, basta con saber algo de HTML y CSS para crear páginas web. Para empezar, deberíamos crear un documento index.html y luego su hoja de estilo, pero como se supone que no tenemos tiempo para eso y en internet hay de todo, usaremos una platilla hecha para empezar. Visita alguno de estos sitios y elije una plantilla que guste y se adapte a la página que tienes en mente:


Open Source Web Design
Open Web Design

yo he decidido usar el diseño llamado Sinorca. Bajamos el zip y lo descoprimimos en una carpeta, donde tenemos el index.html (nombre para la página de inicio por defecto) y sus hojas de estilo .css. En principio podemos abrir el index.html con un editor de texto y editarlo al gusto, pero también es muy útil hacerlo con el Composer de Mozilla (ejecutar Mozilla y pulsar Control+4) o con su versión avanzada, nvu, que son editores gráficos de HTML que también permiten editar código. Lo mismo hacemos con la(s) hoja(s) de estilo.


Ahora que cambiamos las partes principales del index.html como el título y los menús a nuestro gusto, podemos crear otras páginas con la misma plantilla:


[japp@marta ~/web]$ cp index.html trabajos.html

y poner los contenidos que queramos.


Con esto ya está terminada nuestra página básica, sólo necesitamos un sitio dónde ponerla en internet. Para tener un sitio en el servidor externo del IAC, debemos rellenar el formulario de solicitud que está en http://goya/gabinete/web/ y según sea una página personal o de proyecto nos darán un directorio u otro en un servidor interno y en el externo. Hay que copiar nuestras páginas a ese directorio del servidor interno, al que se accede por /net/rives/si/www/, por ejemplo, para mi página personal, debo copiar todo a


[japp@marta ~/web]$ cp -r * /net/rives/si/www/galeria/japp/

una vez copiados podemos ver inmediatamente el resultado en el servidor interno apuntando el navegador a:


http://ttwww/galeria/japp

si las páginas funcionan correctamente sólo tenemos que esperar a que se copien automáticamente al servidor externo cada varias horas o usar el formulario web para que se copien en el momento:


https://ttwww/sic/distribucion/dist.html

ahora sí podemos ver nuestra página en el servidor externo del IAC:


http://www.iac.es/galeria/japp

Una plantilla simple con PHP
Aunque crear ahora nuevas página copiado index.html es fácil, en caso de necesitar editar partes comunes como el menú de la izquierda o la cabecera, tendremos que hacerlo de una en una, un fastidio si son muchas páginas. PHP nos puede ayudar a mantener fácilmente la página creando una única plantilla con PHP donde incluiremos las páginas que iremos haciendo por separado. La plantilla no es más que el index.html renombrado a index.php con el contenido principal vacío poco con una línea de PHP como esta:


[Get Code]
<?php
include ($_GET['page']);
?>

aquí le estamos diciendo que incluya in página llamada $_GET['page'], que una variable en PHP. Ahora sólo hay que decirle qué valor (qué pagina) es es variable y eso se indica por la URL de la siguiente manera;


http://ttwww/galeria/japp/index.php?page=intro.html

Así enviamos por URL (método GET, de ahí el $_GET) la variable page (que se recoje como $_GET['page']) con valor "intro.html) y así es la página que incluye. Se podrían enviar la variables que quisiésemos así:


http://ttwww/galeria/japp/index.php?page=intro.html&menu=principal.html&year=2006

Para hacer más simple la URL, podríamos poner el código PHP como:


[Get Code]
<?php
include ($_GET['page'] . ".html");
?>

de manera que siempre espera páginas .html y así poner en la URL index.php?page=intro únicamente. También sería útil poner unas líneas en caso de que no encuentre la página:


[Get Code]
<?php
if (isset($_GET['page'])) {
$page = $_GET['page'];
if (file_exists("pages/$page.html")) { include ( "pages/$page.html");
}
else {
print "<h2>Page not found</h2>";
}
}
else { include ("pages/home.html");
}
?>

Ahora todas las páginas están en el directorio pages/ y verifica que existe antes de incluirla y si no se pasa ninguna variable que ponga una página de inicio por defecto (home.html).


Par hacer un enlace a cualquiera de estas páginas, por ejemplo desde el menú de la izquierda, basta poner el enlace tal como es pondría en el URL:


[Get Code]
<a href="?c=intro" title="Presentación de mi sitio">Introducción</a>
<a href="?c=enlaces" title="Enlaces relacionados">Enlaces</a>

Hay que recordar que cuando usamos PHP en una página, el documento debe tener extensión .php y debe subirse al servidor (rives o externo) para probarse; ya no puede cargarse simplemente en el navegador como se hacía con html porque es PHP es un lenguaje de servidor y debe pasar por el servidor para que lo interprete.


Para saber más de PHP
http://www.freewebmasterhelp.com/tutorials/phpmysql
http://es.tldp.org/Manuales-LuCAS/manual_PHP/manual_PHP/index.htm
http://www.ignside.net/man/php/

Invitado
Invitado


Volver arriba Ir abajo

Ver el tema anterior Ver el tema siguiente Volver arriba

- Temas similares

 
Permisos de este foro:
No puedes responder a temas en este foro.