Jump to content
Nicereddy

New skin - PCGamingWiki: Overclocked

Recommended Posts

After more than six months in development, we’re very happy to announce that our new PCGamingWiki skin is ready for release!

 

The skin has been developed primarily by our admins Nicereddy and Soeb, who handled the front-end design/development and back-end development (server, MediaWiki upgrades, etc.) respectively.As always, you can support our work and help pay for the site's hosting costs by becoming a patron on Patreon. It'd be greatly appreciated!

 

What's new

A lot, to the say the least!

 

Faster load times, decreased content payload

The home page, for example, has gone from 92 requests, more than 1000 KB of content, and a load time of 8.97 seconds all the way down to 26 requests, 686 KB of content, and a 2.33 second load time. A huge performance gain!

 

Game article pages have also seen significant improvement. Our article on Half-Life 2 has gone from 76 requests, 443 KB of content, and a load time of 4.47 seconds down to 26 requests, 370 KB of content, and a load time of 2.60 seconds.

 

Your load times may differ slightly depending on network speed, how hard our servers are currently being hit by traffic, and device/browser. The above statistics were the average of 5 tests each in Chrome 43, with a logged-in user (therefore without ads) on August 23, 2015 using a 2014 Retina MacBook Pro.

 

Based on Google's PageSpeed Insights test, we've made significant strides with regards to speed and UX on all platforms. Our previous home page's scores on Mobile Speed, Mobile UX, and overall Desktop were 64, 60, and 74 respectively. With the redesigned home page, the scores for Mobile UX and overall Desktop have become 96 and 82 respectively, an increase of 44 points overall! Mobile speed hasn't changed – and therefore isn't listed - because the majority of the points knocked off are from ads, which causes the score to jump randomly between as low as 55 and as high as 72.

 

How did we manage to get such an insane speed boost?

There were a lot of places where the wiki wasn’t doing things as optimally as we would have liked. We used separate files for every one of our icons, embedded information about posts on our forums in the sidebar of every page, and had a lot of extra, unnecessary stuff left over by MediaWiki.

 

In order to decrease the number of resources browsers download to load our articles, we’ve embedded almost all of our icons into the CSS stylesheets, combining dozens of files into one stylesheet.

 

We’ve also optimized the icons to be as small as possible while still looking essentially the same, credit to Soeb for his painstaking work on that front.

A lot of unnecessary resources have been cut off, which also contributed significantly to the savings.

 

Mobile support with responsive design

We want to make our content accessible to as many people as possible, so now the site is optimized for mobile devices as well as desktop. If you run into a problem with a game, it’s probably a lot easier to get on your phone and follow a step-by-step solution from there than it is to constantly switch between your browser and a game. Or if you’ve got a Steam Machine hooked up to your TV, checking for a fix on your phone is a lot easier than trying to use the built-in browser/keyboard with a controller. There are lots of other use cases for PCGamingWiki on a phone or tablet, and we think this’ll be pretty useful for a lot of people.

 

This also makes us, at least as far as we know, the first wiki ever to utilize a fully responsive design! Responsive design means that everyone gets the same content, no "m.pcgamingwiki.com", the content just changes to better fit the browser window.

 

Editing guide

After a year of work, ThatOneReaper deserves a huge amount of recognition, as well as congratulations, for his efforts in creating a comprehensive guide to editing PCGamingWiki. After multiple unsuccessful past attempts by other editors, this is a big deal, and will be a great help to future editors. Thank you to everyone who contributed to its development over the last year with their feedback and suggestions! If you’re interested in contributing information and fixes to the wiki, the Editing Guide is the perfect place to start.

 

Comparison images

 

 

 

Home page

 

 

 

 

 

Half-Life 2 article

 

 

 

 

Borderlands 2 Input Settings

 

 

 

 

Donate page

 

 

 

 

Mobile site

Posted ImagePosted Image

 

Miscellaneous improvements

The header's user information has been condensed into a simple dropdown userbar, heavily inspired by a cancelled Wikimedia extension built for Wikipedia. The Table of Contents has been moved to a floating button which expands when pressed. If you're not a fan, this feature can be disabled in Preferences. Clicking images now opens them in a lightbox, thanks to the MediaViewer extension. And of course, every aspect of the wiki's design has been polished, improved, and iterated upon.

 

