Projecte final HTML

Bon dia a totes i tots!

En aquesta pràctica, que he anomenat projecte final HTML farem una composició i una aplicació de tot el que hem après (afegint-hi una cosa nova) per a donar un nou aspecte a la nostra web. Per tant, podem dir que contarà com a nota d'examen d'Informàtica per aquest segon trimestre (i que farà mitja ponderada amb la resta de notes de les pràctiques, el treball a classe, etc, que ja teniu)

En aquesta ocasió treballarem amb el que s'anomenen frames, que no són més que espais de webs superposades a la nostra que donen un servei determinat. Si visualitzeu la pàgina web de l'escola: http://www3.planalfa.es/safac/ podreu veure una aplicació de frames sobre una web activa.

La idea que us proposo és que doteu la vostra web, la que heu anat construint durant aquestes setmanes, d'un menú d'enllaços i de, com a mínim, 3 pàgines de contingut divers (per la primera podeu aprofitar la que ja teniu feta; per la segona creeu-ne una altre que estigui relacionada, i per la tercera feu-ne una altre en anglès també relacionada amb les anteriors). Fixeu-vos en els exemples de l'apartat Try-it-yourself del següent enllaç: http://www.w3schools.com/html/html_frames.asp

Al final, haureu de tenir una web que es mostri amb dos espais: un per menú d'enllaços (vertical o horitzontal) i un per continguts.

La web que es mostrarà tindrà 2 frames. Quan fem clic a un enllaç, s'obrirà en el frame principal (per veure el codi d'exemple, busqueu abaix del link anterior, a l'apartat Navigation frameset, on us mostrarà l'atribut de l'enllaç que fa obrir una web a un frame diferent).

Quan acabeu, m'haureu d'enviar en una carpeta comprimida el document html on declareu els frames i les 3 webs que s'obren en els frames, de tal manera que quan jo els descarregui i els extregui del zip o el rar, es visualitzi tot correctament (reviseu les URLs, i no poseu "http://.........", sino només el nom del document html a obrir amb l'extensió ("document.html").

Aquesta pràctica és dura. De moment compteu amb tota la setmana per a realitzar-la. Segons com vegi que va, potser dediquem la setmana següent a acabar-la.

Ànims!

Xavi

Pràctica 8

Good morning to everyone!
Today it comes in English too! It has been a while since you did your last English practice and it's interesting to take it back.You have to think that this is aplicated english learning, so this completes your English class' grammar, vocabulary, etc

In this practice, you will have to translate your webs in english, so I can read them in this language. Remember not to use google translator or likely online applications, because they don't translate in the correct way.

This practice's mark will be taken from your use of english, your correction in writing, and your improvements of your previous web. Try to use everything you have learned in last practices to make a new version of your web.

Good luck!
Xavi

Pràctica 7

Hola a totes i a tots!

En aquesta nova pràctica vull que visiteu els següents enllaços:

http://www.w3schools.com/html/html_links.asp
http://www.w3schools.com/html/html_images.asp

Escriu-me en un nou apartat de la vostra web els atributs extra que poden utilitzar les etiquetes <a> i <img>, per què serveixen, afegeix un exemple de cada a la teva web i envia-me-la al correu.

Ànim!

Xavi

Classificació Halloween

Hola!

Com se sol dir: "lo prometido es deuda", així que aquí us poso la classificació final de Halloween.

La veritat es que als llocs alts de la classificació ha sigut molt difícil decidir la col·locació, ja que els treballs eren molt bons. S'ha valorat el resultatfinal, l'estètica, la cura del detall i la utilització de diferents tècniques per a la realització del treball. L'ordre de la classificació és el següent:

Per tant, enhorabona a 19, 3 i 17 que empaten en segon lloc i a 8 per ocupar les primeres posicions campiones d'aquest petit concurs :)

A tots els altres, enhorabona per la feina!

Salut!

Xavi ;)

Pràctica 6

Hola a totes i tots!
En aquesta nova pràctica acabarem de retocar paràmetres amb els que vam començar a treballar la pràctica passada. Recordeu que els atributs d'estil ara es defineixen conjuntament amb l'etiqueta "style", enlloc d'utilitzar paràmetres independents d'altres etiquetes com la "font".

En aquesta pràctica anirem una mica més enllà: aplicarem un color de fons i altres paràmetres d'estil a la nostra web segons aquesta nova etiqueta. Haureu de recuperar la vostra web personal, on es trobaven les vostres descripcions i modificar-ne l'estil.

Visiteu l'exemple de la web: http://www.w3schools.com/html/tryit.asp?filename=tryhtml_styles i seguiu-lo per a donar color al fons enlloc de com ho fèieu abans. A més, a la vostra pàgina web, afegeix un paràgraf amb la definició de "CSS" i cerca i escriu-hi a què es refereixen els experts quan es parla d'etiquetes "deprecades" i doneu algun exemple. Per tant:

-Utilitza styles per redefinir la teva web personal original.
-Afegeix un nou paràgraf d'informació sobre tu amb un estil diferent.
-Afegeix un subapartat (amb subtítol, etc...) sobre el CSS (molt breu, 3-4 línies)
-Afegeix la definició d' "etiqueta deprecada".

-Extra: afegeix un enllaç a un document word qualsevol dels realitzats durant el curs. Explica a la web què      passa. S'obre a la mateixa pàgina web? S'obre amb un altre programa?
-Afegeix un enllaç "torna a l'inici" al final de la vostra web, que quan s'hi faci clic torni a l'inici de la web.

Ànim!
Xavi

Pràctica 5

Hola a tots i a totes!

En aquesta pràctica entrarem en el món dels estils. Antigament es feien servir una sèrie d'etiquetes qe molt probablement vosaltres mateixos heu utilitzat a la última pràctica per a afegir color o mides diferents als textos que escrivíeu. Ara però, tot això va estant definit mitjançant el que s'anomena "style". El més utilitzat actualment és un estàndard conegut com a CSS, que ens permet, aplicant-lo, convertir una web normal en una web "actual".

A continuació teniu un exemple d'una web simple que encara feia servir l'etiqueta <font>: Proveu-ho

<p>
< font size="5" face="arial" color="red">
This paragraph is in Arial, size 5, and in red text color.
< /font>
< /p>

< p>
< font size="3" face="verdana" color="blue">
This paragraph is in Verdana, size 3, and in blue text color.
< /font>
< /p>

Per a aquesta pràctica, doncs, visiteu aquest enllaç: http://www.w3schools.com/html/html_fonts.asp
i aquest altre: http://www.w3schools.com/html/html_css.asp
i observeu quines diferències hi ha entre les configuracions antigues i les actuals amb CSS.

-Realitzeu una plana web explicativa dels CSS amb el següent contingut:
- Títol: Explicació
- Imatge: alguna que tingui a veure amb els estils, cerqueu per Internet
- Descripció de què fa cada línia de codi de http://www.w3schools.com/html/tryit.asp?filename=tryhtml_fontall
- Descripció dels atributs de l'etiqueta <style> i quina estructura té l'etiqueta en global.
- Enllaç a la web que vau crear a la pràctica passada *


Ara doncs, amb tota la feina per davant, ànim i comenceu!

Xavi