Ghacks: Cloudflare, new theme, HTTPS, more
I would like to provide you with information on changes that have been implemented already on Ghacks, or are upcoming in April 2017.
I first thought about publishing this article on April 1, 2017, but the April Fool's epidemic made me re-consider that quickly.
Note that the schedule may change depending on how things progress in April. If things go well, Ghacks will use HTTPS exclusively and the new theme on top of that.
Cloudflare
We have enabled Cloudflare yesterday on the site. Cloudflare acts as a proxy more or less with the aim to block bad traffic to the site without affecting the good (your) traffic.
If you are a regular here on Ghacks you may have noticed already that the server has been acting up a bit in the past weeks. Site went down a couple of times, and sometimes it was slow like a snail instead. This was caused mostly by bad traffic that was hammering the site with requests.
My hope is that by using Cloudflare we are putting an end to this. Result should be a faster, more responsive site. Cloudflare does offer additional features. We will save quite a bit of bandwidth by using the service, and site responsiveness should have improved as well for you (time to first byte, first render).
It is likely that some of you may experience false positives. Cloudflare may ask you to verify that you are human before you may access the site. I hope that this is not the case at all, or very, very limited. If you run into problems regularly, let me know please.
HTTPS
HTTPS is enabled on Ghacks, but it is not the default. We ran tests for the last couple of weeks offering both options to visitors.
If you load the default site, you will get mixed content warnings currently because of the newsletter signup form. Without it, all content should load fine and there should not be any mixed content warnings anymore.
I see the benefits of HTTPS, especially when things like HTTP2 are used as well, as it will speed up the site. Expect HTTPS to be enabled exclusively on the site soon.
New Theme
Work continues on the new theme. We asked you to test it some time ago and report your findings, and are currently in the process of optimizing the theme and changing some of the things that you did not like.
The number one issue was that the thumbnails looked cut off. While that was by design, it caused so much confusion that we will make a change there to avoid that from happening.
Tip: you can test the theme by adding ?theme=ghacks to the URL, e.g. https://www.ghacks.net/?theme=ghacks. Note that the theme works only on the single page then. Any link you follow opens the site using the regular theme.
Closing Words
I hope that the changes won't have a negative effect on your experience, or the site's standing (SEO, reputation). It is hard to predict; while you can use all best practices and such, there is always the chance that things go wrong.
Best case scenario would be that you don't notice any issues, and that the site itself benefits from it as well (faster, better search engine visibility).
Martin, since 2005 your site has been locked in on my Firefox Favorites.
Those huge half sized thumbs on your new site is too much for me. Also I do not trust cloudflare that you are now using.
I need to run Cloudflare right now because it blocks traffic to the site that causes the server to crash otherwise.
Old is better new one is terrible. IMHO. Huge thumbs but only half visible. Bigger everything ? What a shame to see you going downhill in visability & content.
A note on the foreshortened thumbnails, since their implementation also confused me: The full thumbnail is there; it’s just designed so that if the screen width is reduced enough, the left edge of the thumbnail is allowed to drop off the edge of the screen. The image is given 100px inside the main column (so at least that much will always be visible), and then -240px left margin to pull it off to the side.
The screenshot in the article was taken at a small enough size that it would fit in the article, which means it’s also small enough to hit that width limit and crop the thumbnails.
>ghacks is joining the cloudflare botnet
The new theme isn’t my cup of tea. It’s of the same gloomy-doomy blandness one finds almost everywhere these days, from websites to desktop environments to application interfaces … But I guess, the generation that grew up in front of a game console likes this sort of thing. I don’t. In my view the old theme was more cheery and had more character. I also think the new dark header takes up too much space. It’s certainly bigger than the old header, even without a search field. Having said all this, it’s of course the content that matters and not the ever changing flavor-of-the-month looks. So, I’ll shut up about this.
Regarding CloudFlare … from the perspective of someone who runs a commercial website like this one it makes perfect sense to have it professionally hosted by an organization that specializes in such services as this takes a lot of worries out of running the business and helps to prevent technical trouble like DoS attacks etc. But CloudFlare seems to differ from other web hosting companies in many ways and some of them are potentially harmful.
Daniel Brandt of Scroogle search-engine fame maintains an entire website …
http://crimeflare.com/
… with technical analysis and many highly critical articles about the unusual and unverifiable method CloudFlare use to implement SSL encryption and the company’s business practices, where you can read passages like this …
“When you fetch a page from a website that is served from CloudFlare, Javascript has been injected on-the-fly into that page by CloudFlare, and they also plant a cookie that brands your browser with a globally-unique ID. This happens even if the website is using SSL and shows a cute little padlock in your browser. In fact, their entire approach to SSL appears to be a cynical marketing effort – it has a man-in-the-middle problem that cannot be resolved.”
What is innocuous nowadays on the Web as elsewhere?
But I read you and of course most of us are aware of the CloudFlare problematic, recently with the Cloudbleed “affair”. I don’t know to what point the company is ambivalent and what exactly is the trade-off.
I do now that there are measures taken to limit the risks. Here I use an application called PeerBlock which handles IP blocking lists, and not only peer-oriented. I rely on several of those lists among which one called … CloudFlare. When I installed it I feared that sites supervised by the company would be blocked because of the list and up to now not one issue. Is the list a joke or does it handle underground IPs? I have no idea, but I keep it like a Xmas tree far after the New year ..
The list is at https://www.iblocklist.com/lists?category=organizations
This list holds at this time 14 ranges of IPs, not that much in fact, at least not to the point of blocking what may remain worthy, of which Ghacks of course.
Suggestions on the re-design:
All .ghacks-post divs: Use margin-bottom 55px instead of margin-top 55px, and no need to reset the top margin of the first-child.
Font sizes are defined in explicit pixels. Suggest using that only as a fallback for older browsers (if you need to support them), using a percentage on the :root element, and use rem units as the basic sizing (and sometimes em, depending on page structure).
Possible element changes for better semantics:
div.ghacks-post to article.ghacks-post
div.image to section.image
div.content to section.content
small.meta to aside.meta
Ha! I was actually thinking pebcak when I read “human challenged” on the graph.
I just checked the new theme and the page content is not horizontally centered relative to the header/footer (left space is smaller than right space to display edge). At least that is how it looks on 1920 x 1080, in Firefox x64 52.0.2, on Windows 10 Pro x64.
http://cdn.ghacks.net/wp-content/plugins/social-media-feather/synved-social/image/social/regular/96×96/facebook.png and others are still serverd via http (despite page showing https://cdn.ghacks.net/wp-content/plugins/social-media-feather/synved-social/image/social/regular/96×96/facebook.png also)
I assume you’ll rewrite template in the near future so we won’t see any http elements being served via https, right?
Good luck! Sounds like worthwhile changes… and change is always hard. :-)
gHacks over https runs fine now. I have here a remaining issue with jpg thumbnails which aren’t displayed over https but are with http, i.e windows-creators-update-version.jpg on the home page.
Nice work. Cloudflare supervision, and https, and soon a new theme. Spring is in the air :)
I have to edit my previous post.
I assumed page rendering was fine in https because it was once the cache had been previously filled from ghacks accessed in http. With an empty cache https does not render the page which is totally broken with no image.
I’m using uBlock Origin. Strange thing is that if I toggle cosmetic filtering for ghacks then the page is displayed correctly. I’m investigating because there’s something I really don’t understand in the hiatus between page rendering ok in http but not in https within a same browser/system configuration. It shouldn’t whatever the cause be related to cosmetic filtering when cosmetic filtering handles http but breaks with https … frankly, I’m stunned imaculate, but am no expert.
My last https related comment : cleared cache, opening ghacks with https : front-page (homepage) displays correctly, but not the “thread” (articles) pages. I’ve had to switch to http to read and comment on this very page…
Looks like Martin is tuning so I won’t add any more comments regarding https here.
Tom, yes HTTPS still needs some final testing. Current plan is to move to a new host first, then enable the new theme, and then enable HTTPS. Hopefully all done before the end of April.
I just have a question, why Cloudflare? xD damn it guys. you should better use MaxCDN or StackPath or KeyCDN, those options allow easily and very cheap use of a CDN with HTTPS certificate. Moreover, you can personalized the CDN with a CNAME in the cheapest plans.
And also, is time to go on the HTTPS.
In Chrome when I go to https://www.ghacks.net/2017/04/02/ghacks-cloudflare-new-theme-https-more/ , under “Cloudflare” I can’t see the picture unless I right-click on the icon and open the image in a new tab. The URL works well in Edge and IE11.
If I open the URL in a Chrome Incognito tab, the Cloudflare image shows as it should. May my problem is a Chrome extension.
https://www.ghacks.net/ now looks fine using Chrome Version 58.0.3029.41 beta (64-bit). I was getting annoyed looking at the URL in Edge to see it correctly. Thanks for correcting so quickly.
Broken pages on HTTPS connection, Ghacks is now protected from regular visitors lol
Thx Yuliya,
“Tip: you can test the theme by adding &theme=ghacks to the URL “&theme=ghacks returns 404. It should be ?theme=ghacks.”
What do you mean by broken pages?
Martin, thanks for trying to correct the problem with the thumbnails that looked cut off. I kind of suspected that that was the theme’s design and I didn’t try to warn you about it when testing your new site, but it doesn’t look good. I can’t wait for the new improved version!
When I first saw the “cut-off” images, I thought it looked like a “design choice”, but I didn’t think it looked bad. If I maximized my window, then I could see the entire image. However, the thumbnail is the thumbnail (size) regardless of positioning. I think it would be fine to leave that layout as it was/is, but simply add CSS to slide the full image over the text when the image if hovered; it really is a simple technique using well-established CSS. It also provides a positive feedback for the visitor while maximizing space for text, while increasing bandwidth usage not at all.
The one thing I don’t like about the new theme is the use of so much white. I know that that’s popular these days, but I really do like the yellow of the old theme better. It’s much better on the eyes for me. It would be nice if we had an option of choosing either or the good ol’ yellow. That’s really the only thing, I like the rest of the new design though :)
Please ensure that RSS continues to function with Cloudflare enabled; it has been an issue with other sites that I subscribe to.
I think it works just fine. If you notice issues, let me know please.
It’s been spotty as well lately, just letting you know. Hopefully having Cloudflare will fix this for you as well.
I just noticed something with the new theme, at the top of the article it doesn’t say how many comments there are, or on the homepage for each article either. I use this to see how many comments there are because when i visit the site/homepage i like to see if there is new comments on articles i’m interested in and if there are i click on them to read the new comments and replies.
Actually, i just noticed on the homepage it doesn’t say how many comments each article has in the old or new theme, but i’d like to see how many comments there are on the homepage and when you actually click on the article.
1 for the HTTPS =)
GL Martin
“Tip: you can test the theme by adding &theme=ghacks to the URL”
&theme=ghacks returns 404. It should be ?theme=ghacks
Thanks, corrected ;)
Wait nevermind, I just read your explanation in the article. Whoops, I should’ve looked at that first. Still though, it’s pretty annoying having that warning show up there. I’ve had issues where the site wouldn’t even load properly until I enabled those unauthenticated warnings.
Martin, I’m not sure if you’ve noticed or not, but there’s a “This page is trying to load scripts from unauthenticated sources” error in the address bar in Chrome, at least for me. Can you fix it?
Ugh, I’m sorry for the double post here. I’m new to posting comments here and I thought my comment didn’t send at first, but I didn’t realize it was pending moderation. I should also mention that I was using HTTPS Everywhere which can sometimes break sites… either way, I got it sorted out now. Looking forward to the new site design!
Carl, when you access the http or https site? If you open the regular site using https (not the new theme), then you will face the warning because of the newsletter signup form. This won’t be there in this form in the new theme, so don’t worry.
Oh! Mark!, that’s Oh! not Ok!
We’re all different and often have different tastes, preferences. For instance I love space, dislike squeezed text, all the opposite of your comment :)
Martin, we’re old pals, right? Please listen to the words of wisdom, mine of course! Vielen Dank!
Martin hoping that you guys implement a condensed view so more articles can fit in a small space,
not a fan of material type design with lots of free white spaces.
Like a Dense/List/Ultra compact view.
Please implement that so instead of 3 items on my small laptop 10″ or normal Non HD laptop Can see more than 3 items on homepage(instead of list view which can show all items of past week in one front home page)
I was accessing via https, but I see the problem goes away when I use http.
Why am I getting a “This page is trying to load scripts from unauthenticated sources.” warning that shows up in the address bar in Chrome? I’ve noticed it fairly recently. Please fix if you can.