Tècniques de Maquetació Web i Imatges Vectorials

Imatges Vectorials

• Fitxers de molt poc pes, per tant, fàcils de descarregar per internet. El fitxer només conté la informació de com obtenir la imatge a partir d'un conjunt de primitives amb uns valors dels seus paràmetres.
• Imatge independent de la resolució. Permet aplicar zoom mantenint la qualitat de la imatge.
• Es pot seleccionar i manipular independentment cada objecte de la imatge.
• Es pot agrupar i després tornar a desagrupar part de la imatge com un sol objecte.
• Es pot ordenar en profunditat (superposició), creant la il·lusió de 3D.
• Permeten l'animació canviant la posició dels objectes de la imatge.
• Pot utilitzar text TrueType caràcter a caràcter, ja que també són dibuixos.

Tècniques de Maquetació Web

Maquetació basada en Taules

S'aconsegueix l'estructura de 3 panells col·locant una estructura imbricada de taules invisibles com a substrat del codi HTML de la pàgina. Amb la tècnica de trossejat es pot crear la GUI com a imatge que es trosseja i s'exporta a HTML, creant automàticament la taula.

Maquetació basada en Marcs (Frames)

La maquetació és a nivell de navegador, és a dir, cada panell correspon a un marc del navegador.

Avantatges dels Marcs

• Crea zones inamovibles per a la capçalera i la navegació; per tant, sempre sabrem on som i a on podem anar.
• Pàgines amb menys codi repetitiu i, per tant, més mantenible i més ràpid de descarregar.

Inconvenients dels Marcs

• Disseny poc flexible a les mides de la pantalla i resolució. Poden haver-hi zones ocultes de la navegació vertical si les mides de la pantalla no són adequades.
• Difícil d'imprimir. La impressió és independent per a cada marc (a vegades pot ser un avantatge).
• La sincronització de dos marcs respecte a un tercer només és possible amb programació (JavaScript). Per tant, l'estructura de navegació horitzontal en la capçalera i vertical en el marge esquerre requereix de programació.
• Difícil de mantenir l'històric de navegació perquè podem perdre l'estructura de 3 panells.

Què són els Marcs (Frames)?

Permeten dividir la finestra del navegador de manera que presenti un conjunt de documents HTML diferents en la mateixa finestra, un per marc. Per crear l'estructura de 3 panells calen 4 documents: l'índex.html i un per cada marc.

Maquetació basada en Capes i CSS

A l'igual que la tecnologia basada en taules, la maquetació és a nivell de pàgina i s'aconsegueix col·locant capes HTML amb el seu corresponent CSS. CSS dona el format de cadascuna. Tornem a separar la maquetació del disseny.

Què són les Capes (Layers)?

Nou tipus de contenidor que ha aparegut en versions més recents dels navegadors. Es té un control total de la posició, mides i estils. Insertar>Objetos>divPA