Vuoi disegnare un disegno senza avere una gomma a portata di mano? Vuoi dipingere una stanza, senza prima tappare i bordi delle pareti? Bene, allora non pensate nemmeno ai blog senza capire i seguenti 7 tag HTML, che qualsiasi scrittore online dovrebbe davvero conoscere.

Ci sono molte situazioni in cui potresti aver bisogno di modificare la formattazione di un post di blog o di un articolo online. Se sei un autore freelance, avere la capacità di pubblicare un articolo ben formattato utilizzando nient'altro che un editor di testo e un codice HTML è un'abilità eccellente da avere.

Per essere commercializzabile e flessibile online, devi solo sapere come formattare un articolo HTML completo, o come modificare le cose quando anche uno strumento di modifica basato sul web non ottiene le cose correttamente. I seguenti sono 7 tag HTML critici che dovresti sempre tenere in tasca, così come quando e perché dovresti usarli.

HTML non è solo per geek

Ci sono un sacco di tag HTML di base là fuori, ma questo articolo non è pensato per essere ancora un 'altra triste introduzione all'HTML per voi poveri scrittori che non hanno assolutamente alcun interesse ad imparare a codificare le pagine web. No, quello di cui stiamo parlando qui è la formattazione sul web. Per un articolo davvero bello, ci sono alcune regole generali da seguire e alcuni suggerimenti preziosi e dure che vorrei davvero conoscere quando ho iniziato a scrivere per i clienti sul web.

Non lo dico alla leggera. Sono un programmatore nel cuore, e quando ho iniziato a scrivere sul web, avrei potuto codificare una pagina web da zero, senza davvero perdere tempo. Tuttavia, avevo molto da imparare quando si trattava di usare l'HTML per la formattazione degli articoli. Oggi vorrei passare alcune delle lezioni che ho imparato negli ultimi dieci anni per aspirare a nuovi scrittori e blogger online. Ecco i sette suggerimenti per la formattazione che esamineremo i tag per: quotare la formattazione, posizionare le immagini, elencare la formattazione, strutturare le intestazioni, creare enfasi nelle frasi, posizionare annunci non invadenti e accreditare fonti.

Intestazioni - Chi ne ha bisogno?

Nel corso degli anni, l'etichetta per cose come tag di intestazione (

,

, ecc ...) è cambiato. Mentre l'antico suggerimento SEO di far scorrere le intestazioni da grandi a piccole in tutto l'articolo è vero, c'è un costante dibattito tra gli editori sul fatto che sia meglio usare semplicemente la stessa dimensione dell'intestazione, indipendentemente dal fatto che elementi come il testo in grassetto costituiscano un sottotitolo valido, e tutti i tipi di altri dettagli nit-picky. Dimentica tutto questo.

Tutto quello che devi ricordare è che gli studi dimostrano chiaramente che il modello degli occhi dei lettori sul web mostra un chiaro schema a forma di F di cui hai bisogno per trarre vantaggio quando scrivi.

In uno studio di tracciamento oculare condotto dal Nielsen Norman Group, i ricercatori hanno scoperto che su Internet, i lettori prima leggono orizzontalmente nella parte superiore della pagina un paio di volte, e poi scansionano lungo il lato sinistro della pagina. Ciò che questo studio rivela è che i lettori useranno le intestazioni come strumento per identificare il contenuto che è importante per loro. Quindi, se ti interessa fornire ciò che vogliono i tuoi lettori, allora se ordini intestazioni da grandi a piccole non importa quanto riempire le intestazioni con parole informative questo in realtà dice ai lettori di cosa tratta la sezione e li colloca in modo uniforme in tutto l'articolo per organizzarlo bene.

Potresti pensare di essere spiritoso e creativo con questi titoli, ma se non stai descrivendo la sezione, davvero non stai facendo alcun favore a nessuno.

Per citare o non citare

Il miglior tag di mani inventato, secondo me, è il

