HTML - Arabic Support

HTML - Arabic Support

The W3C has a good introduction.

In short:

HTML is a text markup language. Text means any characters, not just ones in ASCII.

  1. Save your text using a character encoding that includes the characters you want (UTF-8 is a good bet). This will probably require configuring your editor in a way that is specific to the particular editor you are using. (Obviously it also requires that you have a way to input the characters you want)
  2. Make sure your server sends the correct character encoding in the headers (how you do this depends on the server software you us)
  3. If the document you serve over HTTP specifies its encoding internally, then make sure that is correct too
  4. If anything happens to the document between you saving it and it being served up (e.g. being put in a database, being munged by a server side script, etc) then make sure that the encoding isn't mucked about with on the way.

You can also represent any unicode character with ASCII

HTML not supporting arabic language

As i can see you are using some html5 based attributes like dir so you need to convert the html4 document to html5 doctype and use lang attribute on html tag and meta tag:

<!DOCTYPE HTML>
<html lang="ar">
<head>
<meta charset="utf-8">

A sample demo is below:

<h1 dir='rtl' lang='ar'>checking</h1><p dir="rtl" lang="ar" style="color:#e0e0e0;font-size:20px;">رَبٍّ زِدْنٍي عِلمًا</p>

HTML Arabic text

Problem will be here that your browser is not capable due to a necessary font or character table which is not being used.
Have a look at this testpage in order to find out if your browser is capable of displaying arabic characters with its actual setting.

This page covers the necessary browser settings to display arabic characters.

CSS not support arabic

The Problem is here with this file:

<script src="js/cufon-yui.js" type="text/javascript"></script>

It`s a font file , try to /Hash/ it , and it will work
(Y)

HTML formatting Arabic text letters

Try adding a zero-width joiner Unicode character before the opening span tag.
You should check this in all browsers, as it is an issue that some can't cope with.

@keyframes doesn't support Arabic

For Arabic include the attributes dir="rtl" and lang="ar" on tag elements with Arabic characters:

h1::after {
content: "مرح";
}

Example 1:

<h1>Testing Arabic</h1>

This render incorrectly characters (on Chrome it seems to work, but in Safari and Firefox don't).

Sample Image

Example 2:

<h1 dir="rtl" lang="ar">Testing Arabic</h1>

This render correctly!

Sample Image

Also, you can read more about problems animating the "content" property here: https://css-tricks.com/animating-the-content-property/

Also you can include inside yours <head></head> tags <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">

Arabic Script Language Not Displaying In Firefox

You aren't specifying the encoding. If you rely on default values, such values may not be correct.

Server should send a proper Content-Type header:

Content-Type: text/html; charset=utf-8

If it doesn't (or there isn't a server involved), you can emulate it in HTML itself:

  • HTML5

    <meta charset="utf-8">
  • Earlier versions:

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

Replace UTF-8 with the actual encoding (though in 2020 the recommended encoding is UTF-8).

does not support Arabic Content in webpage

Try with adding meta charset for arabic at the begning

<META HTTP-EQUIV="Content-Type"  CONTENT="text/html; CHARSET=iso-8859-6">

Or you may try it out with following steps :-

Displaying Arabic text using PHP

1. Don't use the short tags <? ?>. Use the full tags <?php ?>

2. Remove the quotes and semicolon from the first line and others that are outside the php tags
"<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">";

3. Close the span tag <span lang='ar-kw'

4. Make sure save the file with utf-8 encoding. You might be saving it with another coding.


Related Topics



Leave a reply



Submit