Archivi tag: html

Creare delle slide con HTML e CSS (simile a una presentazione power point)

In questo articolo voglio proprorvi un interessante articolo che spiega come realizzare con CSS e HTML una presentazione con delle slide simile a una presentazione power point.

 

The Business of WordPress Theme Design

Link: http://net.tutsplus.com/tutorials/html-css-techniques/how-to-create-presentation-slides-with-html-and-css-2/?utm_source=feedburner&utm_medium=feed&utm_campaign=Feed%3A+nettuts+%28Nettuts%2B%29&utm_content=Google+Reader

Validazione errori XHTML e come risolverli secondo il W3C

Vediamo quali sono e come risolvere gli errori più comuni riscontranti quando si effettua la validazione di un sito presso il serveizio del W3C.

Effettuare la convalida di un sito web non solo permette di garantire la visualizzazione corretta  delle informazioni nei diversi browser, ma anche che i BOT dei motori di ricerca riescano a leggere senza alcun problema tutti i dati, garantendo, quindi, l’indicizzazione del sito web.

Vediamo quindi i problemi:

No doctument type declararion

Dimenticare il doctype per l’intera pagina i motori di ricerca dovranno indovina in che lingua è scritta la pagina web.

Per risolvere questo problema guardatela guida HTML doctype

End tag omitted

Se hai aperto un tag da qualche parte nel documento HTML, è necessario ricordarsi di chiuderlo in un luogo adeguato. Dimenticando di farlo non solo si annulla il codice HTML, ma questo  potrebbe anche essere la causa di alcuni problemi di layout gravi.

La maggior parte degli elementi HTML hanno un tag di chiusura distinto, ad esempio: </ div>, ma altri elementi come input, img e Meta sono chiusura automatica, questo significa che hanno una barra finale prima della loro parentesi di chiusura. Dimenticare questo è lo stesso che dimenticare un tag di chiusura del tutto.

Caratteri speciali

La e commerciale è probabilmente l’entità  più popolare inq questo caso, insieme con le virgolette che sono state incollate  da Word. Ricordatevi sempre di convertire i caratteri speciali con le entità HTML, seguendo la tabella dei caratteri speciali.

Link dove l’URL ha  caratteri non encoded

Sulla scia l’ultimo punto, i caratteri speciali, in particolare il carattere e commerciale dovrebbe anche essere convertiti in entità quando compaiono negli URL.

Block Element all’interno di inside block

Una regola fondamentale di HTML è che gli elementi di blocco non dovrebbero mai andare dentro elementi in linea. Un esempio famoso è un anchor all’interno di una intestazione:
<a href=”#”> <h3> banane </ h3> </ a>
Il <h3> è un elemento di blocco, e quindi dovrebbe avvolgere l’anchor (un elemento inline) in questo modo:
<h3> <a href=”#”> banane </ a> </ h3>.

Required attributed ALT not specified

Ogni immagine inserita nel documento HTML dovrebbe avere un attributo ALT per descrivere il suo contenuto. Se non vogliamo fornire una descrizione è possbile cmq lasciare questo attributo vuoto ad esempio alt = “”.

Attributi width e height (there is not attribute)

Questo è probabilmente un effetto collaterale di utilizzare un editor WYSIWYG, che tende a inserire stili nel codice HTML in modo inline. Gli attributi di larghezza e altezza fanno parte dello stile di presentazione che dovrebbe essere quindi salvato sun un foglio di stile CSS.

Value of attribute id invaid (can not start a name)

Gli attributi di classe, l’ID o il nome non possono iniziare con un numero. Essi possono includere numeri, tranne che all’inizio dell’identificatore.

HTML5 – Supporto Audio e Video

L’HTML 5 offre nuovi elementi per la gestioni di file multimediali.

Gestione Audio

<audio autoplay=”autoplay” controls=”controls”>
<source src=”file.ogg” />
<source src=”file.mp3″ />
<a href=”file.mp3″>Download this file.</a>
</audio>

Gestione Video

<video controls preload>
<source src=”cohagenPhoneCall.ogv” type=”video/ogg; codecs=’vorbis, theora’” />
<source src=”cohagenPhoneCall.mp4″ type=”video/mp4; ‘codecs=’avc1.42E01E, mp4a.40.2′” />
<p> Your browser is old. <a href=”cohagenPhoneCall.mp4″>Download this video instead.</a> </p>
</video>

Per permettere il caricamento automatico

  1. <video preload>

Per mostrare invece la barra di controllo

  1. <video preload controls>

HTML5 – Elemento Type negli script e nei Link

Con l’html5 è possibile non specificare il tipo dei file nei link e negli script.

Con il semplice HTML era necessario definire

<link rel=”stylesheet” href=”path/to/stylesheet.css” type=”text/css” />
<script type=”text/javascript” src=”path/to/script.js”></script>

con l’HTML5

<link rel=”stylesheet” href=”path/to/stylesheet.css” />
<script src=”path/to/script.js”></script>