etichetta. Il motivo per cui lo adoro è per lo stile fresco che offre ai proprietari di blog. Qualunque sia il tema di WordPress o Blogger che usi, le probabilità sono piuttosto buone che tratta il

tag in modo diverso. Ogni progettista di temi ha la sua idea di cosa dovrebbe andare nello stile CSS delle citazioni negli articoli. Il punto è che questo ti offre la possibilità di suddividere il contenuto del tuo articolo in un modo che piace all'occhio e attira le persone a leggere la citazione.

Se stai scrivendo per un cliente, chiedi loro se è giusto che tu faccia uso del tag e, se lo consentono, lo usi con tutti i mezzi.

Un consiglio per l'utilizzo

nei tuoi articoli: non esagerare. Una o due citazioni brevi in ​​un articolo che va da 800 a 1000 parole è più che sufficiente. Dà non solo la possibilità di dare all'occhio una pausa dai paragrafi, ma ti consente di inserire citazioni da esperti esterni, che rafforzano ulteriormente la credibilità del tuo articolo. Non puoi perdere.

Come usare le immagini

Un'altra cosa rivelata dalle heatmap del lettore online Nielsen: le persone tendono a soffermarsi sulle immagini quando leggono un articolo online. Inoltre, gli occhi sono attratti dall'immagine successiva. Questo ti dà un modo psicologico molto potente per mantenere la gente a leggere nel tuo articolo. Inoltre, molto simile a

, le immagini suddividono il contenuto e danno una pausa all'occhio del lettore.

Ovviamente, MakeUseOf utilizza l'uso di immagini belle e grandi, ideali per il tipo di articoli di assistenza tecnica che si trovano in un sito come questo.

Noterai che le immagini sono distanziate abbastanza lontano l'una dall'altra, così che quando hai scostato un pochino, l'occhio è a conoscenza di un'altra immagine che arriva in basso. Non è qualcosa che è fatto solo per l'impatto psicologico di trascinare l'occhio verso il basso l'articolo - rende solo una lettura molto più piacevole e un articolo più bello.

Detto questo, se il blog o il sito web per cui stai scrivendo non ha la proprietà sulla pagina per immagini grandi e a tutta larghezza come questa, allora perlomeno dovresti fare uso di immagini più piccole che sono allineate a sinistra oa destra per tutto l'articolo. Quando lo faccio sul mio blog, mi piace alternare da sinistra a destra solo per cambiare le cose mentre l'articolo scorre lungo la pagina.

Allineare le immagini con il testo che si avvolge come questo di solito è solo una semplice questione di impostare la classe di allineamento su “destra” o “sinistra” nel tag, ma controlla sempre con il proprietario del blog o del sito web che stai scrivendo per scoprire se c'è uno stile CSS che fa uso di qualcosa di simile a ciò che è noto come “galleggiante” proprietà per fare allineamenti. Potrebbe esserci una sintassi specifica che è necessario utilizzare per allineare immagini come questa a seconda dello stile CSS, quindi prenditi il ​​tempo necessario per chiedere al designer. Vale la pena lo sforzo, e renderà un articolo molto più attraente.

Crea una lista e controllala due volte

Come dettagliato da Tina nel suo articolo sui tag HTML Top 11 Tag HTML Ogni Blogger e proprietario del sito web devono conoscere i 11 tag HTML che ogni blogger e proprietario del sito web devono conoscere Il world wide web conosce molte lingue ed è codificato in diversi. L'unico linguaggio, tuttavia, che può essere trovato dappertutto ed è stato in circolazione dall'invenzione delle pagine Web, è il ... Leggi di più, ci sono due tipi di liste che formerai in HTML, il tag lista ordinata

e il tag elenco non ordinato
. Il primo mette i numeri davanti alle voci dell'elenco, il secondo mette i punti. Puoi vedere la sintassi nell'articolo di Tina, ma quando è proprio appropriato usare l'uno o l'altro - o addirittura usare un elenco?

