Google


html

HTML
Javascript i Java
Shockwave/Flash
Fitxers comprimits (ZIP)

Vegeu també:
Consells bàsics per crear i mantenir una web que funcioni.

Planificació i creació de continguts: Pas a pas.

Notes sobre el disseny d'aquestes pàgines.

 

Per on començar amb l'edició de pàgines web.
Quin camí seguir? Per on començar?
Voleu aprendre ràpidament a crear continguts per a pàgines web i editar-les. Molt bé. No us resultarà gens difícil. Ho era molt més per als que vam començar fa uns anys; ara és més intuïtiu i les eines són fàcils de manejar.
Quin camí trobam aconsellable seguir?

Pensam que la manera que per a la majoria pot ser més simple és:

  • Primer, familiaritzar-se amb els elements que componen una pàgina web i aprendre la terminologia que s'usa. Però no de forma teòrica: fent modificacions de pàgines web, o creant-ne de noves.
  • Segon, aprendre a lligar unes pàgines amb altres, aprendre les normes bàsiques del disseny per a la web i utilitzar les imatges amb eficàcia i gust.
  • Si teniu curiositat (tot i que això difícilment us farà falta, avui) també podeu veure quina és la base dels editors visuals: aprendre les principals ordres del llenguatge HTML.


A Vigital trobareu informacions útils per tots aquestes fases del vostre aprenentatge. Aquí us plantejam uns consells inicials perquè pogueu planificar-lo i començar a fer coses concretes.


Com guardar pàgines completes.
La millor manera de començar a treballar amb l'edició i creació de pàgines web és editar una pàgina guardada al disc dur. Primer, cal saber com guardar-la correctament (amb tots els elements gràfics inclosos.)

Si treballau amb Netscape Navigator, podeu guardar una pàgina completa, amb imatges incloses, de la següent manera: Aneu a Archivo | Editar con Composer... Obrirà una finestra nova amb l'editor de pàgines web que inclou Netscape, Composer (que s'identifica a la part inferior de la finestra amb una ploma i un paper.) Ara simplement cal que trieu la carpeta que volgueu i guardau-lo amb Archivo | Guardar.

