1. UD1
Estandards web
Estandards Web:conjunt de recomanacions sobre la interpretació de documents web.
W3C : World Wide Web Consortium, ha publicat mes de cent deu estàndards oberts per a
llenguatges i protocols.
Group-ware o treball en grup
Group-ware : Conjunt de processos realitzats per un conjunt de persones les quals formen
un grup de feina amb la feina amb la finalitat d'aconseguir uns determinats objectius.
Integraccio appw i l'escriptori
Aquest concepte fa referencia a la possibilitat d'utilitzar un appw sense tenir que recórrer a
un navegador, com si d'una app mes del nostre ordinador es tractes.
Site Specific Browsers (SSB). Es una aplicació amb un navegador integrat dissenyat per
funcionar com una única app web.
Eyeos: es un escriptory virtual a la web.
UD2
Aplicacions Web ofimàtiques ( web office information system)
Les eines de treball col·laboratiu permeten que un grup de persones molt distants entre si
treballin de manera conjunta a traves de la xarxa.
Han sorgit com una evolució mes dels tradicionals paquets o suites ofimatiques
Aquestes eines funcionen com a processador de text,fulls de calcul, presentacions
multimèdia, ...etc.
El precursor d'aquestes aplicacions va ser l'aparicio dels processador de textos en línia
WYSIWYG anomenat Writely.
Grups Un dels primers serveis que van aparèixer en la web van ser els grups de noticies
(newsgroup= que era el mitja de comunicació per excel·lència de la xarxa d'usuaris
Consisteixen en un sistema global de discussió organitzat a imatge i semblança del mon
real on conversar i intercanviar impression sobre qüestions molt concretes ja estiguin
relacionades amb tasques professionals o amb aficions.
Wikis: permeten generar editar i publicar continguts sense coneixer els metallenguatges
que formen la web (HTML, XHTML, CSS,javascript, applets java, gadgets, ..etc.)
Com per ejemple : wikipedia .
• El contingut sempre es troba en continua transformació gracies a l'esforç i a la
participacio de tots els membres d¡una comunitat o un grup de treball.
• L'objectiu de les wikis no es organitzar les entrades de manera cronològica sinó en
funcio del contingut i el context en que es trobin.
• La seva rapidesa es deu a una combinació molt eficaç dels processos de lectura i
edició ( sempre ha de ser possible editar el contingut d'un article)
La difusió de continguts en Internet pot ocasionar problemes problemes relacions amb les
nocions d'autoria i propietat intel·lectual.
En virtut de l'us i la gestió de continguts ( vigilància, moderació i consell editorial)
Poden distingir-se dos models de wikis
• Wikis obertes : permeten que qualsevol persona generi un nou contingut o be
modifiqui un d'existent amb plena llibertat.
• Wikis tancades : els qui s'encarreguen de la seva administració i manteniment
estableixen unes normes i supervisen el funcionament Limitat l'accés i la publicació
de continguts a uns quants usuaris.
DOM
(Document Object Model - Model de Objectes de Document) Especificació que
determina com els objectes (text, imatges, enllaços, etc.) en una pàgina web son

2. representats com:DOM defineix qué atributs estan associats. amb cada objecte y cóm els
objectes els atributs poder ser manipulats. El HTML dinàmic(DHTML) es basa en el DOM
per canviar dinàmicament la apariencia de las pagines web després de que han estat
descarregades per un navegador.
ECMAScript
ECMAScript és un llenguatge de programació estàndard publicat per ECMA International.
El desenvolupament va començar a partir del llenguatge Java Script proposat per Netscape
Corporation. Actualment, també és l'estàndard ISO 16262.
ECMAScript definix un llenguatge de tipus dinàmics amb una sintaxi inspirada en el
llenguatge C. Dóna suport a algunes característiques de la programació orientada a
objectes mitjançant objectes basats en prototips.
La major part de navegadors inclouen una implementació de l'ECMAScript.
Metapaquets
Que son els metapaquets?
-Els metapaquets com el seu nom insinua "no son paquets amb contingut", es a dir, no
son el empaquetament de cap programa, Y que es el que son?, Per entendre be lo que
son es necessari conèixer algun sobre la paqueteria .deb que es el sistema de
empaquetament de programes utilitzats per la distribucions derivades de debian.
Per que serveixen els metapaquets?
-Les aplicacions de els metapaquets son diverses, la primera y més cotidiana pot ser, per
exemple, que si jo desitjara instal·lar A y B cada vegada que instal la meva distribució
favorita en algú ordinador, Doncs podria crear un metapaquete anomenat C que
dependeixi de A y B, para que així després de instal·lar la meva distribució favorita
únicament instal·larà C y la meva feina se reduiria a la mitad.
Scalable Vector Graphics
Scalable Vector Graphics (SVG) es una especificació per descriure gràfics vectorials
bidimensionals, tant estàtic com animades (aquests darrers amb ajuda de SMIL)en format
XML.
El SVG permeteix 3 tipus de objectes gràfics:
* Formes gràfiques de vectores(p.e. camins consistents en rectes y curves, y areas
limitats per ells)
* Imatges de mapes de bits /digitals
* Textes
Captcha
Captcha: Aquest es un Test de desafiament i resposta que comprova que el que fa l'acció
es humà i no una maquina (com un robot de google). El terme es va començar a fer servir
l'any 2000 per Luis von Ahn, Manuel Blum i Nicholas J. Hopper de la Carnegie Mellon
University, i John Langford d'IBM.
Aquesta prova consisteix en donar-li al sistema un text,codi, nombre o alternats per
confirmar que es una persona.
EX: quan descarreguem alguna cosa de Megaupload que ens demana un codi per poder
iniciar la descarrega.
1. Aplicació:
Es sol emprar per evitar que programes automàtics pugin obtenir serveis o informació
determinades, també es fa servir per evitar que els robots es puguin registrar en un
sistema de correu o fòrum, i envie correu i posts amb SPAM.
2. Característiques:
* No necessita manteniment ni control del funcionament es totalment automàtic.
* Es un sistema public, per tant el que supera el captcha no es problema de la codi,
sinó de la I.A.
3. Atacs:
Gracies a un sistema de I.A. mes intel·ligent han a aconseguit rompre aquesta seguretat

3. amb un percentatge del 80 - 100%.
4. Problemàtica:
Accessibilitat per a discapacitats
Els captcha tenen el defecte de que no compten en que les persones poden tenir
problema com dislèxia.
Alguns serveis com Google, Yahoo, etc.. han creat un sistema per persones amb
problemes, com un text gravat per un veu en off. o un tipus de text que pot llelir la
persona amb problemas de visió.
W3C
El World Wide Web Consortium (W3C) és un consorci internacional que treballa per a
desenvolupar i promocionar estàndards per al WWW.
El W3C no té cap programa de certificació.
ASP
ASP (Active Server Pages): Es una tecnologia creada per Microsoft per a pàgines web que
permet combinar codi HTML, scripts i components ActiveX.
Les instruccions de programació es troben dins el document ASP i aquestes s'executen
quan es sol·licita el document, per enviar únicament el codi HTML resultant cap al
navegador. L'avantatge d'aquesta tecnologia es que el codi només es troba als arxius del
servidor i els usuaris no poden accedir-hi.
Les comandes de ASP es troben entre "<% %>, per exemple:
<P>
<% For I = 1 To 5 Step 1 %>
<FONT SIZE=”<%= I %>”>Mestres del Web!</FONT><BR>
<% Next %>
</P>
Aquest exemple crea un cicle que repeteix 5 vegades y augmenta la mida de la frase
"Mestres del Web!".
CGI
CGI (Common Gateway Interface): Permet al navegador sol·licitar informació d'un
programa que s'executa al servidor.
A diferència de l'HTML, permet una transmissió d'informació dinàmica i per això es sol
utilitzar per bases de dades, formularis, motors de recerca,etc.
Te l'avantatge de que s'executa al servidor i no depen de la màquina del client, a més el
seu funcionament es molt senzill: els scripts del servidor s'executen i després son enviats al
client.
HTML
L'HTML es un llenguatge que combina dades i etiquetes que marquen la seva estructura,
amb el fi d'estructurar un text de forma que les paraules clau siguin enllaços a textes
diferents.
Origen de l'HTML
Tot va començar com un llenguatge per a científics sense cap format, a partir del 1990 va
evolucionar sense cap estandart, fins que va aparèixer el W3C (World Wide Web
Consortium).
El W3C recomana l'ús del XHTML eXtensible HyperText? Markup Llenguatge (Llenguatge de
Marcat d´Hipertext Extens), que es igual que el HTML Peró amb les etiquetes
simplificades.
Java
Java es un llenguatge de programació orientat a objectes basat en C i C++ que va
començar a desenvolupar-se als '90 per Sun. Les aplicacions Java son compilades en
bytecode o code maquina.
Implementació del code màquina va ser al 1995 per Sun. Aquesta empresa ha estat
controlant l'evolució del Java a través del Java Community Process.

4. A principis del 2007, va ser lliurat la major part del codi, sent així de llicencia GNU GLP, un
software lliure.
PHP
PHP es un acrònim recursiu que significa PHP Hypertext Pre-processor. El gran parescut
que te PHP amb els llenguatges mes comuns de estructurada (C o Perl) permet a la
majoria dels programadors crea aplicacions complexes amb una curva de aprenentatge
molt curta.
Encara que tot el seu diseny esta orientat a la creació de pagines web es possible crear
aplicacions amb una interfaz gràfica per el usuaris amb una extensió PHP-Qt o PHP-GTK.
Exemples de PHP:
<?php // Manual de PHP de WebEstilo?.com
session_register('contador');
echo '<a href="'.$PHP_SELF.'?'.$SID.'">Contador vale: '.++$_SESSION'contador'?. '</a>';
?>
XHTML
És un acrònim en angles de eXtenmsible Hypertext Markup llenguatge(llenguatge extensible
de marcat de hypertext)
Es el llenguatje marcat per substituir el HTML.
Les principal ventatjes de XHTML de HTML són:
* Es poden incorporar elements de distints espais de nombres XML
* Un navegador no necessita implementar heurística per detectar el que volia escriure el
autor.
* Com que es XML se pot utilitzar fàcilment eines creades per al processament de
documents XML
Exemple de XHTML:
* Incorrecte: <p>Primer párrafo<p>Segundo párrafo
* Correcte: <p>Primer párrafo</p><p>Segundo párrafo</p>
JSP
(Java Server Pages)És una tecnologia Java que permet generar contingut dinàmic per
web, en forma de documents HTML XML o d'un altre tipus
es una tecnologia creada per Sun Microsystems.
Ejemplo de documento JSP
<%@ page errorPage="myerror.jsp" %>
<%@ page import="com.foo.bar" %>
<html> <head> <%! int serverInstanceVariable = 1;%>
...
<% int localStackBasedVariable = 1; %>
CSS
(Cascading Style Sheets) o Fulls d'estil en Cascada es un llenguatje utilizat per definir la
presentació d'un document estructurat escrit amb HTML o XML i per extensió en XHTML.
està dissenyat principalment per permetre la separació de contingut del document (escrit
en HTML o un llenguatge similar) de la presentació del document, incloent-hi elements
com la disposició, colors, i fonts.
HTTP
(Protocol de transferència d'hipertext o Hypertext Transfer Protocol)
És un protocol d'intercanvi de documents d'hipertext y multimèdia a la web.
La versió actual de HTTP es la 1.1 y segueix un model client-servidor on el client realitza
una petició d'informació establint una connexió TCP/IP al port 80 d'una màquina remota.
El servidor espera la petició i mitjançant una semàntica específica realitza la contestació.
La connexió establerta no es guarda en lloc quan finalitza per això ha proliferat l'ús de
Cookies com a sistema per guardar paquets d'informació sobre les connexions de cada
usuari.

5. Javascript
Es un llenguatge script basat en el concepte de prototip i que va derivar en l'estàndard
ECMAScript. Es conegut pel seu ús en pàgines web però també s'utilitza en altres
aplicacions.
Malgrat el seu nom contengui la paraula "Java" no deriva d'aquest llenguatge de
programació però conté una sintaxis similar inspirada en el llenguatge C. El seu nom es
una marca enregistrada pero Sun Microsystems.
Servlets
Objecte que funciona dins un contexte com per exemple tomcat o java, que fan que
aquest millori les leves funcionalitats. L'us mes comuns dels servlets es generar pagines web
de forma dinàmica amb paràmetres de petició que envia el navegador web.
Usabilitat (d'una web)
En termes informàtics, l'usabilitat esta associada a la accessibilitat, per axó, quan parlam de
usabilitat web ens referim a un atribut de qualitat que mideix la facilitat d'utilització de les
interficies web.
Web 2.0
Ens referim amb web 2.0 a la evolució de les pagines web, aixo succeeix implementant
noves aplicacions en la pagina web que ens permeten i faciliten compartir informació, la
interoperativitat el diseny centrat en el usuari o D.C.U. i la colaboració amb la world wide
web, aquest terme no es que sigui una nova tecnologia ja que es mes una aplicació de les
aplicacions tradicionals cap a les webs.
Prosumidor i prosumer
Actualment la paraula prosumer es molt utilitzada a internet. Cualsevol persona amb
internet pot a ser prosumer el que vol dir que es un consumidor pero a la vegada un
productor.
Per exemple: una persona que llegeix molts de blogs y a la vegada te un de propi esta
consumint continguts y a la vega creant uns de propis.
WYSIWYG
WYSIWYG significa What You See Is What You Get, que traduït vol dir, el que veus es el
que tindràs.
Sol ser utilitzat per editors HTML en els quals el programa te dos finestres, una en la que
es programa la pagina web i un altra en la que es veu el resultat final, per axó el que veus
es el que tindràs.
Google Wave
Google wave es una eina online creada per Google que es utilitza per comunicares de
moltes formes y col·laborar en la creació des de mapes fins documents de text. Te un
traductor automàtic de fins a 40 idiomes diferents, moltes extensions i poden programar-se
addons.
El dia 4 d'agost google va anunciar que abandonaban el desenvolupament de Wave, per el
que es va considerar com un fracas total anunciant tambe que tan sols aseguraban
mantenir el servei durant el que resta d'aquest any
Usnet
UseNet? és un sistema dels més antics en comunicació entre xarxes d'ordinadors. Permet
intercanviar opinions y experiencies amb altres persones, amb les que tenguin temes o
interessos comuns. Va començar a funcionar en 1980.
La paraula UseNet? ve de Users Network. (Red d' usuaris). És un sistema de discusió a
internet. El crearen l'any 1979 dos estudiants de la Universitat de Duke (EEUU) Tom
Truscott i Jim Ellis que eran estudiants de la Universitat de Duke (EE.UU.)
NNTP
NNTP (Network News Transport Protocol): És un protocol que va ser creat per a la lectura i
publicació de notícies en UseNet?. En Català vol dir: Protocol per a la transferència de
notícies en xarxa.

6. El funcionament de NNTP consta d'un servidor en el que es guarden les notícies. A ell es
connecten els clients a través de la xarxa.
La connexió es fa pel protocol TCP. El port 119 está reservat per el NNTP.
Per transferir notícies, es poden utilitzar dos mètodes.:
* Mètode pushing (actiu): El client envia l'article, i el servidor li torna un codi de
resposta, amb el qual ja sap si s'ha rebut l'article o no.
* Mètode pulling (passiu): S'obté una llista d'articles d'un grup i es publiquen a una
data posterior de l'enviament.
KISS
KISS (Keep It Simple, Stupid), és aquell principi que recomana el desenvolupament
emprant parts senzilles, comprensibles i amb errors de fàcil detecció i correcció, rebutjant
el enrevessat i innecessari en el desenvolupament de sistemes complexos en enginyeria.
mashups
Mashup (aplicació web híbrida), és un lloc o aplicació web que utilitza contingut d'altres
aplicacions Web per crear un nou contingut complet, consumint serveis directament,
sempre a través de protocol http. Exemple: Digg (http://digg.com/) és un mashup de
diversos llocs de notícies controlat gairebé enterament pels usuaris del lloc.
Camelcase
CamelCase és un tipus d'escriptura que s'aplica a frases o paraules compostes.
Es caracteritza per estar totes juntes sense usar espai i la primera lletra de cada paraula
es posa en majúscula.
Hi ha dos tipus de CamelCase:
UpperCamelCase?: La primera lletra de cada paraula en majúscula
Exemple: ElCotxeAnavaMoltAviat?
LowerCamelCase?: La primera lletra de cada paraula en majúscula excepte la primera
paraula en la qual és minuscula
Exemple: elCotxeAnavaMoltAviat
Usos:
-Llenguatges de programació
-Java
-.NET
-Eines wiki
-Noms d'empresa
-MicroSoft?
-BellSouth?
WikiWord
Wikiword identifica i enllaça pàgines wiki. És una fusió de dues o més paraules compost
d'almenys dos caràcters cadascuna, sense fer servir els espais en blanc, on s'escriu amb
majúscula la primera lletra de cada paraula dels components i les lletres restants són en
minúscules.
L'enorme poder de etiquetes wiki és que funcionen com les paraules. Això li permet
enquadrar les declaracions molt complexes en un llenguatge molt concís, i dir les coses el
rerefons es pot subministrar i alterar en comunitat. Això fa explícita una característica clau
de UniversalMind?.
UniversalMind?: El terme ment universal pot definir com la no-local i temporal "ment
col.lectiva" de tots els components agregats, els coneixements, els components, les
relacions, personalitats, entitats, tecnologies, processos i cicles de l'Univers.
FAQ
Es el significat de un acrònim anglès que vol dir Frequently Asked Question; i es refereix a
una llista de preguntes i respostes freqüents d'un tema determinat.
E-learning
E-learning és un mitjà electrònic per a l'aprenentatge a distància o virtual, on es pot

7. interactuar amb els professors per mitjà d'Internet. L'usuari pot gestionar el seu horari;
aquest és un mitjà completament autònom.
UD3
Emmagatzematge a traves de la web
Els serveis d'emmagatzematge a la xarxa no solament permeten disposar de discs
virtuals sinó que ofereixen la possibilitat d'adaptar el ritme de treball a un entorn
canviant ja que poden compartir-se amb altres persones.
Sempre estan disponibles constitueixen una alternativa en cas de que es perdin dades en
un servidor o un equip local i , sobretot garanteix la confidencialitat ja que l'aces es
realitza sempre de forma xifrada.
Arxius multimèdia: requereixen una quantitat d'espai considerable.
Arxius de dades: gmail space, o gspace es una extensio per firefox que ens ofereix una
interfície similar a un client FTP amb la qual s'accedeix als arxius situats en un compte de
gmail.
Serveis d'emmagatzematge i distribució d'arxius en línia
• Dissenyats per allotjar contingut estàtic.
• Permeten l'accés a traves de la web o FTP l'arxiu es pot recuperar a traves d'una
url des d'un navegador.
• Alguns serveis deposin d'eines que permeten la gestió de les descarregues
realitzades a traves del portal.
• Com per exemple : Mega manager → mega upload.
Serveis d'emmagatzematge web
– permeten guardar grans quantitats de dades de forma segura.
– permet realitzar copies de seguretat en servidors remosts
– es poden compartir arxius amb contactes o comunitats d'usuaris.
– Accés remot des del qualsevol punt de la xarxa
– sincronització automàtica per reflectir les modificacions.
– Com per exemple: dropbox
HTML, XHTML, CSS
1 HTML
Les etiquetes html s'escriuen tancades entre angles.
Normalment s'utilitzen dues etiquetes : una d'inici i una altra de finalització per indicar que
ha acabat l'efecte que volíem presentar. L'única diferencia entre es que la de tancament
porta una barra inclinada “/” del codi.
<title>Titulo</title>
<b> va en negreta <b>
<html> etiqueta que indica al navegador el tipus de document que es va a iniciar i li
permet interpretar-ho correctament.
<head> Etiqueta d'aperatura del títol.
<body> Etiqueta d'obertura del cos
<title> el títol s'ha d'incloure dins de head entre les etiquetes <title>... </title>
<br> es l'etiqueta que serveix per indicar-li al navegador que fa de ser un salt de linia
<p> es la que ens serveis per indicar que el que esta compres entra l'etiqueta d'inici i la
de final formen un paràgraf que se separa de l'anterior i el posterior mitjançant l'espai que
correspon a un doble salt de línia.
<font size=”1”> Text grandària
<span style=”font-family: Arial;”>Textooo </span> para modificar el estilo de la letra.
<strong> negreta
<i> italica
<em> italica
<u> subrallat
<div align=”left”> texto justificado </div>

8. Encapçalaments
<h1> Encapçalament 1 </h1> hai 6
Llistes no ordenades : es un conjunt de línies de text precedides generalment d'algun
simbol grafic
es assignat pel navegador.
L'inici i el final de la llista s'indica amb
<ul> la lista </ul>
Cada un dels elements de la lliista es individualitzat mitjançant <li> element </li>
Llistes ordenades :
en les llistes ordenades els navegadors col-oquen davant de cada element un numero o
una lletra correlatius.
En absència d'especificació el navegador assigna l'estil de numeracio que te assignat per
defecte.
L'inici i el final de la llista s'indica amb <ol> lista ordenada </ol>
<li> elements </li>
Color de fons de pagina:
<body bgcolor=”#6666CC”>
<body style=”background-color: rgb(255,0,0); color: rgb(0,0,0);”
alink=”#ee0000”
link=”#0000ee”
vlink”#551a8b”>
</body>
2 HTML
<table> aquí s'indica la taula
<tr> aquesta etiqueta indica l'inici d'una fila
<td> entre aquestes etiquetes anirà el contingut de la primera cel-la</td>
</tr> aquesta indica la fi de primera
<tr> i les corresponents a les cel'les fins l tancament de la nova filma amb <tr>
</table> seria l'etiqueta de tancament de la taula
Encapçalament de la taula i de les columnes : Caption i TH
<caption> text </caption>
L'element caption ocupa una fila sencera i va obligatòriament al capdamunt de la taula.
La cel-la de cada columna acostuma fila es fan servir els elements TH.
Els navegador solen presentar-los en negreta i centrats en la cel-la.
Combinacio de cel-les
<td colspan=3></td>
<td rowspan=2</td>
3 HTML
<img src=”adreça” alt=”text” />
L'atribut adreça serveix per a indicar l'adreça de la imatge amb els mateixos criteris que
en el cas del que per qualsevol motiu no es repoduis lla imatge.
Si un document ha de tenir diverses imatges i fragments de text intercalats es molt
recomanable d'emmarcar-ho tot en una taula.
L'etiqueta IMG
height=”nn”
width=”nn”
<img src=”atencion.gif width=”28” height=”25” alt=”marca de aviso”>
Imatges com a hipervincles
<a href=”adreça de hipervincle”>
<img src=”adreça de la imatge” alt=”text”>
</a>
Mapes d'imatges

9. Un mapa d'imatge s'indica amb un element delimitat per
<map> .... </map>
L'identificador estàndard es id.
Peró alguns navegadors no el reconeixen, i per aquests motiu s'hi acostuma a afegir
name, amb el mateix valor per a tots dos atributs.
<area> un per a cada un dels sectors que calgui definir. La definició s'obté amb les
propietats shape (forma),coords(coordenades=,href (origen del document cridat)= i alt
(explicació alternativa com en les imatges)
Referencia relatives – absolutes
Una barra /,indica que el camí del fitxer s'especifica des de el directori arrel del servidor.
Dos punts i una barra .//, significa anar cap amunt en l'estructura del directori.
Un nom de fitxer o directori indica que es cerca un del fitxer a partir del directori actual.