Prima di tutto, le liste sono ancora un altro ottimo modo per spezzare la monotonia di paragrafi dritti, mantenendo il lettore interessato e ancora una volta richiamando l'attenzione su un rapido elenco di elementi che possono essere scansionati abbastanza facilmente. La regola generale che uso è se gli elementi devono essere contati o meno in qualsiasi modo. Se lo fanno, utilizzare un elenco numerato. Altrimenti, usa non numerato.



Sembra semplice, ma a volte c'è una linea grigia. Ad esempio, elencando i motivi per cui l'utilizzo di una rete wireless può non essere sicuro richiederebbe una lista senza numeri, perché in realtà non importa quanti ce ne siano - sono solo delle ragioni. D'altra parte, quando stai dando passaggi in un processo o qualche procedura in cui l'ordine della lista è importante, i numeri hanno senso. Non utilizzare i numeri se non è necessario, perché possono rendere imbarazzante il tuo elenco. Gli elenchi puntati possono fare davvero molto per migliorare il layout del tuo articolo, quindi avere almeno uno, se appropriato per l'argomento, è un'ottima idea.

Il coraggio e il corsivo si sono evoluti

Un tempo il testo audace era la strada da percorrere quando si voleva enfatizzare una frase o un punto in una frase. Questo proliferò con l'orrendo design dei siti Web degli anni '90, dove i siti che tentavano di vendere le cose sarebbero in grassetto e cambiano le dimensioni dei caratteri di varie parole per indurre in qualche modo inconsciamente a concentrarsi su quelle parole di denaro o qualcosa del genere ... Non lo so. Ma so che una volta che il blogging è diventato così popolare e le intestazioni hanno iniziato a formare la struttura di quel contenuto, il font in grassetto non aveva più senso per enfatizzare qualsiasi cosa. Nella migliore delle ipotesi, è meglio usarlo come un modo per trasformare il testo in intestazione di dimensioni più ridotte possibile - che molti blog là fuori fanno.

Ai vecchi tempi, il tag grassetto era , e molte persone continuano a usarlo inconsapevole del fatto che il web è passato all'etichetta più moderna di , o la sintassi CSS di testo.

Allo stesso modo, tutti usavano usare per tutto il corsivo, mentre oggi il metodo per enfatizzare il testo in corsivo è usare il etichetta. Questo è davvero il modo ideale per mettere l'accento su una parola o frase. Funziona bene, e appare pulito e professionale se fatto con moderazione.

Annunci non invadenti

Come si inserisce un annuncio nel tuo articolo può davvero fare la differenza quando si tratta di non perdere i tuoi lettori a causa di esso. In realtà, molti lettori sono abituati all'idea di annunci pubblicitari e perché sono necessari per pagare i contenuti, ma ciò che infastidisce i lettori e li allontana (o li costringe a usare quegli orribili strumenti di blocco degli annunci) è la pubblicità che pop-up, blocca il testo , o sono mimetizzati per sembrare parte di un articolo. Non farlo.

Invece, usa annunci con bordi chiari e usa il CSS “galleggiante” metodo per fare in modo che il testo si avvolga attorno a esso (a meno che non lo stiate posizionando nella barra laterale). Questo è quello che sembra:









Il galleggiante: giusto; lo inserirà nel testo di cui hai bisogno, e potrai automatizzarlo in WordPress usando i modelli Come utilizzare un modello di contenuto in Wordpress per scrivere più velocemente Come utilizzare un modello di contenuto in Wordpress per scrivere Più veloce Wordpress è una geniale invenzione, e lo ha reso possibile per sempre più persone di avere siti Web sorprendenti, con bellissimi temi. Tuttavia, c'è ancora il problema dell'area del contenuto, che ha ancora bisogno ... Per saperne di più, come ho descritto in articoli precedenti. Ciò elimina la necessità di inserire l'annuncio in ogni singolo articolo. Come puoi vedere, l'annuncio è abbastanza grande da attirare l'attenzione, ma non è camuffato o blocca alcun testo, quindi se i lettori vogliono possono semplicemente ignorarlo e continuare a leggere. Nessun problema.



