Site maximum file size

Question

I have a quick question, and this might be the wrong place, but I hope someone can help me because I'm curious.

I am creating a one-page website with a lot of styles (it is not designed to work on the Internet and uses a lot of images), this is not a big problem, because we believe that we are aimed at a more designer branch, which, most likely, looks like a good one A PC with a pretty good internet connection, and a site the size of a lot of mobile.

But still I wonder what people recommend. my site is currently uploaded 2.2 MB (is there a site on which you can test this battle? I just made an assumption by calculating the sizes of image files, etc.). I can still optimize a lot, but I think that switching under 1mb is a difficult task. is it good enough or is there anyone who has experienced it not?

thanx in advance

Answer 1

You should not worry about the size of your site (especially since you know your target audience) if the user experience does not suffer. However, you must optimize everything you can without sacrificing design. Google page speed can help you a lot. They even have the total size calculator you like. There are also many similar tools available on the Internet.

Also, check out the website's growth trends last year: http://www.theglobeandmail.com/technology/tech-news/bloated-web-pages-costly-for-smartphone-users/article9355125/

According to the HTTP Archive website, which regularly searches the top 10,000 most visited sites on the Internet, the average webpage now weighs approximately 1.3 megabytes , up about 35 percent from last year.

UPDATE

Inspired by the comments of @pwdst, I would like to add that if you want to support mobile phones, tablets, etc., there is no need to sacrifice the appearance of the main site - you can use media queries and practically perform a different presentation for these users. Of course, you can go even further and create another site for them (usually a subdomain).

Answer 2

If you use developer tools, for example, in Chrome, you can see the number of requests and the total amount of data transferred on the "Network" tab. To accurately replicate your user experience, you have to do this with an empty cache - the Incognito or Private tabs can be a great way to do this in most browsers. It is also worth remembering that the testing experience at the local level will be very different from the experience when the effects of latency and bandwidth of the upstream channel come into play.

Be extremely careful about user assumptions if you want to maintain usability. “Good enough” is extremely contextual, it can be “good enough” for the user on a desktop computer, laptop or tablet with a premium DSL connection, but nothing but connect to Edge or 3G on the phone. In cases where possible assumptions should be copied by analyzing user agent strings from server logs or from analytics software such as Google Analytics. It is also worth remembering that you may have a relatively small number of requests for mobile or tablets, and not because mobile or tablet users do not want to visit a website - or choose a visit using another device, but since it is difficult, slow or even impossible to use on their device of choice. This example from a YouTube engineer shows how customers are completely excluded from the site.

In general, the page should be as small as possible, and you may want to look into a lazy loading, in addition to optimization, which helps start time rendering - true, but your current size is not much more than online archive of the average weight of the page 1681kB as at 15 January of this year. Keep in mind that other resources can also use a lot of space - JavaScript is 274K of this average - and it’s unclear if you took this into account in your assessment. Aggressive use of caching will help return visitors and minimize the data transfer required in these circumstances.

I always try to consider whether it is possible to justify the cost of a page compared to functionality. What is the purpose of visitors to your site? Whether the added functionality or the images is enough to justify the cost of execution. Many performance-oriented developers are now actively adjusting the page weight , but this is more difficult for single-page applications where you cannot be the same details with resources.

Answer 3

I would recommend using "Image Preload" , which can help when loading a page, even when it is large.