Accentsconagua

I 10 tag HTML principianti non stanno utilizzando

Codice
Share

Torniamo alle basi per questo. Chiunque legga questo almeno sa cos'è l'HTML. Credo che, indipendentemente dal livello di esperienza che qualcuno ha, rivedere le basi può aiutare ad aumentare la conoscenza. Aiuta anche a perfezionare le abilità, in particolare con le tecnologie in costante evoluzione che guidano Internet.

Si è anche parlato molto del cambiamento con HTML 5. Ogni tag che menziono di seguito è supportato sia in HTML 4.01 sia in HTML 5. Mentre alcuni di questi tag sono già ampiamente utilizzati; Vorrei sfidare alcuni dei modi in cui usiamo e pensiamo a loro.

1.

Qualsiasi libro che leggi sulla programmazione ti dirà che è bello spiegare quello che stai facendo. Perché i commenti sono una buona idea? Per quella ragione esatta. Aiuta chi guarda il tuo codice a sapere cosa sta succedendo.

Per HTML, i commenti possono sembrare eccessivi; tuttavia, può essere utilizzato per definire sezioni e può aiutare a mantenere il codice organizzato e strutturato. Etichettare l'inizio e la fine di una sezione aiuta davvero con il flusso di lavoro.

 
     
  • voce di menu 1
    •  
  • voce di menu 2
    •  
   
Questo è il contenuto principale.
...

2. Stili di tabella - , , e

Quando ripenso ai primi giorni dello sviluppo web, la prima cosa che mi viene in mente è

. Ho abusato di questo così tanto. Quando si usa
correttamente, per dati tabulari solo, è possibile definire gli stili per le intestazioni di colonna, le righe del piè di pagina e il corpo.

Per quanto noioso, è davvero bello creare un foglio di calcolo ben formattato. (Questo sta parlando al di fuori dello sviluppo web). Perché non dovremmo svolgere questo semplice compito di formattazione in un grande design? Ogni tag può quindi essere facilmente stilizzato all'interno del foglio di stile del sito.

Giusto per chiarire: questi tre tag hanno tutti effetto sulle righe della tabella.

Articolo Quantità
Somma 7
# 1 3
# 2 4

Avvolgere le righe della tabella con .

Avvolgere le righe della tabella con . Il le righe devono essere anche sopra . Questo è così che la riga del piè di pagina viene renderizzata prima delle righe di dati rimanenti.

Avvolgere le righe della tabella con .

  
 Articolo Quantità 
   
 Somma 7 
   
 # 1 3 
 
 # 2 4

3.

Gli elenchi a discesa sono un ottimo modo per presentare i dati a un utente per la selezione. Non solo sono consapevoli dello schermo immobiliare, ma sono familiari e facili da usare. La grande cosa è con , è possibile creare categorie (o potremmo chiamarle intestazioni) per le opzioni.

Tigri di Detroit
Chicago Cubs

Leoni di Detroit
Chicago Bears

4. Titoli -

,

,

,

,

, e

So che tutti usano i tag di intestazione. Ma, ad essere onesti, non ricordo quando l'ultima volta è stata quella che ho usato

o inferiore però. Non ho un buon ragionamento a parte non ci ho pensato e ho usato qualcosa di meno semantico, come il testo di uno stile in un
.

Il mio punto qui è: non creare più lavoro per te stesso. Ricorda di usare tutti i tag di intestazione.

5.
e

Mi piacciono i siti che hanno facile trovare informazioni con elementi logicamente separati. Penso che sia elegante.

i gruppi formano insieme degli elementi disegnando una scatola attorno a loro. È anche possibile aggiungere una didascalia al modulo usando .

 
 Informazione generale:

6.

Questo è probabilmente uno dei miei tag HTML preferiti. Il tag etichetta non fa nulla per lo styling. Aggiunge funzionalità.

Nome:
Maschio:
Femmina:

7.

Se stai cercando di creare un effetto drammatico per attirare l'attenzione su una frase o una frase, puoi usare

. Lo spazio bianco viene inserito prima e dopo l'elemento, per impostazione predefinita. Vengono inoltre aggiunti margini per compensare il testo contenuto dell'altro contenuto.

Questo è anche un ottimo modo per fare cose come una citazione di blocco tradizionale. (So ​​che era orribilmente ovvio.) Molte volte, quando scrivo un tutorial, prendo un estratto diretto da un altro sito o fonte. userò

per separare questo.

Questo è ciò che Nettuts usa per il suo stile blockquote.

8.

Non voglio dirlo è relazionato a

, ma so che di solito finisco per usarli insieme.

Pensa a quando hai bisogno di fornire una citazione per qualcosa. Se sei appena uscito dall'università, pensa di fornire l'elenco delle tue referenze alla fine dei tuoi lavori. Ricorda, in formato MLA, i titoli di libri e periodici devono essere in corsivo.

"Adoriamo la bella tipografia e apprezziamo gli sforzi dei designer che escogitano tecniche e strumenti tipografici di grande valore o che condividono le loro conoscenze con altri colleghi designer". - smashingmagazine.com

 
"... questa è una grande citazione." - someGreatPerson

9.

Usare le liste è un ottimo modo per organizzare le informazioni. Tutti ne sono a conoscenza

    , ma quante volte lo sono
      e
      Usato? Forse il riferimento alla "lista di definizioni" confonde alcuni programmatori che iniziano a pensare che possano essere usati solo quando si inseriscono termini e definizioni - tuttavia, questo non è proprio il caso.

      Tipi di elenchi

      1. Elenco non ordinato (ul)
      2. Elenco ordinato (ol)
      3. Elenco definizioni (dl)

      Cosa fanno

      • Elenco non ordinato (ul): Un elenco puntato
      • Elenco ordinato (ol): Una lista numerata
      • Elenco definizioni (dl): Una lista con le definizioni degli elementi

      Ragioni per usare le liste

      • Styling coerente
      • Facile da creare
      • Molto versatile

      Ogni tipo di elenco visualizza le informazioni in un modo valido. Non penso di doverti spiegare

        e
          , ma diamo un'occhiata più da vicino alla struttura di un elenco di definizioni.

           
          Questo è l'elemento n. 1 dell'elenco
           
          Questa è la definizione dell'elemento di elenco n. 1
           
          Questa è la voce n. 2 dell'elenco
           
          Questa è la definizione dell'elemento di elenco n. 2

          Invece di dichiarare solo un tipo di lista (

            o
              ) e ogni voce dell'elenco (
            1. ), noi usiamo
              e
              .
              definisce ogni voce di elenco e
              descrive l'elemento sopra.

              10. '(e altri caratteri ASCII)

              È corretta la codifica per utilizzare i codici ASCII HTML quando si usano simboli. È un po 'più di lavoro, ma farà in modo che i personaggi siano renderizzati correttamente e non siano confusi dal browser come parte di una stringa o altro markup. Hai mai trovato del testo su una pagina web che non sembra corretta? Forse qualcosa del genere: "Non ho usato # %%! T per rendere l'apostrofo."

              L'esempio sopra è forzato, ma penso che trasmetta l'idea.

              I set di caratteri usati nei computer moderni, HTML e Internet sono tutti basati su ASCII. - w3schools.com

              w3schools.com ha una grande pagina di riferimento ASCII HTML per caratteri ASCII. Invito tutti a controllare e memorizzare alcuni dei personaggi più comunemente usati, come l'apostrofo, le citazioni, la e commerciale e il "segno".

              Grazie mille per la lettura!

              Codice

×