La cosa peggiore che puoi fare con i tuoi articoli è esagerare con le pubblicità e scacciare i lettori (e in molti casi potresti anche non dovertene preoccupare degli annunci, come se scrivessi per un cliente). Tuttavia, come proprietario del tuo blog, questi sono i tipi di cose che devi considerare quando scrivi articoli sul tuo sito e questi suggerimenti di base per la formattazione degli annunci possono fare una grande differenza con il modo in cui il tuo annuncio viene percepito.

Fonti di accreditamento

La cosa peggiore di Internet in questo momento è in realtà il furto di contenuti che si verifica - e non sto solo parlando di quelli di bassa qualità che raschiano la rete per i contenuti e li copiano sui loro siti di spam di bassa qualità, configurati solo per Google traffico. No, anche i siti più grandi e popolari - sia i principali blog che i media - hanno la pessima abitudine di rubare notizie e notizie “scoop” da blogger e siti web più piccoli, aggiungendo qualche frase in più e rivendicando l'idea come propria. È orribile e piuttosto immorale, ma succede. Ciò non significa che dovresti seguire l'esempio. In realtà, ha senso che citando fonti di alta qualità RefDot: rende le fonti citazioni dal web Facilità di refDot: rende le fonti citate dal web facile leggere di più per il backup delle affermazioni articolo potrebbe ottenere il tuo sito web identificato come fonte di alta qualità affidabile informazione. Questo è oro SEO proprio lì.



Tuttavia, non vuoi che il testo risulti come contenuto importante al piè di pagina del tuo articolo. Un approccio comune per citare le fonti della storia RefDot: Rende le fonti citando dal web Facilità di refDot: rende le fonti citate dal web una facile lettura Altre informazioni o fonti di immagini al piè di pagina di un articolo tag, che forza il font verso il basso di una dimensione. È un ottimo modo per formattare informazioni sul copyright, commenti legali e crediti. Fornisce le informazioni necessarie, ma non distoglie l'effettiva conclusione dell'articolo stesso.

Naturalmente, i suggerimenti di cui sopra sono le nozioni di base che qualsiasi scrittore online dovrebbe imparare, ma se sei interessato a scavare più a fondo ci sono molte risorse. Dai un'occhiata al mio articolo che elenca alcuni fantastici siti Web in cui puoi imparare codice HTML 8 Migliori siti Web per qualità Esempi di codifica HTML 8 Siti Web migliori per qualità Esempi di codici HTML Esistono alcuni siti Web fantastici che offrono esempi e tutorial di codifica HTML ben progettati e utili. Ecco otto dei nostri preferiti. Leggi di più . Tina ha anche descritto alcuni effetti HTML aggiuntivi utili 7 Effetti HTML interessanti che chiunque può aggiungere al loro sito Web 7 Effetti HTML interessanti che chiunque può aggiungere al loro sito Web Non disperare! Non devi conoscere CSS o PHP per costruire un sito di fantasia. Qualche buon vecchio HTML e sapremo come fare il copia e incolla. Leggi di più che potresti aggiungere al tuo sito. Se vuoi davvero impazzire, ci sono anche risorse per apprendere i primi 5 siti CSS per imparare i CSS online I 5 siti più importanti per imparare i CSS online Leggi di più.

La semplice verità della questione è che scrivere online richiede molto più della creatività necessaria per scrivere qualcosa per una pubblicazione cartacea. Pubblicazione su Internet significa che devi capire non solo i codici di base che stanno dietro i siti web, ma anche quando e perché dovresti farne uso.

Scopri di più su: blog, HTML.