divendres, 27 de març de 2009

Recursos Vol. 14: Tipografia i CSS

Hola que tal, benvinguts a una nova edició dels recursos.
Special Edition: Tipografia i CSS

Col·lecció de 35 fonts per a disseny
25 Tècniques avançades de CSS: backgrounds degradats, efectes 2D i 3D en botons, opacitats, transparències...
Bones pràctiques en els menús desplegables
Gràfiques i barres de dades amb CSS
Read more ...

divendres, 20 de març de 2009

Presentacions de manuals i catàlegs

Com millorar la presentació de manuals i catàlegs?

Us presento dues eines online per a la creació de 'revistes' i 'llibres' online a partir d'un document.

Issuu: és una aplicació que ens permet crear una revista a partir de qualsevol tipus de document. Facilíssim
1. Seleccionar l'arxiu
2. Posar-hi un títol i una descripció
3. Afegir un e-mail
4. Upload

Un cop fet això rebrem un email per a validar-nos i accedir el nostre espai dins de l'aplicació. Tenim també una eina per a afegir la revista que hem creat al nostre blog o lloc web. La presentació del document és en format revista on podem passar els pàgines fent clic amb el ratolí.

Panell de control:



Exemple:


Wobook: aplicació per a crear eBooks a partir de documents pdf, word, ppt, excel, oppenoffice.
Cal que ens registrem (gratis) i ja podem començar a crear els nostres propis eBooks.
Un exemple de la visualització d'un wobook

Extra

De pdf a Word
Free PDF to Word Doc Converter v1.1
Aplicació per a convertir un document pdf en Word, descàrrega gratuita
Read more ...

dimecres, 18 de març de 2009

Tipus de Webs Vol. 1

Hola, que tal. Vull compartir amb vosaltres un estudi que vaig fer sobre classificació de webs segons diferents criteris:

Primera Part: Classificació web
1.Per la seva audiència
  • Públics: És un lloc web normal, una pàgina dirigida al públic general, sense restriccions d’accés en principi.
  • Extranet: Són llocs limitats pel tipus d’usuaris que hi poden accedir, per exemple els proveïdors d’una empresa, o els clients.
  • Intranet: Són llocs que el seu accés està restringit a una empresa o organització, normalment funcionen dins de xarxes privades.
2. Pel seu dinamisme
  • Llocs interactius: L’usuari pot influir sobre el continguts del lloc que variarà en funció de cada usuari. Normalment les pàgines es generen quan l’usuari les sol•licita, personalitzant la informació que se li ofereix.
  • Llocs estàtics: Els usuaris no poden modificar o afegir res al lloc.
3. Per la seva navegabilitat:
Estructures obertes, tancades o semitancades:
  • Estructura oberta: Tots els documents disposen d’adreça i els usuaris poden accedir a qualsevol punt del web.
  • Estructura tancada: Limita l’accés només a un punt d’entrada. Un exemple seria un lloc web que requereix de registre previ per entrar.
  • Estructura semitancada: Té l’accés limitat només a algunes seccions.
4. Pels seus objectius
  • Comercials: Estan creats per a promocionar els negocis d’una empresa. La seva finalitat és econòmica.
  • Informatius: La seva finalitat és la de distribuir informació.
  • Oci: Jocs, cerca de parella, amics.
  • Navegació: La seva finalitat és la d’ajudar a l’usuari a trobar allò que busca a Internet.
  • Artístics o disseny: Són un mitjà d’expressió artística del seu creador o creadors.
  • Personals: A l’igual que els anteriors són un mitjà d’expressió del seu creador o creadors. Els seus objectius o audiència poden ser molt diversos, avui en dia triomfen els blocs o diaris personals.
5. Pel seu estil
Aquesta és una classificació subjectiva.
Els tipus d’estils de webs que es presenten en aquest document són una classificació basada en la recerca.
  • Magazine
  • Minimalista
  • Basat en retícules o quadrícula
  • Experimental o de disseny
  • Fotoblogs i Video blogs
  • E-comerce (botigues on line)
Continuarà...
Read more ...

Recursos Vol. 13: El recurs del mes


Templart: Magnífica eina online per a crear una plantilla web amb pocs clics.
Pels que no tenen temps o els que encara estan començant.

Chuck Norris l'aprova i ens la recomana
Read more ...

Mides absolutes i relatives

Mides absolutes i relatives en CSS:

