Se afișează postările cu eticheta web. Afișați toate postările

O pata roz intr-o mare de verde

* Data based on Alexa & Google Trends for Website results for June 2009

Vezi in format mare aici: http://manyeyes.alphaworks.ibm.com/manyeyes/visualizations/7c0656cc4fad11deaa3c000255111976/comments/7c1a03ac4fad11deaa3c000255111976

Format static:

Tipuri de litere

1.Oldstyle

Prezinta serfuri
Serifurile sunt inclinate
Tranzitia de la subtire la gros este moderata
Linia stress este diagonala (aplecata spre stanga)

exemple: Goudy, Palatino, Times, Baskerville, Garamond

2.Modern

Prezinta serifuri subtiri orizontale
Tranzitia de la subtire la gros este radicala
Linia stress este verticala
Literele moderne au un aer rece, elegant

exemple: Bodoni, Times Bold, Onyx, Didot, Walbaum

3.Slab serif

Prezinta serifuri subtiri orizontale
Nu prezinta tranzitie de la gros la subtire sau este foarte moderata

exemple: Clarendon, Memphis, New Century Schoolbook, Silica

4.Sans serif

Nu au serifuri
Nu prezinta tranzitie de la gros la subtire

exemple: Proxima Nova, Formata, Folio, Bailey Sans, Syntax

5.Script

litere caligrafice, asemanatoare celor scrise de mana

exemple: Linoscript, Ministry Script, Fountain Pen, Cocktail Shaker

6.Decorative

fonturi cu scop decorativ

exemple: Jupiter, The Wall, Blue Island, Fajita, Pious Henry

Mai multe detalii:
http://ilovetypography.com/2007/11/21/type-terminology-old-style/

Tipurile de litere de origine chirilică
http://florinf.wordpress.com/2009/01/31/arhaic-romanesc/
http://www.peteava.ro/video/material/23968
http://www.georgehernandez.com/h/xComputers/Design/Typography.asp
http://typography.ro/2008/11/30/anatomia-fontului-typeface-anatomy/

The Non-Designer's Design Book 3rd edition - Robin Williams

What am I?

art director
usability specialist
interaction designer
front-end developer
techical writer
content specialist
project manager
analyst
user interface designer
information arhitect
graphic designer
software developer
instructional designer
content developer
teacher
programmer

poate putin din toate...

vezi si:

"Will the Real Information Architect Please Stand Up?"

http://www.slideshare.net/gleija/will-the-real-information-architect-please-stand-up-presentation?type=powerpoint

Grafice gratuite de la Google

Api-urile gratuite de la Google pot fi folosite si pentru a desena graficele dorite.
Iata cateva exemple de pornire:

Exemplu Bar chart orizontal
http://chart.apis.google.com/chart?chs=500x100&chd=t:40,60,70&cht=bhs&chl=0%7C100

Sample pie chart

Exemplu Pie chart
http://chart.apis.google.com/chart?chs=450x200&chd=t:60,40,50&cht=p&chl=Part%201%7CPart%202%7CPart%203

Exemplu grafic liniar
http://chart.apis.google.com/chart?chs=440x220&chd=t:10,58,95%7C30,8,63&cht=lxy&chl=Apr%7CMay%7CJune

Exemplu harta
http://chart.apis.google.com/chart?cht=t&chs=440x220&chd=s:g&chco=ffffff,edf0d4,13390a&chld=RO&chtm=europe&chf=bg,s,EAF7FE

Css3 browser support - octombrie 2008

Iata rezultatele testului pentru selectori css3:

