Guida per un Codice HTML pulito

Per chi vuole imparare l'HTML o vuole semplicemente creare un codice pulito per le vostre fanfic basta consultare questa guida; comincio col dire alcune cose che già saprete, ossia tutti i tag sono compresi tra questi due simboli: <>, ogni tag aperto va poi chiuso e alcuni tag accettano delle opzioni da inserire all'interno dell'apertura del tag stesso... alcuni tag base:

<br> serve per andare a capo; non essendo un tag che si apre, non ha bisogno di essere chiuso
<b> mette il testo in grassetto; si chiude con: </b>
<i> mette il testo in corsivo; si chiude con: </i>
<u> sottolinea il testo; si chiude con: </u>
<strike> barra il testo; si chiude con: </strike>
<blink> il testo risulta lampeggiante; si chiude con </blink>

Modificato da syssy5 21/04/2006 1.26

Esempi:

tanti saluti

ciao ciao

importante

errato

cucu

[Modificato da syssy5 21/04/2006 1.10]

per agire su aree più ampie di testo:

<font> cambia il font del testo; esso va messo inserendo il campo: face= con il nome del carattere
Es.: <font face="Times New Roman">
può essere integrato con altre personalizzazioni tipo la grandezza: size=
Es.: <font size="3">
può specificare anche il colore: color=
Es.: <font color="red">
si chiude semplicemente con </font>

<p> agisce sul paragrafo e quando c'è non occorre inserire il tag <br>; può specificare l'allineamento del paragrafo: align=
Es.: <p align=justify> giustificato
<p align=right> allineamento a sinistra
<p align=left> allineamento a destra
<p align=center> allineamento al centro; può essere sostituito semplicemente con tag <center> (si chiude con </center>)
il paragrafo si chiude col tag </p>

<a> crea un link; va messo inserendo anche: href= per poi specificare l'url
Es.: <a href="http://www.egoio.net/efp/index.php>
va chiuso solo con </a>
Per i fanatici: avrete notato che con l'inserimento del link, la formattazione degli stessi risulterà diversa rispetto alle altre pagine; per evitarlo basta inserire all'interno del tag questa breve aggiunta: style="immagini/style9.css" type="text/css"... immediatamente, per la formattazione di quel link, si farà riferimento al foglio di stile corrispondente (e sfido io, con un sito medio-grande, a non usare un foglio di stile, quindi nella stra-grande maggioranza dei casi funzionerà); questa è una chicca che ho scovato personalmente per avere la giusta formattazione nei link

