Quantity VS Quality: Big dilemma! The eternal duel.
We know it should never be a matter of choosing between one and the other, but a constant reassessment and balancing between the two of them. They need to coexist and they are interdependent. Even more in the field of digital news and the new distribution channel of Social Media.
However today we will discuss this matter in a particular perspective:
Content VS Web Performance
Web Performance is calculated often, even if not exclusively, on loading time.
3 seconds load time are enough for users to start abandoning web sites. (Cit.)
Then obviously Performance is also related to experience and we always should to answer these questions before launching a digital newspaper:
- Are all URLs redirecting to the correct landing pages?
- Is the page content easy to read?
- Are the ads an obstacle to navigation?
What should I do then to make sure I do not slow down my web site with content?
Images:
- Size: Images on the web rarely are more than 600 pixels when they are huge pictures, most of the time 300 pixels is more than enough to get the right quality and size of the image and even more often images we need to associate to information are about 200 pixels. And just in case you are wondering 200×200 pixels look like this:
- Weight:
- We should aim to have images that are not heavier than 100kb
- How to optimise
- If you are using Photoshop there is a really easy to use function that is called “Save for Web”, this will help you optimise your image for web without loosing quality and if you need to apply optimisation to many pictures you can perform a batch optimisation through Go to File > Automate > Batch and then selecting “Image Optimization” and “Save for Web”.
- If you are using Gimp you can use the “Image>flatten image” feature and then save as PNG or JPEG depending on your image, for pictures with many colours JPEG is advised.
- If you are not using any of the above maybe you would be interested in checking out: http://www.imgopt.com/, jpegtran (JPEG), optipng (PNG) or pngquant (PNG),http://www.imageoptimizer.net/Pages/Home.aspx or any other tool you can find by searching for “image optimisation tools”.
Fonts
- Choose 1 font, maximum 2 and set the rules to use them. To know more about size of header, sub-header, body text, notes, etc. refer to our Guidelines: Opennemas-Style_Guidelines.pdf
- Leave alone “Serif” fonts, they are good on paper, but not really suitable for web.
- Do not be afraid of using WebFonts as per Google article https://developers.google.com/web/fundamentals/performance/optimizing-content-efficiency/webfont–optimization?hl=en
External services
- Widgets: Widgets are wonderful. We use widgets for everything. We love widgets. However widgets slow down our pages big time. Being an external call it is impossible to avoid that they require to our pages a longer time to load. Therefore we should always check
- How much is slowing down my web page?
- Do users really need/want that widget in that page?
Advertising
- iFrame VS Javascripts:
- iFrame means “inline frame” and it is a function used in coding to include external objects (image, video, html pages, etc) in a page code.
- Javascript tags instead call scripts with embedded code and tell the browser to read them.
- An iframe can only be rendered into a single place but javascript do not have such rule.
- Javascripts load with the content of the site which could cause server load issues and drive users away.
- iFrame is not supported by all browser types.
- Users can disable Javascripts on their devices.
- With iFrame the content is loaded before an advertisement which is important to a publisher.
- With Javascript multiple ad type can be served, that are not allowed with iFrame.
- Conclusion: is worth to test the 2 solutions, track results, including page loading time, and decide which one is more suitable for your site. On March of 2014 The New York Times chose iFrame and chose to work on the challenges in order to overcome them.
What do yo think?
Was this article useful to you?
Please do not hesitate to leave a comment or ask for more information at sales@openhost.es