Qual a melhor forma de exibir um caractere de espaço em branco?

Um aplicativo da web que estou escrevendo destaca caracteres individuais encontrados em um teclado tradicional. Tenho uma área muito limitada na qual o caractere pode ser exibido (que é basicamente a largura de um caractere W na fonte que estou usando), o que significa que não posso exibir a palavra “espaço” ou “espaço em branco”.

Qual é a melhor forma de exibir o caractere de espaço em branco?

Eu tentei algumas opções, mas não tenho certeza se elas apenas levariam à confusão:

  • Exemplo 1 Usando sublinhado. Parece um pouco parecido com o caractere de sublinhado.
  • Exemplo 2 O símbolo de espaço (␠ (␠)). Eu nem sabia que isso existia até começar a procurar para obter respostas a essa pergunta, então não tenho certeza se isso é amplamente reconhecido.
  • Exemplo 2 Uma borda inferior esmaecida em uma cor diferente.
  • Exemplo 3 Um caractere de bloco (█ (█)) como aqueles usados em um terminal para representar o cursor.
  • Exemplo 4 Um espaço em branco sem nenhum estilo aplicado.

Suponho que seja importante notar que é apenas para fins de exibição; o usuário não interage com o caractere, a não ser reconhecendo que ele está lá ao ler a página (portanto, não estou perguntando sobre Qual caractere posso usar para representar a barra de espaço ? ).

Comentários

  • Pergunta fortemente relacionada: É o ponto do meio a melhor maneira de significar um espaço?
  • Todos os caracteres serão separados visualmente? Ou seja, são todas caixas separadas em que o personagem se encontra? Nesse caso, ‘ d simplesmente não uso nenhum estilo, a menos que você tenha algum motivo de que uma única caixa vazia significa outra coisa (como nenhuma entrada).
  • @ JamesDonnelly Na verdade, eu não estava ‘ sugerindo o ponto do meio. Talvez eu devesse ter vinculado diretamente à minha resposta, onde digo que middot não é o melhor caractere e sugiro um ” sub-colchete ” ou colchete do indicador em branco como Ben tem abaixo.
  • Possível duplicata de Que caractere posso usar para representar a barra de espaço?
  • Não vejo isso como uma duplicata. A duplicata proposta está perguntando como representar o uso da barra de espaço física . Esta questão pergunta como representar visualmente um caractere em branco / espaço.

Resposta

Interpunct

Não é intrusivo e é quase imperceptível. E os usuários do Word que estão familiarizados com ele o reconhecerão facilmente, então você terá alguma consistência externa.

Com base nos comentários, editei esta resposta para observar que é necessário gerar uma diferença entre o texto e interpunct, então usei um tamanho de fonte um pouco maior e alterei a cor de preto para azul claro, de modo que seja menos perceptível. Além disso, existem alguns idiomas (como o catalão) que usam isso como um caractere.

É importante notar que esse caractere é usado antes mesmo da era do computador (o latim o utilizava).

Comentários

  • muitos editores de texto centrados em programação também usam isso para espaços em branco à direita, embora em uma cor desbotada.
  • Isso é o Notepad ++ usa quando você pede para tornar os caracteres invisíveis visíveis (o botão pilcrow).
  • Eu também gosto do interpunct, mas como Woodrow aponta, uma cor desbotada realmente ajuda a ser menos perceptível. Acho que em seu exemplo de texto preto em branco eles são bastante intrusivos.
  • Dentro do texto, isso funciona muito bem, mas em uma tonalidade independente, não tenho certeza se é tão claro.
  • Adicionando ao poing @agweber. O desbotamento da cor também é importante, porque alguns idiomas usam este símbolo como parte de sua gramática (por exemplo, catalão; il · lusi ó).

Resposta

Minha visita sempre foi um espaço em branco, ␣ (␣) ou o caractere de sub-colchete ⎵ (⎵), que é mais amplo . Você pode vê-los aqui em w3.org . Eu usei muito o underbracket em meus cursos de programação para mostrar espaço na saída do programa.

Por exemplo These␣do␣a␣pretty␣good␣job␣of␣conveying␣a␣space torna-se:

exemplo com espaço em branco

Certifique-se de usar uma fonte que implemente os glifos Unicode para que não seja interrompida se o sistema do usuário não os tiver, ou poderia ser semelhante a:

Exemplo com fonte sem glifos] 2

