elhacker.net cabecera Bienvenido(a), Visitante. Por favor Ingresar o Registrarse
¿Perdiste tu email de activación?.

 

 


Tema destacado: Arreglado, de nuevo, el registro del warzone (wargame) de EHN


+  Foro de elhacker.net
|-+  Programación
| |-+  Desarrollo Web (Moderador: #!drvy)
| | |-+  HTML maquetacioin
0 Usuarios y 1 Visitante están viendo este tema.
Páginas: [1] Ir Abajo Respuesta Imprimir
Autor Tema: HTML maquetacioin  (Leído 1,170 veces)
Beginner Web


Desconectado Desconectado

Mensajes: 634


youtu.be/0YhflLRE-DA


Ver Perfil
HTML maquetacioin
« en: 14 Enero 2019, 05:04 am »

Hola chicos esta bien este mensaje de bienvenida que hice? no tengo algun error, alguna forma mas facil de hacerla? busco consejos  :huh:

Código
  1. <MARQUEE width="40%" BEHAVIOR=alternate>
  2. <p><span style="color: #339900;">#include &lt;iostream&gt;</span></p>
  3. <p><div style="font: normal normal 1em/1.2em monospace; margin:0; padding:0; background:none; vertical-align:top;"><span style="color: #0000ff;">using</span> <span style="color: #0000ff;">namespace</span> std<span style="color: #008080;">;</span></div></p>
  4. <div style="font: normal normal 1em/1.2em monospace; margin:0; padding:0; background:none; vertical-align:top;"><span style="color: #993333;">int</span> main<span style="color: #009900;">(</span><span style="color: #009900;">)</span></div>
  5. <span style="color: #008000;">{</span>
  6. <div style="font: normal normal 1em/1.2em monospace; margin:0; padding:0; background:none; vertical-align:top;"> <span style="color: #0000dd;">&nbsp;&nbsp;cout</span><span style="color: #000080;">&lt;&lt;</span><span style="color: #FF0000;">"Bienvenidos a mi blog"</span><span style="color: #000080;">&lt;&lt;</span>endl<span style="color: #008080;">;</span></div>
  7. <span style="color: #008000;">}</span>
  8. </MARQUEE>
  9. </BODY>


En línea

7w7
Embusterillo de bolsillo


Desconectado Desconectado

Mensajes: 1.333


Yo-jo Yo-jo Un Pirata Yo Soy ♫♫


Ver Perfil
Re: HTML maquetacioin
« Respuesta #1 en: 15 Enero 2019, 01:23 am »

Hola,

Podría preguntarte... ¿Cuál es tu objetivo? ¿intentas iniciar un blog? ¿es solo una página en blanco la que deseas diseñar?

Veo que estás iniciando en la parte web (perdona, solo podría inferirlo por el código html que suministraste; puede que seas más experimentada), lo cual puede generar mucho entusiasmo al principio: ¡Espero que no pierdas el impulso pues hay mucho por aprender! ... Cuenta con la ayuda de los usuarios de este foro para llevar a cabo tus proyectos.

Antes de responder tu duda puntual, quiero comentarte sobre dos grandes paradigmas en la web:

1. Contenidos dinámicos
2. Contenidos estáticos

Ambos están estrechamente relacionados; pero debes comprender inicialmente que la generación de contenido Dinámico se consigue aprendiendo lenguajes de programación que, de acuerdo a instrucciones suministradas, las interprete y genere contenido a demanda con base en la instrucción dada.

Pensar en contenidos dinámicos es útil pues permite trabajar con relativamente pocos archivos de instrucciones que hagan la mayor parte del trabajo por ti. Pongamos un caso de ejemplo a modo de anécdota:

Citar
Alex desea crear un foro de hackers. Desea que las personas puedan ver información que él publica en su sitio web, pero también quiere que las personas interactuen entre sí y generen contenido para el foro. Ahora bien, su idea es crear un archivo estático que sirva como índice. Lo publica.

Empiezan a llegar personas, y ven el contenido que él ha colocado en el archivo estático, pero Alex se da cuenta que las personas no pueden publicar nada porque al archivo solo tiene acceso él. Tendría que, literalmente, pedirle a las personas que lo llamen por teléfono y les dicte el contenido que quieren poner en su archivo estático. Alex tendría que hacer esto con absolutamente todos los participantes del foro. Elhacker.net tiene 300.000 usuarios.

Insostenible, ¿verdad? Pues bien. Alex se ingenia una manera de automatizar el proceso: Crea un programa para que, a través de un formulario que haga las veces de llamada telefónica, reciba los mensajes de las personas y los coloque en su archivo estático. Al hacer esto, las personas solo deben colocar sus respuestas y el programa las publicaría de forma automática.

Esto genera un inconveniente: Cada vez que el programa recibe una nueva publicación, crea un nuevo archivo estático. No parece un problema ¡hasta que se generan 500.000 temas! ... Y Alex quiere cambiar el logo de su página web... ¿Cómo modificaría 500.000 archivos individuales? ¡Otro cuello de botella!

Pues bien, Alex haya la manera de modificar el mismo programa para que, en vez de generar archivos individuales por cada publicación, más bien utilice una plantilla estática única y, que al ser ejecutada por cualquiera de los usuarios, muestre el contenido relevante del foro en cuestión. Siendo las publicaciones ahora almacenadas en una base de datos.

Se crea entonces este trabajo en equipo de tres componentes clave: El contenido estático (la plantilla); la Base de Datos (que aloja las publicaciones); El programa (que se encarga de la parte lógica, de las instrucciones, de decir: Cuando este formato reciba una publicación, debe alojarla en esta base de datos; y esta página estática debe mostrar dichas publicaciones)

Pues bien, ahora Alex puede cambiar el diseño de la plantilla base y sabrá que las 500.000 publicaciones tendrán el mismo diseño sin importar el momento; y se redujo la cantidad de archivos a unos cuantos (los que el programa con instrucciones requiera). Automatizó todo el proceso.

A modo general, así funcionan las páginas web. No toqué temas fundamentales como qué es un Servidor / Hosting; o cuál es el papel (hoy en día fundamental) del navegador web; porque se extendería mucho la anécdota.

Pero creo que es importante mencionarlo para decirte que, si tu intención es crear un Blog, entonces sepas que te encuentras en el segundo párrafo de mi anécdota. Estas creando un archivo estático; plano; que tendrás que alimentar tú manualmente siempre que vayas a actualizar contenido. Y sin una base de datos, esto será insostenible.

Descuida, no tienes que hacer tu propio programa de Foro, o Blog, o lo que desees... Ya hay programas hechos, muy famosos. Uno muy popular para Blogs es WordPress. Y puedes descargarlo e instalarlo tú misma en tu servidor; o bien, registrar tu propio blog en wordpress.com

Ahora bien, para tu pregunta puntual:


El código HTML es la manera en que los navegadores web interpretan la estructura de una página y la muestran ante tus ojos de acuerdo al modo en que dicha maquetación esté dispuesta. Tres jugadores fundamentales hacen parte de la renderización de tu página web: La estructura HTML en sí (las etiquetas); el estilo CSS (hojas de estilo); javascript (no es importante en estos momentos, para no complicarte la vida)

A grandes rasgos tu estructura es correcta, pero carece de varios aspectos fundamentales y algunos errores (el header, clases, una etiqueta obsoleta, y algunos tags). Déjame entrar en detalle con lo que para mí es realmente fundamental:

Lo ideal, señorita, es intentar no incluir parámetros de estilo dentro de la estructura HTML en sí. Esto se llama "inline css" y es una mala práctica en general. ¿Por qué? Porque imagina que tienes muchas línea de texto en tu página. Todas tienen el parámetro de estilo
Código:
color: #008000;
¿verdad? Bueno, ¿y si quieres cambiar el estilo de todo el texto al mismo tiempo? Volvemos a un escenario insostenible. Es por eso que existen las clases html.

Las clases son nombres que les asignas a las etiquetas HTML y al contenido que albergan, de tal modo que sus estilos sean globales en todo el sitio.

Escenario incorrecto:
Código:
<span style="color: #0000dd;">Hola mundo</span>

Escenario correcto:
Código:
<style type="text/css">
.mi-clase {
  color: #0000dd;
}
</style>

<span class="mi-clase">Hola mundo</span>

Y ahora podrás reutilizar
Código:
mi-clase
donde desees. Para cambiar el color, ahora solo tendrías que cambiar el único parámetro de color en la hoja de estilo y ya está.



Para finalizar: Cualquier duda que tengas no dudes en preguntarnos. Un buen lugar para iniciar con HTML es:
https://www.w3schools.com/html/html_basic.asp

El tema de las bases de datos y lenguajes de programación inevitablemente requiere un insumo vital: Un Servidor o Espacio de Hosting. Sin eso, no tendrás más alternativa que instalar un servidor local en tu PC; pero tu sitio web no sería abierto al público, y solo tú lo podrías ver.

Envíame un mensaje privado si deseas un espacio de hosting gratuito que puedo suministrarte; suelo alojar sitios web de estudiantes, pues a esto me dedico :xD y ya contarás con un espacio para hacer tus experimentos.


« Última modificación: 15 Enero 2019, 01:36 am por Filósotroll » En línea

Absence makes the heart grow fonder.
Páginas: [1] Ir Arriba Respuesta Imprimir 

Ir a:  

WAP2 - Aviso Legal - Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines