HTML5 Cheatsheet 2019

Total Page:16

File Type:pdf, Size:1020Kb

HTML5 Cheatsheet 2019 CHEAT SHEET HTML5 WEB DEVELOPMENT Created by @Manz ( https://twitter.com/Manz ) https://lenguajehtml.com/ S HTML Syntax Tag structure C Comment Syntax Dev annotations S Social metadata For social networks HTML TAG/ATTRIBUTE SYNTAX HTML COMMENT SYNTAX FACEBOOK OPEN GRAPH <tag attribute="value"> content </tag> <!-- text without effects on webpage --> <meta> metadata tag for open graph property metadata type open graph D Document tags HTML main structure H Head tags Header & document metadata content metadata value open graph MAIN TAGS RELATIONS REQUIRED METADATA PROPERTIES <!DOCTYPE html> HTML5 document <link> document relation og:title title of your object <html> document content root tag href link to related document og:type type of your object <head> metadata header related docs hreflang code doc language en, es... music video article book <body> page content visible content type mime hint type for browser profile website title set title to stylesheet set og:image image url for preview G Global Attributes for all elements sizes hint size for favicon 64x64, 96x96 og:url canonical & absolute url DOM / STYLE ATTRIBUTES rel relation type with other document OPTIONAL METADATA PROPERTIES id element identifier unique per page BASIC RELATION og:audio complementary audio url class element class multiple per page alternate link to alternate version og:description 1-2 sentence descr. slot element slot reference to <slot> author link to author URL og:determiner word auto, the, a, an, ... style inline CSS styles css properties help link to help URL og:locale language default: en_US GLOBAL ATTRIBUTES icon link to favicon URL (tab icon) og:locale:alternative others lang array accesskey shortcut key to focus license fetch module map og:site_name general site name contenteditable allow edit element pingback link to pingback server og:video complementary video url search link to search page url dir ltr rtl auto text direction TWITTER CARDS draggable auto stylesheet imports a css style sheet enable drag and drop <meta> metadata tag for twitter cards URL STRUCTURE RELATION hidden hide element not relevant name metadata type twitter cards is custom-elem custom built-in elem canonical link to preferred URL content metadata value twitter cards lang code set content lang en, es, fr... prev prev part URL of series doc BASIC METADATA PROPERTIES nonce hash whitelist script/style [CSP] next next part URL of series doc twitter:title title of your object spellcheck disable grammar check RESOURCE HINTS twitter:card type of your object tabindex num set element order dns-prefetch resolve dns domain summary summary_large_image title set tooltip text mouse hover preconnect pre connect to domain app player translate yes no disable translation prefetch fetch/cache link for future OPTIONAL METADATA PROPERTIES data-* custom metadata on element preload fetch/cache link for now twitter:site account site name HINT TO BROWSER modulepreload fetch module map twitter:creator account name @manz enterkeyhint enter done go search prerender background render page twitter:description description next previous send virtual keyb label as script font image audio video fetch twitter:image absolute image url inputmode none text tel url email document embed object style track APP METADATA PROPERTIES numeric decimal search worker twitter:app:country country code MICRODATA ATTRIBUTES DOCUMENT METADATA twitter:app:name: **** name of app itemid set global urn unique identifier <meta> document metadata twitter:app:id: **** identifier of app itemscope new metadata item charset enc encoding utf-8, iso-8859-1... twitter:app:url: **** url of app store itemtype set microdata genre url name name of metadata iphone ipad googleplay id for **** itemref id list set reference to "id" application-name short webapp name PLAYER METADATA PROPERTIES itemprop token set property & value author name of the page's author twitter:player https url to iframe player description seo page description S Inline Styling CSS inline GOOGLE SEO RECOMMENDATIONS generator software used to build web INLINE STYLES <title> first - second | brand 50-60 chars keywords comma-separated tags <style> embed css style in a document <meta> metadata google-supported referrer default page referrer policy title set title to stylesheet set name metadata name theme-color primary theme css color type mime hint type for browser description text snippet 50-160 chars viewport hint to initial size viewport ONLY FOR <LINK>, PICTURE <SOURCE> & <STYLE> robots googlebot set bots behaviour http-equiv pragma directive (legacy) all noindex nofollow none media apply to specific devices content-type legacy alt. to charset noarchive nosnippet noodp all all devices computers, mobiles... default-style default stylesheet set notranslate noimageindex print printables devices refresh html redirect 10; URL=file.html unavailable_after: date screen all devices - (print + speech) x-ua-compatible better compat IE=edge google speech devices that read a page disable google features content-security-policy enforce csp notranslate nositelinkssearchbox content metadata value CHEATSHEET LEGEND rating adult exclude secure search <title> html tag html tag w/o close tag obsolete seo document title viewport optimized-mobile page <base> attribute attribute w/o value set a document base url content="width=device-width, initial-scale=1.0" href value default value values set link to base url to use target context place to open link value for content value part CHEAT SHEET HTML5 WEB DEVELOPMENT Created by @Manz ( https://twitter.com/Manz ) https://lenguajehtml.com/ F Forms Forms related tags S Select data tags Interactive combo I Interactive tags Other elements MAIN ELEMENTS SELECT ELEMENTS OTHER FORM ELEMENTS <form> form elements collection <select> form elements collection <output> result of calculation name form name document.forms api name form name document.forms api name element name forms.elements api method GET POST dialog send method form associate input with a form form associate input with a form action url to backend form submission size size of element in characters for associate result to other element accept-charset enc force encoding utf-8 autocomplete on off autofill for input <progress> show a bar progress autocomplete on off autofill for all form autofocus focus input when loaded value current value of bar progress novalidate bypass form validation disabled avoid press button max max value of bar progress target context place to put response required required field default: optional <meter> show a known range meter enctype application/x-www-form-urlencoded multiple allow select multiple values value current value of meter multipart/form-data text/plain encoding type <datalist> predefined and open data list low limit of low range <label> associate element with caption SELECT CHILDREN ELEMENTS high limit of high range for reference to id of related element <option> item from <select> or <datalist> min lower bound of range GROUP FORMS label user-visible text instead content max upper bound of range <fieldset> group of form elements value item value for form submit optimum optimum value in gauge name element name forms.elements api selected options selected by default OTHER INTERACTIVE ELEMENTS form associate fieldset with a form disabled avoid select this item option <details> disclosure widget html accordion disabled avoid select this group items <optgroup> group of <option> open keep accordion opened <legend> caption text for fieldset label user-visible group text <summary> caption or title for <details> disabled avoid select this items <dialog> window box container dialog box I Input elements User input types open keep dialog opened USER INPUT DATA B Generic Button HTML Button <input> <textarea> specific & large text HTML GENERIC <BUTTON> V Validations HTML validations name element name form.elements api <button> generic button container USER INPUT DATA autocomplete on off autofill for input TEXT VALIDATIONS <INPUT> & <TEXTAREA> name element name form.elements api autofocus focus input when loaded minlength maxlength min/max length type submit reset button button type dirname submit element directionality GENERAL VALIDATIONS <INPUT> & <TEXTAREA> value button value for form submission form associate input with a form form associate input with a form required required field default: optional placeholder user visual hint autofocus focus button when loaded disabled avoid edit field not send ONLY <INPUT> ELEMENT disabled avoid press button readonly avoid edit field send <input> specific text input short text NUMBER VALIDATIONS ONLY <INPUT> type text hidden search tel url email D Deprecated tags Obsolete elements min max min/max value number number range color file password DEPRECATED TAG RECOMMENDED TAG step granularity step between values datetime-local date time week month <applet> java widgets <embed> <object> POWERFUL VALIDATIONS ONLY <INPUT> checkbox radio submit image reset button <acronym> abbreviation <abbr> pattern REGEXP pattern for test validation value current value of input element <basefont> main font use CSS instead size size of element in characters <big> bigger text use CSS font-size A ARIA Attributes Accesible elements list associate with id of <datalist> <bgsound> background sound <audio> ACCESIBLE RICH INTERNET APPLICATIONS accept hint for expected file in upload <blink> flicker text use CSS animation role specify accessible role for element checked enable in radio or checkbox <center> center text use CSS text-align complementary list listitem main navigation
Recommended publications
  • Move Beyond Passwords Index
    Move Beyond Passwords Index The quest to move beyond passwords 4 Evaluation of current authentication method 6 Getting started with passwordless authentication 8 Early results to going passwordless 9 Common approaches to going passwordless 11 Email magic links 11 Factor sequencing 12 Webauthn 14 Planning for a passwordless future 16 Move Beyond Passwords 2 Introduction Traditional authentication using a username and password has been the foundation of digital identity and security for over 50 years. But with the ever-growing number of user accounts, there are a number of new issues: the burden on end users to remember multiple passwords, support costs, and most importantly, the security risks posed by compromised credentials. These new challenges are now outweighing the usefulness of passwords. The case for eliminating passwords from the authentication experience is getting more compelling every day. Emerging passwordless security standards, elevated consumer and consumer-like experience expectations, and ballooning costs have moved eliminating passwords from a theoretical concept to a real possibility. In this whitepaper, we will explore the case for going passwordless for both customer and employee authentication, and map out steps that organizations can take on their journey to true passwordless authentication. Move Beyond Passwords 3 The quest to move beyond passwords Understanding the need for passwordless authentication starts with understanding the challenges presented by passwords. The core challenges with passwords can be broken down into the following areas: Poor Account Security Passwords have spawned a whole category of security/identity-driven attacks — compromised passwords due to credential breaches, phishing, password spraying attacks, or poor password hygiene can result in account takeover attacks (ATO).
    [Show full text]
  • John Athayde and Bruce Williams — «The Rails View
    What readers are saying about The Rails View This is a must-read for Rails developers looking to juice up their skills for a world of web apps that increasingly includes mobile browsers and a lot more JavaScript. ➤ Yehuda Katz Driving force behind Rails 3.0 and Co-founder, Tilde In the past several years, I’ve been privileged to work with some of the world’s leading Rails developers. If asked to name the best view-layer Rails developer I’ve met, I’d have a hard time picking between two names: Bruce Williams and John Athayde. This book is a rare opportunity to look into the minds of two of the leading experts on an area that receives far too little attention. Read, apply, and reread. ➤ Chad Fowler VP Engineering, LivingSocial Finally! An authoritative and up-to-date guide to everything view-related in Rails 3. If you’re stabbing in the dark when putting together your Rails apps’ views, The Rails View provides a big confidence boost and shows how to get things done the right way. ➤ Peter Cooper Editor, Ruby Inside and Ruby Weekly The Rails view layer has always been a morass, but this book reins it in with details of how to build views as software, not just as markup. This book represents the wisdom gained from years’ worth of building maintainable interfaces by two of the best and brightest minds in our business. I have been writing Ruby code for over a decade and Rails code since its inception, and out of all the Ruby books I’ve read, I value this one the most.
    [Show full text]
  • Cybersecurity in a Digital Era.Pdf
    Digital McKinsey and Global Risk Practice Cybersecurity in a Digital Era June 2020 Introduction Even before the advent of a global pandemic, executive teams faced a challenging and dynamic environ- ment as they sought to protect their institutions from cyberattack, without degrading their ability to innovate and extract value from technology investments. CISOs and their partners in business and IT functions have had to think through how to protect increasingly valuable digital assets, how to assess threats related to an increasingly fraught geopolitical environment, how to meet increasingly stringent customer and regulatory expectations and how to navigate disruptions to existing cybersecurity models as companies adopt agile development and cloud computing. We believe there are five areas for CIOs, CISOs, CROs and other business leaders to address in particular: 1. Get a strategy in place that will activate the organization. Even more than in the past cybersecurity is a business issue – and cybersecurity effectiveness means action not only from the CISO organiza- tion, but also from application development, infrastructure, product development, customer care, finance, human resources, procurement and risk. A successful cybersecurity strategy supports the business, highlights the actions required from across the enterprise – and perhaps most importantly captures the imagination of the executive in how it can manage risk and also enable business innovation. 2. Create granular, analytic risk management capabilities. There will always be more vulnerabilities to address and more protections you can consider than you will have capacity to implement. Even companies with large and increasing cybersecurity budgets face constraints in how much change the organization can absorb.
    [Show full text]
  • Implementing a Web Application for W3C Webauthn Protocol Testing †
    proceedings Proceedings Implementing a Web Application for W3C WebAuthn Protocol Testing † Martiño Rivera Dourado 1,* , Marcos Gestal 1,2 and José M. Vázquez-Naya 1,2 1 Grupo RNASA-IMEDIR, Departamento de Computación, Facultade de Informática, Universidade da Coruña, Elviña, 15071 A Coruña, Spain; [email protected] (M.G.); [email protected] (J.M.V.-N.) 2 Centro de Investigación CITIC, Universidade da Coruña, Elviña, 15071 A Coruña, Spain * Correspondence: [email protected] † Presented at the 3rd XoveTIC Conference, A Coruña, Spain, 8–9 October 2020. Published: 18 August 2020 Abstract: During the last few years, the FIDO Alliance and the W3C have been working on a new standard called WebAuthn that aims to substitute the obsolete password as an authentication method by using physical security keys instead. Due to its recent design, the standard is still changing and so are the needs for protocol testing. This research has driven the development of a web application that supports the standard and gives extensive information to the user. This tool can be used by WebAuthn developers and researchers, helping them to debug concrete use cases with no need for an ad hoc implementation. Keywords: WebAuthn; authentication; testing 1. Introduction Authentication is one of the most critical parts of an application. It is a security service that aims to guarantee the authenticity of an identity. This can be done by using several security mechanisms but currently, without a doubt, the most common is the username and password method. Although this method is easy for a user to conceptually understand, it constitutes many security problems.
    [Show full text]
  • 8 Steps for Effectively Deploying
    8 Steps for Effectively Deploying MFA Table of Contents The value of MFA 3 1. Educate your users 4 2. Consider your MFA policies 5 3. Plan and provide for a variety of access needs 7 4. Think twice about using SMS for OTP 10 5. Check compliance requirements carefully 11 6. Plan for lost devices 12 7. Plan to deploy MFA to remote workers 14 8. Phase your deployment: Be prepared to review and revise 16 8 Steps for Effectively Deploying MFA 2 The value of MFA Multi-factor authentication (MFA) has never been more important. With the growing number of data breaches and cybersecurity threats—and the steep financial and reputational costs that come with them—organizations need to prioritize MFA deployment for their workforce and customers alike. Not doing so could spell disaster; an invitation for bad actors to compromise accounts and breach your systems. Adopting modern MFA means implementing a secure, simple, and context-aware solution that ensures that only the right people have access to the right resources. It adds a layer of security, giving your security team, your employees, and your customers peace of mind. Unfortunately, while the benefits are clear, implementing MFA can be a complex project. In our Multi-factor Authentication Deployment Guide, we’ve outlined eight steps that you can take to better enable your MFA deployment: Educate your users Consider your MFA policies Plan and provide for a variety of access needs Think twice about using SMS for OTP Check compliance requirements carefully Plan for lost devices Plan to deploy MFA to remote workers Phase your deployment: be prepared to review and revise In this eBook, we’ll take a deeper dive into each of these elements, giving you tactical advice and best practices for how to implement each step as you get ready to roll out Okta MFA.
    [Show full text]
  • Html Cheat Sheet
    BEGINNER’S_ ​ HTML CHEAT SHEET Main root 2 Document metadata 2 Sectioning root 3 Content sectioning 3 Text content 4 Inline text semantics 6 Image and multimedia 8 Scripting 9 Demarcating edits 9 Table content 9 Forms 11 Interactive elements 12 WebsiteSetup.org - Beginner’s HTML Cheat Sheet ​ 1 Main root <html> … </html> The HTML <html> element represents the root (top-level element) of an HTML document, so it is also referred to as the root element. All other elements must be descendants of this element. Example: <!DOCTYPE html> <html lang="en"> <head>...</head> <body>...</body> </html> Document metadata <head> … </head> The HTML <head> element contains machine-readable information (metadata) about the document, like its title, scripts, and style sheets. <link> The HTML External Resource Link element (<link>) specifies relationships between the current document and an external resource. This element is most commonly used to link to stylesheets, but is also used to establish site icons (both "favicon" style icons and icons for the home screen and apps on mobile devices) among other things. <meta> The HTML <meta> element represents metadata that cannot be represented by other HTML meta-related elements, like <base>, <link>, <script>, <style> or <title> <style> … </style> The HTML <style> element contains style information for a document, or part of a document. <title> … </title> The HTML Title element (<title>) defines the document's title that is shown in a browser's title bar or a page's tab. Example: WebsiteSetup.org - Beginner’s HTML Cheat Sheet ​ 2 <!DOCTYPE html> <html lang="en"> <head>...</head> <body>...</body> </html> Sectioning root <body> … </body> The HTML <body> Element represents the content of an HTML document.
    [Show full text]
  • Mfaproxy: a Reverse Proxy for Multi-Factor Authentication
    Iowa State University Capstones, Theses and Creative Components Dissertations Fall 2019 MFAProxy: A reverse proxy for multi-factor authentication Alan Schmitz Follow this and additional works at: https://lib.dr.iastate.edu/creativecomponents Part of the Digital Communications and Networking Commons Recommended Citation Schmitz, Alan, "MFAProxy: A reverse proxy for multi-factor authentication" (2019). Creative Components. 425. https://lib.dr.iastate.edu/creativecomponents/425 This Creative Component is brought to you for free and open access by the Iowa State University Capstones, Theses and Dissertations at Iowa State University Digital Repository. It has been accepted for inclusion in Creative Components by an authorized administrator of Iowa State University Digital Repository. For more information, please contact [email protected]. MFAProxy: A reverse proxy for multi-factor authentication by Alan Schmitz A Creative Component submitted to the graduate faculty in partial fulfillment of the requirements for the degree of MASTER OF SCIENCE Major: Information Assurance Program of Study Committee: Doug Jacobson, Major Professor The student author, whose presentation of the scholarship herein was approved by the program of study committee, is solely responsible for the content of this Creative Component. The Graduate College will ensure this Creative Component is globally accessible and will not permit alterations after a degree is conferred. Iowa State University Ames, Iowa 2019 Copyright c Alan Schmitz, 2019. All rights reserved. ii TABLE OF CONTENTS Page LIST OF FIGURES . iii ABSTRACT . iv CHAPTER 1. INTRODUCTION . .1 CHAPTER 2. BACKGROUND . .3 2.1 Passwords and PINs . .3 2.2 Short Message Service . .4 2.3 One-Time Passwords . .5 2.4 U2F and WebAuthn .
    [Show full text]
  • Strong Authentication Based on Mobile Application
    View metadata, citation and similar papers at core.ac.uk brought to you by CORE provided by Helsingin yliopiston digitaalinen arkisto STRONG AUTHENTICATION BASED ON MOBILE APPLICATION Helsingin yliopisto Faculty of Science Department of Computer Science Master's thesis Spring 2020 Harri Salminen Supervisor: Valtteri Niemi Tiedekunta - Fakultet - Faculty Osasto - Avdelning - Department Faculty of Science The Department of Computer Science Tekijä - Författare - Author Harri Salminen Työn nimi - Arbetets titel Title STRONG AUTHENTICATION BASED ON MOBILE APPLICATION Oppiaine - Läroämne – Subject Computer Science Työn laji/ Ohjaaja - Arbetets art/Handledare - Aika - Datum - Month and Sivumäärä - Sidoantal - Number of Level/Instructor year pages Master's thesis / Valtteri Niemi June, 2020 58 Tiivistelmä - Referat - Abstract The user authentication in online services has evolved over time from the old username and password-based approaches to current strong authentication methodologies. Especially, the smartphone app has become one of the most important forms to perform the authentication. This thesis describes various authentication methods used previously and discusses about possible factors that generated the demand for the current strong authentication approach. We present the concepts and architectures of mobile application based authentication systems. Furthermore, we take closer look into the security of the mobile application based authentication approach. Mobile apps have various attack vectors that need to be taken under consideration when designing an authentication system. Fortunately, various generic software protection mechanisms have been developed during the last decades. We discuss how these mechanisms can be utilized in mobile app environment and in the authentication context. The main idea of this thesis is to gather relevant information about the authentication history and to be able to build a view of strong authentication evolution.
    [Show full text]
  • Microdata 184 Cross-Document Messaging 187 Accessible Rich Internet Applications (ARIA) 188 Accessibility 188 in Conclusion 191
    Mobile HTML5 Estelle Weyl Mobile HTML5 by Estelle Weyl Copyright © 2014 Estelle Weyl. All rights reserved. Printed in the United States of America. Published by O’Reilly Media, Inc., 1005 Gravenstein Highway North, Sebastopol, CA 95472. O’Reilly books may be purchased for educational, business, or sales promotional use. Online editions are also available for most titles (http://my.safaribooksonline.com). For more information, contact our corporate/ institutional sales department: 800-998-9938 or [email protected]. Editors: Simon St. Laurent and Meghan Blanchette Indexer: Lucie Haskins Production Editor: Kristen Brown Cover Designer: Randy Comer Copyeditor: Kiel Van Horn Interior Designer: David Futato Proofreaders: Troy Mott and Jasmine Kwityn Illustrator: Rebecca Demarest November 2013: First Edition Revision History for the First Edition: 2013-11-12: First release See http://oreilly.com/catalog/errata.csp?isbn=9781449311414 for release details. Nutshell Handbook, the Nutshell Handbook logo, and the O’Reilly logo are registered trademarks of O’Reilly Media, Inc. Mobile HTML5, the image of a Racket-tailed Drongo, and related trade dress are trademarks of O’Reilly Media, Inc. Many of the designations used by manufacturers and sellers to distinguish their products are claimed as trademarks. Where those designations appear in this book, and O’Reilly Media, Inc., was aware of a trade‐ mark claim, the designations have been printed in caps or initial caps. While every precaution has been taken in the preparation of this book, the publisher and author assume no responsibility for errors or omissions, or for damages resulting from the use of the information contained herein. ISBN: 978-1-449-31141-4 [LSI] Table of Contents Introduction.
    [Show full text]
  • Focus Styles
    Searching accessible components Sami Keijonen Recourses ● Guide to accessible components in Smashing Magazine. ● WAI-ARIA practises. ● Scott O’Haras accessible components. Components like (1/2) ● Focus styles ● Navigation ● Icon only components (social links) ● “Cards” (image, heading, text linking to article) ● Modal dialogs Components like (2/2) ● Accordion ● Tabs ● Styling checkboxes and radio buttons ● “Autocomplete” (dynamic search results) A11y Figma Kit ● A11y Figma Kit for inspiration and reminder. ○ Article explaining the a11y Figma Kit. ● Accessibility plugins for Figma. Focus styles ● All interactive elements (links, form elements etc.) should have focus styles. ○ Crucial for keyboard users. ● Remember to style focus styles in design process (not just hover). In WCAG 2.1 there is only color contrast 3:1 guideline. :focus { Focus styles outline: 0.25rem solid #222; } Color contrast? In 2.2 draft there are also guidelines for change of contrast and minimum area. Focus styles Note that if box-shadow is used, still use transparent outline for WIN high contrast mode. Good examples Never use :focus { outline: 0 } CSS :focus { box-shadow: ... outline: 0.25rem solid transparent; } :focus-visible is for that and now also Safari 14.1 supports it. // Base focus styles :focus { outline: 0.25em solid $color; Focus styles outline-offset: 0.25em; } What about when focus styles // Be careful to remove focus styles are triggered also using mouse // for “mouse” users. click? :focus:not(:focus-visible) { outline: none; More about focus styles. } <nav> <ul> Navigation <li><a href=”url”>Link 1</a></li> <li><a href=”url”>Link 2</a></li> </ul> Start with semantic markup </nav> Navigation <nav aria-label=”Main”> If there are several <ul> navigation, it’s good to add <li><a href=”url”>Link 1</a></li> name using aria-label <li><a href=”url”>Link 2</a></li> attribute.
    [Show full text]
  • EL PASSO: Efficient and Lightweight Privacy-Preserving Single Sign On
    Proceedings on Privacy Enhancing Technologies ; 2021 (2):70–87 Zhiyi Zhang, Michał Król, Alberto Sonnino, Lixia Zhang, and Etienne Rivière EL PASSO: Efficient and Lightweight Privacy-preserving Single Sign On Abstract: Anonymous credentials are a solid founda- 1 Introduction tion for privacy-preserving Single Sign-On (SSO). They enable unlinkable authentication across domains and al- Single Sign-On (SSO) is an answer to the complexity low users to prove their identity without revealing more and fragility of using individual passwords on the web, than necessary. Unfortunately, anonymous credentials i.e., leading to reuse and leaks [1]. SSO enables the use schemes remain difficult to use and complex to deploy. of a unique identity provided by an Identity Provider They require installation and use of complex software at (IdP). Users authenticate themselves to services (called the user side, suffer from poor performance, and do not Relying Parties–RP) with tokens provided by their IdP. support security features that are now common, such SSO improves overall web security [2] and enables the as two-factor authentication, secret recovery, or sup- generalization of good security practices such as the use port for multiple devices. In contrast, Open ID Con- of 2-factor authentication (2FA) [3]. nect (OIDC), the de facto standard for SSO is widely deployed and used despite its lack of concern for users’ Limitations of OpenID Connect. OpenID Connect privacy. We present EL PASSO, a privacy-preserving (OIDC) is a dominant SSO solution used by over a mil- SSO system based on anonymous credentials that does lion websites in 2020 [4].
    [Show full text]
  • Zero-Knowledge User Authentication: an Old Idea Whose Time Has Come
    Zero-Knowledge User Authentication: An Old Idea Whose Time Has Come Laurent Chuat, Sarah Plocher, and Adrian Perrig ETH Zurich Abstract User authentication can rely on various factors (e.g., a pass- word, a cryptographic key, and/or biometric data) but should not re- veal any secret information held by the user. This seemingly paradoxical feat can be achieved through zero-knowledge proofs. Unfortunately, naive password-based approaches still prevail on the web. Multi-factor authen- tication schemes address some of the weaknesses of the traditional login process, but generally have deployability issues or degrade usability even further as they assume users do not possess adequate hardware. This as- sumption no longer holds: smartphones with biometric sensors, cameras, short-range communication capabilities, and unlimited data plans have become ubiquitous. In this paper, we show that, assuming the user has such a device, both security and usability can be drastically improved using an augmented password-authenticated key agreement (PAKE) pro- tocol and message authentication codes. 1 Introduction User authentication still typically involves transmitting a plaintext password to the web server, which is problematic for many reasons. First, an attacker could obtain the user’s password using malware, a keystroke logger, phishing, or a man-in-the-middle attack. Second, the user might be using the same password on different websites, allowing a malicious server operator to impersonate the user. Third, if the website’s database is breached, although passwords may be protected by a hash function, a brute-force attack could reveal low-entropy pass- words. Fourth, as password-reuse and low-entropy passwords are problematic, users are constantly advised to pick new, long, complicated passwords.
    [Show full text]