PT to PX Converter & Font Size Measurements : Convert PT to Pixels, EMS and Percentages

Web design and any computer aided design industry all over the world uses different units of measurements to specify the sizes of the elements on a webpage or screen. On this page , we have a PT to PX converter and a PX to PT converter.  we try to provide a comprehensive set of tools to convert from one unit to another for the web designers who are working with multiple units. PT ) points) , PX ( Pixels) , EMS and Percentages can be converted using the tools below.

Here’s a chart that converts points to pixels (and ems and %). It’s an approximation, which will depend on font, browser and the operating system.

These are important to know when you are doing web designs that fit to every screen.

In below chart we are listing some frequently used measurements in Points, Pixels, Ems and Percents.

PT to PX Converter ( Points to Pixels) – PT to PX Calculator

PX to PT Converter ( Pixels to Points ) – PX to PT Calculator


PX to PT Conversion Table

Some commonly used values are in the below chart for your easy reference.
Points
Pixels
Ems
Percent
6pt
8px
0.5em
50%
7pt
9px
0.55em
55%
7.5pt
10px
0.625em
62.5%
8pt
11px
0.7em
70%
9pt
12px
0.75em
75%
10pt
13px
0.8em
80%
10.5pt
14px
0.875em
87.5%
11pt
15px
0.95em
95%
12pt
16px
1em
100%
13pt
17px
1.05em
105%
13.5pt
18px
1.125em
112.5%
14pt
19px
1.2em
120%
14.5pt
20px
1.25em
125%
15pt
21px
1.3em
130%
16pt
22px
1.4em
140%
17pt
23px
1.45em
145%
18pt
24px
1.5em
150%
20pt
26px
1.6em
160%
22pt
29px
1.8em
180%
24pt
32px
2em
200%
26pt
35px
2.2em
220%
27pt
36px
2.25em
225%
28pt
37px
2.3em
230%
29pt
38px
2.35em
235%
30pt
40px
2.45em
245%
32pt
42px
2.55em
255%
34pt
45px
2.75em
275%
36pt
48px
3em
300%

What is PT or Points used in Typography / Web Design

In typography, the point ( PT)  is the smallest unit of measure. It is used for measuring font size, leading, and other items on a printed page. The size of the point has varied throughout the history of printing. Since the 18th century, the point’s size has varied from 0.18 to 0.4 millimeters.  Source

What is PX or Pixel used in Typography / Web Design

A pixel (px) at 96DPI (dots per inch) is equal to 0.2645835‬ millimeters, 0.010416675‬ inches, or 0.75 point. It is a measurement of how tall a font is in pixels which are visible on your computer screen. So, if a font is 12 pixels in height, that means it takes up 12 pixels on your screen from the top of the letter, to the bottom, which also includes the characters that have sections which are under the guide line, such as a “p” character.

What is EM or EMS used in Typography / Web Design

An em is a unit of measurement. Just like pixels, ems can determine the size of elements on a web page. Unlike pixels, which are absolute, ems are relative to their parent’s font size.  Therefore Em value can be calculated using the below formula.

Value in Ems  = Expected Pixel Value / Inherited Pixel  Value

Inherited Pixel value is the parent’s font size.

Lanka websites is a leading Web Design company in Sri Lanka with 12 years expertise in web design, dynamic website development and ecommerce website development.

Recursively applying proper directory permissions for your live Joomla website

website security

Applying proper directory permissions for your live Joomla websites is one important step in securing it from malicious users online.

Use below commands to recursively set permissions to files and directories.  Joomla recommends 707 special permissions for the /images and /images/stories directories.

find . -type f -exec chmod 644 {} \;
find . -type d -exec chmod 755 {} \;
chmod 707 images
chmod 707 images/stories
chown apache:apache cache

Inserting an Iframe to Joomla article using JCE editor

Have you tried to embed the an iframe in an article using the JCE editor in Joomla ?

You may have been frustrated to see your iframe code stripped off when the articles is finally saved.

Most of the time iframe is the easiest way to include external content in an webpage such as videos, forms and social feeds.

A quick fix for this would be to allow iframes in JCE editor settings below.

In Joomla admin, to to components > JCE Editor >

