Cores RGB e Cores CMYK

Por: Diego Franco - [ October 27th, 2007 ]

Vai um post rapidinho e resumido sobre a diferença de cores RGB e cores CMYK.

RGB

A cor de um pixel em RGB é gerada por 3 cores projetadas que se misturam. As luzes projetadas formam as cores: vermelho, verde, e azul (do inglês: Red, Green, e Blue). Após misturadas, essas cores criam um espaço de cor chamado RGB. As cores RGB são aditivas, significando que a mistura de diversas cores cria o branco. Esse espaço de cor foi criado para gráficos feitos em computadores e visualizados em computadores.

CMYK

A cor de um pixel em CMYK é gerada por 4 cores, são elas: o ciano, magenta, amarelo e preto (do inglês: Cyan, Magenta, Yellow e blacK). O espaço de cor CMYK em um computador é usado para simular tintas impressas em papel e, geralmente é usado em artes-finais para impressão. As cores CMYK são subtrativas, ou seja, significa que misturando diversas cores cria-se o preto. Esse espaço de cor foi criado para gráficos feitos em computador e serem impressos em papel.

Os gráficos para a web são baseados em “tela” e não para impressos, portanto o uso de RGB. Por isso se você enviar um arquivo de alguma arte-final ou peça em Corel ou Photoshop para uma gráfica não esqueça de verificar se está enviando tudo em CMYK, isso é necessário para se gerar um fotolito, a não ser que sua peça criada não use uma imagem colorida, policromática, onde não há uma mistura de cores.

Procure por: DVD, MP3, LCD, Plasma, HDTV, Home Theater

[...] Continuar lendo...

CMYK, CorelDraw, Cores, Desenvolvimento, RGB | Nenhum Comentário » View blog reactions

CMYK | Cores | RGB

Aproveite! Leia isto também:

Declarando cores com códigos Hexadecimais como é isso?

Por: Diego Franco - [ October 25th, 2007 ]

Minha idéia neste post não é de aprofundar no assunto mas de ter uma referência rápida sobre os hexadecimais.

Em nosso ambiente de criação estamos acostumados a selecionar as cores que desejamos e pronto lá está ela naquele círculo, quadrado, fonte ou qualquer outro elemento no qual se deseja preencher. Diferente dos trabalhos Arte-finalistas criados para materiais em papelaria onde selecionamos a cor que se deseja, e se, é RGB ou CMYK (isso depende do tipo de material que é produzido), na web, em nosso CSS mais especificamente trabalhamos com cores escritas em códigos hexadecimais. Mas como é isso?

O nome hexadecimal vem da união de 2 palavras do latin hexa( sexto) e decimal(10, base 10, ou décimo), unindo as duas palavras podemos ter (base do décimo sexto) ou falando em miúdos matemáticos o código hexadecimal é derivado de uma base de cálculo 16, contendo 16 símbolos.

Abaixo você tem uma tabela que mostra como uma base de cálculo 10 é convertida para a base 16.

#	0	1	2	3	4	5	5	7	8	9	10	11	12	13	14	15
Hexadecimais	0	1	2	3	4	5	5	7	8	9	A	B	C	D	E	F

Os números hexadecimais são utilizados para converter valores RGB para que o HTML possa interpretar quais cores você escolheu. As cores RGB variam de 0 à 255. Hoje você pode fazer essa conversão usando a prória calculadora do windows, mas aqui vai uma tabelinha bem simples e prática para se converter valores RGB em hexadecimais.

Tabela RGB - Hexadeximal

00=00	01=01	02=02	03=03	04=04	05=05	06=06	07=07	08=08
09=09	10=0A	11=0B	12=0C	13=0D	14=0E	15=0F	16=10	17=11
18=12	19=13	20=14	21=15	22=16	23=17	24=18	25=19	26=1A
27=1B	28=1C	29=1D	30=1E	31=1F	32=20	33=21	34=22	35=23
36=24	37=25	38=26	39=27	40=28	41=29	42=2A	43=2B	44=2C
45=2D	46=2E	47=2F	48=30	49=31	50=32	51=33	52=34	53=35
54=36	55=37	56=38	57=39	58=3A	59=3B	60=3C	61=3D	62=3E
63=3F	64=40	65=41	66=42	67=43	68=44	69=45	70=46	71=47
72=48	73=49	74=4A	75=4B	76=4C	77=4D	78=4E	79=4F	80=50
81=51	82=52	83=53	84=54	85=55	86=56	87=57	88=58	89=59
90=5A	91=5B	92=5C	93=5D	94=5E	95=5F	96=60	97=61	98=62
99=63	100=64	101=65	102=66	103=67	104=68	105=69	106=6A	107=6B
108=6C	109=6D	110=6E	111=6F	112=70	113=71	114=72	115=73	116=74
117=75	118=76	119=77	120=78	121=79	122=7A	123=7B	124=7C	125=7D
126=7E	127=7F	128=80	129=81	130=82	131=83	132=84	133=85	134=86
135=87	136=88	137=89	138=8A	139=8B	140=8C	141=8D	142=8E	143=8F
144=90	145=91	146=92	147=93	148=94	149=95	150=96	151=97	152=98
153=99	154=9A	155=9B	156=9C	157=9D	158=9E	159=9F	160=A0	161=A1
162=A2	163=A3	164=A4	165=A5	166=A6	167=A7	168=A8	169=A9	170=AA
171=AB	172=AC	173=AD	174=AE	175=AF	176=B0	177=B1	178=B2	179=B3
180=B4	181=B5	182=B6	183=B7	184=B8	185=B9	186=BA	187=BB	188=BC
189=BD	190=BE	191=BF	192=C0	193=C1	194=C2	195=C3	196=C4	197=C5
198=C6	199=C7	200=C8	201=C9	202=CA	203=CB	204=CC	205=CD	206=CE
207=CF	208=D0	209=D1	210=D2	211=D3	212=D4	213=D5	214=D6	215=D7
216=D8	217=D9	218=DA	219=DB	220=DC	221=DD	222=DE	223=DF	224=E0
225=E1	226=E2	227=E3	228=E4	229=E5	230=E6	231=E7	232=E8	233=E9
234=EA	235=EB	236=EC	237=ED	238=EE	239=EF	240=F0	241=F1	242=F2
243=F3	244=F4	245=F5	246=F6	247=F7	248=F8	249=F9	250=FA	251=FB
252=FC	253=FD	254=FE	255=FF

