Questi sono i due libri più importanti che hanno contato nella mia formazione come sviluppatore web. Uno è un libro americano degli anni ’90 che sanciva il passaggio dalle prime pagine web di tipo strutturale a un nuovo web che teneva anche conto delle esigenze dei consumatori, con una grande enfasi sull’inserimento e il trattamento delle immagini. L’altro segna il passaggio alla separazione radicale tra marcatori logico-semantici (linguaggio html5) e marcatori visuali presentazionali (linguaggio CSS-Cascating Style Sheet). Da una parte si indicavano le differenze dalla stampa (per esempio fogli di misura fissata vs pagine separate di differente lunghezza sul web), dall’altra si superavano le commistioni tra tag strutturali e tag presentazionali (evidenti nell’uso delle tabelle organizzare tipograficamente le pagine web) e si arrivava a nuovi tag di tipo strutturale informativo (come <dev> </dev>, <header> </header>, <footer> </footer> ecc.). A questi libri bisogna poi aggiungere le 30 luminose lezioni di Mincone su YouTube, “Come creare un tema wordpress da zero”, che si trovano a questo indirizzo: https://www.youtube.com/watch?v=0hNf_hD49wA&list=PLpxfeyHTWsHtm0JXN5OA4cdX8WSMz80qg

Siegel:

75- I punti di lista come i righelli vengono dal mondo della carta, dove le pagine finiscono e la gente tenta di impacchettare quanto più possibile in una singola pagina. 69- Come separatori i righelli orizzontali e i punti di lista sono paccottiglia visiva che galleggia nel cyberspazio. Questi interrompono il sentiero visivo del lettore lungo la pagina. [vs 138 (nel web) bisogna spezzare la pagina in aree che fanno del surfing un’avventura. (…) La pagina dovrebbe giocare con la metafora del “foglio di carta”]71- Una colonna che eccede le 12 parole va al di là dei limiti di una facile lettura. 72-Più le righe sono lunghe più grande è l’interlinea.124- Bisogna rimpiazzare i puntini delle liste con buona tipografia.

Gigliotti-Tatarotti:

64- <span> </span> e <div> </div> come taga generici che indicano un blocco di programmazione a cui applicare elementi di stile. Se questi elementi vengono usati senza specifiche regole di stile non producono nel rendering [nell’interpretazione visiva del browser] nessun effetto apprezzabile.

65-[Il peso delle regole di stile nella nuova programmazione è decisivo]

69- Esistono cinque famiglie generiche di caratteri tipografici; serif, sans-serif, monospace, cursive e fantasy. Ricorda di inserire sempre quella a cui appartengono i font di tuo interesse , al termine della lista valori per la proprietà font-family.

76- [Che cos’è il DOM (= Document Object Model) = rappresentazione a oggetti della pagina.] Il DOM è un modello di documento che il browser usa per rappresentare la pagina web e che ogni sviluppatore può utilizzare per manipolarla attraverso il celebre linguaggio di scripting JavaScript. Per avere un’idea di come sia fatto questo modello prendiamo come riferimento una pagina web in cui ogni elemento HTML è rappresentato come un nodo di uno schema ad albero. Tanto più complesso è questo modello tanto più fatica compie il motore di rendering di un browser per visualizzare la pagina.

116-[Il box model] Prima di fornire alcune regole CSS per migliorare l’aspetto e la fruibilità dei dati presentati(…) facciamo un passo indietro per introdurre il box model, strumento essenziale per intervenire sul posizionamento degli oggetti in una pagina web, e dunque ancheper migliorare l’aspetto [della pagina]. Non solo le celle di una tabella , ma ogni elemento HTML è visto come un riquadro che ha una serie di proprietà: margin, border e padding [se il contenuto ha una sua altezza e larghezza il padding è una specie di “imbottitura”, lo spazio esistente tra il contenuto e il bordo]. Ognuna di queste proprietà corrisponde a un’area del riquadro che si sviluppa attorno al contenuto secondo lo schema raffigurato nella figura qui sotto:

145-I cinque browser principali del mondo desktop sono: Chrome, Firefox, Safari, Edge e Opera.

156- radio button vs check-box

162- [Gli autori di applicazioni web sono sviluppatori web]