Updated Readme and Notes

master
androiddrew 7 years ago
parent cb7da3e6ab
commit 5458e5a69c

@ -1 +1,48 @@
# Just trying out some notes
# Meta Tags
### x-ua-compatible
`<meta http-equiv="x-ua-compatible" content="ie=edge">`
Description:
The x-ua-compatible tag allows you to chose what version of
Intenet Explorer the page should be rendered as. This has changed in
modern browsers, so if you are not targeting IE 9 or 8 you can consider
removing this all together. Foundation has this because it supports older
browsers which is why it is included.
If you are using this tag you want it to be at the top of your head.
### viewport
Topic: `<meta name="viewport" content="width=device-width, initial-scale=1.0">`
Description:
YOU SHOULD ALWAYS INCLUDE THIS!
This ultimately sets us up so that our users do not have to scroll horizontally
to view content. It is a big part of responsive design, and the user experience
on a site.
The viewport is the user's visible area of a web page. This of course changes
with the device, for example it will be smaller on a mobile device. So in HTML5
The meta tag received supoort for tracking the viewport.
This tag gives the browser instructions on how to control the page dimensions
and scaling.
The `width=device-width` part sets the width of the page to follow the screen
width of the device
The `initial-scale=1.0` part sets the initial zoom level when the page is first
loaded by the browser
THINGS TO REMEMBER:
Do NOT use large fixed width elements
DO NOT let content rely on a particular viewport width to render well
DO use CSS Media queries to apply different styling for small and large screens
-you still shouldn't be using fixed widths. consider using relative widths
such as `width: 100%`

@ -1,43 +1,13 @@
# Vuejs Playground
We all need somewhere to play. This is a simple repo for experiments with the
Vuejs library. You will need [Sass](http://sass-lang.com/) to compile the css used by this project.
Topic: `<meta http-equiv="x-ua-compatible" content="ie=edge">`
Description:
You will also probably want a dev server like live-server.
The x-ua-compatible tag allows you to chose what version of
Intenet Explorer the page should be rendered as. This has changed in
modern browsers, so if you are not targeting IE 9 or 8 you can consider
removing this all together. Foundation has this because it supports older
browsers which is why it is included.
`npm install -g live-server`
If you are using this tag you want it to be at the top of your head.
Alternatively you could just use python but there is no file watch associated
with this option.
Topic: `<meta name="viewport" content="width=device-width, initial-scale=1.0">`
Description:
YOU SHOULD ALWAYS INCLUDE THIS!
This ultimately sets us up so that our users do not have to scroll horizontally
to view content. It is a big part of responsive design, and the user experience
on a site.
The viewport is the user's visible area of a web page. This of course changes
with the device, for example it will be smaller on a mobile device. So in HTML5
The meta tag received supoort for tracking the viewport.
This tag gives the browser instructions on how to control the page dimensions
and scaling.
The `width=device-width` part sets the width of the page to follow the screen
width of the device
The `initial-scale=1.0` part sets the initial zoom level when the page is first
loaded by the browser
THINGS TO REMEMBER:
Do NOT use large fixed width elements
DO NOT let content rely on a particular viewport width to render well
DO use CSS Media queries to apply different styling for small and large screens
-you still shouldn't be using fixed widths. consider using relative widths
such as `width: 100%`
`python -m http.server`

Loading…
Cancel
Save