Blogs

Os blogs e a busca de informaciónDocentes - Nivel 1

Presentación xeral

2

Presentación do curso

• Módulo 1: Páxinas web. Tipoloxía e estrutura.

• Módulo 2: Creación e edición de páxinas web.

• Módulo 3: Creación e edición de blogs.

3

Contido do curso

• Módulo 1. Páxinas web. Tipoloxía segundo a súa

estrutura.

– Tipoloxía

– Infrastrutura

– Estrutura

– Web 2.0

• Módulo 2. Creación e edición de páxinas web

– Servidores gratuitos

– Proceso de creación dunha páxina web

– Ferramentas informáticas

– Conceptos básicos da linguaxe HTML

4

Contido do curso

• Módulo 3. Creación e xestión de blogs

– Tipos de blog. Características

– Servidores de blogs

– Mantemento e administración

– Deseño

– Publicación

5

Módulo 1:

Páxinas web. Tipoloxía e estrutura

6

Módulo 1: Páxinas web. Tipoloxía e estrutura

Un pouco de historia

• 1969. Nace ARPANET (EEUU), precursora de Internet

• 1986. EEUU + EU forman a estrutura da futura rede

• 1988. Fundase en España RedIRIS

• 1989. Integración de protocolos

• 1990. No CERN crease o HTML, linguaxe universal

• 1990. No CERN crease os primeiros servidor e clientes web

• 2006. 3 de xaneiro, 1.100.000.000 usuarios de Internet

7


Tipoloxía

• Persoais (estrutura liñal, pouco complexa, “dormidas”)

• Empresas (estrutura complexa, información e servizos)

• Oficiais (estrutura moi complexa, moita información e moitos servizos,

seguridade)

• Educativas (complexidade moderada, moita información pero

estática)

• Portais temáticos (altísima complexidade estrutural, moitísima

información, interactividade)

8


Tipoloxía

• Buscadores (estrutura sinxela, pouca interactividade, inxente

cantidade de información, rapidez de procesamento)

• Banca on-line (estrutura moi complexa, pouca información, moitos

servizos, interactividade, seguridade , transaccións monetarias)

• Comercio electrónico (estrutura complexa, interactividade,

seguridade, transaccións monetarias)

9


Linguaxe HTML. Condicionantes

• Enorme variabilidade de orixes de páxinas web

• Amplo abanico de usos nas páxinas web

• Gran número de plataformas e S.O. nos programadores

• Gran número de plataformas e S.O. nos usuarios

• Complexidades moi diferentes

• Cantidade de páxinas, usuarios e funcionalidades en

constante aumento

10


Linguaxe HTML. Requisitos

• Sistema sinxelo e fácil de aprender

• Versátil

• Universal, independente de máquina, S.O. ou navegador

• Lixeiro, pouco ancho de banda

• Escalable

HTML: Hyper Text Markup Language

29 11


Infrastrutura

12


¿Qué é unha páxina web?

• Arquivo nun servidor

• Compartido

• Escrito nunha linguaxe

universal

13


Estrutura + Contido

14


Texto simple

<html><head><title>O Blog do cursiño...</title></head>

<body><table width="800" height="800" border="0" bgcolor="#669966"> <tr> <td colspan="2"> </td> </tr> <tr> <td width="154" rowspan="3"> </td> <td width="93" bgcolor="#666633"> </td> </tr> <tr> <td bgcolor="#666633"> </td> </tr> <tr> <td height="200" bgcolor="#666633"> </td> </tr></table></body></html>

Estrutura =

15


Contido =

• Texto simple (ou con formato)• Ligazóns• Imaxes• Sons• Videos

Forman parte do arquivo• Texto• Ligazóns

Non forman parte do arquivo• Imaxes• Sons• Videos

16



<body><table width="800" height="800" border="0" bgcolor="#669966"> <tr> <td colspan="2"> </td> </tr> <tr> <td width="154" rowspan="3"> </td>

