- Clone the repository
- Then run command 'npm install'
- Then run command 'npm run dev'
- Right now it is redirected to public/ folder index.html file, so whatever you make change, make change into the public folder.
- Make changes, follow similar folder structure in public to add images, font, css, js etc
- After you add your design push to the github repository and you will be able to see the changes at live site https://dpsignadvertising.com/index.html or the html files that you pushed. If you pushed about.html then URL will be https://dpsignadvertising.com/about.html
- Optional: If you need to push your development work then you can push into the dev/ branch and your testing environment URL is https://ebookdesign-qno3sx9xo.vercel.app/index.html. First do "git checkout dev && git merge master", then start your development and push with "git push origin dev"
- HTML5 document
- Let's make primary and secondary palettes, and gradients, stick to them so that we can generate multiple theme latter on.
- Use only one google font like Roboto or Realway etc (Stay with only one font, but we can use light, medium, condensed, bold as needed)
- Images alway use the licence free, pexels.com is one site.
- Color selection: Please select analogous color combinations and let us know why you choose it https://www.canva.com/learn/100-color-combinations/, there are Analogous color combinations, Triadic color combinations and Complementary color combinations.
- Don't use full black color (#000000) anywhere.
- Our CSS framework will be Bootstrap, if you can work on the scss then better to provide it.
- For icons better to stick with bootstrap icons, but we can decide if need to use fontawesome.
- Paragraph font size to be 16px (SEO purposes), then in other try to use corresponding needed ems (em)
- CSS should start with "* {margin:0;padding:0;}"
- Use lowercase for class name and id name
- RTL and LTR both need to be supported.
- Use only one h1 in a page (For SEO purpose and w3 validation)
- Follow the hierarchical approach of html tags like div > h1, not like h1 > div (Important for w3 validation)
https://validator.w3.org/ http://jigsaw.w3.org/css-validator/ Pagespeed test https://developers.google.com/speed/pagespeed/insights/, score need to be more than 80 and try to reach 100 :) both in mobile and desktop.