px (píxels, relativa)
pt (punts, absoluta; 1 punt equival a 1/72 de polzada)
pc (piques, aproximadament 12 punts, absoluta)
in (polzades, absoluta; 1 polzada equival a 2.54 cm)
cm (centímetre, absoluta)
mm (milímetre, absoluta)
em (mida de la font actual, relativa)
ex (aproximadament la meitat de la mida de la font, relativa o l'alçada de la 'x')
% (percentatge, relativa)


Per a què utilitzarem les mides absolutes i les mides relatives?

Les mides relatives
especifiquen un mida en relació a una altra propietat, és a dir, els full d'estils que facin anar mides relatives
podran modificar la seva escala molt més fàcilment (web líquida)


Les mides absolutes
ens seran útils quan sabem perfectament quin serà el mitjà de sortida, per tant adaptem els full d'estil a aquell mitjà.
La pàgina és rígida, manté unes proporcions fixes independentment de la resolució del nostre monitor.


1. Els píxels
Al estar relacionats amb els medis visuals (la quantitat mínima de informació que es visible
en una pantalla), és la mida més utilitzada.
Encara que els píxels són una mida relativa, en pantalla solen comportar-se com una mida absoluta.


2. Els EM
Què és un em? A què equival? Per a què serveix?
Són les grans preguntes existencials dels maquetadors web...
Per si encara no hi ha manera, aquí van unes quantes ajudes:


EmChart la carta d'ems.
Aquesta carta ens mostra la seguent formula per calcular els ems:

The formula for computing the EM multiplier is:
desired pixel size / current pixel size = multiplier
és a dir, mida de píxel desitjat / mida actual de píxel = multiplicador

Per a què la utilitzarem?
Per a calcular bottom margins, line-heights, top margins, i top/bottom padding.

EmCalculator la calculadora d'ems
Ens ajudarà a crear el nostre web amb ems, només cal que afegim les mides en píxels i automàticament ens ho transforma en ems.

Enllaços relacionats

Especificacions CSS2
sidar.org
Read more ...

dimarts, 17 de març de 2009

El futur dels Gestors de Continguts de Codi Obert

Via dezinerfolio.com us presento aquest article sobre el futur dels CMS de Codi Obert.

En aquest article 23 dels millors dissenyadors i desenvolupadors web, ens donen el seu parer sobre els CMS de Codi Obert i les seves perspectives de futur.

Despres de fer anar bastants CMS (de codi obert o propietari), podem fer-nos un idea de les virtuts i les mancances d'una manera crítica i constructiva.
Segons les tendències actuals, tot allò que sigui de codi obert sempre tindrà un bon futur (sempre que sigui un bon producte, és clar), però, un bon Gestor de continguts ha de reunir uns requisits específics per a acabar sent dels més usats.

Un bon CMS desde la perspectiva del posicionament:
SEOmoz ens presenta un article sobre com escollir el millor CMS des de la perspectiva del posicionament web.
Aquest article ens parla de la importància que el CMS ens ofereixi eines pel posicionament, poder afegir meta Keywords i validar-los, eines per poder afegir meta-tags dins l'HTML, una bon estructura i categorització de l'arbre de continguts web, etc.

Interessant i constructiu.
Read more ...

divendres, 13 de març de 2009

La Taula Periòdica de les Tipografies

Via Behance.net us presento la Taula periòdica de les Tipografies.

Assigna a cada tipo un número químic ordenades per per la seva popularitat, influència i notorietat, és a dir, aquelles que s'han convertit en les favorites de dissenyadors gràfics i web.
Així ens trobem que la helvetica correspon a l'hidrogen amb numero atòmic 1, seguidament ens trobem a la Futura.
(l'Arial no hi és)



És interesant la manera com ho mostra:
Familia
Número en el rànking
Símbol
Exemple de la font i nom
Creador i any de creació

Read more ...

dimecres, 11 de març de 2009

Recursos Vol. 12: Eines Online

Hola que tal, benvinguts a una nova edició dels recursos.
Edició especial eines on-line per a disseny:
Com molen les coses free!!

Favicon generator bonic generador de Favicons, si no vols deixart'hi la vista, val la pena provar-lo.
LovelyCharts és una aplicació online per a fer diagrames, retícules web, arbres de continguts, etc., 100% gratuït!!!
Colors Scheme Designer, aplicació per fer paletes de colors complementaris, armònics, monocromàtics, etc. Ens dóna la possibilitat de visualitzar una pàgina d'exemple amb els colors que hem triat, en versió clara o fosca. Útil, fàcil, ràpid, per fer via quan no tenim massa temps.
Read more ...

Recursos Vol. 11: Templates i inspiració

Hola que tal, benvinguts a una nova edició dels recursos.
Edició especial Templates
Selecció d'algunes de les millors pàgines de descàrrega gratuïta de plantilles per web.
Inspiració
Read more ...