10 useful Chrome extensions for Web Publisher

Professionally, privately, for charity or “just for fun”: nowadays, online publishing is par for the course. Browser extensions can serve as practical aids and render work processes more efficient. In this blog entry, our Web & Digital Media team showcases a selection of its favourites.

What is a browser extension?

An extension adds a new function to a browser so it can perform additional tasks. An extension therefore enables the browser to be tailored more specifically to your own needs.

Unlike browser apps, extensions only have a small – or even no – user interface component of their own. This means either integrating them with a service already used (e.g. OneNote Clipper), adding new features to the browser or changing individual elements directly on a website (e.g. like Currency Converter for prices on a website). Apart from a handful of exceptions, this is how extensions work on websites and web app.[¹]

Chrome, Firefox and Internet Explorer

  • Chrome has consistently been the most popular browser worldwide since 2012 (see Statista)[²],due in no small part to the wide range of extensions and apps available for it. Consequently, this blog entry is geared towards Chrome.
  • Firefox is also famous and popular for its variety and number of available extensions, which boast a range of functions that wouldn’t be possible with other browsers. A subsequent blog entry will focus on Firefox extensions.
  • The range of add-ons is comparatively small for Internet Explorer.[³]

Ten Chrome extensions

Window Resizer

What does your homepage look like on different terminal devices? Window Resizer enables you to quickly determine how a responsive website behaves. It alters the size of the browser window in one click and simulates different screen sizes. Although the same function exists in Google Developer Tools, this extension saves you a few clicks.

20160223_Innovation@ETH-Bibliothek_Window-Resizer_EN

Figure 1: Adjusting the size of the browser window with Window Resizer

Font Playground

This extensions enables live websites to be displayed in different fonts. In each case, locally saved and Google fonts can be used.

20160223_Innovation@ETH-Bibliothek_Font-Playground-EN

Figure 2: ETH Zurich’s homepage with the Monotype Corsiva font

What Font

You like a website and want to know which font was used? The extension What Font is just what the doctor ordered! It is activated by clicking once on the icon next to the Omnibox. If you move the mouse over the text elements, the font used is faded in via Tooltip.

20160223_Innovation@ETH-Bibliothek_What Font_EN

Figure 3: Using What Font to determine the font on Innovation@ETH-Bibliothek

ColorPick Eyedropper

This tool enables website colour values to be extracted. The colour can be selected with pixel precision, which also makes the extension ideal for photographs. The range of functions is clear and simple.

2016-02-23_color-picker

Figure 4: Using ColorPick Eyedropper to determine the colours on the Thomas Mann Archive Online’s homepage

ColorZilla

The colour values of websites and images can also be determined with ColorZilla. Moreover, the colours of all the CSS elements on a website can be established using the Webpage Color Analyzer. An additional gradient generator also makes the extension a tool for advanced usage.

20160223_Innovation@ETH-Bibliothek_ColorZilla_EN

Figure 5: ColorZilla tested on E-Pics

Check my links

So many links on a website and no time to test whether each one works? Then “Check my links” is just the ticket! The extension shows the number of links on a page and breaks them down into those that work and those that don’t by highlighting them on the page in green or red.

20160223_Innovation@ETH-Bibliothek_CHeck-my-Links_EN

Figure 6: Link check on a Knowledge Portal page

Project Naptha

This practical extension enables OCR text recognition for images. The text in question can be highlighted, copied and even edited or translated. Although the application possibilities are manifold, the tool is not particularly intuitive to operate at first so it might be helpful to have a look at one of the tutorials that users have uploaded onto YouTube (e.g. by N. Boyd).

Project Naptha

Figure 7: Website screenshot Project Naptha

aXe

The extension aXe is a helpful tool for testing the accessibility of websites. Once installed, it is not displayed as an icon next to the Omnibox, but rather extends the selectable tabs of the Google DevTools integrated in Chrome. Right-click on the website displayed and open the panel via “Test”. Then select the tab “aXe” and start the analysis. Any elements that are problematic for accessibility are then listed. Additional, more detailed information on the brief descriptions contained in the list can be retrieved.

20160223_Innovation@ETH-Bibliothek_aXe_EN

Figure 8: aXe before starting the analysis for e-manuscripta

Page Load Time

This extension enables a website’s loading times to be gauged and displayed directly in the toolbar – very practical to get an idea of where you stand in terms of web performance.

20160223_Innovation@ETH-Bibliothek_Page-Load_Time_EN

