Marcadors i Estils CSS

Com veureu, la sessió va ser realment intensa i profitosa… I és que també vam aprendre a crear marcadors! Aquesta opció ens permet enllaçar amb un punt determinat d’una pàgina. És el què a les URL apareix darrere el símbol #. Per exemple: Podem crear marcadors en un llibre on-line, de manera que si cliquem damunt del títol del capítol anem directament al capítol seleccionat.

Per crear aquests enllaços premem la icona de l’ancla allà on vulguem situar el marcador i li posem una etiqueta. LLavors creem un vincle a aquest marcador posant a l’espai “vínculo” el símbol # i el nom de l’etiqueta (p.ex. #capitol1).

Per fer un link d’una pàgina (p.ex. la pàgina index.htm) a un punt determinat del llibre on-line (p.ex. al segon capítol), creem un vincle a l’arxiu a l’arxiu on hi ha el punt on volem anar i a continuació hi posem el marcador i el nom de l’etiqueta (p.ex. libro.htm#capitol2).

FULLS D’ESTIL o Estils CSS: Aquesta opció funciona també a través d’etiquetes i ens permet aplicar els canvis d’estil a totes les pàgines que tenim i no haver de fer-ho d’una en una. Alguns exemples d’etiquetes serien:
- body: per definir l’estil del cos de les pàgines (color del text, del fons, etc.)
- a: per definir l’estil dels links, podem fer-los com nosaltres volguem.

Com crear formularis amb Dreamweaver

En la nostra segona sessió experimentant amb el Dreamweaver hem après a crear formularis. A veure si em sé explicar:

- Dins la opció “común” seleccionem “formulario”. Per crear-lo escollim la opció “insertar formulario” i ens apareixeran unes línies discontínues a la pàgina que delimiten l’espai on s’ha de situar el formulari.

Hi ha diferents elements que podem utilitzar a l’hora de crear el formulari i tots han de tenir el seu nom:
- Camps de text: Perquè l’usuari hi pugui introduir un text, amb un nombre determinat de caràcters o no.
- Botons d’opció: L’usuari pot escollir entre diverses opcions (per exempre: home/dona, casat/solter, etc.)
- Botó “Lista/menú”: L’usuari pot escollir una opció a partir d’una llista que hem creat amb aquesta eina
- Campo oculto: Aquest camp ens permet, per exemple, saber d’on prové la resposta de l’usuari que envia el formulari. Ell no ho veu, però a nosaltres ens permetrà tenir-ne més informació.
- Botó d’enviar: Serà el botó que enviarà la resposta de l’usuari allà on tinguem assignat. Aquest botó pot portar el nom que vulguem (enviar, esborrar, etc.)

Per poder rebre les respostes dels formularis al nostre correu electrònic l’hem de vincular a una web que faci d’intermediària, una espècie de software que ens enviarà les respostes en base als noms que posem a cada camp. Per això és tant important que tots tinguin un nom.

Per fer que tots els camps quedin alineats els podem incorporar dins d’una taula, per exemple, de 2×2. Per agregar més files, ens situem a l’última cel·la i premem el tabulador.

Descobrint el Dreamweaver

Dreamweaver és una aplicació informàtica que ens permet crear pàgines web editant amb llenguatge html. Aquest editor és del tipus WYS/WYG, és a dir, “what you see is what you get“.

Per començar, hem après a canviar de color, tamany i tipus de lletra a través del menú “propiedades” del programa. Aquest menú apareix a la part inferior i varia segons el què tenim seleccionat.

També hem creat links, tant a un arxiu del sistema com a altres pàgines web:
- Si linkem a un arxiu hem de prémer sobre “señalar archivo” i arrossegar el cursor fins el document que ens interessa.
- Si linkem a un web hem d’anar a l’opció “Vínculo” i anotem la URL a l’espai en blanc que hi ha al costat. Si volem que aquest web s’obri en una pàgina diferent sense perdre la nostra, anem a l’opció “Dest.” i hi posem “_blank_”. Les altres opcions actualment ja no s’utilitzen.

Per altra banda, també hem sabut com canviar l’aspecte de la nostra pàgina: el fons, el color de la font, el color dels vincles, els marges, etc. a través de l’opció “propiedades de página“. Dins d’aquesta opció també podem posar títol a la pàgina que hem creat, tot i que també es pot posar i modificar des de la pàgina principal de Dreamweaver. Aquest títol és el que apareixerà al buscador i a la pestanya quan entrem al web.

També hem insertat vídeo i imatge flash al web i l’hem traslladat al nostre blog, fent un “copy&paste” del codi html que es genera a l’editor. En el cas d’un arxiu flash, abans de res ens hem d’assegurar que està guardat al disc on tenim guardats els arxius .htm de la nostra pàgina.

Finalment, també hem après a crear taules i hem descobert que, de fet, totes les pàgines web estan estructurades a partir de taules. Per fer-ne una cal anar a l’opció “Insertar – tabla” on podrem escollir:

- el nombre de files i columnes
- l’amplada de la taula, que pot ser en % o en píxels. Si, en aquesta opció, no hi posem res la taula anirà ocupant l’espai en funció del què hi posem.
- l’espai, en píxels, entre els límits de la cel·la i el text que hi ha a dins (opció “Rell. celda”).
- l’espai, també en píxels, que volem entre cel·la i cel·la (opció “Esp. celda”).
- el gruix del contorn.

Com en Word, les caselles de la taula també es poden combinar, unint-les o dividint-les.

Una vegada hem creat la taula també la podem exportar al blog, copiant el codi html de la pestanya de “diseño” de l’editor i enganxant-lo a la pestanya de “codi” del post on ho vulguem insertar, tal com hem fet a l’insertar el vídeo.

Insertar una taula des de Dreamweaver

Dies	de 9 a 12	de 12 a 14	de 15 a 17
Dilluns	RSC	Innovació	Organització actes
	Marketing
Dimarts	Gestió de la marca	Comunicació de Crisi	Gabinets MMCC
Dimecres	Tecnologies digitals	Marketing	Innovació
		RSC
Dijous	Organització actes	Comunicació interna
Divendres	Gabinets MMCC	Gestió de la marca	Tecnologies digitals

Colors i formes amb Dreamweaver

Bona tarda!!! Avui és dissabte i fa molt bon dia… A veure si descobrim com funciona el DREAMWEAVER!!!

Formats d’imatges

Hi ha 3 tipus d’imatges que podem posar a la web:

jpg - L’utilitzarem sempre que tinguem una imatge real, una foto. Comprimeix molt bé la informació, és a dir, l’arxiu pesa poc i la qualitat és bona.

gif – S’utilitza per imatges amb pocs colors (256 colors). En aquest cas comprimeix millor que el format jpg. Amb aquest tipus de fitxer podem escollir 1 color de transparència, llavors a l’insertar la imatge aquest color no es veurà (com el color  verd als espais de “El Temps” de TV3). Permet gravar diferents imatges en un sol arxiu i dir el temps que ha de passar entre una imatge i una altra (gifs animats).

png – Dóna una bona compressió, com el jpg, de milions de colors i permet també les transparències, però no les imatges en moviment.

Memòria caché – En un fitxer htm hi ha insertades diferents imatges.

Indiana Jones descafeïnat

Com sabreu, el Sr. Harrison Ford s’ha tornat a posar el barret d’aventurer i ens regalarà una nova entrega d’Indiana Jones: Indiana Jones and the kingdom of the Chrystal skull. M’agradarà veure quines peripècies li esperen al pobre Indy, que es deu estar a punt de jubilar…

 

De moment, els nord americans ja han fet de les seves amb el trailer i hi han realitzat alguns “retocs”. Vaja, que n’han censurat i retocat algunes imatges. En una de les escenes de la pel·lícula es pot veure com uns soldats armats de l’exèrcit americà apunten el “jove” Indy i el seu company. Doncs bé, en el trailer que es passarà a USA les armes han “desaparegut” misteriosament mentre que al trailer internacional no les han escatimades. 

Segons sembla, aquest retoc s’hauria fet per aconseguir que el trailer pogués tenir la qualificació de apta per tots els públics en el territori americà, ja que pel què es veu no estaria permès que soldats americans apuntessin a ciutadans americans… Curiós no? Per una banda apliquen aquest tipus de censures sense sentit i, per altra, la gent pot anar armada fins a les dents, fent cursets de tir a menors d’edat, etc. En fi… aquí tenim un gran exemple de la doble moral americana (d’USA, no generalitzem!).

Us adjunto els dos trailes, primer la versió internacional i llavors la d’USA, a veure si hi trobeu més diferències…

And the Oscar goes to…

Com tots ja sabeu, aquesta passada matinada (hora nostra) s’ha celebrat la cerimònia d’entrega dels Òscar. L’entrega de premis més famosa de totes les que es fan i es desfan. I aquest any encara més, si tenim en compte que totes les televisions han anat plenes durant setmanes (fins i tot m’atreviria a dir mesos) de la nominació a l’Òscar de l’actor espanyol Javier Bardem com a millor actor secundari en la pel·lícula “No country for old men“, o més coneguda com a “No es país para viejos” en aquest racó de món. Per cert, traducció molt literal però poc afortunada, crec. I és que sona fatal! Pel meu gust valia més la pena deixar-ho en anglès… Bé que dèiem Brokeback Mountain, per exemple… no?

Un altre aspecte molt destacat als mitjans d’aquesta banda del globus és el fet que els millors premis se’ls han endut actors i actrius europeus. Suposo que els americans no ho deuen haver trobat tant important…

Us en faig un breu repàs:

Millor pel·lícula: “No country for old men” dels germans Coen (USA)

Millor actriu: Marion Cotillard per “La vie en rose” (francesa)

Millor actriu secundària: Tilda Swinton per “Michael Clayton” (anglesa)

Millor actor: Daniel Day-Lewis per “There will be blood” (o ”Pozos de ambición”, una altra gran traducció) (irlandès)

Millor actor secundari: Javier Bardem per “No country for old men” (espanyol)

Millor direcció i millor guió adaptat: Joel i Ethan Coen per “No country for old men” (USA)

Millor pel·lícula estrangera: “The counterfeiters” (Austria). Casualment aquest premi només pren importància quan la pel·lícula nominada és del país en qüestió… És com Eurovisión.

Us he de ser sincera i dir-vos que encara no he vist  cap d’aquestes pel·lícules. Així que no puc criticar-ne ni elogiar-ne cap… Però espero poder-me posar al dia aviat, que ja tinc mono de cine!

Tema de la setmana

Aquesta setmana escriuré sobre CINEMA, una de les meves aficions.

I ara pengem vídeos!

Una miqueta de música…