How To Create Website In Dreamweaver

Posted on

How To Create Website In Dreamweaver – Crea un sitio web con Dreamweaver de principio a fin En este video te mostraré cómo configurar tu sitio web en Adobe Dreamweaver…

Hola a todos, aquí Greg Davis. En este video te mostraré cómo crear tu propio sitio web usando Dreamweaver.

How To Create Website In Dreamweaver

How To Create Website In Dreamweaver

En el primer video creamos el diseño del sitio web, todas las imágenes, y ahora configuraremos el sitio web.

How To Create And Open Files In Dreamweaver

Entonces, cuando abra Dreamweaver, verá la pantalla INICIO, como puede ver aquí. Primero, definamos un nuevo sitio de Dreamweaver.

Bien, dale a tu sitio web un nombre como yourwebsite.com. No aparecerá en ningún otro lado, es solo para ti. Mi nombre es “Sitio1”.

Ok, necesito mostrar a Dreamweaver dónde está mi carpeta local. Y en el primer video creé una carpeta de sitio web, así que LOCALIZÉ mi carpeta de sitio web.

“Sitio1” era el nombre de la carpeta de mi sitio. Hago clic, selecciono, presiono guardar y listo.

The Dreamweaver Cs4 Workspace

Y es por eso que hacemos esto, para que la próxima vez que abra Dreamweaver, no tenga que navegar de nuevo por la carpeta del sitio.

Haga clic en este menú desplegable y todos los proyectos de su sitio web se enumerarán aquí, seleccione el sitio web en el que desea trabajar y Dreamweaver abrirá la carpeta del sitio web. Así que es un gran ahorro de tiempo.

Y si desea editar su sitio de Dreamweaver, haga clic en Administrar sitios, seleccione su sitio, haga clic en editar y podrá editarlo. También puede crear un nuevo sitio o eliminar un sitio. Bien, cierro.

How To Create Website In Dreamweaver

Y nuevamente, puedes ver aquí con la carpeta de mi sitio web abierta. Están mis carpetas “Fuegos artificiales” y “Fotos” que creé en el primer video. Y voy a almacenar mis páginas web aquí, así que vamos a crear una nueva página html.

Creating A New Dreamweaver Site

Y esta es la página principal de un sitio web. Entonces, cuando escribe yourwebsite.com en un navegador, o en cualquier URL de sitio web sin una extensión, el navegador busca una página de índice dentro de la carpeta del sitio web en el servidor web.

Entonces, la página de índice es la página de inicio, pero otras páginas, por ejemplo, si tiene una página de productos.html en la carpeta de su sitio y cargada en su servidor web, estarán disponibles en su sitio.

Y si tiene una carpeta en la carpeta de su sitio web yourwebsite.com/thefoldername/ y el nombre del archivo. Si no coloca un nombre de archivo después del nombre de la carpeta, el navegador también buscará una página de índice en esa carpeta en particular. Entonces funciona así.

La primera línea es el DOCTYPE. XHTML 1.0 Transitional es el tipo de documento predeterminado de Dreamweaver, que es la primera línea.

Connect Dreamweaver To A Dreamhost Server

La segunda línea es la etiqueta html inicial y la inferior es la etiqueta html final. Cada etiqueta tiene una etiqueta de inicio y una etiqueta de finalización. Y la etiqueta final se indica con una barra oblicua, por lo que esta es mi etiqueta final html. Y tienes que poner todo dentro de tu etiqueta html.

Bien, la tercera línea es mi etiqueta de inicio. Las etiquetas de encabezado no son visibles cuando miras una página web, pero son importantes.

Dentro de mi etiqueta de encabezado tengo una metaetiqueta para codificar los caracteres. El valor predeterminado es Utf-8, que es el que utilizan la mayoría de los servidores web. Y tengo mi última metaetiqueta aquí porque es una etiqueta de cierre automático.

How To Create Website In Dreamweaver

Y luego estamos yo y la etiqueta. Nuevamente, cada etiqueta tiene una etiqueta de inicio y una etiqueta de finalización. Y la etiqueta final se indica con una barra oblicua.

Dreamweaver Vs. WordPress: Which Is A Better Website Builder?

Bien, debajo de mi etiqueta de encabezado, puedes ver un GAP. Ya sabes, los navegadores procesan el código en orden y no se preocupan por los espacios entre tus elementos. Luego puede agregar más espacio si lo desea.

Bien, en la siguiente línea tengo mi etiqueta BODY inicial. Y lo que es realmente visible en su navegador estará en la etiqueta del cuerpo de su página.

Bien, volvamos al código, y ahora dentro de mi etiqueta de cuerpo tengo una etiqueta de párrafo inicial, mi texto, luego una etiqueta de párrafo final. Tengo otro párrafo, así que está mi etiqueta final de cuerpo y luego mi etiqueta final HTML.

Entonces, todo lo que su navegador ve para su página estará dentro de su etiqueta de cuerpo.

Moosey Productions Adventure Blog: Why I Use Dreamweaver

