Subscriure's per RSS/AtomLa web border-radius ens permet crear gratuïtament cantons arrodonits per a les nostres webs o taules compatibles amb:
- CSS3
- WebKit
- Gecko
Archive for the ‘Web’ Category
Programació CSS: marcs arrodonits
dilluns, març 8th, 2010Google Reader: Dreceres de teclat
dissabte, febrer 27th, 2010
Els que empreu google reader com a lector de fonts RSS trobareu útil de saber que hi ha unes tecles, que ens permeten navegar rà pidament pels articles.
S’anomenen dreceres o accessos directes de teclat i consisteixen a prémer una tecla o una combinació de les mateixes per a realitzar rà pidament una acció.
Algunes les podeu fer servir arreu, altres són per a la vista de notÃcies.
Us en deixo els que trobo més interessants.
| Tecla | Efecte |
| Navegació | |
 |
Baixar i obrir el següent article. |
 |
Pujar i obrir el següent article. |
  |
Obre o tanca la visualització de l’article. Enter fa el mateix efecte. L’ús d’enter o de la tecla o fan la mateixa funció. |
 |
Baixa sense obrir l’article. |
 |
Puja sense obrir l’article. |
 Espai. Baixa una plana. Es pot fer amb pà gina avall, i pà gina amunt. |
|
| Sobre l’article | |
 |
Marca amb l’estel o desmarca. |
 |
Veure l’article original (obre en una altra pestanya/finestra). |
| Salt | |
 |
Anar als elements marcats amb l’estel (starred). G i després S. |
| Aplicació | |
 |
Refrescar. |
 |
Veure en pantalla completa. |
 |
