Com crear els continguts d’una pàgina web?

Els continguts (textos, imatges, vídeos) d’una pàgina web són importantíssims per tenir una pàgina web de qualitat a la xarxa, on l’usuari trobi exactament allò que busca. També són bàsics per aconseguir un bon posicionament natural als cercadors d’Internet com Google, Bing i Yahoo!, però mai ens hem de focalitzar només en aquest aspecte, sempre hem de pensar en l’usuari de la nostra pàgina web.

Ens hem de centrar en explicar qui som o què oferim a la nostra empresa, però sempre acompanyat de què podem fer pels usuaris o en què els podem ajudar. És a dir, destacar quins beneficis obtindrà el client si contracta els nostres serveis o adquireix els nostres productes. Mai hem d’explicar aspectes interns de la nostra empresa que només poden interessar a treballadors o directius de l’empresa, ja que no és l’objectiu d’una pàgina web i pot desviar l’atenció de l’usuari.

Mai hem de donar per fet que l’usuari coneix la nostra empresa el primer cop que accedeix a la pàgina web. Així doncs, d’una manera ràpida i vistosa, l’usuari ha de ser capaç d’entendre ràpidament què li oferim o en què destaquem, així com els beneficis que pot obtenir contractant els serveis de la nostra empresa.

Redacció dels textos

A l’hora de redactar els textos de la pàgina web, hem de tenir en compte que pocs usuaris llegeixen tot el text, simplement fan un escaneig o una vista ràpida. Per tant, per facilitar la lectura a l’usuari tenim diverses opcions:

  • incloure llistats per resumir els punts importants
  • preparar esquemes o textos acompanyats de gràfics
  • destacar els textos més importants amb títols i negretes
  • evitar paràgrafs llargs que no convidin a la lectura

Els textos han de ser clars i concisos, utilitzant un llenguatge a l’abast de qualsevol usuari de la nostra pàgina web. S’han de destacar les idees principals a les primeres frases o títols del text, mai deixar-les pel final ja que potser l’usuari no ho arribarà a llegir.

Altres aspectes a tenir en compte

Hem de pensar en introduir paraules clau als textos, ja que els textos també han de convèncer als motors de cerca. Tot i així, mai ens hem de centrar en aquest aspecte, és més útil explicar alguna idea o concepte per a que l’entengui l’usuari, que no per a que l’entengui un motor de cerca. Al cap i a la fi, si un usuari ho ha entès, el motor de cerca també ho entendrà.

És recomanable també utilitzar enllaços interns. Els enllaços interns són paraules o fragments de text que fan d’enllaç a altres apartats de la pròpia pàgina web. En aquest cas, és important que aquests enllaços es ressaltin d’alguna manera respecte el text, ja sigui amb subratllat o amb un color diferent.

Si és possible, hem de pensar també en actualitzar els textos o afegir un blog o apartat de notícies o novetats a la nostra pàgina web. A més, també és un tema important pel posicionament orgànic als cercadors, ja que aquests valoren positivament actualitzacions o renovacions de textos i/o articles.

Per acabar amb el tema dels continguts, hem de recordar de cuidar les traduccions a altres idiomes. Així doncs, si no dominem un idioma, és recomanable encarregar la traducció a alguna empresa externa especialitzada.

Factors externs als continguts

Hi ha molts altres factors que hem de tenir en compte i cuidar especialment com:

  • nom del domini
  • títol i descripció de la pàgina que apareixen en els resultats de cerca de Google
  • visualització ràpida de les dades de contacte de l’empresa
  • accés a altres pàgines de l’empresa, com poden ser les de Facebook o Twitter

No podem deixar de banda la gran importància que té el disseny i la usabilitat de la pàgina web, així com una bona programació per a tenir una pàgina web que es visualitzi correctament en tots els navegadors amb un temps de descàrrega òptim. No podem tenir una pàgina web visualment espectacular si l’usuari ha d’esperar 20 segons per poder-la veure.

Com crear continguts d'una pàgina web

WebP – Nou format d’imatge per a web de Google