Thank you

Thank you to each and every of our editors – whether you’ve made five edits or five thousand – your contributions are greatly appreciated, by other editors as well as the community as a whole.

 

If you’d like to support us, and help us better serve you all with faster servers, better loading times, and more comprehensive coverage of new titles, we’d love for you to check out our Patreon.

 

Thank you for the tremendous support over the last three and a half years, we hope this update helps make the wiki even more useful to the PC gaming community.

 

- The PCGamingWiki Team

 

Click here to view the article

Share this post


Link to post
Share on other sites

Fantastic work on the new skin, it really really great! The biggest change is the well-executed mobile/tablet responsiveness which has always been an issue and had begun to affect search engine visibility of the site as well.

Share this post


Link to post
Share on other sites

Was the new design never tested on anything else other than Chrome and Mac? The font rendering looks completely different on Windows. Some elements are pretty much broken on Firefox.

Share this post


Link to post
Share on other sites

Was the new design never tested on anything else other than Chrome and Mac? The font rendering looks completely different on Windows. Some elements are pretty much broken on Firefox.

It was tested in Firefox on Mac and Firefox on Linux as well. The font rendering problems are caused by Windows' font rendering, and can't be fixed without messing up the text for OS X/Linux users.

Share this post


Link to post
Share on other sites

Was the new design never tested on anything else other than Chrome and Mac? The font rendering looks completely different on Windows. Some elements are pretty much broken on Firefox.

Well, it was publicly available to be tested by anyone for good month. Font rendering does look bit differend, but not worse. Maybe pixel or two larger font would've been nicer though. 

 

The main page isn't being rendered correctly for me at all though, or at the tables not supposed to be aligned?

 

This is what it looks like without my fixes.

There should be ads placed there if you aren't logged in. (and according to screenshot you aren't)

Share this post


Link to post
Share on other sites

Any chance of a dark/night mode theme?

