{"id":239,"date":"2012-02-28T18:39:57","date_gmt":"2012-02-28T17:39:57","guid":{"rendered":"https:\/\/alistapart.com\/it\/article\/ogni-volta-che-chiamate-css3-una-feature-proprietaria-un-gattino-muore\/"},"modified":"2012-02-28T18:39:57","modified_gmt":"2012-02-28T17:39:57","slug":"ogni-volta-che-chiamate-css3-una-feature-proprietaria-un-gattino-muore","status":"publish","type":"article","link":"https:\/\/alistapart.com\/it\/article\/ogni-volta-che-chiamate-css3-una-feature-proprietaria-un-gattino-muore\/","title":{"rendered":"Ogni volta che chiamate &#8220;CSS3&#8221; una feature proprietaria, un gattino muore"},"content":{"rendered":"<div class=\"paragrafo\">\n<p><img decoding=\"async\" src=\"http:\/\/alistapart.com\/it\/wp-content\/uploads\/sites\/2\/2012\/02\/n45aweb.png\" border=\"0\" align=\"left\" \/>Annuncio di pubblica utilit\u00e0: ogni volta che definite &#8220;CSS3&#8221; una feature proprietaria, un gattino muore. <strong>Qualsiasi feature -webkit- che non sia presente in una specifica (nemmeno in Editor&#8217;s draft) non \u00e8 CSS3<\/strong>. S\u00ec, normalmente vengono propagandate come tali, ma non fanno assolutamente parte di CSS. <strong>Questa distinzione non \u00e8 pignoleria<\/strong>. \u00c8 importante, perch\u00e9 incoraggia alcuni produttori (*colpo di tosse* <a href=\"http:\/\/lists.w3.org\/Archives\/Public\/www-style\/2010Jun\/0341.html\" target=\"_blank\" rel=\"noopener noreferrer\">Apple<\/a> *colpo di tosse*) ad aggirare il processo degli standard, ad implementare qualsiasi cosa vogliano in WebKit, per poi evangelizzarla agli sviluppatori come la cosa migliore del mondo. I nuovi scintillanti giocattoli ci abbagliano e cominciamo anche noi <a href=\"http:\/\/coding.smashingmagazine.com\/2011\/05\/11\/the-future-of-css-experimental-css-properties\/\" target=\"_blank\" rel=\"noopener noreferrer\">a<\/a> <a href=\"http:\/\/css3clickchart.com\/#reflections\" target=\"_blank\" rel=\"noopener noreferrer\">promuoverli<\/a>, fungendo da cassa di risonanza.<\/p>\n<p>Con il nostro spasmodico desiderio di utilizzare il nuovo gioiello, ci dimentichiamo spesso delle molte persone che hanno combattuto nei dieci anni passati per permetterci di scrivere codice senza fork e senza hack aspettandoci che funzioni in maniera interoperabile. Se siete stati in questo settore per pi\u00f9 di dieci anni, vi ricordate sicuramente che non \u00e8 sempre stato cos\u00ec. La ragione per cui adesso abbiamo questi vantaggi \u00e8 perch\u00e9 ci sono gli standard web, un dura conquista ottenuta con le <a href=\"http:\/\/en.wikipedia.org\/wiki\/Browser_wars\" target=\"_blank\" rel=\"noopener noreferrer\">Browser Wars<\/a>.<\/p>\n<\/div>\n<div class=\"paragrafo\">\n<p>Potreste essere sorpresi dall&#8217;apprendere che <strong>gli standard web esistevano gi\u00e0 durante le Browser Wars<\/strong>. <a href=\"http:\/\/en.wikipedia.org\/wiki\/W3C\" target=\"_blank\" rel=\"noopener noreferrer\">Il W3C fu fondato nel 1994<\/a>. Tuttavia, agli autori non interessava ed erano pi\u00f9 che felici di adottare le estensioni proprietarie. Come risultato, i browser non davano molto peso agli standard web. Vi ricorda qualcosa? Le feature proprietarie di oggi non sono migliori di ActiveX o dei filtri IE: l&#8217;unica differenza \u00e8 un PR migliore, dal momento che non ne abbiamo ancora affrontate le conseguenze. Credeteci o no, <a href=\"http:\/\/www.brucelawson.co.uk\/2010\/in-praise-of-ie6\/\" target=\"_blank\" rel=\"noopener noreferrer\">anche quelle feature furono accolte con gioia in quel periodo<\/a>.<\/p>\n<p>S\u00ec, a volte i browser se ne escono con delle buone trovate che vengono poi rese standard (XMLHttpRequest, le API Drag and Drop, contentEditable, Web fonts, solo per citarne alcune). Comunque, nulla gli impedisce di innovare e seguire il processo degli standard. Nulla gli vieta di proporre cose fichissime, sottoporle all&#8217;appropriato Working Group del W3C e migliorarle attraverso il feedback collettivo prima di correre ad implementarle. Se Microsoft l&#8217;avesse fatto per le API Drag &amp; Drop, non sarebbero cos\u00ec tremende da usare.<\/p>\n<p>Le feature proprietarie che non sono passate attraverso il processo degli standard, solitamente hanno una progettazione misera, anche quando l&#8217;idea generale \u00e8 buona. Ad esempio, i gradienti CSS sono stati una buona idea, ma <code>-webkit-gradient()<\/code> era un disastro verboso e facile agli errori. I web font sono stati un&#8217;idea grandiosa, ma richiedere i files .eot non lo \u00e8 stato. Il processo degli standard non solo aiuta l&#8217;interoperabilit\u00e0, ma aiuta anche a migliorare la progettazione di ciascuna feature, grazie al maggior numero e alla diversit\u00e0 di opinioni.<\/p>\n<p>Quindi, quali sono queste infami feature? In CSS, alcune delle pi\u00f9 popolari sono:<\/p>\n<ul>\n<li><code>-webkit-box-reflect<\/code><\/li>\n<li><code>-webkit-text-stroke<\/code><\/li>\n<li><code>-webkit-mask<\/code><\/li>\n<li><code>-webkit-background-clip: text;<\/code><\/li>\n<li><code>-webkit-text-size-adjust<\/code><\/li>\n<li><code>-webkit-tap-highlight-color<\/code><\/li>\n<li><code>-webkit-text-fill-color<\/code><\/li>\n<\/ul>\n<p><strong>Non tutte le feature con prefisso sono proprietarie<\/strong>. Alcune sono solo implementazioni sperimentali di feature incluse nelle specifiche in draft. Il che ci porta alla prossima domanda.<\/p>\n<\/div>\n<div class=\"paragrafo\">\n<h3>\u201cCome scopro se una determinata feature \u00e8 proprietaria?\u201d<\/h3>\n<p>Un modo che funziona per me \u00e8 cercare in Google tale feature (tra virgolette) e aggiungere alla fine della stringa di ricerca <code>site:w3.org<\/code>, per cercare solo nel dominio w3.org. Due esempi:<\/p>\n<ul>\n<li><a href=\"https:\/\/www.google.com\/?q=%22box-shadow%22+site:w3.org#hl=en&amp;pws=1&amp;sclient=psy-ab&amp;q=%22box-shadow%22+site:w3.org&amp;pbx=1&amp;oq=%22box-shadow%22+site:w3.org&amp;aq=f&amp;aqi=&amp;aql=&amp;gs_sm=3&amp;gs_upl=35188l35812l0l35940l6l6l0l0l0l4l171l758l0.5l5l0&amp;bav=on.2,or.r_gc.r_pw.r_cp.r_qf.,cf.osb&amp;fp=4084e84d72bbc120&amp;biw=1280&amp;bih=679\" target=\"_blank\" rel=\"noopener noreferrer\">\u201cbox-shadow\u201d site:w3.org<\/a><\/li>\n<li><a href=\"https:\/\/www.google.com\/?q=%22box-reflect%22+site:w3.org#hl=en&amp;output=search&amp;sclient=psy-ab&amp;q=%22box-reflect%22+site:w3.org&amp;pbx=1&amp;oq=&amp;aq=&amp;aqi=&amp;gs_upl=&amp;pws=1&amp;bav=on.2,or.r_gc.r_pw.r_cp.r_qf.,cf.osb&amp;fp=4084e84d72bbc120&amp;biw=1280&amp;bih=679\" target=\"_blank\" rel=\"noopener noreferrer\">\u201cbox-reflect\u201d site:w3.org<\/a><\/li>\n<\/ul>\n<p>Come potete vedere, uno dei primissimi risultati per la prima feature \u00e8 una specifica del W3C. I risultati della seconda sono semplicemente delle discussioni nelle mailing list, il che indica che non c&#8217;\u00e8 ancora una specifica per questa feature.<\/p>\n<\/div>\n<div class=\"paragrafo\">\n<h3>\u201cCome posso aiutare?\u201d<\/h3>\n<p>Un facile regola pratica \u00e8 quella di evitare tutte le feature proprietarie. Non usatele, non diffondetele e indubbiamente non siatene dipendenti. Tuttavia, capisco che sia pi\u00f9 facile a dirsi che a farsi: se non potete escludere completamente le cose proprietarie, ecco alcune linee guida che potete seguire di sicuro:<\/p>\n<ul>\n<li>Assicuratevi che il loro utilizzo si conforme ai principi del <a href=\"http:\/\/www.alistapart.com\/articles\/understandingprogressiveenhancement\" target=\"_blank\" rel=\"noopener noreferrer\">progressive enhancement<\/a>, cos\u00ec che il progetto funzioni bene anche senza di esse.<\/li>\n<li>Non evangelizzatele o, se dovete, siate sicuri di spiegare che queste feature sono proprietarie e cosa questo implichi.<\/li>\n<li>Se dovete usarle nel vostro codice, aggiungetegli un commento. Qualcosa come <code>\/* Attenzione: Non standard *\/<\/code> \u00e8 sufficiente. Molte persone apprendono la programmazione front-end guardando il sorgente di siti esistenti. Anche quando non fate interventi a conferenze o non scrivete dei tutorial, probabilmente state insegnando indirettamente a delle persone con ogni singolo pezzo di codice che pubblicate sul web.<\/li>\n<li>Additate gli articoli, le presentazioni a conferenze, le demo e cos\u00ec via che evangelizzano queste feature senza mettere in guardia dal loro status proprietario o che usano un solo vendor prefix (un altro <a href=\"http:\/\/www.glazman.org\/weblog\/dotclear\/index.php?post\/2012\/02\/09\/CALL-FOR-ACTION%3A-THE-OPEN-WEB-NEEDS-YOU-NOW\" target=\"_blank\" rel=\"noopener noreferrer\">problema molto serio<\/a>). O, meglio ancora, <a href=\"http:\/\/codepo8.github.com\/prefix-the-web\/\" target=\"_blank\" rel=\"noopener noreferrer\">sistemateli voi<\/a>, se \u00e8 possibile.<\/li>\n<\/ul>\n<\/div>\n<div class=\"paragrafo\">\n<h3>\u201cCome posso contribuire alla standardizzazione di una feature?\u201d<\/h3>\n<p>Se vi trovate nelle condizioni di dover usare una feature proprietaria molto spesso, entrate in azione per rendere standard qualcosa di simile. Quella che segue \u00e8 una serie di step che vi raccomando di seguire, la maggior parte dei quali pu\u00f2 essere applicata alle nuove proposte in generale:<\/p>\n<h4>Step 1: ricercate alternative standard-compliant<\/h4>\n<p>Prima di tutto, ricercate delle alternative conformi agli standard. Potrebbero avere un supporto da parte dei browser peggiore o inesistente, ma almeno saprete cosa spingere. Potete perfino aggiungerle come fallback, cos\u00ec da evitare che gli altri vendor saranno tagliati fuori dopo che avranno implementato questa feature.<\/p>\n<p>Potete perfino contribuire a velocizzare l&#8217;implementazione,  <a href=\"http:\/\/coding.smashingmagazine.com\/2011\/09\/07\/help-the-community-report-browser-bugs\/\" target=\"_blank\" rel=\"noopener noreferrer\">mandando la notifica di un bug<\/a> ai browser che non la supportano. Assicuratevi prima di aver controllato che non ci siano gi\u00e0 dei report. Se \u00e8 gi\u00e0 stato riportato, potete ancora mostrare che per voi \u00e8 importante scrivendo un commento (siate educati!). I browser tengono in considerazione le richieste degli autori quando assegnano le priorit\u00e0 alle feature da implementare. Mostrategli che una certa feature vi sta a cuore.<\/p>\n<h4>Step 2: Guardate se la feature \u00e8 gi\u00e0 stata proposta<\/h4>\n<p>Il W3C discute quali feature aggiungere e come migliorarle per renderle perfette nelle loro <a href=\"http:\/\/lists.w3.org\/\" target=\"_blank\" rel=\"noopener noreferrer\">mailing lists<\/a>. Ce n&#8217; una per Working Group (WG), a volte di pi\u00f9, dal momento che i Working Group possono collaborare per sviluppare feature che toccano pi\u00f9 tecnologie. Ad esempio, il CSS WG usa la mailing list <a href=\"http:\/\/lists.w3.org\/Archives\/Public\/www-style\/\" target=\"_blank\" rel=\"noopener noreferrer\">www-style<\/a> e lo SVG WG usa la mailing list <a href=\"http:\/\/lists.w3.org\/Archives\/Public\/www-style\/\" target=\"_blank\" rel=\"noopener noreferrer\">www-svg<\/a>. Tuttavia, per le feature che toccano sia CSS sia SVG, c&#8217;\u00e8 la mailing list <a href=\"http:\/\/lists.w3.org\/Archives\/Public\/public-fx\/\" target=\"_blank\" rel=\"noopener noreferrer\">public-fx<\/a>.<\/p>\n<p>Prima di mandare un messaggio a una qualunque di queste liste, <strong>cercate tra le discussioni precedenti sul problema<\/strong>, per favore. Ogni minuto che un membro del WG passa a rispondere a suggerimenti duplicati \u00e8 un minuto in meno che passa a sviluppare gli standard web. Per cercare tra gli archivi potete usare di nuovo il buon vecchio Google. Inserite le parole chiave come fareste di solito e aggiungete in coda alla query <code>site:lists.w3.org<\/code>.<\/p>\n<p>Se vedete che la feature \u00e8 gi\u00e0 stata suggerita, ma la discussione \u00e8 in stallo senza alcuna risoluzione, potete rispondere (una volta!) per riportarla a galla. Per favore, evitate di apparire impazienti o irritati nelle vostre email. Continuate a leggere la discussione per trovare delle idee su cose da aggiungere ma che nessuno ha ancora sollevato.<\/p>\n<h4>Step 3: proponete la feature<\/h4>\n<p>Cercate di includere quanti pi\u00f9 dati rilevanti possibile.<\/p>\n<p>Alcuni tipi di informazione che potreste includere sono:<\/p>\n<ul>\n<li>Use cases in cui la feature si dimostra utile. Questo \u00e8 molto importante: nessun WG vuole standardizzare cose che verranno usate solo in casi limite. Mostrate che quello che state suggerendo \u00e8 di uso comune. Un&#8217;utile tecnica per riunire tali use cases consiste nel cercare su Google la feature proprietaria e vedere come viene utilizzata.<\/li>\n<li>La vostra esperienza derivante dall&#8217;uso di tale feature. Cosa vi piace, cosa cambiereste nel suo modo di funzionare, come potrebbe essere generalizzata, etc.<\/li>\n<\/ul>\n<p>Inoltre, decidete per quali specifiche \u00e8 adatta. Potete trovare una lista di specifiche CSS <a href=\"http:\/\/www.w3.org\/Style\/CSS\/current-work\" target=\"_blank\" rel=\"noopener noreferrer\">qui<\/a>. Poi, <strong>aggiungete all&#8217;inizio del titolo del vostro thread l&#8217;ID tra parentesi quadre di tale specifica<\/strong>. Ad esempio, se \u00e8 per le <a href=\"http:\/\/www.w3.org\/TR\/css3-values\/\" target=\"_blank\" rel=\"noopener noreferrer\">Values &amp; Units<\/a>, aggiungete all&#8217;inizio [css3-values]. (L&#8217;ID di ciascuna specifica si trova nel suo URL). Facendo cos\u00ec, ci assicuriamo che gli editori di tale specifica noteranno il vostro thread pi\u00f9 facilmente e taggarlo aiuta tutti a seguire gli sviluppi di alcune specifiche a cui sono interessati.<\/p>\n<\/div>\n<div class=\"paragrafo\">\n<p>Un&#8217;altra cosa da tenere a mente \u00e8 che le nuove feature non vengono aggiunte alle specifiche che hanno raggiunto o che stanno per raggiungere lo stato di <em>Candidate Recommendation<\/em>. Ovviamente, la stessa regola si applica anche a tutti gli stati successivi, i.e., <em>Proposed Recommendation<\/em> e <em>Recommendation<\/em>.Ad esempio, se il vostro suggerimento riguarda l&#8217;aggiunta di un nuovo selettore, non suggeritelo per <a href=\"http:\/\/www.w3.org\/TR\/css3-selectors\" target=\"_blank\" rel=\"noopener noreferrer\">Selectors Level 3<\/a> (ID: css3-selectors), che \u00e8 nello stato <em>Recommendation<\/em>, ma per Selectors Level 4.<\/p>\n<p>Se volete saperne di pi\u00f9 sul funzionamento del processo degli standard, potete leggere l&#8217;eccellente serie di articoli di fantasai \u201c<a href=\"http:\/\/fantasai.inkedblade.net\/weblog\/2011\/inside-csswg\/\" target=\"_blank\" rel=\"noopener noreferrer\">Inside the CSS WG<\/a>.\u201d<\/p>\n<\/div>\n<div class=\"paragrafo\">\n<h3>\u201cTutto ci\u00f2 \u00e8 difficile e noioso!\u201d<\/h3>\n<p>Lo stesso si pu\u00f2 dire anche per il riciclaggio rispetto al buttare tutto nello stesso cestino. S\u00ec, di sicuro \u00e8 pi\u00f9 difficile rispetto ad usare le feature proprietarie e portare a casa la giornata. Tuttavia, questo processo \u00e8 nell&#8217;interesse di tutti sul lungo termine, inclusi voi stessi.<\/p>\n<p><em>Grazie mille a <a href=\"http:\/\/twitter.com\/dstorey\">David Storey<\/a>, <a href=\"https:\/\/twitter.com\/#!\/sgalineau\">Sylvain Galineau<\/a> e <a href=\"https:\/\/twitter.com\/#!\/meyerweb\">Eric Meyer<\/a> per il loro feedback.<\/em><\/p>\n<p>Illustrazioni: {carlok}<\/p>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Qualsiasi feature -webkit- che non sia presente in una specifica (nemmeno in Editor&#8217;s draft) non \u00e8 CSS3. S\u00ec, vengono comunemente evangelizzate come tali, ma non fanno assolutamente parte di CSS. Questa distinzione non \u00e8 una pignoleria: \u00e8 importante perch\u00e9 incoraggia alcuni produttori ad aggirare il processo degli standard, ad implementare qualunque cosa trovino in WebKit, per poi evangelizzarla agli sviluppatori come se fosse la cosa migliore del mondo. Siamo cos\u00ec bramosi di utilizzare il nuovo gioiello che spesso ci dimentichiamo di quante persone hanno combattuto negli scorsi dieci anni per far s\u00ec che potessimo scrivere codice senza fork e senza hack ed aspettarci che funzioni in maniera interoperabile. Lea Verou spiega perch\u00e9 le soluzioni \u201csingle-vendor\u201d non sono standard e non sono salutari per la vostra pratica professionale o per il futuro del web.<\/p>\n","protected":false},"author":818,"featured_media":7000645,"comment_status":"open","ping_status":"open","template":"","categories":[242,244,247,60],"tags":[],"coauthors":[354],"class_list":["post-239","article","type-article","status-publish","has-post-thumbnail","hentry","category-browser","category-css","category-html","category-numero-45-28-febbraio-2012"],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/alistapart.com\/it\/wp-json\/wp\/v2\/article\/239","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/alistapart.com\/it\/wp-json\/wp\/v2\/article"}],"about":[{"href":"https:\/\/alistapart.com\/it\/wp-json\/wp\/v2\/types\/article"}],"author":[{"embeddable":true,"href":"https:\/\/alistapart.com\/it\/wp-json\/wp\/v2\/users\/818"}],"replies":[{"embeddable":true,"href":"https:\/\/alistapart.com\/it\/wp-json\/wp\/v2\/comments?post=239"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/alistapart.com\/it\/wp-json\/wp\/v2\/media\/7000645"}],"wp:attachment":[{"href":"https:\/\/alistapart.com\/it\/wp-json\/wp\/v2\/media?parent=239"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/alistapart.com\/it\/wp-json\/wp\/v2\/categories?post=239"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/alistapart.com\/it\/wp-json\/wp\/v2\/tags?post=239"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/alistapart.com\/it\/wp-json\/wp\/v2\/coauthors?post=239"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}