SlideShare a Scribd company logo
1 of 12
DRIVE, BLOCS & WIKIS
i una mica d'HTML
Google Drive és un servei d'allotjament d'arxius introduït per
Google el 24 d'abril de 2012. A més a més, permet crear i editar
(reconeix molts formats) els teus propis documents. Posseeix tot un
paquet office:
Documents de Google
Fulls de càlcul de Google
Presentacions de Google
Dibuixos de Google
Formularis de Google
A més podem afegir aplicacions diverses (entre moltes...):
Pixrl (edició d'imatges)
Geogebra (matemàtiques dinàmiques)
HTML editer
PDF converter
GOOGLE DRIVE
Google Drive permet configurar: tant la forma de visualitzar els
documents com l'idioma. Et dóna informació de les últimes
modificacions i ofereix l'opció de gestionar les aplicacions.
El més interessant és que tot el que tenim penjat al nostre espai ho
podem compartir amb altres usuaris, directament enllaçant-los amb
els seu e-mail o convertint-lo en un enllaç que podem enviar.
GOOGLE DRIVE
Un bloc, també anomenat webblog o bitàcola, és un lloc web que
recopila cronològicament articles o textos d'un o més autors,
apareguent primer el més recent.
Un bloc està dissenyat per a què, com en un diari, cada article tingui
data de publicació, de tal forma que la persona que escriu (blocaire o
bloguista) i les que llegeixen poden seguir un camí de tot el que s'ha
publicat i editat.
En cada missatge o article d'un bloc els lectors poden escriure
comentaris (si l'autor ho permet) i aquest, al seu torn, donar-los
resposta. Cada bloc té el seu propi tema i n'hi ha de tipus personal,
econòmic, periodístic, tecnològic, educatiu, polític, etc.
Els més coneguts són:
BLOC O BITÀCOLES
Blogger
(Google)
Blogia
WordPress
Blocs - Xtec
Una wiki (del hawaià wikiwiki, «ràpid», és un lloc web col·laboratiu
que pot ser editat des del navegador pels usuaris. Els usuaris d'una
wiki poden d'aquesta manera crear, modificar, enllaçar i esborrar el
contingut d'una pàgina web, de forma interactiva, fàcil i ràpida. Una
de les wikis més conegudes és la Wikipèdia.
Per col·laborar amb una WIKI l'usuari s'ha de donar d'alta i després
crear seguint unes regles internes.
https://informatica4rts.wikispaces.com/
WIKIS
HTML (Hipertext Transfer Protocol) és un llenguatge de
programació d'etiquetatge d'hipertext. I està format per unes
etiquetes o marques que indiquen les diferents parts i el format d'un
document. És un llenguatge molt senzill, però a la vegada limitat, de
fet és va crear el XML (extensible markup languatge) per completar-
lo. Actualment, el XHTML (extensible Hypertext markup languatge)
els barreja tots dos i fa possible la comunicació entre mòbils i PDA.
Recordem que per visualitzar les pàgines en HTML, necessitem de
“browsers” o navegadors.
Existeixen també Editors que ens ajuden a fer els pàgines web, com
Dreamweaver o Frontpage, però amb un simple bloc de notes en
tenim més que suficient.
HTML
Les marques o etiquetes defineixen les diferents parts del
document. Així podem introduir “títol”, “tipus de lletra”, “color”, “inserir
imatge”, “posició”, “enllaç”,...
Les etiquetes estan formades pels símbols < /> entre els quals
s'escriuen les instruccions. La idea és que s'obren i es tanquen.
Estructura bàsica: Html, Head (capçalera), Body (cos del missatge)
<HTML>
<HEAD>
<TITLE>Títol de la pàgina</TITLE>
...
</HEAD>
<BODY>
<p>Aquí va el contingut de la pàgina</p>
</BODY>
</HTML>
HTML. Estructura bàsica
La capçalera o HEAD, aquí trobarem el títol de la nostra pàgina
web. Ha d’estar escrit correctament i en la llengua del document, ja
que habitualment apareix a la barra de títol de la finestra del
navegador i és una referència per als motors de cerca. A més, és
convenient que sigui igual que el títol del cos del document o que hi
tingui un lligam directe.
<HTML>
<HEAD>
<TITLE>La meva primera pàgina web</TITLE>
...
</HEAD>
<BODY>
Aquí va el contingut de la pàgina
</BODY>
</HTML>
HTML. Estructura bàsica
BODY és el cos del document on es troba el més important i on
s'inclouen la majoria d'etiquetes.
<HTML>
<HEAD>
<TITLE>La meva primera pàgina web</TITLE>
...
</HEAD>
<BODY bgcolor="#E6E6FA">
<p><b>Aquí va el contingut de la pàgina</b></p>
</BODY>
</HTML>
Etiquetes bàsiques:
Encapçalaments: <H1><H2>....<H6>
Paràgraf i Salt de línia: <P><BR>
Negreta: <B>
Cursiva: <i>
Subratllat: <U>
Línia horitzontal: <HR>
• Font: <Font>
• <Font Color=”#ffffff”; Font Size=”24”; Font align: “right”; font face= “Arial”></font>
HTML. Estructura bàsica
Etiquetes bàsiques:
Inserir un enllaç: <a href="http://www.google.com">
Inserir imatges: <IMG src=”path de la imatge”>
Inserir llistes: <ul> i <li>
Inserir taules: <tr> i <td>
És molt important tancar </> les etiquetes, si no no funcionaran.
Un cop tinguem ja tot el codi guardarem el fitxer com a “nom.htm”
Les CSS o fulles d'estil ens ajuden i simplifiquen la feina de fer
pàgines WEB ja que en una pàgina amb codi HTML es defineix tot
l'estil de la pàgina, i després es guarda com a .css i es crida des de
la nostra pàgina.
HTML. Estructura bàsica i CSS
La paleta Pantone és un sistema de control de color per a les arts
gràfiques.
Els colors van codificats de la següent manera: #FFFFFF (6
caràcters hexadecimals). Normalment, els editors d'imatges ens
diuen el codi dels colors que estem emprant.
HTML. Colors: Paleta pantone
L'administració i l'ordre dels arxius és fonamental perquè la pàgina
web funcioni correctament. La primera pàgina sempre s'anomenarà
index.htm. La resta d'arxius estaran tots en la mateixa carpeta, dins
de carpetes endreçades per la seva tipologia. Així les imatges, els
vídeos i la resta estaran degudament nomenats i indexats.
HTML. Com guardem les pàgines i la resta de fitxers

More Related Content

What's hot

What's hot (13)

Pàgines web amb HTML. Presentació Tema_9
Pàgines web amb HTML. Presentació Tema_9Pàgines web amb HTML. Presentació Tema_9
Pàgines web amb HTML. Presentació Tema_9
 
Impress 3
Impress 3Impress 3
Impress 3
 
Mozilla Firefox
Mozilla FirefoxMozilla Firefox
Mozilla Firefox
 
7.1 repte setè. publicar el document formats de sortida
7.1 repte setè. publicar el document   formats de sortida7.1 repte setè. publicar el document   formats de sortida
7.1 repte setè. publicar el document formats de sortida
 
Google documents
Google documentsGoogle documents
Google documents
 
Impress3
Impress3Impress3
Impress3
 
AnàLisi Comparatiu
AnàLisi ComparatiuAnàLisi Comparatiu
AnàLisi Comparatiu
 
Quadre
QuadreQuadre
Quadre
 
Com crear una botiga online Carlos tutuso
Com crear una botiga online Carlos tutusoCom crear una botiga online Carlos tutuso
Com crear una botiga online Carlos tutuso
 
Presentació
PresentacióPresentació
Presentació
 
Google Docs
Google DocsGoogle Docs
Google Docs
 
Presentación google drive
Presentación google drivePresentación google drive
Presentación google drive
 
Com utilitzar slideshare
Com utilitzar slideshareCom utilitzar slideshare
Com utilitzar slideshare
 

Viewers also liked

Tema2infoxarxes 1516
Tema2infoxarxes 1516Tema2infoxarxes 1516
Tema2infoxarxes 1516adieste
 
T5 edi img_1516
T5 edi img_1516T5 edi img_1516
T5 edi img_1516adieste
 
Tema 1 info so_4a_eso_binari1516
Tema 1 info so_4a_eso_binari1516Tema 1 info so_4a_eso_binari1516
Tema 1 info so_4a_eso_binari1516adieste
 
audioTema9 edicio audio
audioTema9  edicio audioaudioTema9  edicio audio
audioTema9 edicio audioTxeli
 
Tema 4 drive blocs i wikis1516
Tema 4 drive blocs i wikis1516Tema 4 drive blocs i wikis1516
Tema 4 drive blocs i wikis1516lourdescostaquera
 
Tema 1 info so_4a_eso_binari1516
Tema 1 info so_4a_eso_binari1516Tema 1 info so_4a_eso_binari1516
Tema 1 info so_4a_eso_binari1516lourdescostaquera
 
Las mejores herramientas web 2
Las mejores herramientas web 2Las mejores herramientas web 2
Las mejores herramientas web 2BVILLAV
 
Claves para poder interpretar un texto
Claves para poder interpretar un textoClaves para poder interpretar un texto
Claves para poder interpretar un textoDiazlachos
 
La contaminacion ambiental
La contaminacion ambientalLa contaminacion ambiental
La contaminacion ambientalmayramoval
 
Riesgos laborales
Riesgos laboralesRiesgos laborales
Riesgos laboralesdalenica89
 
El único punto luminoso se produjo en la red social de adquisición whats app ...
El único punto luminoso se produjo en la red social de adquisición whats app ...El único punto luminoso se produjo en la red social de adquisición whats app ...
El único punto luminoso se produjo en la red social de adquisición whats app ...Descargar Facebook
 
Reglas netiquette grupo esmeralda
Reglas netiquette   grupo esmeraldaReglas netiquette   grupo esmeralda
Reglas netiquette grupo esmeraldaGustavo Vivas
 
Las paginas web
Las paginas webLas paginas web
Las paginas webluciafdez5
 
DISCAPACIDAD DESDE LAS SALAS DE REDACCIÓN
DISCAPACIDAD DESDE LAS SALAS DE REDACCIÓNDISCAPACIDAD DESDE LAS SALAS DE REDACCIÓN
DISCAPACIDAD DESDE LAS SALAS DE REDACCIÓNSAGASERICK
 

Viewers also liked (20)

Tema2infoxarxes 1516
Tema2infoxarxes 1516Tema2infoxarxes 1516
Tema2infoxarxes 1516
 
T5 edi img_1516
T5 edi img_1516T5 edi img_1516
T5 edi img_1516
 
Tema 1 info so_4a_eso_binari1516
Tema 1 info so_4a_eso_binari1516Tema 1 info so_4a_eso_binari1516
Tema 1 info so_4a_eso_binari1516
 
audioTema9 edicio audio
audioTema9  edicio audioaudioTema9  edicio audio
audioTema9 edicio audio
 
T5 edi img_1516
T5 edi img_1516T5 edi img_1516
T5 edi img_1516
 
Tema 4 drive blocs i wikis1516
Tema 4 drive blocs i wikis1516Tema 4 drive blocs i wikis1516
Tema 4 drive blocs i wikis1516
 
Tema 1 info so_4a_eso_binari1516
Tema 1 info so_4a_eso_binari1516Tema 1 info so_4a_eso_binari1516
Tema 1 info so_4a_eso_binari1516
 
Las mejores herramientas web 2
Las mejores herramientas web 2Las mejores herramientas web 2
Las mejores herramientas web 2
 
Claves para poder interpretar un texto
Claves para poder interpretar un textoClaves para poder interpretar un texto
Claves para poder interpretar un texto
 
Huella ecológica
Huella ecológicaHuella ecológica
Huella ecológica
 
La contaminacion ambiental
La contaminacion ambientalLa contaminacion ambiental
La contaminacion ambiental
 
Riesgos laborales
Riesgos laboralesRiesgos laborales
Riesgos laborales
 
Comando D.O.S.
Comando D.O.S.Comando D.O.S.
Comando D.O.S.
 
El único punto luminoso se produjo en la red social de adquisición whats app ...
El único punto luminoso se produjo en la red social de adquisición whats app ...El único punto luminoso se produjo en la red social de adquisición whats app ...
El único punto luminoso se produjo en la red social de adquisición whats app ...
 
Reglas netiquette grupo esmeralda
Reglas netiquette   grupo esmeraldaReglas netiquette   grupo esmeralda
Reglas netiquette grupo esmeralda
 
Las paginas web
Las paginas webLas paginas web
Las paginas web
 
Presentación2
Presentación2Presentación2
Presentación2
 
DISCAPACIDAD DESDE LAS SALAS DE REDACCIÓN
DISCAPACIDAD DESDE LAS SALAS DE REDACCIÓNDISCAPACIDAD DESDE LAS SALAS DE REDACCIÓN
DISCAPACIDAD DESDE LAS SALAS DE REDACCIÓN
 
#11 ms dos
#11 ms dos#11 ms dos
#11 ms dos
 
Opinión pública
Opinión públicaOpinión pública
Opinión pública
 

Similar to Tema 4 drive blocs i wikis1516

4. Introducció a Joomla
4. Introducció a Joomla4. Introducció a Joomla
4. Introducció a Joomlamnicolau
 
Eines per disposar d'un web o un blog
Eines per disposar d'un web o un blogEines per disposar d'un web o un blog
Eines per disposar d'un web o un blogsantfeliuonline
 
Tutorial La Meva XTEC (2)
Tutorial La Meva XTEC (2)Tutorial La Meva XTEC (2)
Tutorial La Meva XTEC (2)Marc Bellapart
 
Vull fer una web: per on començo?
Vull fer una web: per on començo?Vull fer una web: per on començo?
Vull fer una web: per on començo?Ciberteka
 
Ies Estela Iberica
Ies Estela IbericaIes Estela Iberica
Ies Estela Ibericamguilla4
 
Index Blocs
Index BlocsIndex Blocs
Index Blocsstroobo
 
Practiquem amb eines ofimàtiques gratuïtes per la gestió bàsica del negoci
Practiquem amb eines ofimàtiques gratuïtes per la gestió bàsica del negociPractiquem amb eines ofimàtiques gratuïtes per la gestió bàsica del negoci
Practiquem amb eines ofimàtiques gratuïtes per la gestió bàsica del negociCiberteka
 
Llenguatges i Estàndards Web - PAC 1 - Multimedia (UOC) - Paquita Ribas
Llenguatges i Estàndards Web - PAC 1 - Multimedia (UOC) - Paquita RibasLlenguatges i Estàndards Web - PAC 1 - Multimedia (UOC) - Paquita Ribas
Llenguatges i Estàndards Web - PAC 1 - Multimedia (UOC) - Paquita RibasPaquita Ribas
 
Donar-se d'alta a Google docs
Donar-se d'alta a Google docsDonar-se d'alta a Google docs
Donar-se d'alta a Google docsCT 1
 
Llenguatges de programació web
Llenguatges de programació webLlenguatges de programació web
Llenguatges de programació webToni Amengual
 
Curs Wordpress Ajuntament Platja d'Aro
Curs Wordpress Ajuntament Platja d'AroCurs Wordpress Ajuntament Platja d'Aro
Curs Wordpress Ajuntament Platja d'AroGerard Encabo
 
Introducció al wiki - Antoni de la Torre
Introducció al wiki - Antoni de la TorreIntroducció al wiki - Antoni de la Torre
Introducció al wiki - Antoni de la TorreAntoni de la Torre
 

Similar to Tema 4 drive blocs i wikis1516 (20)

UD4 Web
UD4 WebUD4 Web
UD4 Web
 
Html 5
Html 5Html 5
Html 5
 
4. Introducció a Joomla
4. Introducció a Joomla4. Introducció a Joomla
4. Introducció a Joomla
 
Eines per disposar d'un web o un blog
Eines per disposar d'un web o un blogEines per disposar d'un web o un blog
Eines per disposar d'un web o un blog
 
Tutorial La Meva XTEC (2)
Tutorial La Meva XTEC (2)Tutorial La Meva XTEC (2)
Tutorial La Meva XTEC (2)
 
Html
HtmlHtml
Html
 
Tac
TacTac
Tac
 
Html, Xtml & Php
Html, Xtml & PhpHtml, Xtml & Php
Html, Xtml & Php
 
Vull fer una web: per on començo?
Vull fer una web: per on començo?Vull fer una web: per on començo?
Vull fer una web: per on començo?
 
Ies Estela Iberica
Ies Estela IbericaIes Estela Iberica
Ies Estela Iberica
 
Index Blocs
Index BlocsIndex Blocs
Index Blocs
 
Practiquem amb eines ofimàtiques gratuïtes per la gestió bàsica del negoci
Practiquem amb eines ofimàtiques gratuïtes per la gestió bàsica del negociPractiquem amb eines ofimàtiques gratuïtes per la gestió bàsica del negoci
Practiquem amb eines ofimàtiques gratuïtes per la gestió bàsica del negoci
 
Llenguatges i Estàndards Web - PAC 1 - Multimedia (UOC) - Paquita Ribas
Llenguatges i Estàndards Web - PAC 1 - Multimedia (UOC) - Paquita RibasLlenguatges i Estàndards Web - PAC 1 - Multimedia (UOC) - Paquita Ribas
Llenguatges i Estàndards Web - PAC 1 - Multimedia (UOC) - Paquita Ribas
 
Donar-se d'alta a Google docs
Donar-se d'alta a Google docsDonar-se d'alta a Google docs
Donar-se d'alta a Google docs
 
Llenguatges de programació web
Llenguatges de programació webLlenguatges de programació web
Llenguatges de programació web
 
Curs Wordpress Ajuntament Platja d'Aro
Curs Wordpress Ajuntament Platja d'AroCurs Wordpress Ajuntament Platja d'Aro
Curs Wordpress Ajuntament Platja d'Aro
 
Presentació de HTML 5
Presentació de HTML 5Presentació de HTML 5
Presentació de HTML 5
 
Introducció al wiki - Antoni de la Torre
Introducció al wiki - Antoni de la TorreIntroducció al wiki - Antoni de la Torre
Introducció al wiki - Antoni de la Torre
 
Power point slideshare
Power point slidesharePower point slideshare
Power point slideshare
 
Firefox
FirefoxFirefox
Firefox
 

Recently uploaded

MECANISMES I CINEMÀTICA 1r DE BATXILLERAT
MECANISMES I CINEMÀTICA 1r DE BATXILLERATMECANISMES I CINEMÀTICA 1r DE BATXILLERAT
MECANISMES I CINEMÀTICA 1r DE BATXILLERATLasilviatecno
 
ESCOLA MEDITERRÀNIA revista Sant Jordi 2024__MOSTRA (1).pdf
ESCOLA MEDITERRÀNIA revista Sant Jordi 2024__MOSTRA (1).pdfESCOLA MEDITERRÀNIA revista Sant Jordi 2024__MOSTRA (1).pdf
ESCOLA MEDITERRÀNIA revista Sant Jordi 2024__MOSTRA (1).pdfISMAELALVAREZCABRERA
 
ELS DÉUS DE LA MITOLOGIA GREGA (Catalán).pdf
ELS DÉUS DE LA MITOLOGIA GREGA (Catalán).pdfELS DÉUS DE LA MITOLOGIA GREGA (Catalán).pdf
ELS DÉUS DE LA MITOLOGIA GREGA (Catalán).pdfMarinaRiera1
 
ESCOLAERNESTLLUCHINFORME_BAREM_RESOLTES_BAREM.pdf
ESCOLAERNESTLLUCHINFORME_BAREM_RESOLTES_BAREM.pdfESCOLAERNESTLLUCHINFORME_BAREM_RESOLTES_BAREM.pdf
ESCOLAERNESTLLUCHINFORME_BAREM_RESOLTES_BAREM.pdfErnest Lluch
 
SISTEMA DIÈDRIC. PLANS, PAREL·LELISME,PERPENDICULARITAT,
SISTEMA DIÈDRIC. PLANS, PAREL·LELISME,PERPENDICULARITAT,SISTEMA DIÈDRIC. PLANS, PAREL·LELISME,PERPENDICULARITAT,
SISTEMA DIÈDRIC. PLANS, PAREL·LELISME,PERPENDICULARITAT,Lasilviatecno
 
XARXES UBANES I LA SEVA PROBLEMÀTICA.pptx
XARXES UBANES I LA SEVA PROBLEMÀTICA.pptxXARXES UBANES I LA SEVA PROBLEMÀTICA.pptx
XARXES UBANES I LA SEVA PROBLEMÀTICA.pptxCRIS650557
 
Sílvia_López_Competic3_bloc000002_C8.pdf
Sílvia_López_Competic3_bloc000002_C8.pdfSílvia_López_Competic3_bloc000002_C8.pdf
Sílvia_López_Competic3_bloc000002_C8.pdfsilvialopezle
 
ESCOLA MEDITERRÀNIA revista Sant Jordi 2024__MOSTRA (1).pdf
ESCOLA MEDITERRÀNIA revista Sant Jordi 2024__MOSTRA (1).pdfESCOLA MEDITERRÀNIA revista Sant Jordi 2024__MOSTRA (1).pdf
ESCOLA MEDITERRÀNIA revista Sant Jordi 2024__MOSTRA (1).pdfISMAELALVAREZCABRERA
 
Plans Estudi per Especialitats - El Musical
Plans Estudi per Especialitats - El MusicalPlans Estudi per Especialitats - El Musical
Plans Estudi per Especialitats - El Musicalalba444773
 

Recently uploaded (11)

HISTÒRIES PER A MENUTS II. CRA Serra del Benicadell.pdf
HISTÒRIES PER A MENUTS II. CRA  Serra del Benicadell.pdfHISTÒRIES PER A MENUTS II. CRA  Serra del Benicadell.pdf
HISTÒRIES PER A MENUTS II. CRA Serra del Benicadell.pdf
 
MECANISMES I CINEMÀTICA 1r DE BATXILLERAT
MECANISMES I CINEMÀTICA 1r DE BATXILLERATMECANISMES I CINEMÀTICA 1r DE BATXILLERAT
MECANISMES I CINEMÀTICA 1r DE BATXILLERAT
 
ESCOLA MEDITERRÀNIA revista Sant Jordi 2024__MOSTRA (1).pdf
ESCOLA MEDITERRÀNIA revista Sant Jordi 2024__MOSTRA (1).pdfESCOLA MEDITERRÀNIA revista Sant Jordi 2024__MOSTRA (1).pdf
ESCOLA MEDITERRÀNIA revista Sant Jordi 2024__MOSTRA (1).pdf
 
ELS DÉUS DE LA MITOLOGIA GREGA (Catalán).pdf
ELS DÉUS DE LA MITOLOGIA GREGA (Catalán).pdfELS DÉUS DE LA MITOLOGIA GREGA (Catalán).pdf
ELS DÉUS DE LA MITOLOGIA GREGA (Catalán).pdf
 
ESCOLAERNESTLLUCHINFORME_BAREM_RESOLTES_BAREM.pdf
ESCOLAERNESTLLUCHINFORME_BAREM_RESOLTES_BAREM.pdfESCOLAERNESTLLUCHINFORME_BAREM_RESOLTES_BAREM.pdf
ESCOLAERNESTLLUCHINFORME_BAREM_RESOLTES_BAREM.pdf
 
SISTEMA DIÈDRIC. PLANS, PAREL·LELISME,PERPENDICULARITAT,
SISTEMA DIÈDRIC. PLANS, PAREL·LELISME,PERPENDICULARITAT,SISTEMA DIÈDRIC. PLANS, PAREL·LELISME,PERPENDICULARITAT,
SISTEMA DIÈDRIC. PLANS, PAREL·LELISME,PERPENDICULARITAT,
 
XARXES UBANES I LA SEVA PROBLEMÀTICA.pptx
XARXES UBANES I LA SEVA PROBLEMÀTICA.pptxXARXES UBANES I LA SEVA PROBLEMÀTICA.pptx
XARXES UBANES I LA SEVA PROBLEMÀTICA.pptx
 
Sílvia_López_Competic3_bloc000002_C8.pdf
Sílvia_López_Competic3_bloc000002_C8.pdfSílvia_López_Competic3_bloc000002_C8.pdf
Sílvia_López_Competic3_bloc000002_C8.pdf
 
itcs - institut tècnic català de la soldadura
itcs - institut tècnic català de la soldaduraitcs - institut tècnic català de la soldadura
itcs - institut tècnic català de la soldadura
 
ESCOLA MEDITERRÀNIA revista Sant Jordi 2024__MOSTRA (1).pdf
ESCOLA MEDITERRÀNIA revista Sant Jordi 2024__MOSTRA (1).pdfESCOLA MEDITERRÀNIA revista Sant Jordi 2024__MOSTRA (1).pdf
ESCOLA MEDITERRÀNIA revista Sant Jordi 2024__MOSTRA (1).pdf
 
Plans Estudi per Especialitats - El Musical
Plans Estudi per Especialitats - El MusicalPlans Estudi per Especialitats - El Musical
Plans Estudi per Especialitats - El Musical
 

Tema 4 drive blocs i wikis1516

  • 1. DRIVE, BLOCS & WIKIS i una mica d'HTML
  • 2. Google Drive és un servei d'allotjament d'arxius introduït per Google el 24 d'abril de 2012. A més a més, permet crear i editar (reconeix molts formats) els teus propis documents. Posseeix tot un paquet office: Documents de Google Fulls de càlcul de Google Presentacions de Google Dibuixos de Google Formularis de Google A més podem afegir aplicacions diverses (entre moltes...): Pixrl (edició d'imatges) Geogebra (matemàtiques dinàmiques) HTML editer PDF converter GOOGLE DRIVE
  • 3. Google Drive permet configurar: tant la forma de visualitzar els documents com l'idioma. Et dóna informació de les últimes modificacions i ofereix l'opció de gestionar les aplicacions. El més interessant és que tot el que tenim penjat al nostre espai ho podem compartir amb altres usuaris, directament enllaçant-los amb els seu e-mail o convertint-lo en un enllaç que podem enviar. GOOGLE DRIVE
  • 4. Un bloc, també anomenat webblog o bitàcola, és un lloc web que recopila cronològicament articles o textos d'un o més autors, apareguent primer el més recent. Un bloc està dissenyat per a què, com en un diari, cada article tingui data de publicació, de tal forma que la persona que escriu (blocaire o bloguista) i les que llegeixen poden seguir un camí de tot el que s'ha publicat i editat. En cada missatge o article d'un bloc els lectors poden escriure comentaris (si l'autor ho permet) i aquest, al seu torn, donar-los resposta. Cada bloc té el seu propi tema i n'hi ha de tipus personal, econòmic, periodístic, tecnològic, educatiu, polític, etc. Els més coneguts són: BLOC O BITÀCOLES Blogger (Google) Blogia WordPress Blocs - Xtec
  • 5. Una wiki (del hawaià wikiwiki, «ràpid», és un lloc web col·laboratiu que pot ser editat des del navegador pels usuaris. Els usuaris d'una wiki poden d'aquesta manera crear, modificar, enllaçar i esborrar el contingut d'una pàgina web, de forma interactiva, fàcil i ràpida. Una de les wikis més conegudes és la Wikipèdia. Per col·laborar amb una WIKI l'usuari s'ha de donar d'alta i després crear seguint unes regles internes. https://informatica4rts.wikispaces.com/ WIKIS
  • 6. HTML (Hipertext Transfer Protocol) és un llenguatge de programació d'etiquetatge d'hipertext. I està format per unes etiquetes o marques que indiquen les diferents parts i el format d'un document. És un llenguatge molt senzill, però a la vegada limitat, de fet és va crear el XML (extensible markup languatge) per completar- lo. Actualment, el XHTML (extensible Hypertext markup languatge) els barreja tots dos i fa possible la comunicació entre mòbils i PDA. Recordem que per visualitzar les pàgines en HTML, necessitem de “browsers” o navegadors. Existeixen també Editors que ens ajuden a fer els pàgines web, com Dreamweaver o Frontpage, però amb un simple bloc de notes en tenim més que suficient. HTML
  • 7. Les marques o etiquetes defineixen les diferents parts del document. Així podem introduir “títol”, “tipus de lletra”, “color”, “inserir imatge”, “posició”, “enllaç”,... Les etiquetes estan formades pels símbols < /> entre els quals s'escriuen les instruccions. La idea és que s'obren i es tanquen. Estructura bàsica: Html, Head (capçalera), Body (cos del missatge) <HTML> <HEAD> <TITLE>Títol de la pàgina</TITLE> ... </HEAD> <BODY> <p>Aquí va el contingut de la pàgina</p> </BODY> </HTML> HTML. Estructura bàsica
  • 8. La capçalera o HEAD, aquí trobarem el títol de la nostra pàgina web. Ha d’estar escrit correctament i en la llengua del document, ja que habitualment apareix a la barra de títol de la finestra del navegador i és una referència per als motors de cerca. A més, és convenient que sigui igual que el títol del cos del document o que hi tingui un lligam directe. <HTML> <HEAD> <TITLE>La meva primera pàgina web</TITLE> ... </HEAD> <BODY> Aquí va el contingut de la pàgina </BODY> </HTML> HTML. Estructura bàsica
  • 9. BODY és el cos del document on es troba el més important i on s'inclouen la majoria d'etiquetes. <HTML> <HEAD> <TITLE>La meva primera pàgina web</TITLE> ... </HEAD> <BODY bgcolor="#E6E6FA"> <p><b>Aquí va el contingut de la pàgina</b></p> </BODY> </HTML> Etiquetes bàsiques: Encapçalaments: <H1><H2>....<H6> Paràgraf i Salt de línia: <P><BR> Negreta: <B> Cursiva: <i> Subratllat: <U> Línia horitzontal: <HR> • Font: <Font> • <Font Color=”#ffffff”; Font Size=”24”; Font align: “right”; font face= “Arial”></font> HTML. Estructura bàsica
  • 10. Etiquetes bàsiques: Inserir un enllaç: <a href="http://www.google.com"> Inserir imatges: <IMG src=”path de la imatge”> Inserir llistes: <ul> i <li> Inserir taules: <tr> i <td> És molt important tancar </> les etiquetes, si no no funcionaran. Un cop tinguem ja tot el codi guardarem el fitxer com a “nom.htm” Les CSS o fulles d'estil ens ajuden i simplifiquen la feina de fer pàgines WEB ja que en una pàgina amb codi HTML es defineix tot l'estil de la pàgina, i després es guarda com a .css i es crida des de la nostra pàgina. HTML. Estructura bàsica i CSS
  • 11. La paleta Pantone és un sistema de control de color per a les arts gràfiques. Els colors van codificats de la següent manera: #FFFFFF (6 caràcters hexadecimals). Normalment, els editors d'imatges ens diuen el codi dels colors que estem emprant. HTML. Colors: Paleta pantone
  • 12. L'administració i l'ordre dels arxius és fonamental perquè la pàgina web funcioni correctament. La primera pàgina sempre s'anomenarà index.htm. La resta d'arxius estaran tots en la mateixa carpeta, dins de carpetes endreçades per la seva tipologia. Així les imatges, els vídeos i la resta estaran degudament nomenats i indexats. HTML. Com guardem les pàgines i la resta de fitxers