Goal The student must understand basic html5 elements and what is meant by semantics. The goal is to have an accessible page for spoken browsers and the visually impaired that can be easily styled. The page must validate correctly with the W3’s html validator, https://validator.w3.org. We will start with a basic structure that will include a: * header * main ** two sections * an aside * footer The content can be Lorem Ipsum, https://lipsum.

Goal To understand an html5 post form styled using an advanced css reference style sheet. The page must validate correctly with the W3’s html validator - https://validator.w3.org. The page content can be made more realistic if you want, but you can just use the basics as suggested below: page title: [Co-op’s name] login header title: [Co-op’s name] app info paragraph stating please log into my app userid form field with a label that explains what it is, and length and maxsize 8 characters

Goal The student must understand basic html5 elements and what is meant by semantics to create a site of pages. The pages must validate correctly with the W3’s html validator, https://validator.w3.org. Building on exercise 2, take the login form’s structure and create a site template. From this template create 4 other pages: a welcome or landing page a second page a third page a logout page. 1) The pages titles and headers have to be renamed appropriately.

Goal This exercise is a leap forward and requires that the student learn basic php from whatever source works best for them. The student uses basic php to process form data. The page must validate correctly with the W3’s html validator - https://validator.w3.org also, for any custom css - http://jigsaw.w3.org/css-validator/. Structure: the login page, index.php, contains a form that calls itself when the user submits the form the authentication logic checks:

Goal The student uses basic php to build a full website. Login variables will be kept in memory between page loads using php’s $_SESSION superglobal. In the process, code will be separated to reduce duplication. I will present a prototyping code layout that I have found useful. The pages must validate correctly with: the W3’s html validator, https://validator.w3.org. the W3’s css validator, http://jigsaw.w3.org/css-validator/ Naming conventions: all lowercase with underscores separating words

Goal The student uses their php website to secure their code by introducing a php router architecture [fyi: technically a front-controller pattern]. The student replaces the sample pages - described below, with the logic from their php website. The result is that the student’s website now works with a router that is accessed from the public folder. This helps prevent hackers from accessing the php logic. After reading the tutorial, if you have questions about how the router works, contact me.

Goal Instead of using an array to hold valid users and their passwords, a mysql innodb table - called users, is queried. Its structure is: username: is the primary key fullname password See the sql template file for the innodb table skeleton. The student determines what data type the fields should be when creating the table. Finally, the student uses sql through the pdo library to authenticate the user logging into the basic php site.

Goal This is a gentle introduction to adding accessibility to webpages using Aria roles and attributes, since it is a complex topic. Along with using semantic HTML 5 elements, it is hoped your webpages will be navigable by a spoken browser user. After the basic tutorial(s) below, the student will add Aria attributes and roles to their previous login form. They will also add examples from the MDN aria-labelledby ref - https://developer.

Introduction This is bold text, and this is emphasized text. Visit the Hugo website!