Author: Web Admin

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.

PT to PX Calculator
PX to PT Calculator
PT, PX, EMS, Percent % Conversion Chart
Point, Pixel, EMS, Percent Conversion Chart

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.

USA Measurements PT or PX

In the USA, its often seen the use of multiple measurement units, especially in design and web development. Whether you’re dealing with points (pt) in print materials, pixels (px) for screen displays, or ems and percentages for responsive web design, it can get confusing. That’s where our PT to PX Converter comes in handy. It’s a simple, yet powerful tool designed to streamline your workflow. By instantly converting between points, pixels, ems, and percentages, it eliminates the guesswork and ensures accurate, consistent measurements across different platforms. No more struggling with complex calculations or relying on approximations. Our converter provides precise results, saving you time and effort. Whether you’re a seasoned designer or just starting out, our tool simplifies unit conversions, making your work easier and more efficient. Try our PT to PX Converter today and experience the convenience of seamless unit conversions. It’s a must-have tool for anyone working with design and web development in the USA.

Recursively applying proper directory permissions for your live Joomla website

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

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

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

To enable JavaScript in Firefox 1.xx series

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

To enable JavaScript in Microsoft Internet Explorer

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

To enable JavaScript in Safari

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

To enable JavaScript in Opera

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

Netscape and Mozilla Suite

Select Preferences from the browser’s Edit menu.
Click Advanced on the left side of the dialog box.
Click the Scripts & Plugins subitem under Advanced.
Check the box next to Navigator.
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

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.