Chapter 1: Prepare Assets - What you need to prepare before creating a page?

Planning is the most important part of any construction process.

It is undeniable that building a website will be the same as building your own house, you will need to choose the right concept, set the structure and then prepare all the necessaries and materials before starting.

Preparation is the key to success

Prepare Content

In the online world, your website is central to all online marketing activities and content is the biggest marketing tool on sites. It is unarguable the important role of content in helping achieve your firm’s marketing goals.

In order to raise search engines ranking and converting visitors to customers on your pages, it’s crucial to have a solid content strategy in place.

These are three important parts of the content creation process that you should keep in mind:

Understand customer needs: Craft content that brings value to customers or addresses customer needs directly and influence them to take action.

SEO optimized: Focus on the keywords in your content, it is the door that customers will open to get on your page.

CRO/ LPO optimized: Focus on the Headlines as David Ogilvy, one of the greatest marketers, has said, “On average, five times as many people read the headline as read the body copy. When you have written your headline, you’ve spent eighty cents out of your dollar”. The next stage is the body text which is your chance to get ‘closer’ to the deal with prospects by making a connection, understanding customers' pain points and influencing them to take action emotionally.

Content Strategy

Prepare Images

The image can delivery better than word

Images can deliver product information faster and better, especially in the e-commerce field. Thus, if you participate in this market, let’s spend time to prepare your images carefully.

What you need to pay attention to is the size of images that make them display perfectly on all devices and will not slow down the page loading speed.

Here are some recommended methods by JSN PageBuilder 4 developers to help users have the best quality of images on a page:

Choosing the right image size

Image dimension

Pick the image size that is closest to the actual presentation on the website. For example, the image size should be set up to 1600px if it is used for the background of the section or 600px for an image or in a small column.

Images should NOT be scaled up, only scaled down to preserve the highest possible quality.

In order to view image information, you can use Google Chrome addon since it allows you to get information of the original image.

View image information

Choosing the right image format

There are 3 primary image formats that you can consider to use:

JPEG, JPG

Use JPEG or JPG format when images are having a lot of colours and less text, like photography. The file size will be much smaller than PNG. For example:

JPG (150Kb)PNG( 489kb)

Note: But keep in mind that this format doesn’t support transparent background, while PNG does.

PNG-8

When images are having lots of text and less colour, you can use PNG-8 which is the 8 bit PNG version. PNG-8 is approximately 10-30% smaller than other bitmap formats like JPG.

For example:

PNG (6Kb)JPG (9Kb)

Also, this format provides a much sharper text presentation.

Note:

The other versions of PNG which are PNG-24 and PNG-32not recommended here since these versions will retain the amount of information much more than PNG-8. Thus, it will create a larger file size.

GIF

GIF is an acronym for Graphics Interchange Format which uses a lossless data compression technique that reduces the file size without quality loss. GIF files are commonly used on the internet, along with these above file formats.

GIF format should be used when:

You want to create web animation. GIF images will hold all of the animation frames and timing information in one single file. Some image editors like Photoshop make it easy to create a short animation and export to GIF file.

You need transparency. GIF images have an “alpha channel” that can be transparent, so you can merge your transparent image on any coloured background.

You need a small file. The compression techniques in the GIF format allow image files to shrink tremendously. For very simple icons and web graphics, GIF is the best image file format.

Image optimization

Since Image optimization helps in improving page load speed, boosts websites’ SEO ranking, and improves user experience, you should consider using one of the following images compression tools depending on an operating system you are using:

Support

Connect with us

JoomlaShine and this site is not affiliated with or endorsed by The Joomla! Project™. Any products and services provided through this site are not supported or warrantied by The Joomla! Project or Open Source Matters, Inc. Use of the Joomla!® name, symbol, logo and related trademarks is permitted under a limited license granted by Open Source Matters, Inc.