519 – Browser battles revisited

clip_image002The “Browser Wars” happened in the late 1990s, and marked a time of intense, er, “competition” between different web browsers. Since then, Google’s Chrome has rather cleaned up and established a seemingly unassailable lead in browser market share.

Still, Edge’s recent release using the Chromium rendering engine – designed to make it comparable with Chrome from a compatibility point of view, yet allowing Microsoft developers to remove Google-services-specific stuff (and replace them, sometimes, with Microsoft-services-specific stuff, many of which will be checked in to the Chromium open-source project.

The Edge browser built on Chromium was released in January, and updates are flowing through to add more functionality – which, exactly, depending on whether you’re running the normal release or you’re on one of several preview or developer (“canary”) versions. Some features are things that were ideally intended to make it to the public release – like synchronizing extensions installed across multiple PCs.

The Edge update won’t be forced out to existing non-Chromium-Edge users (hello, out there!) – or at least there will be a way of stopping it from being pushed out, if you’re an enterprise IT controller who’d rather not have to manage change and things like that.

One of the benefits of Edge being on Chromium is that the extensions which third parties build for the browser should be compatible – and since Google has 2/3rd of the total market, there are more of them than for other browsers.

clip_image004

There’s an Edge “addons” page which shows a curated list of extensions known to work well with the new Edge, but if you want, you can install anything that’s listed on the Google site.

If you enable the ability to install Chrome extensions into Edge, then refresh/browse to the Chrome store again, you’ll be met with scary warnings, however…

clip_image006

Google has started alerting of a security issue – namely, if the extension is somehow added to the Chrome store and subsequently found to be of dubious intent and posing a security risk, then Google can remotely knobble it on installed machines. They are now warning that if you happen to use a Chromium but-not-Chrome browser – like Edge – then they won’t do this. It seems the extension security scare banner isn’t the only one to try to make Edge users install and switch to Chrome.

Tsk, Tsk.

Also, the Edge browsers published for Android and iOS are receiving updates to make them work more seamlessly with desktop Edge. (See more for Android & iOS)

Tip o’ the Week 480 – Installing Apps in New Edge

Whatever you call it – New Edge, Edge Dev, Edgemium, Chromdge etclip_image002[4]c – the new Windows browser called Edge but with its rendering gubbins based on Chromium is making progress with regular updates and has quite a following already.

ToW 476 covered some of the articles that were written when it first came out, but buried within was a slew of interesting features that merit their own mention.

clip_image004[4]Such a capability is being able to install a web page as an App, making it look a lot like a normal Windows app to some degree. In older Edge browser, this was known as pinning a site.

In New Edge, just go to the … menu (top right) on any web page, and under Apps, you can Manage apps and install pages.

clip_image006[4]If the current site is a regular web page, you’ll see “Install this site…” but if the page is itself a Progressive Web App (PWA), like the Starbucks example above, then it will likely declare its name. There are lots of PWAs out there already – see here as an example – some are managed through the Windows Store, but since Google allowed Chrome / Chromium to install PWAs, many are published online and available directly.

Users don’t even need to know what a PWA is, for the most part – if a site looks and feels like an app, then that’s what it is. Some publishers report dramatic improvements in using PWA when compared to more traditional iOS/Android or UWP apps – Tinder, for example, found the PWA was 90% smaller than the regular app.

It seems that when Tindering, size really does matter.

Tip o’ the Week 470 – Chrome Activities on Time

clip_image002As many of now know, the Edge browser in Windows 10 is going to change.

In short, the browser application will be rewired to use the open-source Chromium rendering engine, meaning that Edge will be every bit as compatible as Chrome is in displaying web pages and apps. It doesn’t mean that Edge will look and feel the same as Chrome, though – if the latter is a skin on the Chromium engine that provides a load of additional functionality, so Edge will be a different skin but will look and act much the same as it does today.

For now, at least, there are a lot of Chrome users on Windows 10 and various teams at Microsoft have gone to some lengths to build Chrome extensions to support other services or software, maybe in the same way they work on Edge or even beyond. See here for a list of Chrome extensions published by Microsoft.

clip_image004One such extension was published recently, which allows the activity that a user is doing in Chrome, to be published to the Windows Timeline feature.
Install the Activities extension here.
(assuming you’re using Chrome… Edge users who just clicked on that link, go and have a word with yourselves).

clip_image006After installation, then any browsing you do in Chrome while will show up in Timeline – press WindowsKey + TAB or click the Timeline button that is generally found next to the Start button on your taskbar, and use the slider at the side to jump to a particular date, or click the search bar on the top right (keyboardistas, just press CTRL-F) and search for a keyword within the content you were browsing earlier.

It’s a fantastic way of searching not just browser history, but other activities – like Office docs or many Windows apps.

clip_image008Look under the icon for the Activities extension, and you can choose which browser you’d like to use to open the tile from the Timeline – in the example above, a Google search within Chrome took us to a content page, and clicking or tapping that tile will re-open the website.

So, if you’re currently using Chrome under sufferance but would like to keep most of your browsing in Edge, having browsed in Chrome and gone back to the Timeline, it will give you the option of using your default – Edge – or using the other one, er, Edge…

Tip o’ the Week 458 – Grabbing pictures from websites

clip_image001There are plenty of reasons why you might want to get the URL of a picture that is embedded on a web page, and some of them don’t even risk breaching the copyright of the image’s owner or page author!

Legitimate examples might include things like downloading a company logo from its website so you can include it in a PowerPoint slide; try going to just about any major company site and you’ll probably find it’s not straightforward to save the image file. Ditto all sorts of clever pages that might stop you simply saving the picture to your PC.

clip_image003clip_image005Normal behaviour is, mostly, to just right-click on an image and in Edge, you’ll be able to save the picture (or use Cortana to try to give you more details on the image, even trying to guess what’s in the image depending on how straightforward it is – it’s surprisingly good). Ditto, if you’re using Chrome, except you can search Google instead. Try the same on a company logo, and you may find you won’t get the option to save or search.

If you want to grab the actual URL for an image on a web page, the clip_image006foolproof way of getting it is to look at the source – if you don’t mind fishing through maybe a few thousand lines of HTML. It’s not too bad if the image is at the top of the page, but it could prove tedious if elsewhere. In Edge, an easier solution would be to right-click on the image and choose, Inspect element. You may need to press F12 to get these options in your right-click menu. Chrome has a similar thing, simply called Inspect, and can be invoked by CTRL-SHIFT-I.

The Inspect Element funciton in browsers is designed to help web page debugging; it’ll let a user or designer jump straight to the section of a web page’s source, and inspect or even modify the code behind the page.

clip_image008As an example, right-click on the logo on www.microsoft.com and Inspect Element. You’ll see the highlighted section is the bit where the logo sits on the page, and immediately next in the hierarchical representation of the page code, you’ll see the <img> tag, denoting that this pertains to the image itself.

Look for the src= part, double-click on it and you’ll see the URL of the image in an editable text box, meaning you can easily copy that to the clipboard and get ready to paste it wherever you need it clip_image010to go. Try pasting it into a new browser tab just to check that all you’re getting is the logo.

clip_image011

Using a search engine

Of course, there may be easier ways to get an image – using Bing or Google search, for example.

Bing is actually quite a bit better in this regard. When you click on an image in the results from Bing’s Image search, you’ll see a larger preview of the picture along with a few actions you can take – like jump to the originating page; search for other sizes of the same image; use Visual Search to run a query on just some selectable portion of the image; or simply just view it in the browser, thereby opening just that image and showing you the direct URL to it.

In the case of both Google and Bing, if you click on “Share”, then you’ll get a link to the search result of that image rather than the picture itself – so if your plan is to embed the image in another web page or upload it to some other place, then you’ll be frustrated.

clip_image012Another legitimate use of the original URL for a logo might be to change the icon in Teams – assuming you have permissions to Manage a team site (click the ellipsis to the right of the clip_image013name and if you’re suitably perm-ed up, when you click on the Manage Team option, you’ll see a little pencil icon on the logo if you hover over it. Click that to change the picture).

Simply choose Upload picture, paste in the URL of the logo you want to use and you’re off to the races.

Figuratively speaking, anyway. You might have to jigger about with the proportions of the image by downloading it first and editing it elsewhere, as the image will need to be more-or-less square. Built-in icons in Teams appear to be 240×240 pixels in size so you could try to target that if you’re resizing.

Tip o’ the Week 455 – Pin your PMAs

clip_image002Progressive Web Apps were covered some months ago in ToW 426, and are seen by many as the next generation of mobile apps. They provide a handy way of meeting the needs of a website suitable for mobile browsers as well as a way of delivering an app-like experience to multiple devices of varying sizes, without needing the developers to target specific platforms individually.

Microsoft published a bunch of 3rd party PWA apps directly into the Microsoft Store (eg start with SkyScanner then click on “Microsoft Store” when opened with the Store app itself rather than the web UI), though there haven’t been any new ones for a while.

Google is also throwing its weight behind PWAs – so much so, that version 70 of the Chrome browser has support for PWAs that can be installed to look like a desktop app on Windows, so when the PWA is running it hides the browser UI and is launched from either within Chrome directly, or from the traditional Windows app UI.

clip_image004clip_image005

clip_image007When installed, eg https://app.ft.com, via the Chrome browser, the PWA behaves a lot like a desktop app – it can be found by typing its name on the Start menu, and can be quickly pinned to the Start menu or taskbar.

clip_image009That said, Edge browser users can treat pretty much any website in that way – if you browse to a PWA or simple page you like, as well as adding it to favourites/toolbars etc, you can pin it to your taskbar or start menu by going to the settings menu in the top right. Otherwise, when opening PWAs in Edge they look and behave the same as in other ways, though the Edge toolbar remains.

To look for dedicated PWA resources, check out this list, or look here, here or here.