DEV Community

Dennis
Dennis

Posted on

URL Tracker DevLog #4: The first alpha version of the new URL Tracker is out! πŸŽ‰

So it finally happened. The first alpha version of the new URL Tracker is now available for Umbraco 10 and Umbraco 13. The process has been long and there have been struggles. Nevertheless, the end result is something to be proud of. In this post, I'll go through the update and share some thoughts, compromises and discoveries.

Let's take a tour

Landingpage

When you open the backoffice, you'll first notice the whole new landingpage of the URL Tracker:

Screenshot of the landing page of the URL Tracker

I made it very clear that I wanted the URL Tracker to scream less "Infocaster" and more "Umbraco", but I still wanted some aspect of my company to show in the plugin. I removed Infocaster's brand colors from the design and instead added the logo to the footer and added a subtle Infocaster pattern to the background to achieve this.

You'll also notice that the "most recently created redirects" have disappeared and that the statistic, although still present, feels less threatening.

Recommendations

The term "Not Found" has disappeared from the overview. Instead, the URL Tracker introduces a new concept of "Recommendations" or "Issues". This change allows the URL Tracker to also show other types of recommendations in the future.

Recommendations also better conveys the plugin's intention: recommending actions you can take to improve your website. To that end, the presentation of issues has changed. It no longer shows a boring (and arguably unfriendly) table and instead presents issues as clearly separated cards:

A screenshot of the new recommendation cards

These cards present the problem in an easily digestible way by answering the most important questions:

  • What is the issue?
  • Where is the issue?
  • How important is it?
  • What can I do about it?

If you don't know which recommendation to choose, you may click on the question symbol to get more information about each recommendation and examples.

Statistics and context

If you want to further investigate the impact of a particular issue, you may click on it to open the analysis view:

A screenshot of the analysis view of one recommendation

The analysis view may help you understand the root cause behind an issue. It tells you what the issue means, it shows how often the issue has occurred for the past 20 days and it shows you source pages from where the issue is triggered. This may be helpful to track down missing images for example or broken links.

Friendly redirect management

One of several bigger issues was the redirect editing experience. In the old URL Tracker, all options were just presented to you without any guidance. Some options were mutually exclusive and you had to backtrack several times to make sure you filled in all correct fields. The new URL Tracker addresses that with a linear interface:

A screenshot of the new Redirect management experience

Instead of giving you all options at once, the new URL Tracker simply asks you first how you want to match incoming URLs and how to find the redirect URL. It only shows the inputs that are relevant to your choice. This means less noise and less confusion, nice!

These compromises were made

I wanted to finish this redesign and I found that I couldn't do it by myself. Although I don't shy away from a little bit of typescript and css, it is still not my passion and not my area of expertise. I got my coworkers involved to help me out. Together we made some compromises so we could finish the product in time.

Extendability

Initially I made a plan for extendability. I wanted to make these features extendable:

  • Tabs on the dashboard
  • Recommendations for each recommendation type
  • Incoming URL conditions
  • Outgoing URL conditions
  • Analysis chapters

For the sake of finishing this project, these extension points have been dropped and instead, these features are now fixed into the interface.

Translations

I really want the URL Tracker to be 100% translatable. It would make the URL Tracker appealing for a much broader audience. Although most parts of the UI have made it into translations, the URL Tracker is not completely translatable yet.

Loading states and destructive actions

Some shortcuts have been taken on the UI in order to finish the release. That means that not all actions give you immediate feedback when you perform them. That being said: most actions are quick enough that you don't really need them. They will be added at some point though.

Destructive actions, such as delete and bulk updates, should have confirmation messages to make sure that you don't make unintended changes. At the moment, the URL Tracker doesn't provide confirmation dialogues.

Import and export

There were plans to make a new import and export file format and make a more diverse and friendly import and export experience that would allow you to import redirects in different formats or maybe even import redirects from Skybrud redirects. These plans have been dropped and we're sticking to the old format for now.

Roadmap

We're not done yet with the URL Tracker. The URL Tracker will be ported to the new backoffice ofcourse and we'll still address the topics that we compromised on. On top of that, we still have several plans for improvement:

Scoring and classification

The URL Tracker relies on a new scoring algorithm to calculate how important the recommendations are. This system likely still needs adjustments, but we need to test the algorithm on realistic data to see how well it works and adjust it accordingly. We would love your input on this, so if you have any suggestions to improve, please let us know by reacting on github to the release discussion.

More context, better statistics

The statistic on the landingpage will get more context. A histogram of the issues for the past month will give you more context on how your site is doing. Are you having more or less issues than last week? This quick diagram will show you.

Redirect to media

At the moment, you can only redirect to a static URL or to content. In the future, you'll also be able to redirect to media.

More guidance when editing redirects

We want to see first how well the new redirect editing experience works, but we may still make adjustments to this. Some thoughts that we have include:

  • autocomplete for domains on the source condition
  • regex support on the source condition
  • capture group support on the target condition
  • test your redirect

...your feedback?

Do you have thoughts about the URL Tracker? Are there things that you miss right now that you would like to see? Have you discovered a bug or is something not working how you expect? I really want to know your feedback so I can focus on the changes that make the most impact for the users of this awesome plugin. You may report a bug or suggest a feature

Final words

I am very proud that I've been able to build this awesome product. It's incredibly satisfying to start with a vision and being able to make that vision reality. Although not everything has turned out exactly how I visioned it, I'm very happy with the end result.

That concludes this blog post! Please leave a comment if you have any thoughts. Thank you for reading and I'll see you in my next blog!! 😊

Top comments (0)