Figure 9: Load Time measurement based on the example of the Knowledge Portal

SEOStack Keyword Tool

This tool might be helpful for anyone involved in search engine optimisation (SEO). SEOStack shows which search requests are conducted based on “seed keywords“. This enables you to develop a better understanding of which search requests the users make most frequently in connection with your own service. Here, the tool relates to searches on Google and YouTube.

SEOStack,

Figure 10: Screenshot of SEOStack, longtail keywords for seed “ETH-Bibliothek”

[1] https://developer.chrome.com/webstore/apps_vs_extensions
[2] http://de.statista.com/statistik/daten/studie/157944/umfrage/marktanteile-der-browser-bei-der-internetnutzung-weltweit-seit-2009/
[3] http://www.howtogeek.com/169080/beginner-geek-everything-you-need-to-know-about-browser-extensions/


This work is licensed under a Creative Commons Attribution-ShareAlike 4.0 International Public License.
CC-BY-SA

DOI Link: 10.16911/ethz-ib-2227-en

Comments
  1. nike shoes for men
  2. longchamp handbags
  3. supreme
  4. christian louboutin outlet
  5. christian louboutin outlet
  6. jordan shoes
  7. supreme
  8. supreme clothing
  9. goyard bags
  10. jordan shoes
  11. curry 5
  12. retro jordans
  13. steph curry shoes
  14. giannis shoes
  15. a bathing ape
  16. golden goose
  17. chrome hearts store
  18. kevin durant shoes
  19. jordan 11
  20. birkin bag
  21. RoyalCBD
  22. off white
  23. Tattoo Artists
  24. 부커취
  25. this information
  26. to read more
  27. Best Product Reviews
  28. best hosting companies
  29. C_THR81_2005 practice test
  30. lebron 16 shoes
  31. check out
  32. cao su giam chan
  33. zajm bez procentov
  34. golden goose
  35. 관전클럽
  36. chandelier for living room
  37. 온라인카지노
  38. Instagram for my business
  39. profile
  40. goyard tote
  41. upholstery cleaning welwyn
  42. view
  43. go to see
  44. you can check
  45. for more info
  46. click here
  47. 토토사이트
  48. map
  49. just go to
  50. Tattoo Artists
  51. yeezy boost
  52. info here
  53. check this link
  54. supreme new york
  55. for details
  56. instapot sales
  57. is iptv legal
  58. RV Center
  59. moncler
  60. IELTS Test centre in Karachi
  61. venue finder
  62. hoa chat thi nghiem
  63. tarot del amor
  64. Better sex coach
  65. yeezy boost
  66. this website
  67. Big win online casino videos
  68. wsop free chips
  69. instagram prodvizheniye
  70. on thi giay phep lai xe
  71. https://ugearsmodels.us/
  72. off white
  73. prodvizheniye v instagram
  74. supreme shirt
  75. kd shoes
  76. yeezy
  77. longchamp
  78. Live Murder
  79. los angeles townhouse
  80. more info here
  81. kipas blower
  82. yeezy 700
  83. off white shoes
  84. stone island
  85. supreme clothing
  86. game developers ukraine
  87. kevin david from twitter
  88. for more details
  89. just go to
  90. 200-901 Exam
  91. golden goose sale
  92. longchamp
  93. yeezy shoes
  94. hermes birkin
  95. yeezy 350
  96. kyrie 6 shoes
  97. longchamp handbags
  98. laptop cu binh duong
  99. dominoqq online
  100. adidas yeezy
  101. remont noutbukov Almaty
  102. sex maza
  103. to learn more
  104. thuoc tieu chay
  105. Red Search
  106. balenciaga shoes
  107. golden goose outlet
  108. off white shoes
  109. moncler
  110. yeezy outlet
  111. michael jordan shoes
  112. yeezy boost
  113. golden goose
  114. cheap jordans
  115. longchamp
  116. yeezys
  117. nike shox
  118. yeezy boost 350
  119. South Skip Bins
  120. cua nhom cao cap
  121. builders in Halifax
  122. vegas11 agent
  123. hybrid stiiizy
  124. boost immune system
  125. may lam cua nhom
  126. to read more
  127. goede onderwater fotocamera
  128. Tattoo Artists
  129. Tattoo
  130. golden goose
  131. supreme clothing
  132. yeezy shoes
  133. jordan shoes
  134. lebron shoes
  135. url

Leave a Reply

Your email address will not be published.