Amb Internet Explorer versió 5, basta que aneu a Archivo | Guardar como pàgina web completa. El programa guarda la pàgina web a la carpeta indicada i crea una subcarpeta amb els gràfics i altres fitxers auxiliars (com ara fulls d'estil.)

Si utilitzau una versió anterior de Internet Explorer, és un poc més complicat (caldrà que guardeu la pàgina web, cada un dels gràfics, i després modificar l'HTML perquè puguin mostrar-se correctament els gràfics), de manera que no és un bon punt de partida per un principiant. Tanmateix, planejau-vos actualitzar la vostra versió de l'explorer (és gratuït i fàcil d'obtenir, bé de la web, bé en cd-rom.)

Treballar amb l'editor bàsic.
Abans d'investigar el llenguatge de definició de les pàgines web, potser trobareu més fàcil modificar alguna de les pàgines que heu guardat i veure quins són els elements de la pàgina i com es manegen. És realment senzill. Obriu l'aplicació FrontPage Express o el Composer (els editors gratuïts inclosos, respectivament amb Explorer i amb Netscape.). Amb aquests programes us familiaritzareu molt aviat amb la manera en què es crea una pàgina web, i que no està molt lluny de com treballam amb el processador de textos.

L'ajuda dels programes és completa i fàcil d'entendre, i no falten manuals que es poden comprar a qualsevol llibreria.
És hora d'aprendre diferents coses:

  • Provau de fer alguna taula;
  • Canviar colors dels tipus de lletres.
  • Canviar els gràfics, eliminar-ne o afegir-ne...
  • Manejar diferents tipus d'elements de text: paràgrafs, llistes...
  • Creau enllaços dins de la pàgina o altres pàgines.

Podeu fer totes aquestes proves amb una pàgina que creeu des del principi vosaltres mateixos.


Fer la feina més seriosament.
En poc temps ja sabeu com crear una pàgina web.

FrontPage Express o Composer són més que suficients; i si voleu retocar alguna coseta a nivell de codi HTML, us basta el bloc de notes o Notepad. Els gràfics podeu crear-los amb algun programa dels que teniu (vegeu la secció gràfics per a la web.)

Però crear una web no és el mateix que editar una pàgina -així com no és el mateix escriure una pàgina que un llibre sencer! Cal tenir en compte moltes altres coses: sobre tot, planificar bé el que volem.

Llegiu els articles sobre idees bàsiques per a la creació de pàgines web i l'especial que hem preparat sobre el disseny de Vigital.

Amb el temps, si us plantejau crear una web una de debò, potser us convendrà provar un editor més potent, com els que comentam a un altre article, i algun dels programes editors de gràfics, editors de fulls d'estil, etcètera que també comentam a una altra secció de Vigital. I si sou ambiciosos amb els gràfics que voleu utilitzar, també us plantejareu algun editor d'imatges amb més prestacions que les coses bàsiques que inicialment podeu tenir. De tot això en trobareu àmplia informació a aquestes pàgines.

HTML?
Una pàgina Web és superficialment semblant a qualsevol altre document: un text, unes imatges, tot endreçat d'una determinada manera. Si mai no heu fet una pàgina web, no us serà gens problemàtic aprendre'n. És realment senzill (Crear els continguts per a una pàgina Web ara és infinitament més senzill que fa uns cinc anys, quan el Web començava a extendre's per tot arreu i la gent intentava crear les seves pàgines.

Una pàgina web és un tipus de fitxer que té poc de particular: és senzillament un fixter de text, amb una extensió .html o .htm (de hypertext markup language) que l'identifica, i que conté el text més una sèrie de codis que permeten donar-li format (per exemple, distribuir en columnes, posar en negreta, assignar colors). El Navegador (normalment Internet Explorer o Navigator) interpreta els codis i mostra correctament en pantalla la informació que conté el fitxer htm.

Per comprovar això, obriu el Bloc de Notes de Windows (o, si heu fet cas de les nostres recomanacions, el NoteTab) i obriu un fitxer htm qualsevol del vostre disc. Si encara no domineu el tema, i no sabeu on pugui haver-n'hi un, podeu cercar-lo utilitzant l'explorador de windows (herramientas>buscar : teclegeu *.htm) Encara que no hagueu guardat cap fitxer d'aquests al disc, n'hi ha d'haver al caché de l'explorador i algunes ajudes de programes.

Les imatges o altres afegits que aparentment conté la pàgina web NO estan dins del fitxer htm; estan enllaçats a través d'un codi que indica quina imatge s'ha de mostrar, les seves dimensions, la localització...

Així que la pàgina web, vista amb un editor de text, conté una mescladissa de text normal i una sèrie de codis. Aquests codis són sempre de l'estil <head> i </head>, per exemple. Sempre van entre unes claus. Hi ha un codi inicial i un de tancament: <p> representa un paràgraf i </p>el final d'aquest. Al principi pot semblar embullós, però de fet és força simple. Es pot captar la idea en cinc minuts, i als cinc minuts següents, amb una referència dels codis al costat, crear la primera pàgina amb el bloc de notes...Tothom que fa uns anys s'hagi atrevit a voler fer una pàgina web haurà après a escriure en html, gairebé sense adonar-se'n.

Però és necessari avui en dia dominar, o tan sols tenir una idea de com està estructurat el llenguatge html? Sí i no. Francament, crec que és necessari tenir-ne una idea bàsica. És necessari perquè així coneixem perfectament tota la terminologia que utilitizen els editors de pàgines web per donar format i, per un altre costat, ens pot permetre fer algun retoc senzill amb l'editor de text. Per tenir-ne un coneixement elemental, us pot ser útil aquesta fitxa de referència que hem preparat.

Si voleu informació més en detall, podeu trobar-ne a diferents adreces d'internet que us proporcionem a aquesta secció, o comprar algun llibre dels molts que s'han editat.

Altres components i fitxers annexes de les pàgines web.
Javascript.
És una mena de llenguatge de programació que interpreta i executa el navegador. Conté una sèrie d'instruccions (contingudes en el que s'anomena Script, inclòs a una pàgina html o vinculat a ella en forma de fitxer .js). Les instruccions s'executen a l'ordinador client, a través del navegador, i permeten fer més rica i interactiva la navegació. Per exemple, el JavaScript permet els ara tan comuns efectes de "mouseover" (canvi d'imatges en passar per sobre el ratolí); també permet obrir una nova finestra del navegador amb dimensions exactes en fer alguna acció prefixada pel programador.

Els navegadors només són capaços d'interpretar Javascript a partir de les darreres versions, i es pot tenir habilitada o no aquesta possibilitat a les preferències del programa. Es poden obtenir nombrosos scripts ja preparats, amb diferents funcions, de webs com Javascript Source i altres.

Java.
És un llenguatge de programació, independent de plataforma, que també permet pàgines més interactives. A diferència del Javascript, els programets escrits en Java estan enllaçats des de la pàgina, i no formen part d'ella. El programa en si es diu "applet" (aplicacioneta) i és un fitxer amb extensió .class. Si voleu veure un exemple de Java, aneu a aquesta pàgina. Tanmateix, cal dir que l'opció de permetre Java pot estar desactivada a les opcions del navegador, perquè pot ralentitzar bastant el funcionament. L'oferta d'applets java gratuïts és bastant ampla. Existeixen webs especialitzats, com ara Java Boutique.

 

Exemple d'aplicació Java: passeu el ratolí per sobre de la imatge (sense fer clic) i actuarà com a una lupa.

El segon exemple, a baix és una calculadora bàsica feta amb Java: proveu d'utilitzar-la. Funciona!

Sorry, your browser doesn't suppor Java.

Shockwave/Flash
Són animacions interactives de tipus vectorial (es poden canviar de tamany sense perdre qualitat), i extremadament compactes. Per veure-les cal un plug-in o programet accessori del navegador, que és gratuït i es pot descarregar de Macromedia. A aquest web tenim diferens exemples de flash, encara que no tots interactius. La pàgina d'inici de Macromedia és un bon exemple d'animació i interactivitat amb flash.

Fitxers adjunts zip, rar.
És freqüent que molts de webs ofereixin programes o fitxers comprimits per així accelerar la seva descàrrega per part dels usuaris. A aquest mateix web en trobareu. El format de compressió de dades més usat és el .zip. Cal tenir un programa per descomprimir, com ara WinZip. Winzip és shareware, però n'hi ha d'altres gratuïts, que es poden baixar de qualsevol servidor de programes.

Documents PDF (Portable Document Format).
S'utilitzen bastant; hi hem dedicat un article.

   [ Vigital ] [ Manual de diseño digital, en castellano ] [ Contactar ]

idees i suggerències programes per al web Gràfics per al web CSS HTML

Pàgina inicial pàgina inicial