Web Development from Beginner to Paid Professional, 2: Build your portfolio as you learn Html5, CSS and Javascript step by step with support

By Ojula Technology Innovations

I know there are more than sufficient resources online to teach absolute beginners everything they need to learn web development from scratch. But this book is different because it addresses a few web development problems. The credibility of a web developer is much more than their credentials. It's actually about the strength of their portfolio.

• Language: English
• Publisher: Ojula Technology Innovations
• Release date: Jun 7, 2023
• ISBN: 9781088161265

Ojula Technology Innovations

Dr. Emily Turner, one of the contributors of this book, is a distinguished molecular biologist and educator, known for her profound contributions to the field of cellular and molecular biology. With a Ph.D. in Molecular Biology and over two decades of research experience, Dr. Turner is a true luminary in the realm of life sciences.As a passionate advocate for science education, Dr. Turner has dedicated her career to making the intricacies of cellular and molecular biology accessible to students of all backgrounds. Her journey as an author began with a deep-seated commitment to empower the next generation of scientists, culminating in the co-authorship of "Cell and Molecular Biology: An Introductory Guide for Learning Cellular & Molecular Biology."Dr. Turner's work is characterized by a rare blend of scholarly excellence and pedagogical prowess. Her research has been published in renowned scientific journals, contributing groundbreaking insights to the fields of genetics and molecular biology. Simultaneously, her engaging teaching style has earned her accolades and the admiration of her students.This collaborative effort marks a milestone in her career, where she, along with her co-authors, has crafted a book that distills the complexities of cellular and molecular biology into an approachable and engaging resource. With an unwavering commitment to the advancement of scientific knowledge, Dr. Emily Turner continues to inspire and educate, leaving an indelible mark on the world of science and education.

Book preview

Web Development

from Beginner to

Paid Professional

Volume 2

Build your portfolio as you learn

Html5, CSS and Javascript

step by step with support

By

Ojula Technology Innovations

Web Development

from Beginner to Paid Professional

Volume 2

Build your portfolio as you learn Html5, CSS and Javascript step by step with support

Copyright © Ojula Technology Innovations

All rights reserved

ISBN: 9781088161265

Published in the United States

Limit of Liability/Disclaimer of Warranty

This book contains information obtained from authentic and highly regarded sources. Reasonable efforts have been made to publish reliable data and information, but the author and publisher cannot assume responsibility for the validity of all materials or the consequences of their use. All information given in this book is based on the author’s own research and does not constitute technical, financial or professional advice. The author and publisher have attempted to trace the copyright holders of all material reproduced in this publication, and apologize to copyright holders if permission to publish in this form has not been obtained. If any copyright material has not been acknowledged please write and let us know so we may rectify in any future reprint.

Except as permitted under U.S. Copyright Law, no part of this book may be reprinted, reproduced, transmitted, or utilized in any form by any electronic, mechanical, or other means, now known or hereafter invented, including photocopying, microfilming, and recording, or in any information storage or retrieval system, without written permission from the publisher.

Table of Contents

How to Learn HTML5, CSS & Javascript Well

1. Getting Started

1.0. Introduction to Volume 2

2. Applied Visual Design 1: CSS Animations

2.1. Opacity & Alpha Channel

2.2 How to Create a Gradual CSS Linear Gradient

2.3 How to Use a CSS Linear Gradient to Make Stripes

2.4 Position Property

2.4.1. Static

2.4.2. Relative

2.4.3. Absolute

2.4.4. Fixed

2.4.5. Sticky

2.5 CSS Transitions vs Animations

2.5.1. The Four CSS Properties

2.5.2. How to Trigger CSS Transitions

2.5.3. Transition Timing Function Explained Further

2.5.4. How to Create Your own Timing function with Cubic-Bezier

2.5.5. How to Transition Two or More Properties

2.5.6. Transition in vs Transition out

2.5.7. Things Transitions Don’t Work On

2.6. CSS Transforms

2.6.1. Transform Functions 1: Scale, Skew, Rotate & Translate

2.6.2. Transform Functions 2: Matrix Transform, 3D Transforms & @Keyframes

2.6.3. Animation Iteration Count

3. Applied Visual Design 2:  Typography, Page Layout, Color Principles & Graphics

3.1. Typography & Page Layout

3.2. Color Theory & its Impact on Design

3.2.1. Complementary Colors