Procure por: games, PS2, PS3, Nintendo, Wii, iPod

[...] Continuar lendo...

CSS, Cores, Desenvolvimento, Hexadecimal | 6 Comentários » View blog reactions

Aproveite! Leia isto também:

Como pessoas com distúrbios de visão enxergam o seu site?

Por: Diego Franco - [ October 2nd, 2007 ]

Site visto por portador de protanopia. Assino os Feeds da Daniele Viana do danielevsilva.com/blog/, uma ótima referência quando se fala sobre cores, psicodinâmica das cores, teoria de design e outros assuntos, Daniele já trabalhou durante 3 anos com acessibilidade para deficientes visuais. Ontem lendo seu post falando sobre O azul - Uma breve analise das cores me chamou a atenção uma de suas referências de links no final do seu post sobre Geradores de Cores, por sinal também ótimas referências. O link que me chamou atenção leva o título deste post: Como pessoas com distúrbios de visão enxergam o seu site?

Na minha opinião acessibilidade é uma questão de amor ao Ser-humano, pura responsabilidade social, e quando digo responsabilidade social não estou falando só de ajudar o portador de deficiência a atravessar a rua ou desenvolver um site totalmente acessível ao deficiente visual, mas creio que responsabilidade social vai mais além, é fazer de você um portador do amor para com o próximo e para com o meio em que vive entendendo que não somos mais importantes que nosso próximo, mas que cada um tem o seu valor, creio que a maior mudança acontece em você mesmo e não no próximo.

O que isso tem a ver com o título do post? Tudo. É de suma importância que saibamos como um deficiente visual se comporta e “vê” as coisas ou como um paraplégico se “move”, porque de uma forma ou de outra isso acaba acontecendo, com tecnologia ou sem ela, a diferença está na forma de como o deficiente visual “vê” as coisas e o paraplégico se “move”.

O site http://colorfilter.wickline.org/ leva você a uma experiência muito interessante de emular como portadores de Discromatopsia*** veêm o seu site. Na imagem acima mostra como um portador de protanopia vê o meu site. Dentre as opções de emulação do site você tem:

* Como portadores de deutanopia veêm;
* Como portadores de protanopia veêm;
* Como portadores de tritanopia veêm;
* Como portadores de acromatopsia veêm;
* Como portadores de protanomalia veêm;
* Como portadores de deutanomalia veêm;
* Como portadores de tritanomalia veêm.

O teste é fácil: coloque o endereço do seu site no campo: Type a URL e escolha um filtro para visualizar, o Colorblin ainda está em fase de desenvolvimento, mas com certeza poderá nos ajudar a escolher melhor as cores a serem utilizadas em nossos sites, ou seguir a boa iniciativa que o Henrique do RevolucaoEtc e o Flávio do Japs tiveram em disponibilizar uma folha de estilos de alto contraste separada caso o usuário necessite.

É isso ai vamos amar mais as pessoas!

*** Discromatopsia (dis=distúrbio; cromos=cor; opsis=olho) é um termo genérico usado para designar qualquer distúrbio de cores.

Segundo Wright¹(1944) apud⁽¹⁾ do ponto de vista cromático os indivíduos podem ser classificados como tricromata (normal, anormal), dicromata, acromata ou monocromata. O tricromata normal identifica todo o espectro visível nas condições padronizadas do exame. O tricromata anormal percebe as três cores básicas: vermelho, verde, azul, porém, uma delas de forma deficitária. É a protanomalia se o déficit é para o vermelho; a deutanomalia, para o verde; a tritanomalia para o azul e a tetartanomalia para o amarelo. Na ausência de percepção total de uma das cores, temos o dicromata: o protanope, deutanope, tritanope ou tetartanope. As discromatopsias podem ser congênitas ou hereditárias ou adquiridas.

Fonte: Conselo Brasileiro de Oftalmologia - Arquivos Brasileiros de Oftalmologia.

Procure por: games, PS2, PS3, Nintendo, Wii, iPod

[...] Continuar lendo...

Acessibilidade, Cores | 1 Comentário » View blog reactions

Acessibilidade | Cores | discromatopsia | Ferramentas | usabilidade