Firefox 3.0.3 From the 43 selectors 36 have passed, 0 are buggy and 7 are unsupported (Passed 373 out of 578 tests)
Safari 3.1.2/525.21 From the 43 selectors 43 have passed, 0 are buggy and 0 are unsupported (Passed 578 out of 578 tests)
Chrome 0.2.149.30 - Safari/525.13 From the 43 selectors 43 have passed, 0 are buggy and 0 are unsupported (Passed 578 out of 578 tests)
IE 6.0.2900.5512 From the 43 selectors 10 have passed, 1 are buggy and 32 are unsupported (Passed 276 out of 578 tests)
IE7 From the 43 selectors 13 have passed, 4 are buggy and 26 are unsupported (Passed 330 out of 578 tests)
Opera 9.52 From the 43 selectors 43 have passed, 0 are buggy and 0 are unsupported (Passed 578 out of 578 tests)
IE8 beta2 From the 43 selectors 22 have passed, 1 are buggy and 20 are unsupported (Passed 349 out of 578 tests)

Prin urmare selectorii css3 pot fi folositi fara probleme in Opera, Safari si Chrome. (suport 100%).

Iata si definitiile acestora la http://www.w3.org/TR/css3-selectors/#selectors

Se zvoneste ca ie6 se va retrage

Mai devreme sau mau tarziu ie6 se va retrage din competitie.

Iata ce propun altii:
http://iedeathmarch.org/

Acum sa ne uitam si pe statistici:

Sursa www.w3schools.com/browsers/browsers_stats.asp

Scaderea procentului de la 55.7% la 0.1% al ie5-ului din 2002 in 2008 (5ani si jumate) ne duce la concluzia ca si ie6 va avea aceeasi evolutie sau poate una ceva mai rapida, ca urmare a numarului mare de noi browsere; cum procentul de 55.6% a fost atins de ie6 in septembrie 2006, ne putem astepta la o scadere a procentului de utilizare sub 1% in anul 2011 (si sub 3% in 2010).

Daca vreti sa vedeti si cateva statistici de la noi din tara, www.trafic.ro va ofera procentaje asemanatoare:

statistici furnizate de trafic.ro pentru siteul romanesc gsp.ro (Gazeta Sporturilor)

Lectia 1 HTML - formulare - tagurile <fieldset>, <legend>, <label>

Iata modalitatea de scriere corecta a unui formular:

.........................................................................................................................................

<form action="inregistrare.php" method="post">
<fieldset>
<legend>Formular inscriere</legend>

<label for="numeu">Nume</label>
<input type="text" value="Popescu" name="nume" id="numeu" />

<label for="pren">Prenume</label>
<input type="text" value="Mihai" name="prenume" id="pren" />

<span>Sex</span>
<label for="sex_m"><input type="radio" name="sex" value="m" id="sex_m" /> masculin</label>
<label for="sex_f"><input type="radio" name="sex" value="f" id="sex_f" checked="checked" /> feminin</label>

<label>Data nasterii</label>
<select>
<option>1</option>
<option>2</option>
<option selected="selected">3</option>
<option>4</option>
</select>
<select>
<option selected="selected">Alege data</option>
<optgroup label="Lung">
<option>Ianuarie</option>
<option>Februarie</option>
<option>Martie</option>
</optgroup>
<optgroup label="Scurt">
<option>Ianuarie</option>
<option>Februarie</option>
<option>Martie</option>
</optgroup>

</select>

<label for="poza">Poza</label>
<input type="file" name="poza" id="poza" />

<label for="mesaj">Mesaj:</label>
<textarea name="mesaj" id="mesaj" cols="30" rows="10">Completeaza cu mesajul tau...</textarea>

<label for="nl"><input type="checkbox" value="nl" name="nl" id="nl" /> Doresc sa ma abonez la NL dvs.</label>
<label for="acord"><input type="checkbox" value="ac" name="acord" id="acord" /> Sunt de acord cu <a href="#">termenii si conditiile</a></label>

<input type="submit" value="Trimite!" />
</fieldset>

</form>

.........................................................................................................................................

Taguri des omise in formulare, insa foarte importante sunt:

<fieldset> = element ce permite gruparea elementelor (campuri, butoane, etichete) aflate in legatura

<legend> = titlul fieldsetului

<label> = eticheta corespunzatoare campului urmator; atributul for permite asocierea etichetei cu elementul corespunzator. Observati cele 2 modalitati de scriere: separat - in cazul unui camp de tip text si inclus in cazul inputurilor de tip checkbox sau radio.

