{"id":2963,"date":"2015-01-14T07:00:27","date_gmt":"2015-01-14T06:00:27","guid":{"rendered":"http:\/\/ignuscommunity.es\/blog\/?p=2963"},"modified":"2015-01-14T12:46:46","modified_gmt":"2015-01-14T11:46:46","slug":"herramientas-para-la-tipografia-en-la-web","status":"publish","type":"post","link":"https:\/\/ignuscommunity.es\/blog\/herramientas-para-la-tipografia-en-la-web\/","title":{"rendered":"Herramientas para la Tipograf\u00eda en la Web"},"content":{"rendered":"<p style=\"text-align: justify;\">\u00a1Hola a tod@s!<\/p>\n<p style=\"text-align: justify;\">Hoy me inicio en este blog hablando de algunas herramientas Web que los desarrolladores suelen utilizar en sus proyectos.<\/p>\n<p style=\"text-align: justify;\"><img loading=\"lazy\" class=\"aligncenter wp-image-3021\" src=\"http:\/\/ignuscommunity.es\/blog\/wp-content\/uploads\/2014\/11\/Herramientas-Tipografia-Web-IGNUS-Community-original.png\" alt=\"Herramientas-Tipografia-Web-IGNUS-Community (original)\" width=\"400\" height=\"290\" srcset=\"https:\/\/ignuscommunity.es\/blog\/wp-content\/uploads\/2014\/11\/Herramientas-Tipografia-Web-IGNUS-Community-original.png 550w, https:\/\/ignuscommunity.es\/blog\/wp-content\/uploads\/2014\/11\/Herramientas-Tipografia-Web-IGNUS-Community-original-300x217.png 300w\" sizes=\"(max-width: 400px) 100vw, 400px\" \/><\/p>\n<p style=\"text-align: center; margin-top: 20px;\"><span style=\"font-size: 18pt; color: #00b29a;\">\u00a1Vamos all\u00e1!<\/span><\/p>\n<p style=\"text-align: justify;\"><!--more--><\/p>\n<ul>\n<li style=\"text-align: left;\"><strong><span style=\"color: #00b29a;\"><a style=\"color: #00b29a;\" href=\"http:\/\/es.lipsum.com\/\" target=\"_blank\">Lorem<\/a><\/span><\/strong><\/li>\n<\/ul>\n<p style=\"text-align: justify;\">Muy \u00fatil a la hora de querer generar p\u00e1rrafos, palabras o listas. Si no tengo el texto final para mi web no puedo empezar, por ello siempre los dise\u00f1adores para ir probando sus composiciones se han valido de textos falsos.<\/p>\n<ul>\n<li style=\"text-align: left;\"><strong><span style=\"color: #00b29a;\"><a style=\"color: #00b29a;\" href=\"http:\/\/www.identifont.com\/\" target=\"_blank\">Identifont<\/a><\/span><\/strong><\/li>\n<\/ul>\n<p style=\"text-align: justify;\">Si necesitamos identificar una fuente, esta herramienta es perfecta. Podemos buscarlas por apariencia, por nombre, por similitud, por imagen o s\u00edmbolo y por el nombre de su propio autor. Lo m\u00e1s interesante de todas las categorizaciones es buscar una fuente por apariencia, en el que te ir\u00e1n haciendo una serie de cuestiones hasta finalmente proponerte la tipograf\u00eda que cree que es.<\/p>\n<ul>\n<li style=\"text-align: left;\"><strong><span style=\"color: #00b29a;\"><a style=\"color: #00b29a;\" href=\"http:\/\/www.myfonts.com\/WhatTheFont\/\" target=\"_blank\">WhatTheFont<\/a><\/span><\/strong><\/li>\n<\/ul>\n<p style=\"text-align: justify;\">En el caso de que hayas visto alguna tipograf\u00eda y tengas una imagen de ella, WhatTheFont te propone una forma distinta de buscarla. Subes la imagen y el sistema te devuelve una propuesta, dependiendo de la complicaci\u00f3n y si lo localiza en su base de datos, puede acertar al 100%.<\/p>\n<ul>\n<li style=\"text-align: left;\"><strong><span style=\"color: #00b29a;\"><a style=\"color: #00b29a;\" href=\"http:\/\/www.font-combinator.com\/\" target=\"_blank\">FontCombinator<\/a><\/span><\/strong><\/li>\n<\/ul>\n<p style=\"text-align: justify;\">Permite trabajar con t\u00edtulos, subt\u00edtulos, cuerpo del texto y el fondo. Podemos escribir nuestro texto y configurar el tama\u00f1o, el color, el tipo de fuente y el interlineado. Tambi\u00e9n el color del fondo. Es muy potente visualmente. Finalmente basta con copiar el c\u00f3digo CSS generado y pegarlo en tu proyecto web.<\/p>\n<p style=\"text-align: justify;\">Una versi\u00f3n alternativa de \u00e9sta es <strong><span style=\"color: #00b29a;\"><a style=\"color: #00b29a;\" href=\"http:\/\/www.csstypeset.com\/\" target=\"_blank\">CSSTypeSet<\/a><\/span><\/strong>, algo m\u00e1s completo y con un mayor n\u00famero de opciones de personalizaci\u00f3n.<\/p>\n<ul>\n<li style=\"text-align: justify;\"><strong><span style=\"color: #00b29a;\"><a style=\"color: #00b29a;\" href=\"http:\/\/www.myths.com\/pub\/doc\/html\/fonts\/safefonts.html\" target=\"_blank\">Web-Safe Fonts<\/a><\/span><\/strong><\/li>\n<\/ul>\n<p style=\"text-align: justify;\">Cuando estamos en la fase de dise\u00f1o de nuestra web solemos utilizar fuentes muy creativas, pero en el momento de ver nuestra creaci\u00f3n en Internet, la fuente no es precisamente la que se utiliz\u00f3. Por tanto, esta web se cre\u00f3 con el objetivo de saber si una topograf\u00eda es segura o no para nuestra web, es decir, si hay alguna fuente que vayamos a utilizar y no sabemos si est\u00e1 instalada en el sistema por defecto.<\/p>\n<ul>\n<li style=\"text-align: left;\"><strong><span style=\"color: #00b29a;\"><a style=\"color: #00b29a;\" href=\"http:\/\/letteringjs.com\/\" target=\"_blank\">LetteringJS<\/a><\/span><\/strong><\/li>\n<\/ul>\n<p style=\"text-align: justify;\">Se trata de una librer\u00eda para jQuery que nos permite cambiar el aspecto visual de las tipograf\u00edas, letra a letra. Por si no te hab\u00edas dado cuenta, la imagen de arriba est\u00e1 realizada con este plugin en combinaci\u00f3n con CSS ;)<\/p>\n<p style=\"text-align: center;\"><span style=\"font-size: 14pt; color: #00b29a;\"><strong><span style=\"font-size: 18pt; color: #fdc82f;\">\u00bfY t\u00fa? \u00bfYa conoc\u00edas estas utilidades?<\/span><\/strong><br \/>\n<\/span><\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u00a1Hola a tod@s! Hoy me inicio en este blog hablando de algunas herramientas Web que los desarrolladores suelen utilizar en sus proyectos. \u00a1Vamos all\u00e1!<\/p>\n","protected":false},"author":9,"featured_media":3020,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_mi_skip_tracking":false},"categories":[235,219],"tags":[270,202,185,323,325,479,225,242,324,60],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v18.8 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Herramientas para la tipograf\u00eda en la web - IGNUS<\/title>\n<meta name=\"description\" content=\"Diferentes herramientas muy \u00fatiles que los desarrolladores usan a menudo en sus proyectos web para el tratamiento de la tipograf\u00eda.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/ignuscommunity.es\/blog\/herramientas-para-la-tipografia-en-la-web\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Herramientas para la tipograf\u00eda en la web - IGNUS\" \/>\n<meta property=\"og:description\" content=\"Diferentes herramientas muy \u00fatiles que los desarrolladores usan a menudo en sus proyectos web para el tratamiento de la tipograf\u00eda.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/ignuscommunity.es\/blog\/herramientas-para-la-tipografia-en-la-web\/\" \/>\n<meta property=\"og:site_name\" content=\"IGNUS Community Blog\" \/>\n<meta property=\"article:published_time\" content=\"2015-01-14T06:00:27+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2015-01-14T11:46:46+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/ignuscommunity.es\/blog\/wp-content\/uploads\/2014\/11\/Herramientas-Tipografia-Web-IGNUS-Community.png\" \/>\n\t<meta property=\"og:image:width\" content=\"200\" \/>\n\t<meta property=\"og:image:height\" content=\"119\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"Miguel Mart\u00edn\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebSite\",\"@id\":\"https:\/\/ignuscommunity.es\/blog\/#website\",\"url\":\"https:\/\/ignuscommunity.es\/blog\/\",\"name\":\"IGNUS Community Blog\",\"description\":\"Solucionamos tus necesidades tecnol\u00f3gicas\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/ignuscommunity.es\/blog\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"es\"},{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/ignuscommunity.es\/blog\/herramientas-para-la-tipografia-en-la-web\/#primaryimage\",\"url\":\"https:\/\/ignuscommunity.es\/blog\/wp-content\/uploads\/2014\/11\/Herramientas-Tipografia-Web-IGNUS-Community.png\",\"contentUrl\":\"https:\/\/ignuscommunity.es\/blog\/wp-content\/uploads\/2014\/11\/Herramientas-Tipografia-Web-IGNUS-Community.png\",\"width\":200,\"height\":119},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/ignuscommunity.es\/blog\/herramientas-para-la-tipografia-en-la-web\/#webpage\",\"url\":\"https:\/\/ignuscommunity.es\/blog\/herramientas-para-la-tipografia-en-la-web\/\",\"name\":\"Herramientas para la tipograf\u00eda en la web - IGNUS\",\"isPartOf\":{\"@id\":\"https:\/\/ignuscommunity.es\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/ignuscommunity.es\/blog\/herramientas-para-la-tipografia-en-la-web\/#primaryimage\"},\"datePublished\":\"2015-01-14T06:00:27+00:00\",\"dateModified\":\"2015-01-14T11:46:46+00:00\",\"author\":{\"@id\":\"https:\/\/ignuscommunity.es\/blog\/#\/schema\/person\/37eb0205f95eecbdb812ee70c7a44deb\"},\"description\":\"Diferentes herramientas muy \u00fatiles que los desarrolladores usan a menudo en sus proyectos web para el tratamiento de la tipograf\u00eda.\",\"breadcrumb\":{\"@id\":\"https:\/\/ignuscommunity.es\/blog\/herramientas-para-la-tipografia-en-la-web\/#breadcrumb\"},\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/ignuscommunity.es\/blog\/herramientas-para-la-tipografia-en-la-web\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/ignuscommunity.es\/blog\/herramientas-para-la-tipografia-en-la-web\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/ignuscommunity.es\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Herramientas para la Tipograf\u00eda en la Web\"}]},{\"@type\":\"Person\",\"@id\":\"https:\/\/ignuscommunity.es\/blog\/#\/schema\/person\/37eb0205f95eecbdb812ee70c7a44deb\",\"name\":\"Miguel Mart\u00edn\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/ignuscommunity.es\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/2756e9d3d6d0c369a9f213bbfd78f801?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/2756e9d3d6d0c369a9f213bbfd78f801?s=96&d=mm&r=g\",\"caption\":\"Miguel Mart\u00edn\"},\"url\":\"https:\/\/ignuscommunity.es\/blog\/author\/mmartin\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Herramientas para la tipograf\u00eda en la web - IGNUS","description":"Diferentes herramientas muy \u00fatiles que los desarrolladores usan a menudo en sus proyectos web para el tratamiento de la tipograf\u00eda.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/ignuscommunity.es\/blog\/herramientas-para-la-tipografia-en-la-web\/","og_locale":"es_ES","og_type":"article","og_title":"Herramientas para la tipograf\u00eda en la web - IGNUS","og_description":"Diferentes herramientas muy \u00fatiles que los desarrolladores usan a menudo en sus proyectos web para el tratamiento de la tipograf\u00eda.","og_url":"https:\/\/ignuscommunity.es\/blog\/herramientas-para-la-tipografia-en-la-web\/","og_site_name":"IGNUS Community Blog","article_published_time":"2015-01-14T06:00:27+00:00","article_modified_time":"2015-01-14T11:46:46+00:00","og_image":[{"width":200,"height":119,"url":"https:\/\/ignuscommunity.es\/blog\/wp-content\/uploads\/2014\/11\/Herramientas-Tipografia-Web-IGNUS-Community.png","type":"image\/png"}],"twitter_misc":{"Escrito por":"Miguel Mart\u00edn","Tiempo de lectura":"2 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebSite","@id":"https:\/\/ignuscommunity.es\/blog\/#website","url":"https:\/\/ignuscommunity.es\/blog\/","name":"IGNUS Community Blog","description":"Solucionamos tus necesidades tecnol\u00f3gicas","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/ignuscommunity.es\/blog\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"es"},{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/ignuscommunity.es\/blog\/herramientas-para-la-tipografia-en-la-web\/#primaryimage","url":"https:\/\/ignuscommunity.es\/blog\/wp-content\/uploads\/2014\/11\/Herramientas-Tipografia-Web-IGNUS-Community.png","contentUrl":"https:\/\/ignuscommunity.es\/blog\/wp-content\/uploads\/2014\/11\/Herramientas-Tipografia-Web-IGNUS-Community.png","width":200,"height":119},{"@type":"WebPage","@id":"https:\/\/ignuscommunity.es\/blog\/herramientas-para-la-tipografia-en-la-web\/#webpage","url":"https:\/\/ignuscommunity.es\/blog\/herramientas-para-la-tipografia-en-la-web\/","name":"Herramientas para la tipograf\u00eda en la web - IGNUS","isPartOf":{"@id":"https:\/\/ignuscommunity.es\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/ignuscommunity.es\/blog\/herramientas-para-la-tipografia-en-la-web\/#primaryimage"},"datePublished":"2015-01-14T06:00:27+00:00","dateModified":"2015-01-14T11:46:46+00:00","author":{"@id":"https:\/\/ignuscommunity.es\/blog\/#\/schema\/person\/37eb0205f95eecbdb812ee70c7a44deb"},"description":"Diferentes herramientas muy \u00fatiles que los desarrolladores usan a menudo en sus proyectos web para el tratamiento de la tipograf\u00eda.","breadcrumb":{"@id":"https:\/\/ignuscommunity.es\/blog\/herramientas-para-la-tipografia-en-la-web\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/ignuscommunity.es\/blog\/herramientas-para-la-tipografia-en-la-web\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/ignuscommunity.es\/blog\/herramientas-para-la-tipografia-en-la-web\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/ignuscommunity.es\/blog\/"},{"@type":"ListItem","position":2,"name":"Herramientas para la Tipograf\u00eda en la Web"}]},{"@type":"Person","@id":"https:\/\/ignuscommunity.es\/blog\/#\/schema\/person\/37eb0205f95eecbdb812ee70c7a44deb","name":"Miguel Mart\u00edn","image":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/ignuscommunity.es\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/2756e9d3d6d0c369a9f213bbfd78f801?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/2756e9d3d6d0c369a9f213bbfd78f801?s=96&d=mm&r=g","caption":"Miguel Mart\u00edn"},"url":"https:\/\/ignuscommunity.es\/blog\/author\/mmartin\/"}]}},"_links":{"self":[{"href":"https:\/\/ignuscommunity.es\/blog\/wp-json\/wp\/v2\/posts\/2963"}],"collection":[{"href":"https:\/\/ignuscommunity.es\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ignuscommunity.es\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ignuscommunity.es\/blog\/wp-json\/wp\/v2\/users\/9"}],"replies":[{"embeddable":true,"href":"https:\/\/ignuscommunity.es\/blog\/wp-json\/wp\/v2\/comments?post=2963"}],"version-history":[{"count":45,"href":"https:\/\/ignuscommunity.es\/blog\/wp-json\/wp\/v2\/posts\/2963\/revisions"}],"predecessor-version":[{"id":3025,"href":"https:\/\/ignuscommunity.es\/blog\/wp-json\/wp\/v2\/posts\/2963\/revisions\/3025"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/ignuscommunity.es\/blog\/wp-json\/wp\/v2\/media\/3020"}],"wp:attachment":[{"href":"https:\/\/ignuscommunity.es\/blog\/wp-json\/wp\/v2\/media?parent=2963"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ignuscommunity.es\/blog\/wp-json\/wp\/v2\/categories?post=2963"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ignuscommunity.es\/blog\/wp-json\/wp\/v2\/tags?post=2963"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}