Afegir una subscripció. |
Si no us responen feu clic sobre el text d’una notÃcia per a situar el focus i tot seguit premeu la tecla.
Podeu consultar tots els accessos directes a l’ajuda de google reader.
Programació CSS: Fer que surti una fletxeta als camps de text
dimarts, febrer 2nd, 2010Us passo un truc per a fer que els formularis HTML de les planes web que programeu tinguin una fletxeta a l’esquerra quan es passi la fletxa del ratolà pel damunt.
Fletxeta vermella a la dreta
A més a més farem que mentre s’escrigui, la fletxa del cursor es converteixi en una mà , i el text aparegui en color blau.
El text és blau mentre escrivim
Per a això haurem de crear un fitxer de tipus CSS, i col·locar-lo dins la carpeta css/
També crearem la carpeta imatges/ i hi posarem a dins la imatge de la fletxeta 
Podeu descarregar-la des d’aquÃ: fletxa-e.gif
Dins del directori css crearem un fitxer anomenat codic-cat-test-input-fletxa.css amb aquest contingut:
/* www.codic.cat
Arxiu css per a l'efecte de la fletxeta vermella, color del text, i fletxa del ratolÃ
Enllaç curt a aquest article: http://wp.me/pzeab-1as
*/
#codic-cat-test-fletxa input, #codic-cat-test-fletxa textarea {
color: #010101; /* Color del text escrit */
background-color: #FFFFFF;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 100%;
border-right: 1px solid #C5C5C5;
border-bottom: 1px solid #C5C5C5;
border-left: 1px solid #333333;
border-top: 1px solid #333333;
margin: 0 0 5px 0;
padding: 1px 2px;
cursor: pointer;
}
#codic-cat-test-fletxa input:hover, #codic-cat-test-fletxa textarea:hover {
color: #010101;
background: #FFFFFF url(../imatges/fletxa-e.gif) right no-repeat;
}
#codic-cat-test-fletxa input:focus, #codic-cat-test-fletxa textarea:focus, #codic-cat-test-fletxa select:hover, #codic-cat-test-fletxa select:focus {
color: #0101F1; /* Color del text mentre escribim */
background: none;
background-color: #F7F7F7; /* Color gris de fons mentre escribim */
}
Un cop fet això, crearem a l’arrel del nostre projecte un arxiu html, el podeu anomenar com volgueu, jo li he dit codic-cat-test-input-fletxa.html.
<html> <head> <link rel="stylesheet" type="text/css" href="css/codic-cat-test-input-fletxa.css" /> </head> <body> <h1>Codic.cat formulari de demostració</h1> <div id="codic-cat-test-fletxa">    <form name="codic-cat-test" id="codic-cat-test" method="post">      <input type="text" name="nom" id="nom" /><br />      <input type="text" name="cognom" id="cognom" /><br />      <textarea name="comentaris" id="comentaris"></textarea><br />    </form> </div> <div id="codic-texte">    Passa la fletxa del ratolà per sobre dels camps per a veure la imatge.<br /> </div> </body> </html>
I executem l’arxiu html amb el navegador.
Aquest codi funciona perfectament en google chrome i en firefox, però no amb internet explorer 8 de microsoft.
microsoft té una terrible voluntat de no seguir els està ndards.
Greasemonkey per a Google Chrome
dimarts, febrer 2nd, 2010
En un moviment d’una potència espectacular google ha contractat el creador de Greasemonkey (Aaron Boodman), un sistema d’scripts que ens permet fer el que vulguem per a Mozilla Firefox, i ha portat nativament GreaseMonkey a chrome 4.
Això fa que que desenes de milers d’scripts (guions o programes interpretats en temps real), uns 40.000,  siguin disponibles per a google Chrome 4 només descarregar-lo i puguem fer tantes coses com permet fer aquest sistema d’scripts:
- treure la publicitat dels webs
- canviar el tipus de lletra
- descarregar totes les imatges en el resultat d’una cerca
….
Es calcula que entre un 15 i un 25% dels scripts de Greasemonkey encara no funcionen en chrome, quelcom que canviarà aviat amb la incorporació del creador del motor d’scripts.
Via: Donwload Squad
Alliberat google Chrome 4
dimarts, gener 26th, 2010
S’acaba d’alliberar la versió final de google Chrome v. 4.
Concretament és la 4.0.249.79.
Aquesta versió presenta alguns avantatges molt interessants:
- La cà rrega de planes és molt més rà pida
- Es poden instal·lar extensions (complements o plugins)
- Es pot sincronitzar els favorits (bookmarks) entre tots els nostres ordinadors
La funcionalitat d’actualitzar els favorits (adreces d’interès) amb tots els nostres equips és realment fà cil de fer servir.
Només cal que introduïm el correu electrònic i el mot de pas d’una conta de gmail, i ja està .
Els nostres favorits es guarden dins de la conta de gmail.
La funcionalitat d’extensions és realment fabulosa.
Podem instal·lar tot d’extensions anant a la plana:
https://chrome.google.com/extensions
A més a més segons google, les extensions ens avisaran automà ticament quan hi hagi una nova versió.
Podeu veure algunes extensions en aquesta imatge, a l’extrem superior dret, que he capturat del vÃdeo oficial de google:
Per exemple amazon té una extensió que permet  afegir a la teva llista de productes desitjats (wish list) productes, afegir notes, i accedir quan vulguis.
Una aplicació que seria realment trencadora, kick ass que dirien a Amèrica (coça al cul de la competència), seria una que et notifiqués quan un producte que t’interessa (ebay, amazon…) baixa de preu.
Les extensions s’instal·len des del mateix navegador amb un click.
Els que coneixeu wordpress sabeu que podem instal·lar temes i ginys (extensions) amb un clic. El mateix.
Aquesta és la plana web de les extensions:
Una extensió genial és Flashblock.
Aquesta extensió permet bloquejar el flash de les planes, fins i tot de manera individual.
Per exemple els banners de publicitat.
El que més memòria i temps de CPU menja de les múltiples planes amb les que navego és la publicitat flash amb la que ho envaeixen tot.
Amb aquesta extensió s’ha acabat el broquil!.
Secbrowsing també és molt recomanable ja que periòdicament revisa que tots els nostres complements o plugins estiguin actualitzats.
Via: Official Google Blog
WAMP
dijous, desembre 24th, 2009
WAMP vol dir:
Windows
Apache
MySql
PHP.
És habitual l’expressió LAMP:
Linux
Apache
MySql
PHP.
La gent de wampserver.com van desenvolupar un WAMP:
Apache + MySql + Â PHP per a Windows.
Bà sicament han creat un executable que instal·la Apache, Php, i MySql tot llest per a començar a programar i que permet configurar la majoria de coses amb un clic.
Les directives de PHP.INI o d’Apache (httpd.conf) es poden modificar amb una simple pulsació del botó del ratolÃ, i llavors el programari modifica els fitxers de configuració.
Aixà per exemple per a activar en PHP que permeti usar <? i no només <?php, enlloc de modificar l’arxiu PHP.INI i acativar la directiva short open tag, fem clic a la opció pertinent, wamp fa que s’actualitzi la configuració, i al cap de 2 segons en el nostre entorn ja permet executar codis PHP com <?=”Hola Catalunya”?>.
Crear à lies al servidor web es fa també des del ratolà i és terriblement fà cil.
Una altra de les grà cies és que permet disposar de diverses versions d’Apache, de PHP o de MySql i de bescanviar quina s’està executant amb un clic.
Nogensmenys per a fer això s’ha d’instal·lar uns complements.
I per a acabar-ho d’adobar incorpora el PHPMyAdmin, que és un administrador web per a MySql, per a poder crear les taules, Ãndexs, afegir usuaris, permisos, etc… des de la mateixa eina.
No podia faltar la opció phpinfo(). ;-)
Jo acostumo a desenvolupar en PHP contra Linux, o bé contra Windows, però en configuracions on tot és instal·lat manualment i els arxius s’han de modificar a mà : el servidor Web, MySql, i el PHP…
I haig de dir que amb wampserver va ser descarregar-lo i començar a programar en qüestió de segons.
El fet de poder parar tots els serveis per a que no consumeixin memòria ni CPU mentre no els fem servir, i poder-los reiniciar en segons amb un clic, també és d’agrair.
Alliberat PHP 5.2.12
divendres, desembre 18th, 2009
S’acaba d’alliberar la versió 5.2.12 de PHP.
Aquesta versió soluciona més de 60 problemes i millora l’estabilitat.
També s’ha incorporat la possibilitat de limitar el número de d’arxius que els usuaris poden enviar al servidor via formulari per a evitar atacs de denegació de servei DoS, com ja van fer el 17 de Novembre amb PHP 5.3.1.
Veure l’anunci oficial de PHP (anglès, traduir al Català amb google).
VÃdeo: què és google Chrome OS
dijous, novembre 19th, 2009El sistema operatiu de Google: Google Chrome OS.
Aquest vÃdeo, en anglès, explica què és.
Us en faig cinc cèntims: és un navegador. Quan inicies l’ordinador súper-rà pidament s’inicia un navegador i tot, tot, ho fas a Internet.
Ben mirat, si la majoria del nostre temps el passem navegant a Internet, consultant el correu de google, editant documents (es pot fer amb google documents i guardar-los a Internet), llegint feeds RSS, veient vÃdeos, publicant el bloc, interactuant al Facebook… perquè no fer que l’ordinador arrenqui súper-rà pidament i iniciï un navegador per a fer totes aquestes coses a Internet?.
Això és el que han pensat els nois de google i s’explica al vÃdeo.
En Richard Stallman, i no només ell, hi estaria en contra i ens avisaria dels perills de que totes les nostres dades, la nostra vida, sigui a la xarxa.
De moment google està fent bé les coses i ens permet exportar i fer un backup de tot el que tenim al núvol (es coneix aixà Internet quan ens referim a que guardem les nostres dades a algun lloc d’Internet, sense conèixer la infraestructura que hi ha al darrere).
Les consideracions d’Stallman anirien en la lÃnia de la privacitat i la seguretat, i és cert que al Facebook, qualsevol dictadura podria exigir (com fan a la xina amb yahoo i google) i saber qui són els nostres amics i demanar accés al nostra bústia de correu. En el cas d’un mail gratuït de hotmail, yahoo, o gmail, qui ens diu que el garzon o el rubalcaba no es podrien dedicar a espiar-nos preventivament?. No seria cap sorpresa.
Bé, un aspecte a tenir en compte és 1) la privacitat i el perill de que les nostres dades estiguin a la xarxa, i l’altre 2) disponibilitat de servei.
Si gmail no funciona i no tenim accès al nostre correu, podem perdre hores de feina. El mateix si falla google documents.
I si un error als servidors comportés que perdéssim tota la nostra informació podria significar una catà strofe a la nostra vida o la de la nostra empresa.
Tot això són els reptes als que ens hem d’enfrontar amb aquestes noves tecnologies que canvien amb tanta velocitat i que canvien també la nostra manera de viure i de relacionar-nos amb els altres, com per exemple Facebook.
Truc: Saber qui enllaça al nostre bloc
dilluns, novembre 16th, 2009
Blogsearch ens permet saber fà cilment qui enllaça al nostre bloc.
Per tal de saber quins enllaços google ha indexat que apunten al nostre bloc simplement direm:
| link:elnostrebloc.cat |
I ens retornarà els resultats.
Blogsearch està disponible en Català . Si la veieu en una altra aneu a les preferències i indiqueu-li l’idioma en que google mostrarà els missatges.
Moltes persones no se n’han adonat però google va incorporant la nostra llengua a totes les seves eines.
Fins i tot moltes, no totes, són accessibles des del punt cat.
Youtube Full HD
divendres, novembre 13th, 2009
Youtube ha anunciat al seu bloc que la setmana entrant donarà suport a vÃdeos 1080p, és a dir Full HD, la mà xima resolució disponible en l’actualitat.
Aixà doncs podrem pujar vÃdeos al portal que tinguin la mà xima qualitat estandarditzada en l’actualitat.
Si vam pujar un vÃdeo a aquesta resolució (1920×1080) Youtube, que conserva els original enviats, farà el reencoding, és a dir la reconversió al seu format de vÃdeo, de manera que estarà disponible a Full HD.
Amb els portà tils actuals no té sentit veure un vÃdeo en Full HD ja que les pantalles amb prou feines suporten HD (1366×768) o HDTV 720p (1280×720), però si connectem el portà til, l’ordinador o el media center a un televisor Full HD amb un connector HDMI o un DVI sà que en podrem gaudir a mà xima qualitat.
Via: Web Upd8 |Â Youtube blog
Loading ...