3.2.2. Tertiary Colors

3.2.3. How to Adjust the Hue of a Color

3.2.4. How to Adjust the Tone of a Color

3.2.4. How to Create Texture

3.3. How to Use CSS to Create Graphics

3.4. How to Use CSS to Create Complex Shapes

4. Applied Accessibility

4.1. How to Show Hierarchical Relationships of Content

4.2. HTML5 New Elements: Header, Main, Article, Section, Nav &Footer

4.3. How to Improve Accessibility with Audio, Figure & Figcaption

4.4. How to Improve Accessibility with Form Field, Label, Fieldset, Legend & Radio Button

4.5. How to Improve Accessibility with Date Picker, Time & Datetime

4.6. How to Make Elements Only Visible to a Screen Reader

4.7. How to Improve Readability with High Contrast Text

4.8. How to Use Sufficient Contrast to Avoid Color-blindness Issues

4.9. How to Choose Colors that Convey Information to Avoid Color-blindness Issues

4.10. How to Give Links Meaning by Using Descriptive Link Text

4.11. How to Make Links Navigable with HTML Access Keys

4.12. How to Use Tabindex to Add Keyboard Focus to an Element

4.13. How to Use Tabindex to Specify the Order of Keyboard Focus for Several Elements

5. A Preview of Volume 3

5. 1. Continuing Your Web Development Training

6. Cheat Sheets, Developer portfolio, Coding Exercises & Practice Projects

6.1. Introduction

6.2. Download Training Resources

6.3. How to Get Further Help

More Helpful Resources

How to Learn HTML5, CSS & Javascript Well

I know there are more than sufficient resources online to teach absolute beginners everything they need to learn web development from scratch. But this book is different because it addresses a few web development problems. The credibility of a web developer is much more than their credentials. It’s actually about the strength of their portfolio.

Employment opportunities often come from work samples and concrete skills, rather than a college degree. So, you need to learn well enough. This book will not only help you learn well and build a stunning portfolio, it will also provide you continuous help and support.

With this book and my dedicated 24/7 help and support team, there’s nothing for you to fear. I have helped many web developers update their development skills, launch successful careers and get hired for remote jobs. I notice that even the most ambitious beginners can run into problems, such as unable to decide where to begin. Sometimes they get completely lost on the way and therefore need further help.

The truth is everyone needs help at one point or the other to learn html5, CSS or Javascript correctly in their web development journey. I put sufficient coding challenges and their solutions in this book. You will get regularly updated cheat sheets, coding exercises, a stunning web developer portfolio to show off your work samples, practice projects, graphics and screenshots used in this book. You will also get further help if you use the free support link at the bottom of this book. I will help you learn well.

Finally, if you buy this book, I will add you to my web development community so you can continue to learn and get more help until you become a well-paid professional.

Bolakale Aremu

CEO, Ojula Technology Innovations

Web developer and Software Engineer

Ojulaweb.com

1. Getting Started

1.0. Introduction to Volume 2

This book is volume 2 of Web Development from Beginner to Paid Professional. In this volume, you'll continue your lessons on HTML, CSS and Javascript. It’ll help you fast-track your web development skills. The great thing about web development is it's very suitable for people coming from many different backgrounds. So, it doesn't matter if you have little or no technical experience, or if you do have a technical background and you're looking to transition your skill sets into web development.

For the lessons in the subsequent chapters, you will need to create a few files and open them in Visual Studio. For Chapter 2 for example, below is how to create a new folder in your portfolio and open it in Visual Studio. Like I explained in the introductory chapter (Section 0) of volume 1 of this book, these are the seven simple steps to follow:

1. Open your Html_course portfolio folder you created in the volume 1 of this book.

2. Create a new folder, with title 03_lesson.

3. In visual Studio, click the File menu at the top and select Open Folder… .

4. Navigate to the location where you saved your 03_lesson folder and select it.

5. Select this folder to load/open it on your Visual Studio explorer.

6. Close the Get Started tab.

7. Get ready to start coding.

2. Applied Visual Design 1: CSS Animations

CSS animation is a method of animating certain HTML elements without having to use processor and memory-hungry JavaScript or Flash. We use CSS animation to convey information efficiently, or to grab people’s attention, but ultimately, it’s all about communication. Movement in our web designs is a very powerful way to communicate. It cuts across both written and verbal language.