Profles -> desired Profile -> Plugin parameters -> Allow IFrames.

The setting is available in the media settings tab.

How to stop Google indexing your site when it is under construction or maintenance

seo process in a hand drawn diagram

When you are creating a new website with Joomla or with any other method on a live server, Google might index the half-done pages and give you crappy search results for some time.  Best thing is to block google from visiting the site using the good old robots.txt

change the content of the robots.txt in the root folder to

User-agent: *
Disallow: /

thats it , google will never look at your site untill you remove these lines. So dont forget to replace these codes with original Joomla robots.txt file contents later.

User-agent: *
Disallow: /administrator/
Disallow: /cache/
Disallow: /components/
Disallow: /images/
Disallow: /includes/
Disallow: /installation/
Disallow: /language/
Disallow: /libraries/
Disallow: /media/
Disallow: /modules/
Disallow: /plugins/
Disallow: /templates/
Disallow: /tmp/
Disallow: /xmlrpc/

Dashed and dotted lines with just one click in Photoshop CS6

Photoshop CS6 has some cool features which are top requests from any designer in the world. Such one is the ability to create dashed and dotted lines very quickly.

In this video Adobe Product Manager, Zorana Gee, gives a hint at what’s to come – creating dashed and dotted lines with just one click in Photoshop. A top requested feature brought to life!

How to enable or disable JavaScript support in web browsers

This applies to following browsers: 

FireFox / Chrome / Internet explorer / Safari / Opera

To enable JavaScript in Firefox 2.xx or 3.xx series

  1. Open Firefox.
  2. On the Tools menu, click Options.
  3. Click on the Content icon.
  4. Check the box next to Enable JavaScript.
  5. Click the Advanced button to open the Advanced JavaScript Options box.
  6. Check the boxes under Allow scripts to section that you want to allow.
  7. Click OK.
  8. Click OK.

To enable JavaScript in Firefox 1.xx series

  1. Open Firefox.
  2. On the Tools menu, click Options.
  3. Click Web Features in the Options list.
  4. Under the Web Features section, check the box next to Enable JavaScript.
  5. Click the Advanced button to open the Advanced JavaScript Options box.
  6. Check the boxes under Allow scripts to section that you want to allow.
  7. Click OK.
  8. Click OK.

To enable JavaScript in Microsoft Internet Explorer

  1. Select Internet Options from the browser’s Tools menu.
  2. Click the Security tab.
  3. Click Custom Level in Security Level for this Zone.
  4. Scroll down to Scripting, near the bottom of the list.
  5. Under Active Scripting, choose Enable.
  6. Click OK to leave Security Settings. Click OK to leave Internet Options.

To enable JavaScript in Safari

  1. Select Preference from the browser’s menu.
  2. Click the Security tab (with the “lock” icon).
  3. Make sure the box next to JavaScript is checked.

To enable JavaScript in Opera

  1. Select Quick Preferences from the browser’s Tools menu.
  2. Make sure the checkbox next to Enable JavaScript is checked.

Netscape and Mozilla Suite

  1. Select Preferences from the browser’s Edit menu.
  2. Click Advanced on the left side of the dialog box.
  3. Click the Scripts & Plugins subitem under Advanced.
  4. Check the box next to Navigator.
  5. Click the OK to close the Preferences dialog box.

 

Most of Modern Websites uses JavaScript for various purposes in their content.

Examples are to validate user input and animations.

 

Example : JSL Website when browsed with a browser which has Javascript disabled.

 

Are All Search Engines the Same?

A web search engine or Internet search engine is a software system that is designed to carry out web search, which means to search the World Wide Web in a systematic way for particular information specified in a textual web search query. – Wikipedia

Search engines work by crawling hundreds of billions of pages using their own web crawlers. These web crawlers are commonly referred to as search engine bots or spiders. A search engine navigates the web by downloading web pages and following links on these pages to discover new pages that have been made available

Search engines basically operate the same way, but it’s the minor differences that determine if your website is relevant to a search result or not…

Google, Yahoo, and Bing are three of the biggest search engines in the world. Collectively, they fulfill trillions of searches every year, and they constantly compete for more users in the search market.