<td width="93" bgcolor="#666633"> </td> </tr> <tr> <td bgcolor="#666633"> </td> </tr> <tr> <td height="200" bgcolor="#666633"> </td> </tr></table></body></html>

O texto forma parte do arquivo

Existen moitos tipos de discapacidade; mental, física, funcional, motora, sensorial, etc. Cada un destes tipos implica unha serie de inconvenientes ás persoas que a padecen. Ó longo da historia, foron aparecendo diferentes aparatos, inventos ou técnicas para facerlle a vida un pouco máis fácil a que sofre estes impedimentos. Exemplos disto son o simple bastón dos ou o adestramento de cans guía para os invidentes, audífonos para os xordos, cadeiras de rodas para os que non poden camiñar, etc.

Existen moitos tipos de discapacidade: mental, física, …. Poden camiñar, etc.

17



<body><table width="800" height="800" border="0" bgcolor="#669966"> <tr> <td colspan="2"> </td> </tr> <tr> <td width="154" rowspan="3"> </td>

Existen moitos tipos de discapacidade: mental, física, …. Poden camiñar, etc.

<td width="93" bgcolor="#666633"> </td> </tr> <tr> <td bgcolor="#666633"> </td> </tr> <tr> <td height="200" bgcolor="#666633"> </td> </tr></table></body></html>


Pero todos estes son inventos moi “vellos”; ¿ten a moderna tecnoloxía algo que ofrecer?. Pois si, temos dende aparatos que funcionan por ordes faladas para a xente sen mobilidade, ordenadores que poden ser manexados movendo a cabeza ou simplemente coa vista, rampas automáticas para subir escaleiras, etc.Cando a axenda do centro o permita, os alumnos e alumnas de tecnoloxía e un par de profes, realizaremos unha visita ó Centro de atención integral Princesa Letizia, de Vilagarcía de Arousa, onde poderemos ver e interactuar con este tipo de medios, e achegarnos un pouco e ver como é un día de traballo de persoas con parálise cerebral, e o día dos profesores e coidadores que traballan con eles. Este é un centro de día para persoas con parálise cerebral.¿Sabes o que é un centro de día? ¿E a parálise cerebral ?

O texto forma parte do arquivo

18



<body><table width="257" height="172" border="0" bgcolor="#669966"> <tr> <td colspan="2">

</td> </tr> <tr> <td width="154" rowspan="3"> Existen moitos tipos de discapacidade: mental, física, …. Poden camiñar, etc.</td> <td width="93" bgcolor="#666633"> </td> </tr> <tr> <td bgcolor="#666633"> </td> </tr> <tr> <td height="51" bgcolor="#666633"> </td> </tr></table></body></html>



As imaxes non forman parte do arquivocole.jpg

19


<html><head><title>O Blog do cursiño...</title></head><body><table width="257" height="172" border="0" bgcolor="#669966"> <tr> <td colspan="2">

<img src=“./cole.jpg”> </td>

</td> </tr> <tr> <td width="154" rowspan="3"> Existen moitos tipos de discapacidade: mental, física, …. Poden camiñar, etc.</td> <td width="93" bgcolor="#666633"> </td> </tr> <tr> <td bgcolor="#666633"> </td> </tr> <tr> <td height="51" bgcolor="#666633"> </td> </tr></table></body></html>



As imaxes non forman parte do arquivo

20


En resumo, unha páxina web é unha serie de arquivos enlazados, cun arquivo índice que os xunta dándolle a estrutura á páxina

Pros

• Pouco peso (carga rápido)

• Recursos noutro servidor

• Facilidade de programación

• Non precisa SW específico

Contras

• Posibles fallos externos nas

ligazóns

21


A Web 2.0

• Web 1.0: Internet orientado ós contidos

• O modelo esgotouse: A regla do 90 – 9 – 1

• 90 % usuarios pasivos

• 9 % colaboradores ocasionais

•1 % usuarios realmente activos

• Web 2.0: Internet orientada ós usuarios

• YouTube, Google Earth, Wikipedia, blogs