Folosirea acestor taguri imbunatateste gradul de accesibilitate al (x)html-ului.

Obs. Nu uitati in cazul xhtml-ului sa folositi numai atribute insotite de valoare: disabled="disabled".

Linkuri utile - Siteuri interesante

Pentru a micsora numarul de postari si de etichete, am centralizat aici cateva postari cu rol de bookmark.
Unele dintre siteurile de mai jos se mentin in pozitie de top:

www.odeo.com podcasting... diverse tematici
del.icio.us
e-CREATIVE AWARDS / those which give an inspiration
cssplay iata ce se poate intampla daca te joci putin cu css-ul :)

Salarii in domeniul Internetului / Webului

Iata statisticile celor de la aiga privind salariile pentru

"communication design profession in the United States":

mai multe detalii: http://www.designsalaries.com

Portabilitatea informatiilor

DataPortability - Connect, Control, Share, Remix from Smashcut Media on Vimeo.

DataPortability gathers existing open standards into a blueprint for a social, open, remixable web where your online identity, media, contacts and content can follow you wherever you go.

http://www.dataportability.org/

Oficiale si neoficiale - google

http://bloggerindraft.blogspot.com -> the official blog for blogger in draft

http://googlesystem.blogspot.com -> An unofficial blog that watches Google's latest attempts to move your operating system online

http://gmailblog.blogspot.com -> the official Gmail blog

Webmaster Guidelines -> recomandarile google pentru webmasteri

Lista va continua...

PS. ce parere aveti despre noul mod de introducere a comentariilor (formularul inline ce inlocuieste popupul sau pagina adresata comentariilor) ?
detalii

Tendinte noi in grafica websiteurilor (2008)

Stilurile Vintage / Retro
Notite scrise de mana si agrafe
Stil dezordonat
Stropi de cerneala
Tempera
Tehnica colajului
Scrisul de mana si schite
Litere mari
Fonturi Script
Texturi de lemn
Delimitari in Zig Zag

Iata si exemple: http://bestwebgallery.com

Tendinte web2.0 catre web3.0

| View | Upload your own

Aplicatii web2.0

http://www.feedmyapp.com - director de aplicatii web2.0 cu diverse categorii: bloguri, chat, webos, joburi, social, mancare, etc
http://www.go2web20.net
- director cu siteuri web2.0 clasificate prin etichete; vizualizare flash

Editare de imagini online

Bran, originally uploaded by minea_eliza.

Aceasta poza este editata cu Picnik ( www.picnik.com ) din interiorul siteului Filckr ( www.flickr.com ) si este postata pe blogul meu direct, de pe Flickr. Incercati si voi!

lista mea opml incompleta

Iata una din listele mele de feeduri:

<?xml version="1.0" encoding="UTF-8"?><opml version="1.1"><outline text="Main Folder"><outline title="feeds.feedburner.com/subtraction" text="feeds.feedburner.com/subtraction" type="rss" xmlurl="http://feeds.feedburner.com/subtraction"><br /><outline title="feeds.feedburner.com/BoxesAndArrows_Stories" text="feeds.feedburner.com/BoxesAndArrows_Stories" type="rss" xmlurl="http://feeds.feedburner.com/BoxesAndArrows_Stories"><br /><outline title="feeds.feedburner.com/vitaminmasterfeed" text="feeds.feedburner.com/vitaminmasterfeed" type="rss" xmlurl="http://feeds.feedburner.com/vitaminmasterfeed"><br /><outline title="feeds.feedburner.com/FunctioningForm" text="feeds.feedburner.com/FunctioningForm" type="rss" xmlurl="http://feeds.feedburner.com/FunctioningForm"><br /><outline title="feeds.feedburner.com/Bittbox" text="feeds.feedburner.com/Bittbox" type="rss" xmlurl="http://feeds.feedburner.com/Bittbox"><br /><outline title="feeds.feedburner.com/idevelop/wdNW" text="feeds.feedburner.com/idevelop/wdNW" type="rss" xmlurl="http://feeds.feedburner.com/idevelop/wdNW"><br /><outline title="feeds.feedburner.com/pingmag_e" text="feeds.feedburner.com/pingmag_e" type="rss" xmlurl="http://feeds.feedburner.com/pingmag_e"><br /><outline title="feeds.feedburner.com/urlgreyhot" text="feeds.feedburner.com/urlgreyhot" type="rss" xmlurl="http://feeds.feedburner.com/urlgreyhot"><br /><outline title="feeds.feedburner.com/SmashingMagazine" text="feeds.feedburner.com/SmashingMagazine" type="rss" xmlurl="http://feeds.feedburner.com/SmashingMagazine"><br /><outline title="feeds.feedburner.com/Boagworldcom-ForThoseManagingWebsites" text="feeds.feedburner.com/Boagworldcom-ForThoseManagingWebsites" type="rss" xmlurl="http://feeds.feedburner.com/Boagworldcom-ForThoseManagingWebsites"><br /><outline title="www.aiga.org/syndication/articles/home.rss" text="www.aiga.org/syndication/articles/home.rss" type="rss" xmlurl="http://www.aiga.org/syndication/articles/home.rss"><br /><outline title="www.w3.org/2000/08/w3c-synd/home.rss" text="www.w3.org/2000/08/w3c-synd/home.rss" type="rss" xmlurl="http://www.w3.org/2000/08/w3c-synd/home.rss"><br /><outline title="www.colly.com/index.php?/weblog/rss_2.0/" text="www.colly.com/index.php?/weblog/rss_2.0/" type="rss" xmlurl="http://www.colly.com/index.php?/weblog/rss_2.0/">  </outline></opml>

Web Trend Map 2008

Web Trend Map 2008 asa cum o vad cei de la www.informationarchitects.jp

Si tendinte in general...

Alte feeduri preferate

http://feeds.feedburner.com/veerlesblog

http://www.cssbeauty.com/rss/news/

http://www.cssbeauty.com/rss/gallery/

http://annevankesteren.nl/feeds/weblog

http://www.w3.org/2000/08/w3c-synd/home.rss

http://feeds.feedburner.com/Photojojo

http://feeds.feedburner.com/urlgreyhot

http://feeds.feedburner.com/boagworldpodcast

http://feeds.feedburner.com/BoxesAndArrows_Stories

http://www.alistapart.com/feed/rss.xml

http://www.aiga.org/syndication/articles/home.rss

http://www.netmag.co.uk/zine.rss

http://feeds.feedburner.com/SmashingMagazine

http://www.ghelir.ro/rss

Firefox

Extensiile mele prefeate pentru firefox sunt :

del.icio.us Bookmarks https://addons.mozilla.org/firefox/3615/

Greasemonkey - o unealta foarte utila pentru cei dorici sa experimenteze, care are un viitor sigur :) https://addons.mozilla.org/firefox/748/

web developer toolbar - utila, dar nu fundamentala https://addons.mozilla.org/firefox/60/

Firebug - o unealta forte importanta; parerea mea este ca ar trebui inclusa in firefox - variata pentru developeri https://addons.mozilla.org/firefox/1843/

download status bar https://addons.mozilla.org/firefox/26/

Lista mea completa de extesii o puteti gasi aici.

Nu folositi inca firefox? Grabitiva sa-l downloadati.

Aspectul webului 2.0

Acest post este dedicat graficienilor si designerilor orientati spre arhitectura informatiei, prezinta acele elemente care dau aspectul unui site web2-0.
Citind urmatoarele articole o sa va faceti o idee destul de ampla asupra acestora: litere mari, logouri sugestive si ingrosate, gradienti, culori aprinse, reflexii... etc:

Insa nu trebuie sa insistati asupra lor,deoarece utilizatorul nu poate fi pacalit. Desi aspectul este important si imbunatateste experienta utilizatorului, informatia este cea mai importanta. Scopul si arhitectura siteului sunt esentiale. (vezi postul anterior)

mineaeliza: { web design }