21-10-2010 - Internet, Recursos web

Fa uns dies Google va anunciar a través del blog Chromium el llançament d’un nou format d’imatge per a la web, anomenat WebP. És un format que comprimeix la mida de l’arxiu de manera considerable respecte el format JPG, mantenint la mateixa qualitat. D’aquesta manera, WebP es presenta com a una clara alternativa al clàssic JPG.

El format WebP pot ser important, per exemple, quan els usuaris utilitzen xarxes de banda ampla limitada, com poden ser les xarxes mòbils. En aquests casos és quan els usuaris aprecien més la lentitud al descarregar les imatges de les pàgines web. S’ha de tenir en compte que un 65% del total de bytes transmesos d’una pàgina web corresponen a imatges o fotografies. Així doncs, WebP permetria als usuaris poder descarregar imatges més ràpidament, però mantenint la qualitat i resolució.

Les proves que ha dut a terme Google amb 900.000 imatges, han donat com a resultat una reducció de la mida dels arxius d’un 39,8% de mitjana, esperant però que els desenvolupadors puguin aconseguir encara uns millors resultats.

En el següent enllaç podeu veure alguns exemples comparatius amb diferents imatges, on s’aprecia la reducció de mida, sense que es vegi afectada la qualitat de les imatges.

webp - jpg

Haurem de veure com evoluciona el format WebP i si serà reconegut pels diferents navegadors d’Internet. De moment, Pixelmator, el software d’edició fotogràfic per Mac, ja ha anunciat oficialment que adoptarà WebP. Així doncs, tot sembla indicar que, a mitjà o llarg termini, el format WebP passarà a ser compatible i acceptat pels diferents navegadors i sistemes operatius.

El futur de les pàgines web: Com seran d’aquí 5 anys?

30-04-2010 - Internet, Recursos web

A Noupe hem trobat aquest interesantíssim article en anglès titulat The Future Of The Web: Where Will We Be In Five Years?, on podem trobar 15 prediccions de com seran i què tindran les pàgines web d’aquí 5 anys. Així, trobem un llistat amb 15 punts a tenir en compte per a preparar-nos per les pàgines web del futur. Els punts són els següents:

  • Inclusió de micropagaments per obtenir continguts de qualitat. Aquests micropagaments estaran presents a revistas online, serveis de notícies, pàgines web d’artistes, etc.
  • Increment de lús del scroll horitzontal en el disseny web, degut a que les pantalles cada cop són més gran i amb resolucions variables.
  • Revistes online en format més interactiu, amb la inclusió de Wikis, vídeo i audio digital, xarxes socials pròpies, etc.
  • Contingut colaboratiu i en temps real.
  • Més continguts semàntics i millor ús d’ells, amb noves aplicacions que sapiguen treure-li partit.
  • Millor ús dels estàndards web.
  • Realitat augmentada en aplicacions web per a dispositius mòbils.
  • Millores en la seguretat contra atacs de Phishing, Scams i Spam.
  • Més aplicacions i xarxes socials.
  • Programes televisius de més alta qualitat a Internet.
  • Les aplicacions web han d’exercir un paper més important a la vida diària.
  • El SEO (Search Engine Optimization) perdrà importància, ja que molts usuaris utilizaran les recomenacions que puguin trobar a les xarxes socials.
  • Sistemes Operatius online.
  • Interfícies d’usuari personalitzades.
  • La Web serà el centre d’informació i distribució de contingut (millor i més ús de RSS).

Des de NBSP, recomanem una lectura exhaustiva de tots els punts amb les seves explicacions i comentaris: The Future Of The Web: Where Will We Be In Five Years?.

InstantShift – 104 fonts gratuites per dissenyadors

30-04-2010 - Disseny, Recursos web

InstantShift ens ofereix en un interessant post 104 fonts d’excel·lent qualitat per a descarregar de manera gratuita. És una molt bona col·lecció amb tipografies d’estils molt variats.

* A més a més, si teniu una estona lliure, doneu-vos una volta per la pàgina web d’InstantShift, ja que hi ha una pila d’articles i recursos interessants.