Comentários

  • Estes█do█não█do█a█pretty█good█job█of█conveying█a█space. imgur.com/Uj8fZeKl.png . Tenha cuidado para não usar caracteres que podem não existir no sistema do usuário ‘, pois este é, na verdade, um aplicativo da web. Se você seguir esse caminho, inclua a fonte no aplicativo.
  • @Tyzoid Com certeza! Se você ‘ for usar unicode, certifique-se de que a fonte ‘ está usando implementa esses glifos. Dito isso, ‘ não tenho certeza se ‘ não é razoável esperar que o usuário ‘ s sistemas tenham uma fonte que implementa todos os símbolos Unicode. Por exemplo, meu sistema está servindo aqueles glifos do STIX General.
  • @Ben Pode ser o caso na maioria dos casos, mas acho que não é razoável presumir que os usuários ‘ systems têm todos os símbolos Unicode disponíveis. O meu não ‘ t, conforme evidenciado pela captura de tela de sua resposta. (Além disso, para o benefício de pessoas como eu, você pode incluir uma captura de tela da aparência do texto?)
  • A outra vantagem disso é que você pode ver onde há vários caracteres de espaço em uma linha . Ou seja, você disse que há 4 caracteres aqui: ⎵⎵⎵⎵ e três aqui: ⎵⎵⎵, muito mais fácil do que aqui: ____ vs. ___
  • Também vale a pena dizer que eles não são ‘ t aparecendo no aplicativo Android SE.

Resposta

Resposta curta

Para representar a barra de espaço de um teclado, U + 23B5 colchete inferior (normal ⎵ bold monoespaço ). Como alternativa, U + 2423 Open Box (␣). No ambiente HTML, ⎵ e &blank, respectivamente. Para representar espaços no texto, use o interponto U + 2E31 Ponto do meio do separador de palavras (⸱) ou U + 00B7, ponto do meio (·) como alternativa.

Repetição mental e outra pontuação:

  • U + 2E31: ⸱⸱⸱⸱Quatro⸱espaços⸱antes, ⸱agora⸱⸱dois, ⸱um⸱at⸱end.⸱
  • U + 00B7: ···· Quatro · espaços · Antes, · agora ·· dois, · um · no · fim. ·
  • U + 23B5: ⎵⎵⎵⎵Quatro⎵espaços⎵antes, ⎵agora⎵⎵dois, ⎵um⎵at⎵end .⎵
  • U + 2423: ␣␣␣␣Quatro␣espaços␣antes, ␣agora␣␣dois, ␣um␣at␣end.␣

Obras monoespaciais melhor:

  • U + 2E31: ⸱⸱⸱⸱Four⸱spaces⸱before,⸱now⸱⸱two,⸱one⸱at⸱end.⸱
  • U + 00B7: ····Four·spaces·before,·now··two,·one·at·end.·
  • U + 23B5: ⎵⎵⎵⎵Four⎵spaces⎵before,⎵now⎵⎵two,⎵one⎵at⎵end.⎵
  • U + 2423: ␣␣␣␣Four␣spaces␣before,␣now␣␣two,␣one␣at␣end.␣

Resposta longa

Para barra de espaço, U + 23B5 colchete inferior, HTML ⎵ () é o caminho a percorrer. É um símbolo utilizado em teclados e teclados virtuais de telefones celulares, mas tem baixa cobertura de fonte. U + 2423 Open Box, HTML &blank (␣) foi melhor suportado, fica melhor com outro pontuação, mas é feia isoladamente: vs .

A representação visual de espaços no texto é mais diversa. Nos velhos tempos do console, os manuais representavam os espaços como uma combinação de be uma barra (/). Há um Unicode para isso, U +2422 Símbolo em branco (␢), mas sem o mesmo impacto da representação anterior na maioria das fontes. Mas a aparência antiga ou nova não ajudam muito. Usar sobreposições para simular as formas antigas e U + 2422 diretamente:

  • U + 0338: Theseb̷dob̷notb̷dob̷ab̷prettyb̷goodb̷jobb̷ofb̷conveyingb̷ab̷space.

  • U + 2422: Estes␢do␢não␢fazem␢a␢bombomtrabalho␢de␢transmissão ␢a␢space.

Uma solução moderna é usar o separador de palavras do ponto intermediário U + 2E31 (⸱) ou o ponto intermediário U + 00B7 ponto (·). O primeiro é aconselhável, o segundo tem amplo suporte a fontes.

