L'editor de codi Bluefish és una aplicació utilitzada per desenvolupar pàgines web i scripts. No és un editor WYSIWYG. Bluefish és una eina utilitzada per editar el codi que es crea des d'una pàgina web o un script. Està pensat per a programadors que tinguin coneixement de l'escriptura de codi HTML i CSS i que tingui modes de treballar amb els llenguatges de script més comuns com PHP i Javascript, així com molts altres. L'objectiu principal de l'editor Bluefish és facilitar la codificació i reduir els errors. Bluefish és programari lliure i de codi obert i hi ha versions disponibles per a Windows, Mac OSX, Linux i diverses plataformes similars a Unix. La versió que estic fent servir en aquest tutorial és Bluefish a Windows 7.
01 de 04
La interfície Bluefish
La interfície Bluefish. Tir de pantalla cortesia Jon Morin
La interfície Bluefish es divideix en diverses seccions. La secció més gran és el panell d'edició i aquí és on podeu editar el vostre codi directament. A la part esquerra del panell d'edició hi ha el panell lateral, que realitza les mateixes funcions que un gestor de fitxers, que us permetrà triar els fitxers que voleu treballar i canviar el nom o eliminar fitxers.
La secció de capçalera situada a la part superior de les finestres Bluefish conté diverses barres d'eines, que es poden mostrar o amagar a través del menú Visualitza.
Les barres d'eines són la barra d'eines principal, que conté botons per dur a terme funcions comunes com guardar, copiar i enganxar, cercar i reemplaçar, i algunes opcions d'indentació del codi. Notaràs que no hi ha botons de format com negreta o subratllada.
Això es deu al fet que Bluefish no té codi de format, sinó només un editor. A sota de la barra d'eines principal trobareu la barra d'eines HTML i el menú fragments. Aquests menús contenen botons i submenús que podeu utilitzar per inserir automàticament codi per a la majoria dels elements i funcions del llenguatge.
02 de 04
Ús de la barra d'eines HTML en Bluefish
Ús de la barra d'eines HTML en Bluefish. Tir de pantalla cortesia Jon Morin
La barra d'eines HTML del Bluefish està ordenada per pestanyes que separen les eines per categoria. Les pestanyes són:
Barra ràpida: podeu introduir altres eines a aquesta pestanya per als elements que utilitzeu amb freqüència.
HTML 5: permet accedir a etiquetes i elements comuns en HTML 5.
Estàndard: s'hi accedeix a les opcions de format HTML comú en aquesta pestanya.
Formatació: aquí es troben opcions de format menys habituals.
Taules: diverses funcions generadores de taules, incloent un auxiliar de taula.
Llista: eines per generar llistes ordenades, desordenades i de definició.
CSS: es poden crear fulls d'estil des d'aquesta pestanya, així com el codi de disseny.
Formularis: els elements de formulari més comuns es poden inserir a partir d'aquesta pestanya.
Fonts: aquesta pestanya té dreceres per treballar amb fonts en HTML i CSS.
Marcs: les funcions més comunes per treballar amb formularis.
En fer clic a cada pestanya es mostraran botons relacionats amb la categoria rellevant a la barra d'eines que hi ha a sota de les pestanyes.
03 de 04
Ús del menú de fragments a Bluefish
Ús del menú de fragments a Bluefish. Tir de pantalla cortesia Jon Morin
A sota de la barra d'eines HTML hi ha un menú anomenat la barra de fragments. Aquesta barra de menú té submenús relacionats amb diversos idiomes de programació. Cada element del menú insereix codi d'ús comú, com ara doctypepes HTML i informació meta, per exemple.
Alguns dels elements del menú són flexibles i generen codi en funció de l'etiqueta que vulgueu utilitzar. Per exemple, si voleu afegir un bloc de text preformat a una pàgina web, podeu fer clic al menú HTML a la barra de fragments i triar l'element del menú "qualsevol etiqueta vinculada".
En fer clic en aquest element s'obre un diàleg que us demanarà que introduïu l'etiqueta que voleu utilitzar. Podeu introduir "pre" (sense els claudàtors) i Bluefish insereix una etiqueta d'obertura i tancament "pre" al document:
.
04 de 04
Altres característiques del blau
Altres característiques del blau. Tir de pantalla cortesia Jon Morin
Tot i que Bluefish no és un editor de WYSIWYG, té la capacitat de permetre que previsualitzeu el vostre codi en qualsevol navegador que hàgiu instal·lat a l'ordinador. També és compatible amb la compleció automàtica de codi, el ressaltat de sintaxi, les eines de depuració, un quadre de sortida de seqüència d'ordres, connectors i plantilles que poden donar-li un començament de salt per crear documents amb els quals treballa amb freqüència.