From 5458e5a69cb4635ef783a7dd2e05d9fcfb8d55cd Mon Sep 17 00:00:00 2001 From: androiddrew Date: Wed, 13 Sep 2017 12:04:43 -0400 Subject: [PATCH] Updated Readme and Notes --- NOTES.md | 49 ++++++++++++++++++++++++++++++++++++++++++++++++- README.md | 46 ++++++++-------------------------------------- 2 files changed, 56 insertions(+), 39 deletions(-) diff --git a/NOTES.md b/NOTES.md index 5cf8227..235c48e 100644 --- a/NOTES.md +++ b/NOTES.md @@ -1 +1,48 @@ -# Just trying out some notes +# Meta Tags + +### x-ua-compatible + +`` + +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: `` + +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%` diff --git a/README.md b/README.md index 0539d57..ebf7224 100644 --- a/README.md +++ b/README.md @@ -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: `` -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: `` -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`