Cheat Sheets a Added Bytes

30-04-2010 - Recursos web

Us presentem uns fulls (de funcions, tags, comandes …) descarregables en PDF des de http://www.addedbytes.com/cheat-sheets/. Podem trobar-les de PHP, HTML, CSS, JavaScript, MySQL, expressiones regulars, mod_rewrite …

Pàgines i eines web interessants

30-04-2010 - Recursos web

Us presentem a continuació un recull de pàgines web amb eines o recursos interessants:

  • WEBWAIT. Pàgina web que calcula el temps que ha d’esperar un usuari per poder visualitzar la nostra pàgina web.
  • SXC. Banc de fotografies gratuit.
  • José Luis Ávila Herrera. Banc d’imatges gratuites.
  • Free Icons Web. Pàgina web amb galeries d’icones gratuites.
  • Ajaxload. Pàgina web que ens permet generar imatges de càrrega, podent seleccionar diferents estils i colors.
  • Ajax Rain. Pàgina web que contè articles i scripts Ajax, DHTML i PHP.
  • MiniAjax. Pàgina web que contè scripts Ajax, DHTML i PHP.
  • Hivelogic: Enkoder. Eina que ens ajuda a protegir les adreces de correu electrònic convertint-les en codi JavaScript xifrat, amagant-les dels robots de rastreig.
  • The FWA. Pàgina web on trobar milers de websites interessants i atractius.
  • Dezignus.com. Blog de disseny gràfic molt interessant i útil. Es tracta d’un blog on el seu creador mostra i comparteix algunes de les seves obres, així com les d’altres artistes o dissenyadors. Els conjunts d’iconess que presenta són molt recomenables.
  • Load info – gif generator. Eina per generar imatges de càrrega. Hi ha diversos estils que podem adaptar al nostre gust o necessitat amb color de fons, color de la imatge animada i la mida.
  • Iconfinder.net. Cercador d’icones molt complet i ràpid. Ens permet filtrar per mida de icona i ens mostra les icones amb fons de pantalla blanc o negre. Totes les icones estan sota llicència Creative Commons, GPL i LGPL.
  • Urbanfonts.com. Permet descarregar-nos un bon número de fonts gratuites. La cerca de la font és senzilla (ordenades per categories, imatges de les fonts … ) i, a més, les trobem per MAC i Windows.
  • Stripe Generator. Eina que ens permet crear diferents tipus de fons per a les nostres pàgines web. Podem definir el color i amplada de les bandes, el color i tipus de fons, el degradat …
  • Color Wizard. Eina que ens permet, partint d’un color base, aconseguir un combinat de colors relacionats amb aquest color base.
  • Squidfingers – Patterns. Website que ens permet descarregar mosaics o fons per a les nostres pàgines web.
  • Check Browser Compatibility. Eina per a comprovar si la nostra pàgina web es visualitza correctament amb els diferents navegadors.
  • CSS Mania. Directori de pàgines desenvolupades amb fulls d’estil (CSS).
  • CSSBarcelona.com. Galeria de pàginas web desenvolupades amb CSS.
  • Web a 2.0. Galeria d’aplicacions i serveis Web 2.0.
  • AddThis. Botó per a que els usuaris comparteixin la teva página web amb altres usuaris de pàgines com Delicious, Digg, Technorati …
  • Lorem Ipsum. Generador de textos Lorem Ipsum.
  • BgPatterns. Eina que ens permet crear un fons per a la nostra pàgina web amb diferents figures.
  • Preloaders.net. Eina que ens permet generar imatges de càrrega animades de forma senzilla.
  • TABS GENERATOR. Eina que ens permet generar pestanyes per a les nostres pàgines web. Ens ofereix diferents opcions i paràmetres per a poder personalitzar-les tal i com volem. És una eina molt còmoda, fàcil d’uitlizar i intuitiva.
  • ColoRotate. Eina (desenvolupada en Flash) que permet generar paletes de colors a partir d’un con de colors en 3D. Les paletes generades es poden compartir amb la resta d’usuaris de la comunitat.