zenden tools Archives - Zen Den Web Design - Creativity and Security in One Place

Will you lose customers while your mobile pages slowly load, or will you gain loyal followers as you optimize mobile site speed? The choice is yours, but Google plans to add mobile website speed to SERP ranking, so wise businesses are moving to optimize mobile site speed now. The majority of consumers are mobile and they expect mobile sites to be quickly accessible, some experts say within one second. Follow these steps to appease the need for speed (and overall responsive web design).

Minimize to optimize mobile site speed

1. Minimize image size

Images take longer to load than text, so make sure your image size matches the available space. Reduce the image resolution as much as you can without sacrificing quality. Crop images for a perfect fit, and compress them with a jpeg type file.

2. Minify resources

To minify, you delete or compress unneeded resources while maintaining processing efficiency. This refers to code and formatting in the form of HTML, CSS and JavaScript. Google Developers recommend a range of tools and server modules to address minification and help you optimize mobile site speed.

3. Reduce blocking JavaScript and CSS

The initial render should only use JavaScript and CSS files necessary for loading above the fold content, and defer the ones that block or reroute content. This allows viewers to immediately see the top part of your page while the rest of your page loads. Avoid or inline external files that send requests out to the network, as they eat up valuable time.

4. Slash and delay above the fold content

As mentioned above, initial content will load faster when there is less data involved. Consider saving images and other time grabbers for below the fold positions. Structure your website to load main content before widgets and sidebars to optimize mobile site speed.

5. Compress files

Smaller files mean faster network transfers, which will speed up loading times. Gzip can be enabled in the web server configuration, and accounts for up to 90% file size reduction. This leads to a quicker first render, and your viewers will use less data too.

6. Trim or omit video

Videos take up the most room on a website, and are the biggest culprits when pages load slowly. If video is not integral to your site, eliminate it completely. Other options include loading it in the background, or only running it on your desktop site. Some mobile sites use a call to action button that either links to a video hosting site like YouTube, or routes the video file to the user’s email address.

7. Remove redirects

Redirects require extra processing and delay page loading. An example is when a mobile viewer is sent to your desktop landing page and then redirected to your mobile landing page. Hosting your mobile and desktop sites in the same location is one way to address this. Many websites prefer using a responsive design that responds and changes to any size device screen to optimize mobile site speed.

Modification for optimization

8. Choose plugins wisely

Plugins can cause your mobile site to lag or crash, as well as induce security concerns. Not all plugins are well conceived, so select carefully. Take time to research and make sure the plugins you pick are up-to-date, have a lot of positive customer reviews, and have a high number of downloads (thousands are better than hundreds). Run tests to determine if a plugin affects your site speed, and weigh the pros and cons.

9. Enhance browser caching

Mobile caches cannot hold large amounts of content, and this slows down mobile site loading speed. All resources for your site should have a caching policy in place. This allows reusing of previous responses whenever possible, cutting down on retrieval time to optimize mobile site speed.

10. Utilize a CDN

A content delivery network (CDN) disperses the weight of your website across a network of servers around the world. Users receive your content from the server that is located closest to them. The shorter the distance between user and server, the faster your content loads.

Put your mobile site to the test

In addition to these steps, Google’s TestMySite online tool checks the mobile-friendliness, mobile speed and desktop speed of any website. The results include a number grade up to 100 for each of the three categories, and a list of fixes to optimize mobile site speed in that specific area. You can also request to receive the report via email.

Mobitest is another online tool for finding the speed of your site, and tests strictly for mobile. You can choose between several devices to test on: iPhone 5s, Galaxy S5 or iPad Air. Load time, page size, waterfall chart and screenshot are displayed on the results page.

GTMetrix tests the speed of your site on either Firefox (desktop) or a Galaxy Nexus (mobile). After registering, you can generate a performance report with percentages and letter grades for pagespeed score and YSlow score, as well as results for page load time and number of requests. GTMetrix also breaks down your performance scores into subcategories with suggestions for correcting low scores.

The average person uses a mobile device more than 150 times a day, and as mobile’s popularity continues to grow, so does the need to optimize mobile site speed. Reducing or eliminating some features, changing others, and periodically testing and updating your mobile site will keep it optimized. More than a “mobile friendly” site, you’ll have a mobile site built for speed.

Heading is code name for structure

Heading tags (or title tags) are designed to add two elements to content: hierarchy and rhythm, and one major component to search engine parsing: identity.
Imagine a block of text on any topic that would be presented in form of a big clump, possibly with paragraphs, but without visual effects to outline its essence.

The result is a rather uninviting, uninteresting and inefficient post. Very few would be intrigued enough to read it. There is no clear display of what it is all about, the question it raises or the answer it provides.

The purpose of heading tags from a strictly redactional point of view is to be visually enticing and deliver a sort of summary of the content itself. In other words, they constitute the skeleton of web content from the spine (main heading) to limbs (subheadings) to fingers and toes (lower subheadings).

Heading tags respect the chain of command

Typically, the hierarchy in headers is <H1>, <H2>, <H3> with instances of <H4> to <H6>, though those are rarely used in blogging (more commonly found in web page design to create “sections”).
From 1 to 6, the heading tags wouldn’t dream of pretending to be what they are not.

Heading and subheadings are not designed to just format the text. In fact, they are not format elements per se. The font size, color and style are merely set to make them stand out and highlight their respective role. As a good practice, no tagging should be inserted in the body itself.

“Tag, you’re it”: how heading tags impact SEO: <H1> – The main topic. What we will talk about, hence its prominence (that’s a boss).
Heading is code name for structure: <H2>

Subheading that announces we enter into the topic more specifically and develop the characteristics of H1 honcho (Heading Tags) to H2 (structure).

How heading tags impact SEO

The notation <H> title/subtitle </H> acts like an ID tag for search engines when algorithms parse content and eventually decide how to rank the web page. Not that this aspect only decides whether your landing page will do well or not, but the correlation between heading tags and content is unmistakable.

Headers are unlikely to secure you the top position just because you use them. What they say (or don’t say) and how they are used throughout a site has its importance.
The consensus is there should be only one <H1> per page, and that it should mention your focus keyword. In the case of articles, SEO professionals recommend to place that same keyword in at least one <H2> (and of course, it will be dispersed in the text so a “match” will naturally happen between titles and content).

What they don’t recommend, however, is to replicate heading tags in a page or through the site. They should be unique. Nor should you hammer your keywords in the hope you’ll win the race (the opposite is likely to happen). Lastly, unless ranking is not your concern, keep the subject line short (heading tags should never become entire paragraphs), to the point and relevant.

In many instances, site owners have no idea of the importance of heading tags, but chances are their web developer knew a thing or two about it. For others, tools in web creation and blogging allow to select a line and make it a header without knowledge of coding. Even if Google and Yahoo and Bing allege they don’t require heading tags to be able to find your site and display it in results, the digital marketers think and know otherwise. And all SEO concerns aside, we have to admit that structured content looks good and reads better.

Posts

10 Tips To Optimize Mobile Site Speed