Web Stock NZ

Web Stock NZ
Web Stock NZ

Visit site

Web Stock is a conference that runs out of New Zealand and is coming in to its 10th Year Anniversary. I've heard a lot of great things about Web Stock from friends, but lets take a look how their website goes.

Mobile metadata is used on the Web Stock site:

<meta name="HandheldFriendly" content="True">
<meta name="MobileOptimized" content="320">

Critical CSS

Critical CSS is employed on this site, as is critical JS to a certain extent (although that's not really a thing). There is only 1 http request that is used to include fonts from typography.com. The remainder of the CSS, which looks to be a custom version of Foundation, is included inline in the head. This is great to avoid any additional http requests, which can be more costly than the file itself, but it does have a knock on issue in that there's not way of caching the CSS (at least in the way they've done it) meaning you download the same CSS and JS over and over again.

Web Stock NZ technical details

Meta Viewport

<meta name="viewport" content="width=device-width, initial-scale=1.0"/>


@media only screen { }

@media only screen and (min-width: 641px) { }

@media only screen and (min-width: 1025px) { }

@media only screen and (min-width: 1151px) { }

@media only screen and (min-width: 1401px) { }

@media only screen and (orientation: landscape) { }

@media only screen and (orientation: portrait) { }

@media only screen and (max-width: 640px) { }

@media only screen and (min-width: 641px) and (max-width: 1024px) { }

@media only screen and (min-width: 1025px) and (max-width: 1150px) { }

@media only screen and (min-width: 1151px) and (max-width: 1400px) { }

@media only screen and (min-width: 1401px) and (max-width: 999999999999) { }

@media only screen and (min-width: 1320px) { }

@media only screen and (max-width: 768px) { }

@media only screen and (max-width: 480px) { }

@media only screen and (max-width: 1150px) { }

@media only screen and (max-width: 1024px) { }

@media only screen and (max-height: 600px) { }


These are the frameworks Foundation