HTML &CSS and Make a website with coding

Slides:



Advertisements
Similar presentations
HTML I. HTML Hypertext mark-up language. Uses tags to identify elements of a page so that a browser such as Internet explorer can render the page on a.
Advertisements

HTML Basics Customizing your site using the basics of HTML.
Intro to HTML. HTML HTML = HyperText Markup Language Used to define the content of a webpage HTML is made up of tags and attributes Content.
Introduction to HTML & CSS
Ideas to Layout Beginning web layout using Cascading Style Sheets (CSS). Basic ideas, practices, tools and resources for designing a tableless web site.
WeB application development
CSS The basics { }. CSS Cascading Style Sheets - language used to – describe html appearance & formatting Style Sheet - file that describes – how html.
Making Things Look Nice: Visual Appearance and CSS CMPT 281.
1 eVenzia Technologies Learning HTML, XHTML & CSS Chapter 1.
Web Workshop: CSS Objectives: - “What is CSS?” - Structure of CSS - How to use CSS in your webpage.
JMD2144 – Lesson 5 Web Design & New Media. ‘Div’ide and conquer One of the most versatile structure tags available is the.. tag Short for ision, it allows.
Review HTML  What is HTML?  HTML is a language for describing web pages.  HTML stands for Hyper Text Markup Language  HTML is not a programming language,
Basics of HTML.
 Using Microsoft Expression Web you can: › Create Web pages and Web sites › Set what you site will look like as you design it › Add text, images, multimedia.
HTML. We’ll learn … What HTML is What tags are What a basic web page looks like What 3 HTML tags are required What HTML comments look like How to title.
HTML & CSS A brief introduction. OUTLINE 1.What is HTML? 2.What is CSS? 3.How are they used together? 4.Troubleshooting/Common problems 5.More resources.
Styling and theming Build campaigns in style. What we'll look at... How a web document is structured How HTML and CSS fit together Tools you will need.
All Web pages are written with some form of HTML (HyperText Markup Language). HTML documents are saved as Text Only files so virtually any computer can.
Introduction to HTML. What is a HTML File?  HTML stands for Hyper Text Markup Language  An HTML file is a text file containing small markup tags  The.
The format is text files, with.htm or.html extension. Hard returns, tabs, and extra spaces are ignored. DO NOT use spaces in file names. File names ARE.
INTRODUCTION TO CSS. OBJECTIVES: D EFINE WHAT CSS IS. K NOW THE HISTORY OF CSS. K NOW THE REASON WHY CSS IS USED. CSS SYNTAX. CSS ID AND CLASS.
CSS Basic (cascading style sheets)
Computing Theory: HTML Year 11. Lesson Objective You will: o Be able to define what HTML is - ALL o Be able to write HTML code to create your own web.
Just Enough HTML How to Create Basic HTML Documents.
Basic HTML PowerPoint How Hyper Text Markup Language Works
IS1811 Multimedia Development for Internet Applications Lecture 4: Introduction to HTML Rob Gleasure
INTRODUCTION TO HTML5 Semantic Layout in HTML5.  The new semantic layout in HTML5 refers to a new class of elements that is designed to help you understand.
Week 1 – Beginners Content McAfee & Big Fish Games CoderDojo.
Web Design. How do web pages work? Webpages are written in a code called HTML. Programs like Internet Explorer read the code, and then show it as a web.
How the Web Works Building a Website – Lesson 1. How People Access the Web Browsers People access websites using software called a web browser. To view.
HTML GUIDE Press F5 and then Click on the links on the left to get to the section you want Section 1: Getting Started Section 2: Moving Banner Section.
FUNDAMENTALS OF HTML, XHTML & CSS Lesson 4. THE OBJECTIVES -  In this lesson you will begin coding in HTML to provide the structure  You will learn.
HTML Basic. What is HTML HTML is a language for describing web pages. HTML stands for Hyper Text Markup Language HTML is not a programming language, it.
Web programming Part 1: HTML 由 NordriDesign 提供
1 After completing this lesson, you will be able to: Understand the basics of HTML coding. Use HTML tags. Plan an HTML site. Create a table with HTML.
WEEK -1 ACM 262 ACM 262 Course Notes. HTML What is HTML? HTML is a language for describing web pages. HTML stands for Hyper Text Markup Language HTML.
University of South Asia Course Name: Web Application Prepared By: Md Rezaul Huda Reza
External Style Sheets Exploring Computer Science – Lesson 3-6.
DIGI KNOW? Intro to Web Development Bishoy Riad, Director of Web Development.
HTML HyperText Markup Language Victoria E. Kozlek.
CSS IS A LANGUAGE DESIGNED TO TARGET HTML ELEMENTS AND NODES BY TYPE, CLASS, ID AND VALUE, AND CHANGE THEIR VALUES CSS – change how your HTML looks and.
Microsoft Expression Web - Illustrated Unit A: Getting Started With Microsoft Expression Web.
Basic HTML Page 1. First Open Windows Notepad to type your HTML code 2.
Blended HTML and CSS Fundamentals 3 rd EDITION Tutorial 1 Using HTML to Create Web Pages.
Getting Started with HTML
Introduction to CSS: Selectors
HTML CS 4640 Programming Languages for Web Applications
Web Basics: HTML/CSS/JavaScript What are they?
HTML – The COMPUTING UNLOCKED GUIDE
Getting Started with CSS
4.01 Cascading Style Sheets
>> Introduction to CSS
Human Computer Interaction
Uppingham Community College
HTML & teh internets.
Basic HTML PowerPoint How Hyper Text Markup Language Works
Website Design 3
Intro to CSS Mr. Singh.
Objective Understand web-based digital media production methods, software, and hardware. Course Weight : 10%
Overview of HTML.
Web Design and Development
Understand basic HTML and CSS terminology, concepts, and basic operations. Objective 3.01.
HTML / CSS Mai Moustafa Senior Web Designer eSpace eSpace.
Website Testing EIT, Author Gay Robertson, 2018.
HTML – The COMPUTING UNLOCKED GUIDE
Web Development 101 Workshop
4.01 Cascading Style Sheets
Unit 10 The Web Book Test.
WJEC GCSE Computer Science
Presentation transcript:

HTML &CSS and Make a website with coding Code cademy.com HTML &CSS and Make a website with coding

Web development Make a Website Explore HTML & CSS fundamentals as you build a website in this introductory course to web development.

Why? Sign up! Use school details. Why learn HTML? Every webpage you look at is written in a language called HTML. You can think of HTML as the skeleton that gives every webpage structure. In this course, we'll use HTML to add paragraphs, headings, images and links to a webpage. In the editor to the right, there's a tab called test.html. This is the file we'll type our HTML into. See the code with the <>s? That's HTML! Like any language, it has its own special syntax (rules for communicating). When we press Save & Submit Code, the results tab will act like an Internet browser (e.g. Chrome, Firefox, Internet Explorer). A browser's job is to transform the code in test.html into a recognizable webpage! It knows how to lay out the page by following the HTML syntax.

CSS is the styling you add to HTML code Take a look at the HTML file in index.html. Pretty standard, right? You know all this stuff: headers, paragraphs, images, lists, and tables. Look in the preview pane: no surprises there. (In fact, it's pretty ugly if you ask us.) The stylesheet.css tab (which we'll teach you how to use in this course) contains all the CSS styling information: where HTML elements should go, what color they should be, how big they should be, and more. We've commented out a crucial line in the index.html file. If you remove the comment (the <!-- in line 4 before the text, and the --> in line 6 after the text), you'll be able to see the magic CSS imparts. Don't delete any of the actual <link> tag!

Where to start? HTML and CSS show how tags and selectors work to style your elements. Make a Website is an exercise for you to create a stylish website, using Bootstrap. I recommend you to learn HTML and CSS first. Therefore, you will know how tags, classes, and id's can be styled before making your website with code. Other website you're being asked to make is a free weebly website so don't confuse the two. You can work on your own or with experts in the class. I may allow group work also in partnerships that work hard together.