Exemplos:

  • Um⸱pretty⸱good⸱job⸱of⸱displaying⸱spaces. (U + 2E31)
  • Um · muito · bom · trabalho · de · exibição · de espaços. (U + 00B7)
  • A⸱pretty⸱good⸱job⸱of⸱displaying⸱a⸱space. (U + 2E31 mono espaçado) nota
  • A·pretty·good·job·of·displaying·spaces. (U + 00B7 mono espaçado)

Para notas históricas, usos e mais alternativas, consulte https://en.wikipedia.org/wiki/Interpunct e https://en.wikipedia.org/wiki/Whitespace_character (enterrado em Visão geral / Definição e ambiguidade / Unicode / Substitutos).


Se bem entendi, seu aplicativo está exibindo texto como pressionamentos de tecla (ou texto e teclas especiais).Nesse caso, com U-2423:

  • A p r e t t y g o o d j o b o f d i s p l a y i n g k e s .

  • A bonito bom job de exibindo chaves.

Com U-23B5:

  • A p r e t t y g o o d j o b o f d i s p l a y i n g k e y s .

  • Um bonito bom job de exibindo chaves.


nota Em algumas fontes mono espaçadas, é um glifo de largura diferente!

Comentários

  • U + 2422 Símbolo em branco, como visto em várias outras respostas.
  • Obrigado, eu editei para mencionar isso. Não consegui encontrar isso antes porque a nova renderização de ” b slash ” (ou ” b solidus “) não é como nos dias das máquinas de escrever. Puxa, me sinto velho agora.
  • Presumo que Lucida Sans Unicode (das fontes listadas em fileformat.info) corresponda melhor às suas expectativas .
  • PS: U + 2E31 é semanticamente bom, mas mal suportado e (se for) geralmente se parece com U + 00B7, que pode ter um comportamento de quebra de linha menos desejável, mas está disponível universalmente. U + 2027 também parece o mesmo (talvez posicionado um pouco mais alto), mas é o caractere errado para o trabalho, porque junta as palavras ao seu redor – é para dicionários. U + 2024/5 são um e dois pontos na linha de base, o que pode ser melhor do que U + 2026 ou período padrão U + 002E.

Resposta

Você pode usar cor? A Wikipedia usa caixas azuis claras para mostrar os caracteres:

insira a descrição da imagem aqui

Mas se você estiver limitado a duas cores, eu sugeriria estas:

  • ˽ ⎵⎴ – Modificando estante de letras, sub-colchete ou overbracket para representar o botão
  • ⬚ ◌ – Círculo pontilhado ou quadrado para representar o vazio
  • 👽 👾 🚀 – Uma opção de comédia.

Comentários

  • Não💩 tenho certeza💩 de que isso💩 é💩 uma boa💩 ideia.
  • @PierreArlaud Eu não ‘ nem mencionei essa merda.
  • @PierreArlaud Sua ideia é uma porcaria! Nós rimos de nossos 💩 produtores quando ‘ a lemos.
  • com cores, você pode ‘ mostrar facilmente quantos espaços entre as palavras quando há vários consecutivos

Resposta

& em branco; ␣

Wikipedia lista os seguintes caracteres para esta finalidade:

Unicode space-illustrating characters (visible) Code Decimal Name Block Display Entity U+00B7 183 Middle dot Basic Latin · · U+237D 9085 Shouldered open box Misc Technical ⍽ - U+2420 9248 Symbol for space Control Pictures ␠ - U+2422 9250 Blank symbol Control Pictures ␢ - U+2423 9251 Open box Control Pictures ␣ ␣ 

Jukka Korpela (autor de ” Unicode explicado “) tem um website que tem isto a dizer:

Espaços visíveis

Existem alguns caracteres gráficos que podem ser usados um símbolos para um espaço. Embora às vezes chamados de espaços visíveis, eles não são espaços, mas notações visíveis usadas para indicar a aparência de espaços em manuais de instrução e descrições de textos.

A tabela a seguir lista alguns símbolos, em ordem decrescente de utilidade prática . Suas formas variam de acordo com a fonte; especialmente o último varia muito.

 ␣ U+2423 OPEN BOX ␢ U+2422 BLANK SYMBOL ␠ U+2420 SYMBOL FOR SPACE 

O símbolo ␢ tem uma longa história de uso para esta finalidade na programação de computador inicial Foi escrito à mão em folhas de codificação por programadores para indicar um caractere de espaço para operadores de máquina de cartão perfurado (que eram como um pool de digitação).