For Yahoo and Bing, keyword factors are most relevant. For Google, relevant links are the most important factor. Yahoo has no preference for sites with respect to age. Google, on the other hand, will rank a site for its age and longevity. Google respects website maturity.

Because of these differences, the smart marketer or web designer will study the differences in search engines and use their indexing platforms to his or her advantage. If your plan is to conquer more than one search engine, you’ll need to optimize carefully and know how each search engine is likely to respond.

Top 10 Search Engines of the World as of 2020

  1. Google
  2. Bing
  3. Yahoo
  4. Baidu
  5. Yandex.ru
  6. DuckDuckGo
  7. Ask.com
  8. AOL.com
  9. WolframAlpha
  10. Internet Archive

eCommerce mistakes you want to avoid when creating your online business website

Building a business based on an eCommerce website is aways a challenge, so it is important to get basic things corrent first time to succeed in the ever competitive online market. Check if you have covered below points with your ecommerce website development.

1. No proper marketing Plan

You can build the best website of the whole wide world and no one will come buying stuff from you if they dont know about it. Having a digital marketing plan along with a traditional marketing strategies will give you the best results. It is always wise to hire a qualified experienced persons for this who can advice you not just digital marketing, but traditional as well.

2. No proper Branding – Logo or a unique theme

If your website does not have a quality logo to brand yourself, the visitors might not take you serious. Never keep your site without a logo, today the logo designs can be created for very cheap prices. If it still is out of your reach, create one yourself, but dont leave your site logoless.

3. Lack of customer interactions and recommendations/reviews

Reviews are the best marketing on your site you can ever put. There should be always methods for the customer to make inquiries and complaints easily.
It gives a chance for you to find out whats working and whats not in your products.

4. Showing Social profiles and stats when those are not grown fully.

Yes, We know, that you wanted your facebook followers featured on your website footer and your developer developed it at a cost. But enabling it when there is only few people following your page works totally negative to your business. Always remember to enable followers and stats only when they are looking impressive.

5. No proper story for your business

Every successful business has a great story about them to tell, if you dont have a great story, then customers might think you are not passionate about the products you present. So be creative and word your story well in your About Us page, state your vision, mission and goals clearly in that page in simple words. It will be a good investment to hire a experienced content writer for this one time job.

6. No Address in contact page

Al thou you may do the business entirely online, but people might be interested in where are you located for various reasons. Having your location mentioned in your contact page will not only make your customers more confident, it might open new business opertunities from your locale as well.

7. using a free email address.

Always use a proper email address from your domain name. Be creative about it too. You dont have to use info@yourdomain.com becuase everyone is doing it. if you are selling autoparts – turbo@yourautobusiness.com would be a good email to use for contact.

8. Trying too many things with SEO and lack of proper SEO strategy

You overall SEO strategy should be optimized to focus on your strongest markets and prioritize your keywords. Putting same amount of effort to a keyword that is less important will deprive the attention needed for you most important keywords.

it is always better to select your best keywords and a local SEO strategy to maximize RIO from you SEO budget.

You can talk to us about creating a successful ecommerce website with confidence that we know all the pitfalls of online businesses and will not let you fall in to those. Contact us today

The CSS font shorthand rule

When styling fonts with CSS you may be doing this:

font-weight: bold;
font-style: italic;
font-variant: small-caps;
font-size: 1em;
line-height: 1.5em;
font-family: verdana,sans-serif
And thats a lot of code to type and the CSS file gets big with if you have a lot of font rules!
There’s no need though as you can use this CSS shorthand property:
font: bold italic small-caps 1em/1.5em verdana,sans-serif
Much better! Just a few of words of warning: This CSS shorthand version will only work if you’re specifying both the font-size and the font-family. The font-family command must always be at the very end of this shorthand command, and font-size must come directly before this. Also, if you don’t specify the font-weight, font-style, or font-variant then these values will automatically default to a value of normal, so do bear this in mind too.
This is useful when you want to make your Joomla templates load faster, you can reduce the file size of your CSS files considerably by using this method.

Magento : How to replace the default logo in transactional emails

Here is a screenshot of the magento admin panel.

Navigate through menu > System > Configuration> Design > Transactional Emails.

Select and upload the logo , then set the ALT text. and save. Alt text is important as most email clients block images in email s by default.