Hi, I wanted to make a page with pictures of people who work in our research group, so I hacked the “features” template of quark, replacing icons with images. So far so good, and when I was developing the page I mostly used safari. In safari, the page works fine all the time. The page is here:
Then, I looked using chrome, and found that some fraction of the images were missing. When I reloaded, some of the missing images were loaded, while others disappeared. For sure, all of the images are available on the server, they load when I point the browser at them individually.
When I “inspect” a missing image chrome tells me:
Failed to load resource: the server responded with a status of 508 ()
So my question is, how can my simple page lead to an overload like this? I have 34 images, each about 40kB, so really not much.
The page is here if anyone wants to play and make suggestions!
https://anuquantumoptics.org/people
The hacked feature code, that builds the page, looks like this:
{% set grid_size = theme_var(‘grid-size’) %}
{% set columns = page.header.class == ‘small’ ? ‘col-3 col-md-4 col-sm-6’ : ‘col-4 col-md-6 col-sm-12’ %}{{ content|raw }} <div class="columns"> {% for feature in page.header.features %} <div class="column {{ columns }}"> <div class="feature-image" style="font-weight: bold"> <img src="{{feature.image}}" width="100%" height="100%"> {% if feature.name %} <br> {{ feature.name }} {% endif %} </div> <div class="feature-content"> {% if feature.text1 %} {{ feature.text1 }} <br> {% endif %} {% if feature.text2 %} {{ feature.text2 }} <br> {% endif %} {% if feature.url %} <a href="{{feature.url}}">{{ feature.url_text }}</a> {% endif %} </div> </div> {% endfor %} </div> </div> </section>