•SecondLife

22


Actividade 1

• Editar unha páxina web cos seguintes elementos

• Unha foto horizontal de cabeceira

• Un menú lateral con 3 seccións de texto

• Un bloque central de texto

• Insertar imaxes

23


Pasos

• Crear unha carpeta onde gardar os arquivos

• Abrir o bloc de notas e copiar a estrutura do arquivo

• Gardar o arquivo co nome “index.html”

• Buscar imaxes en Internet para engadir

• Insertar o texto e as imaxes no sitio correspondente

• Gardar o arquivo

• Facer doble clic no arquivo e abrilo co navegador

24


Index.html <html><head><title>O Blog do cursiño...</title></head><body><table width="257" height="172" border="0" bgcolor="#669966"> <tr> <td colspan="2">

<img src=“./cole.jpg”> </td>

</td> </tr> <tr> <td width="154" rowspan="3"> Texto do bloque central</td> <td width="93" bgcolor="#666633"> Texto de menú lateral</td> </tr> <tr> <td bgcolor="#666633"> Texto de menú lateral </td> </tr> <tr> <td height="51" bgcolor="#666633"> Texto de menú lateral </td> </tr></table></body></html>

19

Módulo 2:

Creación e edición de páxinas web

26

Módulo 2: Creación e edición de páxinas web

Proceso de creación dunha páxina web

• Concepción da páxina. Contidos e servizos

• Organización e estruturación da información

• Compilación do texto, imaxes e documentos a incluir

• Editar os arquivos HTML

• Subilos a un servidor (upload)

• Probar o seu funcionamento

•Rexistrar a páxina en algún directorio

27


Ferramentas para a edición

• Editores de texto (escribir texto):

• Bloc de notas

• Editores de HTML (resaltan etiquetas):

• AceHtml, HTMLkit, First Page 2000 (son freeware)

• Editores WYSIWYG (ademáis, previsualizan como queda):

• Macromedia DreamWeaver, Adobe GoLive, Microsoft

FrontPage, Word

WYSIWYG: What You See Is What You Get

28


29


Hospedaxe dunha páxina web

• Hospedaxe, aloxamento ou hosting: as páxinas residen nun

servidor que as comparte, con gran ancho de banda

• Servidores

• Comerciais. Tarifa baixa, gigas de espazo, contas de

correo electrónico e grupos

• De “regalo”. Proveedor de Servicios de Internet (ISP)

• Gratuitos. Lentos, con publicidade e con fallos.

30


Consideracións a ter en conta

• Espazo asignado

• Tempo de uso gratis

• Facilidade de uploading (formulario de subida, ftp)

• Cantidade de publicidade

• Velocidade do servidor

• Características adicionais (contadores, libro de visita, java,

javascript, estatísticas, etc)

31


Actividade 2. Colgar a páxina anterior en Internet• Usando algún buscador, localizar hospedaxes gratuitos

• Comparalos, escoller un, e rexistrarse nel

• Subilo ao espazo acadado no servidor

• Comprobar que funciona ben

32


Fundamentos de HTML

• Linguaxe interpretado

• Texto simple con etiquetas (tags), que

“abren e cerran”

• Insertanse referencias aos elementos

non texto

• Sangrado do texto (código fonte)

33


Fundamentos de HTML. Seccións máis importantes• HTML. Todo o arquivo empeza por

<html> e remata con </html>

• HEAD. Información sobre o arquivo

(non se visualiza) <head> </head>

• BODY. O que se amosa da páxina

<body> </body>

34


Fundamentos de HTML.

Elementos de cabeceira

•Título. <title> </title>

• Folla de estilo. Onde se enlaza <link>

• Estilo. O estilo da páxina <style>

35


Fundamentos de HTML. Formato do texto

• tipo de letra <font face=“arial”> texto a formatear </font>

• tamaño <font size=5> texto a formatear </font>

• color <font color=green> texto a formatear </font>

• negrita <b> texto a formatear </b>