Eu usaria ␣ & em branco; particularmente porque existe uma entidade HTML com um nome obviamente relevante.

Comentários

  • Portanto, se houver símbolos para exibir espaço, existem símbolos para exibindo símbolos de espaço?

Resposta

Você sempre pode usar uma fonte monoespaçada, então o espaço seria indicado por uma lacuna do tamanho de um carvão :). Você pode destacar cada espaço (por exemplo, <mark>&nbsp;</mark>) e definir algumas regras CSS para torná-lo da cor apropriada.

Resposta

Olhe para o URL desta página. Os espaços entre as palavras do título são substituídos por um travessão. É intuitivo, legível e familiar.

Comentários

  • O problema é que - será semelhante a um -!
  • Esses são hífens (U + 2011). Os traços são (en traço, U + 2013) e (travessão U + 2014) . Além disso, alguns URLs usam um símbolo de adição, + (U + 002B), enquanto outros escrevem simplesmente %20 (U + 0020 é o Caractere Unicode para espaço). Isso é chamado de codificação de porcentagem, uma parte do conjunto de URI.

Resposta

Estou acostumado com os caracteres de espaço em branco do Eclipse “, que são usados para mostrar espaços em branco no contexto da formatação do código.

  • Espaço: U + 00B7 “ponto do meio”: ·
  • Guia: U + 2192 “seta para a direita”: →

Se puder, exibindo caracteres de espaço em branco em uma cor mais clara do que o texto normal ajuda a enfatizar que esses são caracteres de espaço em branco. Por exemplo, se o texto normal é preto, use cinza.

Comentários

  • O ponto do meio é a melhor solução para espaço, mas para tabulação é necessário mais de uma coluna na maioria das fontes monoespaçadas. Eu prefiro o pequeno triângulo preto apontando para a direita (U + 25B8) que pode ser combinado com o ponto do meio no vim para mostrar as guias.

Resposta

Quando eu estava aprendendo redação técnica na universidade aqui na Nova Zelândia, aprendemos a usar uma casa (número Unicode: U + 2302, código HTML: & # 8962) ou um triângulo acima (número Unicode: U + 25B3, código HTML: & # 9651) para indicar espaços.

Set-ExecutionPolicy⌂Unrestricted Set-ExecutionPolicy△Unrestricted 

Comentários

  • uhh … Eu tenho muita dificuldade em encontrar o espaço lá. Parece muito com um caractere, então tenho que ler a palavra duas vezes para até mesmo dividir as palavras no lugar certo …
  • @Falco, eu também. Acho que depende do tipo de letra escolhido .
  • Já vi isso sendo usado para exibir um separador de coluna (ou tabulador), mas não para espaços normais entre palavras.

Resposta

Como mencionado acima, o espaço em branco do programador tradicional é uma letra b minúscula, sobreposta por uma barra. Eles foram usados em folhas de codificação manuscritas passadas de programadores para operadores de keypunch que não estavam familiarizados com a linguagem de programação usada e, portanto, exigiam uma entrada inequívoca.

Em uma página da web, isso pode ser representado inserindo, em sequência: uma letra b minúscula, uma tag span que especifica estilo margem esquerda de -.4em, uma barra, uma tag de intervalo final

(Usar uma classe CSS economizaria digitação e geralmente é uma prática melhor).

Usar em como o unidade de medida permite que o personagem escalar se tamanho nt é alterado.

Resposta

Não estou afirmando que isso seja superior, mas é uma abordagem que pode ser usada: para texto que é para ser exibido como caracteres (não uma imagem) em uma tela (não impressa): basta usar a string real, com os espaços necessários, e dizer ao usuário para posicionar o cursor na string e usar uma tecla de seta para mover e contar o espaços (faço isso como um leitor ao verificar algumas strings e contar comprimentos). Isso tem a vantagem de que a string pode ser copiada e colada e evita quaisquer problemas de renderização de caracteres e suporte ao conjunto de caracteres.

Ex. :

As datas podem ser inseridas com vários espaços, como neste exemplo, que tem 2 espaços entre cada elemento “25 dez 2016”. Coloque o cursor em a string e use as teclas de seta para a direita e esquerda para explorá-la. Você pode copiar e colar no programa.

(Observação: este site substitui vários espaços inseridos por um único então, ironicamente, t seu exemplo não funciona aqui. Entrei em 2 espaços consecutivos onde disse que sim.)

Deixe uma resposta

O seu endereço de email não será publicado. Campos obrigatórios marcados com *