Un espacio para compartir.
Desde 2007.
inicial
255.337 visitas
Todos los materialesSobre este material
Descubre cómo se construye un sitio web estático con este curso de Dreamweaver CS. El recorrido propone pasar de la primera página HTML a la organización de un conjunto de páginas enlazadas entre sí.
Los ejercicios introducen la definición de un sitio de trabajo, las propiedades de las páginas y la incorporación de contenidos. También incluyen la preparación de imágenes y su inserción dentro de los documentos HTML.
Una parte del material se centra en las hojas de estilo CSS y en la aplicación de estilos a los elementos de la página. Este trabajo permite explorar la relación entre el contenido y su presentación visual.
El curso incorpora prácticas de conexión con un servidor mediante FileZilla y de subida de los archivos de la web. Puedes utilizar la secuencia de actividades para entender cómo se organizan los documentos de un proyecto sencillo.
Se trata de un material vinculado a Dreamweaver CS que también contiene técnicas de maquetación propias de su época, como las tablas. Es útil como introducción y consulta histórica, pero los procedimientos deben contrastarse con las herramientas y prácticas actuales antes de aplicarlos a un proyecto nuevo.
Prepárate, practica, aprende
Creación de la primera página HTML con Dreamweaver.
Definir un sitio con Dreamweaver.
Configuración de la conexión con el servidor mediante FileZilla. Subimos nuestra primera web al servidor.
Creación de una hoja de estilos. Implementación de estilos.
Aplicación de estilos en un documento HTML. Propiedades de la página.
Creación de más páginas HTML para poder enlazarlas después.
Tratamiento de imágenes con Photoshop
Insertar imágenes en un documento HTML.
Enlazar distintos documentos HTML.
Manipulación del archivo estils.css.
Enlaces entre páginas
Maquetación del contenido mediante tablas.
Maquetación del contenido mediante tablas e inserción de vídeos de YouTube.
Maquetación del contenido mediante tablas.
Creación del índice de nuestra web.
Creación del índice de libros.
Creación de la página de libros de cada autor.
Enlaces con anclas
Els que hagueu seguit el problema del Sergi amb el formulari PHP, sapigueu que la solució és que el servidor que té no té habilitada la funció mail necessària per poder enviar formularis de la manera aquí plantejada. Amb un canvi de servidor ho ha tingut solucionat.
Ostres, ja veig que el tema no funciona ja que quan prems el botó enviar no surt el missatge d'agraïment. Aquí tens un problema que no aconsegueixo veure... No crec que sigui que tens un "ç" a l'adreça i això no estigui permès en una variable... Envia'm el fitxer sencer a xevi.vb@gmail.com, el penjaré directament al meu servidor i ho provem. Si sense tocar absolutament res funciona és que tens un problema amb el teu servidor. Si no, seguirem buscant...
El nom del fitxer q pujo al servidor (awardspace.com) és el mateix que el q crida al formulari: "formulari.php". Si vols fer comprovar el seu funcionament ho pots mirar a quadratonics.awardspace.com --> contacte. He estat mirant tb les opcions de php del meu servidor. No n'he trobat cap referent a que s'hagi d'activar alguna opció pq funcioni el php, en principi el soporta.
Hola Sergi. Primer de tot, ja he arreglat el codi que m'has enganxat en el formulari de contacte. Segona cosa: a mi em funciona correctament (he provat el teu codi en el meu servidor i funciona). L'error pot estar en que l'arxiu que envies al servidor s'ha de dir formulari.php (no se si és el teu cas). Fixa't que el formulari, quan prems el botó enviar, el que fa és cridar un altra vegada a l'arxiu formulari.php passant les dades introduïdes al formulari per paràmetre i això és el que detecten els condicionals (if) del codi. O sigui que l'arxiu formulari.php és cridat dos vegades: una per mostrar el formulari i l'altra per enviar el correu i mostrar el missatge d'agraïment. Per aconseguir això el nom que crida el formulari un cop enviat i el fitxer que envies al servidor ha de ser el mateix. Diga'm si és això o no.
He copiat i enganxat el codi en un comentari i ha sortit el formulari, no sabia q interpretés html... si no poguessis llegir el codi te l'enviaria x correu a l'adreça q hem diguessis.
Bones altra vegada Xevi! Doncs sí, el servidor q tink (awardspace.com, no sé si et sona...) soporta php (puc escollir entre la versió 4.4.1 o 5.2.5). Akesta es la url d la pagina: quadratonics.awardspace.com i a continuació et passo el codi html de la pàgina concreta que conté el formulari : VEURE CODI Merci!!
Quan descarregues el FileZilla per primera vegada, l'arxiu d'instal·lació pot ser que se't guardi a l'escriptori. Llavors un cop instal·lat, l'accés directe cap al programa també se't guarda a l'escriptori. Com que tan l'arxiu d'instal·lació com l'accés directe del programa ja instal·lat tenen el mateix icona, pot ser que llavors a l'hora d'engegar-lo et confonguis. Hauries de veure quin és quin. L'altra tema, un cop engegat el programa, inicialment la pantalla està dividida en 4 parts (això és una opció de configuració que es pot arreglar). Per connectar amb el servidor, a dalt tens 3 camps per omplir: amfitrió (servidor), nom d'usuari i contrasenya. Llavors prement CONNEXIÓ RÀPIDA s'ha de connectar correctament.
Hola, m'he baixat el Filezilla, però: 1r. cada vegada que el vull obrir haig d'intalar-lo, doncs surt el I gree, next, next....No s'instal.la definitivament? 12n. una vegada obert, com puc conectar amb el teu servidor per veure la meva pàgina provisional? 3r. la pàgina del filezilla esta partida en quatre i no en dues, Sitio local Sitio remoto Nombre de arc... Nombre de arc... Apa, siau.
Per cert, perquè tot això funcioni és necessari que el servidor admeti PHP, per tant hauries de revisar també aquesta qüestió...
Sergi, cap problema, envia el codi a veure què hi puc veure.
Com diu en Sergi, si instal·les la versió de la pàgina oficial no has de tenir cap problema. Però coneixent-nos, anem pas per pas: 1-Treure versions antigues del FileZilla: ves a Inicio -> Panel de Control -> Agregar o quitar programas i elimina qualsevol versió del FileZilla que encara puguis tenir. 2-Ves a l'escriptori i elimina qualsevol icona del FileZilla que pugui quedar. 3-Obre l'Internet Explorer i ves a la pàgina oficial de FileZilla. 4-Allà descarrega l'última versió estable (avui és FileZilla_3.1.6_win32-setup.exe (recommended)). 5-Ens demanarà si volem guardar el programa o executar-lo. Li diem EJECUTAR. 6-Instal·lem el programa (I agree, next, next...) 7-Quan el programa acaba d'instal·lar-se, premem FINISH i ACEPTAR i ja s'executa ell solet. I ja està, ja em diràs si t'ha funcionat!
Bones!! Jo hem vaig descargar el Filezilla des de la seva pagina principal ( http://filezilla-project.org/download.php?type=client ) i no he tingut cap problema ni en la instal·lació ni posteriorment. Sort!!
Mira ara t'explico el que acabo de fer per cinquena vegada avui: - dos clics a l'anagrama del FileZilla que només tinc a l'excriptori - clico I agree - clico next, next, nxet, next, intall, i finish la pantalla fa una reacció i el FileZilla no s'obra. A mi aquest aparell no em vol creure.....
Xevi, ho sento però no hi ha manera que se m'instal.li el FileZilla. El busco a aquesta web per tornar-lo a baixar i no el trobo. Em pots tirar un "cable"?. Gràcies.
Bones altra vegada Xevi, doncs bé, ja he actualitzat la web al servidor amb el nou formulari i no aconsegeuixo q m'arrivi cap mail al correu amb la informació. Per fer una altra prova, també he fikat un enllaç amb l'exemple del formulari del manual. L'omplo, clico al botó enviar i tampoc m'arriva res al correu. Si vols et puc passar el codi de la pàgina pq li facis una ullada, però l'he revisat uns quants cops i diria q segueix la mateixa estructura q la del manual. A veure si entre tots ho podem solucionar! Merci!!!!
Hola Sergi! És necessari penjar la web al servidor per veure si funciona (a no ser que configuris un servidor local de correu, tinc entès, cosa que jo no he fet...).
Bones Xevi, doncs un cop aclarits els dubtes (gràcies!), ara el problema q tink es q no m'arriba cap mail al correu amb les dades del formulari. Es expressament necessari penjar la web al servidor remot pq funcioni el php? O només provant la web amb qualsevol explorar ja hauria de funcionar?
Hola Sergi. Aquestes etiquetes les has d'escriure tu (el Dreamweaver només et genera el formulari). Pel tema del dos fitxers, la resposta és no. Només hi ha d'haver un fitxer que és el formulari.php, que de fet és el que tens el codi sencer en el manual. Aquest fitxer conté el formulari (que amb Dreamweaver serien tot el que hi ha entre les etiquetes form) i el codi PHP que em diu quan un usuari ha premut el botó ENVIAR. En aquest cas (tota la part de sota del codi), és quan agafa les dades entrades en el formulari, les monta en la variable $cos i ho envia tot per correu electrònic. Si tens cap més dubte pregunta sense por.
Bones, he estat seguint aquest manual i m'han sorgit un parell de dubtes, q no sé si me'ls podries resoldre. Dius q s'ha de crear un fitxer contacte.php i a dins crear-hi un formulari. Un cop inserit el formulari, si mirem el codi, no hem surt enlloc les etiquetes del tipus "" abans de les estiquestes . No sé si es per que he creat el fitxer de manera erronia. I una altra cosa q no hem queda massa clara: Hi ha d'haver 2 fitxers per realitzar el formulari? És a dir, un amb el fitxer .php amb el formulari i l'altre amb la pàgina web completa (.html) q contindrà, entre altres coses, el formulari? Merci per tot!!
Com ja vaig dir la setmana passada, he posat alguns continguts nous a la secció d'enllaços d'aquest manual. La majoria són manuals explicatius que he trobat per internet i que estan realment bé. El que parla de com enviar un formulari per correu electrònic i el de posar un reproductor de música mp3 a la web són de collita pròpia. Seguiré actualitzant. Espero els vostres comentaris i/o aportacions (que sempre seran benvingudes).
Ostres, la meva intenció és ampliar el curs de Dreamweaver amb material que ja tinc mig preparat en breu. He detectat que aquestes seccions se les mira molta més gent de la que em pensava, que no són només els meus alumnes, i això m'omple de satisfacció. Espero en breu poder penjar aquests materials de Dreamweaver i les solucions de matemàtiques.
Bones Xavi, tens pensat actualitzar aviat aquest manual?? Està molt bé, sobretot els exercicis!!