Esempio per il link: EFP (provatelo all'interno del sito e vedrete la differenza...)

altre chicche...

elenco puntato:
<ul> apre l'elenco
<li> definisce le singole voci
</ul> chiude l'elenco

elenco numerato:
<ol> apre l'elenco
<li> definisce le singole voci
</ol> chiude l'elenco

^{mette il testo come apice; si chiude con}
_{mette il testo come pedice; si chiude con}

Esempi:

• uno
  
• due
  
• tre
  

1. primo
   
2. secondo
   
3. terzo
   

questo testo è un ^apice
questo testo è un _pedice

se avete domande, richieste o qualche tag scovato da voi per rendere il tutto più semplice, scrivete qui...

Oh, che bello!
Mi sembri abbastanza ferrata per svelare un arcano su cui mi arrovello da un po'... senza trovare risposta.
Io ho l'abitudine di mettere i tag a mano, in genere i post li scrivo direttamente coi tag, senza poi aggiungerli a colpi di copia/incolla.
Abitudine che ho da quando posto sui forum e il mio office era privo di FP...
Ma bando alle ciance e veniamo alla domanda cruciale: qual è il tag per il maiuscoletto?!
Perchè ho anche cercato in alcune guide, ma non ho avuto affatto fortuna
Grazie in anticipo, qualunque sia la risposta

Serpedoro, non ho capito il tuo problema....
Sissy5, mi hai illuminata su un bel po' di cose.... Grazie per questo topic molto utile!!!!

Per quel che ne so, il maiuscoletto si può inserire esclusivamente tramite gli stili.
text-transform=uppercase
ma protrei sbagliarmi, sono secoli che uso le definizioni nel css e non nella pagina pura.

Per far diventare il testo maiuscolo devi scrivere ^^:

e chiudere con

Chiedo scusa ^^;. Il codice è questo:

<font style="text-transform:uppercase"> e chiudere con </font>

Posso dire una cosa, comunque?
Tutti i tag di font sono assolutamente inutili, e - peggio ancora - sono notevolmente pesanti, a meno che non impostiate il carattere un'unica volta all'inizio del documento, chiudendone poi il tag alla fine.
Mettere degli stili significa appesantire nuovamente il codice.
Credo che in una fanfic bastino tre tag:
P
BR
I
senza complicarsi inutilmente la vita e senza far perdere la vista al genere umano perché mettete il font sbagliato.

Beh, Maki, io sono la prima a non voler appesantire inutilmente il codice, ma se devi usare commenti o note a piè di pagina, è difficile fare a meno di una seconda dimensione di font. Io sto risolvendo usando un comando "FONT SIZE=3" all'inizio del testo vero e proprio, cioè dopo i commenti, e chiudendolo prima delle note a piè di pagina. Considera però che i testi di cui stiamo parlando sono poesie, quindi il font grande non dà fastidio.
Parlo di dimensione, perché in quanto al font vero e proprio, sono d'accordo con te.

---

Scritto da: Serpedoro 24/04/2006 17.32
Per il resto, Makichan, personalmente reputo che la grafica, dopo la trama e l’uso corretto di sintassi, grammatica e punteggiatura, sia una parte un tantino fondamentale.

---

Ovvio, per questo sono contrarissima alle fanfic dai mille colori e all'uso allucinato del tag font, che spesso si rivela controproducente. Un conto è quando si usa un bel carattere leggibile, un altro è quando trovi fanfic in microscopico.

Comunque, nel css il codice che ti serve è font-variant: small-caps;
quindi sarà *p style="font-variant: small-caps;"*

Prova Prova

---

Grazie infinite Sabrina, ma quello che mi hai dato è il tag per la maiuscola normale.

---

Infatti mi era sorto un dubbio ;p. Comunque credo di poter affermare che un codice per il maiuscoletto non esista, dal momento che anche quando lo si ottiene con Word e poi si salva la pagina con l'estensione '*.htm/html', il programma converte il maiuscoletto in maiuscolo.

---

quindi sarà *p style="font-variant: small-caps;"*

---

No ;_;... io non posso crederci ;_;. Comincio a pensare che Word non sia veramente il massimo ^^;. Scusate, ho errato! E giuro che non perseverò u_u;.

Donc! Ho provato e...

funziona!!!

Grazie infinite Maki, sei grande!
Ora copierò e incollerò il magico tag nel mio piccolo vademecum!

Non te la prendere Sabrina "sbagliando" e continuando a tentare si impara!

Grazie ancora Maki, a te e a tutte quante!

Ciao Maki!
Potresti,per favore, spiegarmi come si inseriscono correttamente le immagini?
Ovvero:
le ho caricate su freeforumzone
ho provato a inserise il tag che dici nella tua guida
*img src="" width="" height="" border=""*
inserendo anche il dominio del freeforum,
ma niente!!
mi faresti un esempio per favore?
Grazie!

<*img src="link immagine" /*>
togliendo gli asterischi...
esempio:

<*img src="http://www.immaginifico.com/habekshinbu.gif" border="0" /*>

ti dà



altrimenti sui forum usa l'opzione IMG

Oh cielo! Nella mia testa ti avevo già ringraziato! Solo ke mi è mancato il collegamento diretto col portatile! Scusa, Maki!Sono imperdonabile!
Grazie TANTO per il tuo aiuto! Ho risolto tutto!

Grazie Grazie!



NB: Una curiosità, tanto per saperne di più: ma ogni volta che scrivete un messaggio sul forum inserite tutte le volte i vari tag per le immagini, firme ecc..? Se è così.. o__O Santa pazienza!
Ciao, ciao

Ma no, la firma è automatica ^_^ Devi andare sul tuo profilo di FFZ, inserire il codice lì e poi la firma appare automaticamente sotto ogni tuo messaggio ^_^

Se vuoi inserire altre immagini nei messaggi allora sì, devi inserirne il codice a mano.

Qualcuno mi risolve un dubbio amletico che mi sta dando da penare, perfavore?
Perché quando metto l'html e scrivo a mano il tag per mettere in centro, il sito non me lo riconosce, ma se invece lo copio-incollo dalla guida sì? Eppure sono sicurissima di digitare i caratteri giusti!
Non voglio dipendere sempre dalla guida
Spero che la mia domanda abbia una risposta. In caso, vi ringrazio in anticipo!

Io invece ho una domanda:

Usando il css in linea, inserisco questo codice:
p style="margin: 0.0px 0.0px 0.0px 0.0px; line-height: 20.0px; font: 13.0px Arial; color: #222222; min-height: 15.0px">roba che scrivo....

Sui vari browser mi riconosce il min-height e il testo risulta correttamente spaziato. Ma se incollo il codice qua l'informazione sembra completamente ignorata e in effetti poi il testo mi appare compattato.

Why, pecché?

hanabi2lavendetta, 13/01/2008 13.42:

---

Io invece ho una domanda:

Usando il css in linea, inserisco questo codice:
p style="margin: 0.0px 0.0px 0.0px 0.0px; line-height: 20.0px; font: 13.0px Arial; color: #222222; min-height: 15.0px">roba che scrivo....

Sui vari browser mi riconosce il min-height e il testo risulta correttamente spaziato. Ma se incollo il codice qua l'informazione sembra completamente ignorata e in effetti poi il testo mi appare compattato.

Why, pecché?

---

Non ho capito, ma il css lo vuoi inserire sul sito? o sul forum?
Perché non puoi, visto che il sito e il forum stesso hanno un loro css.

Naco chan, 13/01/2008 18.41:

---

Non ho capito, ma il css lo vuoi inserire sul sito? o sul forum?
Perché non puoi, visto che il sito e il forum stesso hanno un loro css.

---

Scusa, colpa mia che di fretta mi sono spiegata male.

Quando inserisco una mia fanfiction, copio un codice html che mi viene generato da un convertitore (ho scelto il più leggero che potessi trovare).
Se apro quel codice usando un browser qualunque, il testo risulta comunque rispettare la mia formattazione.
Nel momento però in cui lo inserisco nella casella per caricare la fanfiction, quella formattazione la perdo.
Ho provato a cambiare certe opzioni per generare questo codice (attualmente le mie sono:
html 4.01 transitional, stile CSS in linea e Unicode 8: ho provato altri tipi di html e CSS incorporato - più pesante - senza variazioni di rilievo, in quanto a un testo senza css risulta una schifezza: col classico salto di riga a ogni ritorno e i paragrafi a pacchetto).
Beninteso, posso lasciare le cose come stanno (il mio testo risulta un po' ammucchiato ma resta leggibile), la mia era una curiosità per capire se posso renderlo ancora più elegante.

Il mio consiglio è di mettere i codici a mano, in modo tale che il font, a meno che non scegli di cambiarlo per esigenze tue, resta quello del sito.
Anche io riscontravo questi problemi, ma da quando uso questo sistema, non ne ho più.

Naco chan, 14/01/2008 19.49:

---

Il mio consiglio è di mettere i codici a mano, in modo tale che il font, a meno che non scegli di cambiarlo per esigenze tue, resta quello del sito.
Anche io riscontravo questi problemi, ma da quando uso questo sistema, non ne ho più.

---

In effetti noto che il layout che mi risulta è quello del sito (font compreso) a prescindere da ogni istruzione css che do.
Fatto sta che senza quest'istruzione la formattazione salta come scrivevo sopra (e tra le due situazioni preferisco l'attuale!)

Quando si inseriscono tag html in un contesto che già contiene tag che identificano una impaginazione particolare può capitare di vedere comportamenti strani della pagina.
Se possibile sarebbe il caso di usare un codice il più semplice possibile.

In genere noi suggeriamo NVU che genera un codice abbastanza leggero che non sembra avere problemi con il codice del sito.

Hasta Luego