• cursiva <i> texto a formatear </i>

• subrayar <u> texto a formatear </u>

• centrar <center> texto a formatear </center>

36


Fundamentos de HTML.

• Imaxe <img src=“../imaxe.jpg” border=“0”>

<img src=“http://www.flickr.com/imaxe.jpg”>

• Comentario 

• ligazón

<a href=“http://www.microsoft.com”> Microsoft</a>

• Nova liña <br>

• Novo parágrafo <p>

37


Fundamentos de HTML. Táboas<table width=“800” border=“0”>

<tr><td width=“400” align=“right”></td><td align=“right”></td>

</tr><tr>

<td align=“right”></td><td align=“right”></td>

</tr></table>

38


Actividade 3. Introducir texto con formato, imaxes e ligazóns

• Retomar o arquivo anterior e engadirlle máis elementos

• actualizar os cambios en Internet

35

Módulo 3:

Creación e edición de blogs

40

Módulo 3: Creación e edición de blogs

Blogs. Características

Páxina web con certas particularidades

• Viva, actualízase periódicamente

• É interactiva, o visitante pode participar nela

• Servidores proveen facilidades para crealos e administralos

• Amosan os artigos por orde de publicación inverso

41


Tipos de blogs segundo o seu contido

Blog (weB log). Similitude coas mensaxes grabadas nos

troncos.

Blog. Artigos de texto, incluindo algunhas imaxes ou videos

Fotolog. Fotos, con texto acompañándoas

Videolog. Videos, cun texto explicativo

42


Tipos de blogs segundo o seu contido

Blog (weB log). Similitude coas mensaxes grabadas nos

troncos.

Blog. Artigos de texto, incluindo algunhas imaxes ou videos

Fotolog. Fotos, con texto acompañándoas

Videolog. Videos, cun texto explicativo

43


Servidores de blogs

• Blogger. (www.blogger.com) Fácil e rápido. Menos potente

que Wordpress, pero máis sinxelo. Gratis.

• Blogia. (www.blogia.com) Sinxelo e en español. Gratis.

• Wordpress.(es.wordpress.com ) Elegante e potente, pero algo

máis complexo que blogger. O máis popular. Gratis.

• Bitacoras. (www.bitacoras.org) cun bo directorio de blogs.

Gratis pero con invitación.

44


Tarefas do blogger

• Deseño. Contidos, estrutura e apariencia.

• Edición. Escritura dos arquivos HTML.

• Escritura. Escritura dos artigos e contestación de correos.

• Publicación. Dos artigos escritos

• Mantemento. Renovación do blog, eliminación de artigos

ou seccións obsoletas, etc.

• Administración. Dar de alta e baixa autores, supervisar

artigos (moderador).

45


Blogs en Blogger. www.blogger.com

46


Blogs en Blogger.

47


Blogs en Blogger.

48


Blogs en Blogger.

49


Blogs en Blogger.

¡Xa creamos o noso primeiro blog!

50


Blogs en Blogger.

¡Aí vai!

Vista de autor

51


Blogs en Blogger. Actividade 4

Crear un blog en Blogger con calquera temática

52


Blogs en Blogger.

¡Aí vai!

Vista de

visitante

53


Blogs en Blogger.

Diferencias

54


Blogs en Blogger. Inicio

55


Blogs en Blogger. Nova entrada

56


Blogs en Blogger. Nova entrada

57


Blogs en Blogger. Editar entradas

58


Blogs en Blogger. Mantemento

59


Blogs en Blogger. Administración

60



61



62



63



64


Blogs en Blogger. Actividade 5

No blog anteriormente creado,

1.Darlle permisos de autor ao noso compañeiro ou compañeira de mesa

2.Confirmar a autorización para a invitación que recibiremos

3.Dotar de contidos o blog creado, insertando imaxes, ligazóns e algún

video

4.Xogar cos formatos e cos deseños

5.Utilizar os recursos de buscas para localizar imaxes, textos, etc.

Blogs

Education

Transcript of Blogs