Y puede poner tantas etiquetas como quiera dentro de una etiqueta, pero si comienza una etiqueta de cuerpo, por ejemplo, y luego comienza una etiqueta de párrafo, primero debe cerrar su etiqueta de párrafo y luego puede cerrar la suya en el marcado. . cuerpo. 🇧🇷 Para que tus etiquetas no se superpongan.

Básicamente, usamos etiquetas para organizar las páginas web. También podemos usar tablas, pero las tablas generan mucho código y eso no nos gusta. Las tablas son excelentes para los datos, pero usamos divs para el diseño.

Y puedo aplicar un estilo de clase o un estilo de ID a mi etiqueta div. La única diferencia entre los estilos de clase y los estilos de ID es que un ID es un identificador único para un elemento. Entonces solo puedo aplicar el estilo de ID a UN elemento por página. Así que básicamente aplico el estilo de clase a mis elementos.

How To Create Website In Dreamweaver

Será el estilo de clase, aquí está el nombre del estilo de clase. Está diseñado con un punto en la parte delantera, porque es un estilo CLASS. Se genera un estilo de ID delante de una etiqueta hash.

How To Make A Responsive Website Design In Dreamweaver Cc 2021

Ok, explico mi regla en este documento. Usaremos un archivo de hoja de estilo externo más adelante, pero esto es solo un ejercicio rápido.

Le di un margin-left:auto y un margin-right:auto para centrarlo. De esta manera, realmente puede centrar una etiqueta div.

Selecciono ver mi borde de 10 px y el relleno de 20 px. Y di margin-left:auto y margin-right:auto para centrar.

Ok, entonces mi etiqueta div tiene 400px de ancho desde este punto. Por lo tanto, el relleno y el borde no están incluidos, aumentan el tamaño total de mi caja.

Build Your Own Website With Dreamweaver

Y como no tenía ningún contenido dentro de mi etiqueta dip, Dreamweaver lo puso en esta línea, pero puedo escribir lo que quiera.

Bien, activé la vista previa en vivo y ahora puedo ver cómo se ve mi página en el navegador.

También puede obtener una vista previa de su página en un navegador, y debe revisar sus páginas en diferentes navegadores para asegurarse de que se vean como usted desea.

How To Create Website In Dreamweaver

Así que adelante e instale todos los navegadores populares como Chrome, Firefox, IE, Opera y Safari en su computadora. Luego haga clic en Editar lista de navegadores y agregue esos navegadores a su lista.

How To Create A Website

Lo encendí y ahora puedo ver el relleno y los márgenes de mis diferentes elementos.

Paso el cursor sobre un elemento, digo mi etiqueta div y la vista previa azul que ve es el ancho y la altura reales del elemento. Hay acolchado morado, una variedad de adornos azules y un adorno amarillo.

Aquí está mi etiqueta BODY de apertura y, como mencioné anteriormente, todo lo visible en su navegador estará dentro de la etiqueta BODY de su página.

Después de la etiqueta de inicio de mi cuerpo, hay una etiqueta de inicio de inmersión. Así es como me metí en esto, después de mi etiqueta corporal inicial. Se le aplica un estilo de clase, llamado “firstdivtag”.

Adobe Dreamweaver Introduction. Certificate Course

Así que tengo mi TEXTO dentro de mi etiqueta div, rodeado por una etiqueta de párrafo

. Etiqueta de inicio y etiqueta de fin. Hay otro párrafo.

Y luego está mi última etiqueta div y los otros 2 párrafos que escribí antes. Pero están fuera de mi rango de buceo. Luego está mi etiqueta de cuerpo final y mi etiqueta html final.

Y dentro de la autoetiqueta, incluyo mi hoja de estilo CSS. Esta es la marca de inicio de mi estilo y esta es la marca final de mi estilo. CSS es un lenguaje que funciona con html, y una hoja de estilo CSS es básicamente una colección de reglas.

How To Create Website In Dreamweaver

Dentro de mi hoja de estilo solo hay una regla: el estilo de la clase que creé. Se llama “firstdivtag” con un punto al frente porque es un estilo de clase.

How To Create A Web Page Using Html In Adobe Dreamweaver

Y dentro de mis mechones rizados tengo todos los atributos y valores de este estilo de clase único. Como lo quiero: fondos, márgenes, todo está ahí.

Y es muy fácil también. Hay una propiedad, por ejemplo altura, y hay un valor real, pero por supuesto puedo cambiarlo en cualquier momento.

Una forma es tener una hoja de estilo incrustada, como esta. Se agrega a la página misma y a mi etiqueta de encabezado.

Otro método es vincular la página a un archivo de hoja de estilo externo. La ventaja de usar una hoja de estilo externa es que puedo diseñar un sitio web de 1000 páginas en un solo lugar. Solo necesito un archivo css externo y puedo definir todo

Adobe Dreamweaver Web Design Software Review

How to create free website, how to create website in google free, how to create easy website, how to create a website, how to create website google, how to create own website, how to create a website on dreamweaver, how to create a website with dreamweaver, how to create a website using dreamweaver, how to create website with dreamweaver, how to create a website dreamweaver, how to create a website in dreamweaver

Leave a Reply

Your email address will not be published. Required fields are marked *