web widget

{{Short description|Applet intended to be used within web pages}}

{{Multiple issues|

{{how-to|date=April 2016}}

{{More citations needed|date=September 2013}}

}}

A web widget is a web page or web application that is embedded as an element of a host web page but which is substantially independent of the host page, having limited or no interaction with the host.{{cite web |author=Brad at CD Baby |date=August 28, 2012 |title=Website Widgets: What Are They and Why Do I Need Them? |url=http://blog.hostbaby.com/2012/08/website-widgets-what-are-they-and-why-do-i-need-them/ |url-status=unfit |archive-url=https://web.archive.org/web/20190824104407/http://blog.hostbaby.com/2012/08/website-widgets-what-are-they-and-why-do-i-need-them/ |archive-date=August 24, 2019 |work=The HostBaby Blog |quote=Widgets: They’re those little doo-dads you see on websites, often in the sidebar, that perform one simple function and don’t take up much room while they’re doing it.}} A web widget commonly provides users of the host page access to resources from another web site, content that the host page may be prevented from accessing itself by the browser's same-origin policy or the content provider's CORS policy. That content includes advertising (Google's AdSense), sponsored external links (Taboola),{{cite web

|url= https://pubhelp.taboola.com/hc/en-us/articles/360003205033-Widgets

|title= Widgets - Taboola Publisher Help Center

|work= taboola.com

|date= 17 April 2024

}} user comments (Disqus),{{cite web

|url= https://help.disqus.com/developer/web-integration

|title= Web Integration

|work= disqus.com

}} social media buttons (Twitter,{{cite web

|url= https://help.twitter.com/en/using-twitter/add-twitter-share-button

|title= How to add the Tweet button to your website

|work= twitter.com

}} Facebook), news (USA Today),{{cite web

|url=https://usatoday30.usatoday.com/community/widgets/

|title= USATODAY.com Widgets

|work= usatoday.com

}} and weather (AccuWeather).{{cite web

|url=https://www.accuweather.com/en/free-weather-widgets/current

|title= Free Current Weather Widget

|work= accuweather.com

}} Some web widgets though serve as user-selectable customizations of the host page itself (Elfsight, Powr, OpenWidget).

Technology

Widgets may be considered as downloadable applications which look and act like traditional apps but are implemented using web technologies including JavaScript, HTML and CSS. Widgets use and depend on web APIs exposed either by the browser or by a widget engine such as Akamai, Clearspring, KickApps, MassPublisher, NewsGator or many others.

Sites such as FormLoop allow users to easily create widgets from their own content with no coding knowledge necessary.

Usage in social media

End users primarily use widgets to enhance their personal web experiences, or the web experiences of visitors to their personal sites.

The use of widgets has proven increasingly popular, where users of social media are able to add stand-alone applications to blogs, profiles and community pages. Widgets add utility in the same way that an iPhone application does. The developers of these widgets are often offering them as a form of sponsored content, which can pay for the cost of the development when the widgets' utility maps to the user's needs in a way where both parties gain. For example, a sports news brand might gain awareness and increased audience share in exchange for the utility of current game scores being instantly and dynamically available - the blog which posted the Sports score widget might gain in having a stickier site.

Video platforms such as YouTube and Dailymotion support iframe-based video embedding.{{Cite web|title=Embed videos & playlists - YouTube Help|url=https://support.google.com/youtube/answer/171780?hl=en|access-date=2021-04-17|website=support.google.com}}{{Cite web|title=Embedding videos|url=https://faq.dailymotion.com/hc/en-us/articles/115008959787-Embedding-videos|website=Dailymotion Help Center|date=24 December 2024 }}

Security considerations

As any program code, widgets can be used for malicious purposes. One example is the Facebook "Secret Crush" widget, reported in early 2008 by Fortinet as luring users to install Zango adware.{{cite web|url=http://blog.anta.net/2008/01/05/widget-inflicts-malware-facebook-ignores-advisory/ |title=Internetworking, security, safety and more |publisher=Blog.anta.net |access-date=2013-09-07 |archive-url=https://web.archive.org/web/20130605112311/http://blog.anta.net/2008/01/05/widget-inflicts-malware-facebook-ignores-advisory/ |archive-date=5 June 2013}}

One important factor with client-side widgets is that often the host can not control the content. The content or the functionality it provides cannot be modified by the host. The content is pre-published by the publisher/author/service provider and the host can either accept that content or not use the widget. The host does, however, control the placement of the Widget. Because the host can always take the Widget down, it assures a large degree of mutual advantage and satisfaction with performance and content.

SEO considerations

Web widgets can affect page rank in two ways. First, links generated by client-side widgets will not be seen by search engines that do not "run" the widget code before analysing the page. Those links will not contribute to page rank.{{Cite web|title = How Web Widgets Affect SEO|url = http://www.southcoastweb.co.uk/how-web-widgets-affect-seo|website = South Coast Web Design Ltd|access-date = 2016-02-18|first = Yarry|last = Troshchey| date=18 February 2016 }} Second, pages may be penalized for hosting widgets that automatically place links into the page, thereby manipulating page rank.{{cite web

|url= https://webmasters.googleblog.com/2016/09/a-reminder-about-widget-links.html

|title= A reminder about widget links

|date= September 8, 2016

|work= Official Google Webmaster Central Blog

}}

Accessibility considerations

Web widgets are complex UI controls. WAI-ARIA{{cite web|url= https://developer.mozilla.org/en-US/docs/Learn/Accessibility/WAI-ARIA_basics|title= WAI-ARIA Basics|work= MDN Web Docs|date= 12 September 2023}} is a technology that can improve the Usability and Accessibility of such widgets by adding in further semantics that browsers and assistive technologies can recognize and use to facilitate users' interactions. For example, a tabpanel widget must contain a specific set of roles (i.e. tablist, tab, tabpanel, etc.){{cite web|url= https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/Tab_Role|title= ARIA: tab role|work= MDN Web Docs|date= 12 April 2023}} and must follow specific interactions (i.e. keyboard navigation).{{cite web|url= https://www.w3.org/wiki/TabPanel#Keyboard_Interaction|title= Keyboard Interaction|work= W3.org}}

Widget management systems

{{Main|Widget engine}}

Widget management systems offer a method of managing widgets that works on any web page, such as a blog or social networking home page. Many blog systems come with built-in widget management systems as plug-ins. Users can obtain widgets and other widget management tools from various widget companies.

Mobile Web widget

A Mobile Web widget has the same purpose and function as a web widget, but it is made for use on a mobile device such as mobile phone or tablet. In contrast, a web widget is on a personal computer or laptop computer.

Standards

The W3C is creating a set of standards for web widgets.{{cite web|title=Web Application Working Group's Widgets: Family of Specifications |url=http://www.w3.org/2008/webapps/wiki/WidgetSpecs|publisher=W3C|access-date=27 March 2013}}

References

{{Reflist}}

Further reading

  • Rajesh Lal; [http://widgets-gadgets.com/?page_id=2 Developing Web Widget with HTML, CSS, JSON, and AJAX] ({{ISBN|9781450502283}})
  • Soylu, A., Wild, F., Mödritscher, F., Desmet, P., Verlinde, S., De Causmaecker, P. (2011). [https://lirias.kuleuven.be/bitstream/123456789/318478/2/50.pdf Mashups and Widget Orchestration.] The International Conference on Management of Emergent Digital EcoSystems, MEDES 2011. San Francisco, California, USA, 21–24 November 2011. ACM.

Category:Widget engines

Category:Blogs

Category:Internet terminology