{"id":940,"date":"2018-04-10T09:36:41","date_gmt":"2018-04-10T15:36:41","guid":{"rendered":"https:\/\/disenoweb.facmed.unam.mx\/?page_id=940"},"modified":"2018-10-09T16:14:36","modified_gmt":"2018-10-09T22:14:36","slug":"imagenes","status":"publish","type":"page","link":"https:\/\/disenoweb.facmed.unam.mx\/index.php\/imagenes\/","title":{"rendered":"Im\u00e1genes"},"content":{"rendered":"

[et_pb_section fb_built=\u00bb1″ background_color=\u00bb#efefef\u00bb _builder_version=\u00bb3.0.94″][et_pb_row custom_padding=\u00bb0px|0px|27px|0px\u00bb _builder_version=\u00bb3.0.47″ background_size=\u00bbinitial\u00bb background_position=\u00bbtop_left\u00bb background_repeat=\u00bbrepeat\u00bb][et_pb_column type=\u00bb4_4″ _builder_version=\u00bb3.0.94″ parallax=\u00bboff\u00bb parallax_method=\u00bbon\u00bb][et_pb_text _builder_version=\u00bb3.0.94″ text_font=\u00bb||||||||\u00bb text_font_size=\u00bb81px\u00bb text_text_color=\u00bb#0cbbce\u00bb header_font=\u00bb||||||||\u00bb header_text_align=\u00bbcenter\u00bb text_orientation=\u00bbcenter\u00bb]<\/p>\n

<\/path><\/svg><\/p>\n

Im\u00e1genes
<\/strong><\/h1>\n

[\/et_pb_text][\/et_pb_column][\/et_pb_row][\/et_pb_section][et_pb_section fb_built=\u00bb1″ background_color=\u00bb#3f3f3f\u00bb _builder_version=\u00bb3.0.94″ custom_padding=\u00bb18px|0px|0px|0px\u00bb][et_pb_row custom_padding=\u00bb40px|0px|24px|0px\u00bb _builder_version=\u00bb3.0.94″][et_pb_column type=\u00bb4_4″ _builder_version=\u00bb3.0.94″ parallax=\u00bboff\u00bb parallax_method=\u00bbon\u00bb][et_pb_text background_layout=\u00bbdark\u00bb _builder_version=\u00bb3.0.94″ text_font=\u00bb||||||||\u00bb]<\/p>\n

Las im\u00e1genes que utilizamos en nuestro sitio deben cumplir con requerimientos m\u00ednimos de calidad, una buena o mala imagen puede hacer la diferencia en como el usuario percibe la p\u00e1gina . En este tutorial podremos ver las cualidades que tiene una buena imagen y tambi\u00e9n\u00a0 la edici\u00f3n b\u00e1sica de estas. <\/p>\n

[\/et_pb_text][et_pb_button _builder_version=\u00bb3.0.94″][\/et_pb_button][\/et_pb_column][\/et_pb_row][et_pb_row custom_padding=\u00bb0px|0px|27px|0px\u00bb _builder_version=\u00bb3.0.94″][et_pb_column type=\u00bb1_4″ _builder_version=\u00bb3.0.94″ parallax=\u00bboff\u00bb parallax_method=\u00bbon\u00bb][et_pb_button button_url=\u00bb#cuidados\u00bb button_text=\u00bbCuidados \u00bb button_alignment=\u00bbcenter\u00bb _builder_version=\u00bb3.0.94″ custom_button=\u00bbon\u00bb button_text_color=\u00bb#ffffff\u00bb button_bg_color=\u00bb#0ba2c4″ button_border_width=\u00bb0px\u00bb button_font=\u00bb||||||||\u00bb][\/et_pb_button][\/et_pb_column][et_pb_column type=\u00bb1_4″ _builder_version=\u00bb3.0.94″ parallax=\u00bboff\u00bb parallax_method=\u00bbon\u00bb][et_pb_button button_url=\u00bb#Brillo\u00bb button_text=\u00bbBrillo y contraste\u00bb button_alignment=\u00bbcenter\u00bb _builder_version=\u00bb3.0.94″ custom_button=\u00bbon\u00bb button_text_color=\u00bb#ffffff\u00bb button_bg_color=\u00bb#0ba2c4″ button_border_width=\u00bb0px\u00bb button_font=\u00bb||||||||\u00bb][\/et_pb_button][\/et_pb_column][et_pb_column type=\u00bb1_4″ _builder_version=\u00bb3.0.94″ parallax=\u00bboff\u00bb parallax_method=\u00bbon\u00bb][et_pb_button button_url=\u00bb#recortar\u00bb button_text=\u00bbRecortar imagen \u00bb button_alignment=\u00bbcenter\u00bb _builder_version=\u00bb3.0.94″ custom_button=\u00bbon\u00bb button_text_color=\u00bb#ffffff\u00bb button_bg_color=\u00bb#0ba2c4″ button_border_width=\u00bb0px\u00bb button_font=\u00bb||||||||\u00bb][\/et_pb_button][\/et_pb_column][et_pb_column type=\u00bb1_4″ _builder_version=\u00bb3.0.94″ parallax=\u00bboff\u00bb parallax_method=\u00bbon\u00bb][et_pb_button button_url=\u00bb#ajustar\u00bb button_text=\u00bbAjustar imagen\u00bb button_alignment=\u00bbcenter\u00bb _builder_version=\u00bb3.0.94″ custom_button=\u00bbon\u00bb button_text_color=\u00bb#ffffff\u00bb button_bg_color=\u00bb#0ba2c4″ button_border_width=\u00bb0px\u00bb button_font=\u00bb||||||||\u00bb][\/et_pb_button][\/et_pb_column][\/et_pb_row][\/et_pb_section][et_pb_section fb_built=\u00bb1″ _builder_version=\u00bb3.0.94″ custom_padding=\u00bb44px|0px|94px|0px\u00bb][et_pb_row custom_padding=\u00bb58px|0px|39px|0px\u00bb _builder_version=\u00bb3.0.94″][et_pb_column type=\u00bb4_4″ _builder_version=\u00bb3.0.94″ parallax=\u00bboff\u00bb parallax_method=\u00bbon\u00bb][et_pb_text _builder_version=\u00bb3.0.94″ header_font=\u00bb|600|||||||\u00bb]<\/p>\n

Tama\u00f1o de las im\u00e1genes<\/strong><\/h1>\n

[\/et_pb_text][et_pb_tabs active_tab_background_color=\u00bb#0baabc\u00bb _builder_version=\u00bb3.0.94″ tab_font=\u00bb||||||||\u00bb box_shadow_style=\u00bbpreset2″][et_pb_tab title=\u00bb1. Tama\u00f1o \u00bb _builder_version=\u00bb3.0.94″]<\/p>\n

El tama\u00f1o m\u00ednimo recomendado para las im\u00e1genes es de 800px de ancho para utilizar en secciones medianas<\/strong>, y de 2000px para las que ocupan gran parte de la pantalla (como en el carrusel inicial).<\/strong><\/p>\n

\"\"<\/p>\n

[\/et_pb_tab][et_pb_tab title=\u00bb2. C\u00f3mo saber de que tama\u00f1o son en Windows \u00bb _builder_version=\u00bb3.0.94″]2. Bot\u00f3n derecho sobre la imagen- Propiedades- Detalles- Imagen- Dimensiones<\/p>\n

\"\"
\n[\/et_pb_tab][et_pb_tab title=\u00bb3. C\u00f3mo saber el tama\u00f1o en Mac\u00bb _builder_version=\u00bb3.0.94″]<\/p>\n

3. Bot\u00f3n derecho sobre la imagen-Obtener informaci\u00f3n- M\u00e1s informaci\u00f3n- Dimensiones<\/p>\n

\"\"<\/p>\n

[\/et_pb_tab][\/et_pb_tabs][\/et_pb_column][\/et_pb_row][\/et_pb_section][et_pb_section fb_built=\u00bb1″ background_color=\u00bb#f2f2f2″ module_id=\u00bbcuidados\u00bb _builder_version=\u00bb3.0.94″ custom_padding=\u00bb54px|0px|117px|0px\u00bb][et_pb_row custom_padding=\u00bb70px|0px|27px|0px\u00bb _builder_version=\u00bb3.0.94″][et_pb_column type=\u00bb4_4″ _builder_version=\u00bb3.0.94″ parallax=\u00bboff\u00bb parallax_method=\u00bbon\u00bb][et_pb_text _builder_version=\u00bb3.0.94″]<\/p>\n

Cuidados<\/strong><\/h1>\n

[\/et_pb_text][et_pb_tabs active_tab_background_color=\u00bb#0b9cc4″ _builder_version=\u00bb3.0.94″ tab_font=\u00bb||||||||\u00bb box_shadow_style=\u00bbpreset2″][et_pb_tab title=\u00bb1. No forzar el tama\u00f1o de la imagen\u00bb _builder_version=\u00bb3.0.94″]Debemos respetar el taman\u0303o original de las ima\u0301genes: si es de formato pequen\u0303o, no debemos forzar su taman\u0303o, ya que no debe apreciarse borrosa o que sus pi\u0301xeles sean visibles.<\/p>\n

\"\"
\n[\/et_pb_tab][et_pb_tab title=\u00bb2. Respetar las proporciones de las im\u00e1genes \u00bb _builder_version=\u00bb3.0.94″]Si la imagen tiene un ancho y largo determinado no debemos alterar ninguno de estos factores con el fin de llenar.<\/p>\n

\"\"
\n[\/et_pb_tab][et_pb_tab title=\u00bb3. Uniformidad en las im\u00e1genes\u00bb _builder_version=\u00bb3.0.94″]Si tenemos diferentes im\u00e1genes continuas en una galer\u00eda debemos procurar que todas sean del mismo tama\u00f1o para que se aprecie un orden en la composici\u00f3n. En la secci\u00f3n edici\u00f3n\u00a0 de este tutorial podemos ver como ajustar las im\u00e1genes al mismo tama\u00f1o.<\/strong>
\n\"\"<\/p>\n

\"\"
\n[\/et_pb_tab][\/et_pb_tabs][\/et_pb_column][\/et_pb_row][\/et_pb_section][et_pb_section fb_built=\u00bb1″ _builder_version=\u00bb3.0.94″][et_pb_row custom_padding=\u00bb44px|0px|0px|0px\u00bb _builder_version=\u00bb3.0.94″][et_pb_column type=\u00bb4_4″ _builder_version=\u00bb3.0.94″ parallax=\u00bboff\u00bb parallax_method=\u00bbon\u00bb][et_pb_text _builder_version=\u00bb3.0.94″]<\/p>\n

Edicion b\u00e1sica de im\u00e1genes<\/strong><\/h1>\n

 <\/p>\n

Existen diferentes tipos de programas que podemos utilizar para la edici\u00f3n de im\u00e1genes, en este tutorial utilizaremos\u00a0 https:\/\/pixlr.com\/editor\/<\/a>\u00a0 es un editor de im\u00e1genes en linea y gratuito.<\/p>\n

 <\/p>\n

[\/et_pb_text][\/et_pb_column][\/et_pb_row][et_pb_row custom_padding=\u00bb45px|30px|47px|30px\u00bb custom_margin=\u00bb|||\u00bb module_id=\u00bbBrillo\u00bb _builder_version=\u00bb3.0.94″ box_shadow_style=\u00bbpreset2″][et_pb_column type=\u00bb4_4″ _builder_version=\u00bb3.0.94″ parallax=\u00bboff\u00bb parallax_method=\u00bbon\u00bb][et_pb_text _builder_version=\u00bb3.0.94″]<\/p>\n

Ajustar brillo y contraste<\/strong><\/span><\/h3>\n

El brillo y el contraste nos ayudara a mejorar una imagen sobre expuesta u opaca.<\/p>\n

1. Archivo- Nueva imagen \u00a0 2. Ajustes- Brillo y contraste<\/strong> \u00a0\u00a0 3. Ajustar los niveles\u00a0 \u00a0 4. Archivo- Guardar<\/strong><\/p>\n

<\/strong><\/p>\n

V\u00eddeo<\/strong><\/h2>\n

[\/et_pb_text][et_pb_video src=\u00bbhttps:\/\/disenoweb.facmed.unam.mx\/wp-content\/uploads\/2018\/04\/brillo.mov\u00bb play_icon_color=\u00bb#f79000″ _builder_version=\u00bb3.0.94″][\/et_pb_video][\/et_pb_column][\/et_pb_row][et_pb_row custom_padding=\u00bb50px|30px|58px|30px\u00bb custom_margin=\u00bb80px|||\u00bb module_id=\u00bbrecortar\u00bb _builder_version=\u00bb3.0.94″ box_shadow_style=\u00bbpreset1″][et_pb_column type=\u00bb4_4″ _builder_version=\u00bb3.0.94″ parallax=\u00bboff\u00bb parallax_method=\u00bbon\u00bb][et_pb_text _builder_version=\u00bb3.0.94″ header_font=\u00bb|600|||||||\u00bb header_4_font=\u00bb|600|||||||\u00bb]<\/p>\n

Recortar imagen<\/strong><\/span><\/h3>\n

Recortar im\u00e1genes para ajustar el tama\u00f1o o\u00a0 alg\u00fana parte de la fotograf\u00eda\u00a0 no deseada.<\/p>\n

1. Archivo-Nueva imagen\u00a0 2. Seleccionar herramienta de corte<\/strong>\u00a0 3. Seleccionar secci\u00f3n- Recortar\u00a0 4. Archivo- Guardar<\/strong><\/p>\n

<\/strong><\/h2>\n

<\/strong><\/h2>\n

Video<\/strong><\/h2>\n

[\/et_pb_text][et_pb_video src=\u00bbhttps:\/\/disenoweb.facmed.unam.mx\/wp-content\/uploads\/2018\/04\/recortar.mov\u00bb _builder_version=\u00bb3.0.94″][\/et_pb_video][\/et_pb_column][\/et_pb_row][et_pb_row custom_padding=\u00bb27px|30px|61px|30px\u00bb custom_margin=\u00bb80px|||\u00bb module_id=\u00bbajustar\u00bb _builder_version=\u00bb3.0.94″ box_shadow_style=\u00bbpreset1″][et_pb_column type=\u00bb4_4″ _builder_version=\u00bb3.0.94″ parallax=\u00bboff\u00bb parallax_method=\u00bbon\u00bb][et_pb_text _builder_version=\u00bb3.0.94″]<\/p>\n

#0ba8c<\/strong><\/span><\/h3>\n

Ajustar im\u00e1genes<\/strong><\/span><\/h3>\n

Dimensionar im\u00e1genes en un\u00a0 tama\u00f1o en especifico ayudara a crear uniformidad en la p\u00e1ginas, tanto en secciones como en galer\u00eda es importante que las im\u00e1genes\u00a0 que se encuentren juntas tengan las mismas dimensiones.<\/p>\n

\"\"<\/p>\n

[\/et_pb_text][et_pb_text _builder_version=\u00bb3.0.94″]<\/p>\n

1. Archivo-Abrir imagen\u00a0 2. Editar- Trasformaci\u00f3n libre\u00a0<\/strong> 3. Ajustar imagen 4. Guardar<\/strong>\u00a0 5. Capa-Abrir imagen como capa\u00a0 6. Editar- Trasformaci\u00f3n libre\u00a0<\/strong><\/p>\n

7. Ajustar imagen\u00a0 8.Guardar imagen<\/strong><\/p>\n

<\/strong><\/p>\n

<\/strong><\/h2>\n

<\/strong><\/h2>\n

Video<\/strong><\/h2>\n

[\/et_pb_text][et_pb_video src=\u00bbhttps:\/\/disenoweb.facmed.unam.mx\/wp-content\/uploads\/2018\/04\/AJUSTAR-IMAGEN.mov\u00bb _builder_version=\u00bb3.0.94″][\/et_pb_video][\/et_pb_column][\/et_pb_row][\/et_pb_section]<\/p>\n","protected":false},"excerpt":{"rendered":"

Im\u00e1genes Las im\u00e1genes que utilizamos en nuestro sitio deben cumplir con requerimientos m\u00ednimos de calidad, una buena o mala imagen puede hacer la diferencia en como el usuario percibe la p\u00e1gina . En este tutorial podremos ver las cualidades que tiene una buena imagen y tambi\u00e9n\u00a0 la edici\u00f3n b\u00e1sica de estas. Tama\u00f1o de las im\u00e1genesEl […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_et_pb_use_builder":"on","_et_pb_old_content":"","_et_gb_content_width":"","jetpack_post_was_ever_published":false,"footnotes":""},"jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/PaVGAT-fa","amp_enabled":true,"_links":{"self":[{"href":"https:\/\/disenoweb.facmed.unam.mx\/index.php\/wp-json\/wp\/v2\/pages\/940"}],"collection":[{"href":"https:\/\/disenoweb.facmed.unam.mx\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/disenoweb.facmed.unam.mx\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/disenoweb.facmed.unam.mx\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/disenoweb.facmed.unam.mx\/index.php\/wp-json\/wp\/v2\/comments?post=940"}],"version-history":[{"count":72,"href":"https:\/\/disenoweb.facmed.unam.mx\/index.php\/wp-json\/wp\/v2\/pages\/940\/revisions"}],"predecessor-version":[{"id":1528,"href":"https:\/\/disenoweb.facmed.unam.mx\/index.php\/wp-json\/wp\/v2\/pages\/940\/revisions\/1528"}],"wp:attachment":[{"href":"https:\/\/disenoweb.facmed.unam.mx\/index.php\/wp-json\/wp\/v2\/media?parent=940"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}