I've done this before with another site, it's incredibly difficult to maintain, especially if you don't have full control over the site's CSS (which we don't, because of MediaWiki). So unfortunately, this isn't planned.

Share this post


Link to post
Share on other sites

I've done this before with another site, it's incredibly difficult to maintain, especially if you don't have full control over the site's CSS (which we don't, because of MediaWiki). So unfortunately, this isn't planned.

I'd be happy with something very basic, just black in place of white, and black text something not black. :P

Share this post


Link to post
Share on other sites

Can't change the appearance anymore, huh?

 

I've always reverted back to the old MediaWiki look because I prefer it over the new-gen bloated mobile stuff that websites keep getting changed to. Unfortunately, that option is gone on PCGW, so it looks like I'm going to have to live with this new redesign.

 

Loads much faster, yes, but from a usability and visual standpoint, it's much worse to me.  I'd rather have a delayed page load than discomfort when viewing the site (though thankfully the article pages didn't change too much).

 

Even the font causes me some minor eye strain (Windows/Pale Moon); is there any way to change this on my end?

Share this post


Link to post
Share on other sites

Can't change the appearance anymore, huh?

 

I've always reverted back to the old MediaWiki look because I prefer it over the new-gen bloated mobile stuff that websites keep getting changed to. Unfortunately, that option is gone on PCGW, so it looks like I'm going to have to live with this new redesign.

 

Loads much faster, yes, but from a usability and visual standpoint, it's much worse to me.  I'd rather have a delayed page load than discomfort when viewing the site (though thankfully the article pages didn't change too much).

 

Even the font causes me some minor eye strain (Windows/Pale Moon); is there any way to change this on my end?

You should be able to through a custom wiki stylesheet, maybe, I can't really help you with that right now though.

 

Well, it was publicly available to be tested by anyone for good month. Font rendering does look bit differend, but not worse. Maybe pixel or two larger font would've been nicer though. 

 

There should be ads placed there if you aren't logged in. (and according to screenshot you aren't)

That's an odd place for an ad.

Share this post


Link to post
Share on other sites

I'm not alone i'm guessing in that I was very fond of the old site layout and format on Windows/Firefox. And I am sad to see it go.

I will adjust however. One thing I really miss a lot is seeing the latest edits right on the front page. But like I said. I'll adjust!

Thanks for the work.

Share this post


Link to post
Share on other sites

I'm not alone i'm guessing in that I was very fond of the old site layout and format on Windows/Firefox. And I am sad to see it go.

 

I will adjust however. One thing I really miss a lot is seeing the latest edits right on the front page. But like I said. I'll adjust!

 

Thanks for the work.

Thank you for having an open mind :)

 

I'll miss the edits on the front page as well, I'm kind of thinking we should bring them back, or at least make a link to them more prominent.

Share this post


Link to post
Share on other sites

Thank you for having an open mind :)

 

I'll miss the editest on the front page as well, I'm kind of thinking we should bring them back, or at least make a link to them more prominent.

Yup, I find myself already becoming acustomed to it.

 

Would there be by chance, any ability to set that as something like a user side option? To see the latest edits on the front page at like the very bottom?

Share this post


Link to post
Share on other sites

Please sign in to comment

You will be able to leave a comment after signing in



Sign In Now

  • Found PCGamingWiki useful? Please consider making a Donation or visiting our Patreon.
  • Similar Content

    • By Andytizer
      We are proud to announce that PCGamingWiki is launching a new microtransactions section in all of our PC game articles.    Many PC gamers don't have a clue about what they are getting into before they install the latest 'free-to-play' game, 'game as a service' multiplayer shooter or new 'live service' singleplayer game. These games could contain manipulative loot boxes, hopelessly unfair grinds or game imbalancing pay-to-win unlocks.    At PCGamingWiki, we want to provide absolutely clear information as to how each game is monetized and what microtransaction techniques are being employed. We want people to know whether the game includes solid DLC or expansion packs that deliver solid content post-release, or whether their game features real money gambling mechanics, or keeps their best content behind paywalls or premium subscriptions.  
      Microtransaction categories and definitions
      Central to our project is the definition of each microtransaction category. We have got in contact with the creators of Microtransaction.Zone (a fantastic website which has sadly not updated since 2018) and they have kindly given some advice to adapt their microtransaction tags to our new categories on PCGamingWiki.    These new Microtransaction categories are: Loot box - A variation of microtransaction where the player purchases a loot box where there is a chance to receive varying qualities of in-game item, similar to gambling. Cosmetic - Cosmetic microtransactions are any paid additional content that are designed to be cosmetic and does not substantially affect gameplay, such as skins, hats, decorative items etc. Unlock - Purchase of microtransaction content that affects gameplay and is not solely cosmetic. 'Unlocks' are normally chunks of a game that have been already developed and have been 'locked', and can be 'unlocked' with a purchase. This commonly includes individual characters, maps, levels, weapons, armors, etc. Boost - Allows player to pay to accelerate progress in a game, whether it is faster speed, levelling, level skipping, boosting % chance to find rare items, etc. Currency - Being able to purchase in-game currency whether it's gold, gems, tokens, crafting materials, credits, V-Bucks, etc. which in turn are used to buy other microtransactions, or can be traded for account credit. Infinite cap - Game has microtransactions that can be purchased over and over again without any limit. This is in contrast to finite cap games that have a limit. Pay-to-skip - The game's 'main' rewards can be achieved or grinded for without payment, but payment unlocks those rewards faster or instantaneously.   This list is a first draft and we welcome feedback on definitions on how these will be implemented.   We have also added the following Monetization categories: Ad-supported DLC Expansion pack Freeware Free-to-play Player trading Subscription     New categories will appear in the Infobox   Microtransaction/monetization categorisation is part of the Taxonomy project. Editors can simply add the tags by adding this code to the {{Infobox_game}} template at the top of the game article using this code: |taxonomy = {{Infobox game/row/taxonomy/monetization | ad-supported, dlc, expansion pack, freeware, free-to-play, player trading, subscription | ref= }} {{Infobox game/row/taxonomy/microtransactions | boost, cosmetic, currency, finite cap, infinite cap, loot box, pay-to-skip, unlock | ref= }} You can find up to date code and definitions on the Taxonomy project page, with detailed instructions on how to implement the new categories.
      You might notice that at the moment these categories barely contain any games. We need new editors and help from the PC gaming community to help us to sort and categorise each game article. You don't need an account to edit, but if you create an account and login, you can browse and edit our website without any ads.
       
      Microtransaction section We have also added a new text area under the Availability to precisely list and explain how each microtransaction affects the game. This valuable area will explain exactly how each game uses microtransactions and provides an opportunity to warn players of any particularly problematic microtransactions.     Example of new Microtransactions header in game Apex Legends   See these examples which represent a first draft: Apex Legends Destiny 2 World of Warcraft A new set of instructions is listed in the Editing_guide/Microtransactions, which contains a detailed guide. Each bullet point should match the Infobox category. The code for this area and also reproduced here:
      ===Microtransactions=== *'''[[Currency (microtransaction)|Currency]]''': Begin with this row to explain how real money is directly exchange for in-game currency, and also how it is earned in-game. Try not to mention other currencies unless necessary. *'''[[Loot box (microtransaction)|Loot box]]''': What drops from the loot box *'''[[Cosmetic (microtransaction)]Cosmetic]''': *'''[[Unlock (microtransaction)|Unlock]]''': *'''[[Boost (microtransaction)|Boost]]''': *'''[[Pay-to-skip (microtransaction)|Pay-to-skip]]''': Emphaisize that despite Boosts existing, all important content can be acquired through grinding on the base subscription/free tier. *'''[[Infinite cap (microtransaction)|Infinite cap]]''' / *'''[[Finite cap (microtransaction)|Finite cap]]''':  
      We need editors
      Our project is quite ambitious and we are making new changes that needs more manpower, and we are looking for new editors to help categorise all these microtransactions and help our fellow PC gamers. Furthermore, this is a brand new section and we are really looking for feedback on the categories, names, definitions, suggesting new categories, layout and more!
      If you have a suggestion please leave a comment on this post, or hop onto our Discord onto the #projects channel for more immediate feedback. Let's fix PC gaming!
    • By Andytizer
      After some past requests we have implemented ProtonDB links in all relevant PCGamingWiki articles.
      The new link now appears in the form of a ProtonDB icon in the bottom of the infobox where other partner links are placed. This is automatically added when a Steam App ID is added to any game article.
      Proton is a tool released by Valve Software that has been integrated with Steam Play to make playing Windows games on Linux easier to achieve. ProtonDB gather reports from other gamers as they test games with Proton on Linux and provide aggregate scores of how well games perform. 
      Hopefully this link will encourage more reports to be submitted to ProtonDB to help Linux gamers get their games working. I have also spoken to buck, the developer for the site, who is looking into mutual linking from ProtonDB pages back to PCGamingWiki in the future.
    • By Andytizer
      For some time we have been developing a new PCGW Account Single Sign-on (SSO) system makes use of Keycloak and allows a single account to login to Wiki (MediaWiki), Communty (IP Board) and our Sidewikis. For many months users could choose to login using the PCGW Account or the native logins for the Wiki and Community sites. You will now notice that the PCGW Account is the only way to login as we have now disabled the native logins.
        The PCGW Account was expertly put together by our server administrator Snuxoll, and all credit goes to him for suggesting and executing this new system. It finally puts to rest the rather poor system 'SSO' system we previously used 2012-2018 which caused us ever increasing issues as time went on.   Here are some more details: FAQ can be found here. New Account Management links on the Wiki sidebar and the Community navigation tab. New ticketing system in place - if you need account support please email help@pcgamingwiki.com. Alternatively join us on our Discord server and ask for help in the #support channel.
    • By PatriotRDX
      I have the screenshots for all the settings on Space Hulk Ascension. These are cropped and ready to go. But the upload form says I can't upload them. How can I add these, a search of this forum provides 0 relevant results. Email is verified, please advise.
    • By Andytizer
      We are happy to announce that we have implemented MobyGames integration into our wiki articles now. This will allow quick access to MobyGames' vast database of video game information.
      The new parameter can be added as follows into the standard infobox template:
      |mobygames = witcher-3-wild-hunt See the result of this in the small whale icon at the bottom of the infobox on The Witcher 3 article.
      You can see some of the background to this discussion to adding MobyGames in this thread:
       
  • Who's Online   1 Member, 0 Anonymous, 300 Guests (See full list)

  • Recently Browsing   0 members

    No registered users viewing this page.

  • Forum Statistics

    1,372
    Total Topics
    7,431
    Total Posts
×
×
  • Create New...