Starting from Scratch Lesson 1 intro
It's gonna be A Human Future
CSS practice Glitch remix
CSS is Awesome CodePen
Understanding users.
7 principles to help create great digital experiences for children.
How to design for children
CSS grid calendar.
Some basic boxes: calendargrid
Why is front end development so hard?
Useful answer to the question: quora
13 03 2022 ~ Monday clock
Proceeding to set up an 11ty site. Started: 14:00 UK winter time. By 18:40 the shiny new site said Hi! Browsersync serving the index.html file and README.md from: _site. Woohoo localhost:8080! The command line instuction to make the html file hadn't worked kept giving '< was unexpected at this time' error, so made the file in VS code in the browser instead. Rest of the evening figuring what to do next.. perused lots of starter projects, reasons for using a styleguide, and a poem.
And then, some Sanity.
29 02 2022 ~ ! Not secure Flora 🇺🇦
Found an online book and read some reminders of reasons to Learn JavaScript w3docs
" There are at least three perfect things about JavaScript:
- It supports complete integration with CSS and HTML.
- It provides straightforward ways of doing simple things.
- It is supported by almost all the major browsers and is performed by default. "
MDN JavaScript
Frontend Masters Bootcamp
FreeCodeCamp JavaScript Algorithms and Data Structures
w3docs Learn JavaScript
Digital Ocean How To Code in JavaScript
W3schools JavaScript Tutorial
I think when you have a lot of jumbled up ideas they come together slowly over a period of several years ~ Tim Berners-Lee
You can use the editor on GitHub to maintain and preview content for the website in Markdown files.
Whenever you commit to this repository, GitHub Pages will run Jekyll to rebuild the pages in your site, from the content in your Markdown files.
Markdown is a lightweight and easy-to-use syntax for styling your writing. It includes conventions for
Syntax highlighted code block
# Header 1
## Header 2
### Header 3
- Bulleted
- List
1. Numbered
2. List
**Bold** and _Italic_ and `Code` text
[Link](url) and 
For more details see GitHub Flavored Markdown.
Your Pages site will use the layout and styles from the Jekyll theme you have selected in your repository settings. The name of this theme is saved in the Jekyll _config.yml configuration file.
Having trouble with Pages? Check out our documentation or contact support and we’ll help you sort it out.
#100DaysofCode @ka11away's Official Site
#30DaysofHTML Learning with Jen email course
#150DaysofHTML Deep dive with Schalk Neethling email course
Frontend Masters Bootcamp
Udacity Classroom
A live calendar for June
A deeper dive and rummage into Git concepts prompted by this thread ...
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>The most important GIT CONCEPTS
— Iren Gataullina (@IrenSayWhen) June 14, 2021
Stop copy-pasting, start Understanding
- THREAD -
Had a second try at this challenge using lots of < abbr> and < dfn> tags.
Rather more than would usually be neccessary as clarified by helpful feedback from Jen Kramer:
< abbr> is for abbreviations, acronyms, and initialisms. Let's say we're talking about HTML. All the element tells us is what HTML stands for:
< abbr title="Hypertext Markup Language">HTML< /abbr>
< dfn> does the definition. Often that goes beyond the abbreviation (hopefully!):
< p>< dfn id="html">< abbr title="Hypertext Markup Language">HTML< /abbr>, the Hypertext Markup Language, describes the structure of web documents, identifying parts of the document like headings, lists, and links.< /p>
< p>However, < a href="#html">HTML< /a> is limited in its appearance and functionality.< /p>
So here we've defined HTML early in the document. Later, if we want to refer to the definition, we link to it.
Should we put a around that second instance of HTML?... it depends. If we were pages into a book and we'd not used HTML in that time, perhaps so. If we're a paragraph later, probably not.
So -- should people be defined? Maybe, but probably not in the sense of a dictionary entry. I love your link to Michelle Obama's Wikipedia entry, for example. If you don't know who she is, you can read about her. But that's just a plain old link. You can't look her up in Webster's dictionary. 😁
This has been a very useful exercise and lesson in how much and how flexibly text can be enriched with HTML.
#30DaysofHTML Day 3: 'Who Said What From Where'
@CodePen
Created React App - my-new-app.
Getting comfortable with Create React App
Creating React App my-new-app.
Getting "web-vitals" missing error (even though it seems to be there).
Possible missing bits due to slow internet.
my-app
Many errors concerning versions.
Some StackOverflow possible solutions
Defining terms.
#30daysofhtml CodePen challenge Day 4
First the cite challenge: to modify yesterdays blockquote exercise in light of new information about the different rules governing this feature which can be an attribute or an element.
Who said what from where challenge: a practical review of things learnt so far.
#30daysofhtml CodePen challenge 1 Day 3
#30daysofhtml CodePen challenge 2 Day 3
Believing impossible things.
<blockquote> and <q> #30daysofhtml
#30daysofhtml CodePen challenge Day 2
Some time today to backtrack and work through the #30daysofhtml challenges on CodePen starting with <address>.
#30daysofhtml CodePen challenge Day 1
Link attributes: type, referrerpolicy, as, disabled, imagesrcset, and imagesizes.
Elements:<strong>, <mark>, <cite>, <s>, <del> and <ins>.
Practice pen
Day 11 - #150daysofhtml Wrapping up attributes and link element
Day 11 - #30daysofhtml Marking up edits and drawing attention with elements
I got 🌟8/8 in the #30DaysofHTML Day 1 quiz yay! 🙌
Day 1 #30DaysofHTML <address> examples pen
A #30daysofhtml challenge!
☕☕☕
Day 10 - #30daysofhtml Challenge Pen
Day 10 - #30daysofhtml <sup> and <sub>
Day 10 - #150DaysofHTML The link element integrity attribute
What to do about sesquipedalianism? <wbr> !
More rel attribute keywords on the link element.
A live calendar for June
Day 9 - #30daysofhtml <wbr>
Day 9 - #150Daysofhtml Concluding rel
The <small> print then ....
link rel and Resource Hints - improving user experience and accessibility through performace.
and ... WIP ...
HTML + CSS semantic calendar project.
#30daysofhtml - Day 8 <small>
#150daysofhtml - Day 8 link rel
What does that TLA* mean? 🤔💡🤭
Plus so many more things to learn about </link> element and the magical browsers 🧙♂️🧙♀️
#30daysofhtml - Day 7 <abbr>
#150daysofhtml - Day 7 The </link> element part 3
#30daysofhtml - Day 6 <details> and <summary>
#150daysofhtml - Day 6 The <link href=""/> element part 2
#30daysofhtml - Day 5 <dl><dt><dd>
#150daysofhtml - Day 5 The <link href="style/main.css"/> element
#30daysofhtml - Day 4 <dfn>
#150daysofhtml - Day 4 The <base> element
#30daysofhtml - Day 3 <cite>
#150daysofhtml - Day 3 The <title> element
Getting to know ...
The official HTML5 boilerplate
HTML, accessibility, and CSS layout and architecture expert Manuel Matuzovic's own HTML Boilerplate walkthrough
Day 2
#30daysofhtml - Day 2 - <blockquote> and <q> - not for indentation or conversation.
#150daysofhtml - Day 2 - <head> contains metadata - data about data.
#30daysofhtml - Day 1 - <address> tag
#150daysofhtml - Day 1 - <html class="no-js" lang="en">
With #30daysofhtml email course
and a subscription to #150daysofhtml
More about the lang attribute on the <html> element
The lang attribute: browsers telling lies, telling sweet little lies
blog post by Manuel Matuzovic.
Learning how to write HTML properly.
I created a Google Developer Profile!
#DevBadges
Day 5 - CodeLog - #100daysofcode
Getting in the mood to make a new GitHub pages 100 days of code log by making an octocat.
Day 4 - Front End Focus - #100daysofcode
Learned a bit more about image resizing and DOM events then played a coding fantasy game to practice the flex box and had a look at Google's free CSS course.
Read chapter 4 - Animal, Vegetable or Mineral, a free sample of @skrug's book
and thought about making choices mindless in relation to my current landing page project.
Dont Make Me Think Chapter 4 sample pages
Then played 20 Questions
Crafting an HTML and CSS landing page
"The self is a cumulative network because its history persists."
~The networked self
FontSquirrel helped me make a web font kit. Next a http://favicon.cc and flex box Holy Grail CSS.
Trying to understand what stuff does ...
Font Squirrel Web font generator
Favicon generator creator Favicon.cc
How to Become a Great Front-End Engineervia
@philwalton
"The amateur software engineer is always in search of magic." - Grady Booch via Programming Wisdom @CodeWisdom on Twitter 12:37 PM - 12 Oct 2018
You can use the editor on GitHub to maintain and preview content for the website in Markdown files.
Whenever you commit to this repository, GitHub Pages will run Jekyll to rebuild the pages in your site, from the content in your Markdown files.
Markdown is a lightweight and easy-to-use syntax for styling your writing. It includes conventions for
Syntax highlighted code block
# Header 1
## Header 2
### Header 3
- Bulleted
- List
1. Numbered
2. List
**Bold** and _Italic_ and `Code` text
[Link](url) and 
For more details see GitHub Flavored Markdown.
Your Pages site will use the layout and styles from the Jekyll theme you have selected in your repository settings. The name of this theme is saved in the Jekyll _config.yml configuration file.
Having trouble with Pages? Check out our documentation or contact support and we’ll help you sort it out.