Generate meta refresh html pages
Introduction to meta refresh redirection
Meta refresh html tags are a way to redirect the user from the current url to an other. There are two other ways to achieve redirection. One being HTTP redirection and the other JavaScript redirection. HTTP redirection is when the web server or the back end application sends HTTP status codes(301, 307 etc) as response to the request from the browser. Javascript redirect is when javascript "window.location" property is used for redirection.
This website can be used to generate web pages with meta refresh html tags along with javascript redirect code for redirecting users to a different web page. Javascript redirect is added to have the redirection happening quickly. If it is just meta refresh redirect then the html page with the meta refresh code becomes visible on the screen for a short while. Javascript redirect doesn't have that problem. Please keep in mind that using javascript redirect may cause issues for search engines while crawling or indexing web pages. If that's a concern please remove the javascript redirect since google says "Only use JavaScript redirects if you can't do server-side or meta refresh redirects." on this google search central.com webpage. Javascript redirect is added in the generated file with the assumption that the user wants the redirect to work and is not concerned by the possible search engine optimization impacts. To remove javascript redirect please delete the following from the generated html "<script>window.location.replace('...url supplied');</script>".
Note: To learn more about how redirection works please refer to this webpage on MDN web docs.
How meta refresh tags can be used as link shorteners?
Meta refresh tags as well as JavaScript redirect on an html page tells the browser to automatically redirect the user to an other page. This mechanism can be used to create redirection from an html page with a shorter url to one with a longer url. For example if there is a long url "https://www.example.com/blog/how-to-use-meta-refresh-html-tags.html" then an other html page with redirect code in it which has a shorter name can be created, for example https://www.example.com/shortname.html. This "shortname.html" file which has a shorter url can act as a link shortener because this shorter link can be used in place of the longer url and both point to the same webpage.
An example of redirection from an html page with meta refresh tag
This link: https://generate-meta-refresh-html-pages.pages.dev/a.html
Redirects to: https://generate-meta-refresh-html-pages.pages.dev/norobots/examplepage
Steps taken to generate shorter url using this tool
- Entered the url "https://generate-meta-refresh-html-pages.pages.dev/norobots/examplepage" in the input field above
- Clicked the button "Download generated html file"
- A file with name "generate-meta-refresh-html-pages_pages_dev_norobots_examplepage.html" got downloaded
- Renamed the file to "a.html" to reduce the length of filename. Otherwise the original filename has to be used in the url which makes url longer. Please note that the file has JavaScript redirect added to it. If you are concerned about search engine optimization impacts, please double check if JavaScript redirect is appropriate for your situation
- Put the file "a.html" in the public folder of the front end application
- Now navigating to "https://generate-meta-refresh-html-pages.pages.dev/a.html" redirects the user to "https://generate-meta-refresh-html-pages.pages.dev/norobots/examplepage"