SlideShare uma empresa Scribd logo
1 de 20
Dreamweaver CS6
AGENDA
– Introduction
– Creating your local root folder
– Creating a home page
– Inserting and using tables
– Previewing in browser
– Creating Hyperlinks
INTRODUCTION
What is …
Adobe Dreamweaver ?
Why we …
Use Adobe Dreamweaver ?
INTRODUCTION
– Dreamweaver is a complete website development
and site management program.
– It works with web technologies like HTML, XHTML,
CSS, JavaScript, and PHP.
INTRODUCTION
– Web Designers
– Developers
– Visual interface for making and editing HTML websites and
mobile apps
– enabling cross-platform compatibility, to create pages
http://php-editor-review.toptenreviews.com/
INTRODUCTION
<p align = “ ” > some text here </p>
<input type= “ " name="fname" value=“Enter First
Name" />
leftrightcenter
textpasswordcheckboxradiosubmit
CREATING YOUR LOCAL ROOT FOLDER
• Create a new folder on your local root folder
• Give the folder a brief, but descriptive name. Do not use
capital letters, spaces, or special characters when naming
folders and files for your website. All of your pages will be
saved within this folder.
• Open the folder, and create another new folder inside. Name
this folder “images” (make sure the file name is lower case).
Put all of your images, buttons, movie files, etc. inside the
images folder.
CREATING YOUR LOCAL ROOT FOLDER
1. Click Site > Manage Sites.
2. Click New > Site.
3. Select the Site tab.
4. Enter a name for the site in the Site Name text field (This
name will be for your use only – it will not be published with
your site.)
CREATING YOUR LOCAL ROOT FOLDER
1. Click on the Server tab located on the left side of the toolbar.
2. To add a server, click the + symbol from the bottom left-hand
corner of the window.
3. Type in Server Name text field “morning_shift”.
4. Now select from Connect using selected fields
Local/Network.
5. Browse Server Folder and gave path of your local root folder
6. Finally insert url in Web URL i.e
http://localhost/your_folder_name
CREATING YOUR LOCAL ROOT FOLDER
1
2 3
4
5
6
CREATING A HOMEPAGE
• 1. To add a new page go to File > New and choose a basic HTML page. Save this
page by clicking File >Save As. Name the first page index.html. This will be the first
page that users encounter when they visit your site. Save this file to your local root
folder as index.html. Naming the homepage index.html tells the Web browser that
this is the first page it should open when someone visits your site.
• 2. After your homepage index.html is created, you can use this page as a template
layout for all the other pages in your site. Simply hit Save As and name the file
whatever you wish, but be sure to keep the name is simple, for example
history.html, resume.html, etc. Remember not to use capital letters or spaces
when naming files, this will make it easier for web browsers to find your files.
• 3. To save the pages of your site simply click File > Save for each page. Make sure
your homepage is named index.html, and save all of your files in the folder you
chose when you defined your site, i.e. in your local root folder.
CREATING A HOMEPAGE
– Document Types
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www. w3.org/TR/html4/loose.dtd“ >
is called a “doctype,” and it simply identifies what
flavor of HTML you used to write the page.
Developers have used two doctypes for years HTML
4.01 and XHTML 1.0—and each has two styles: strict
and transitional.
CREATING A HOMEPAGE
– Dreamweaver even lets you use the latest,
greatest, and simplest doctype, HTML5
– <!DOCTYPE HTML>
INSERTING AND USING TABLES
– To insert a table, follow these steps:
– In the main menu, click Insert > Table.
– Insert the amount of Table Rows and Columns.
– Set Table Width to between 600 and 800 pixels.
– Set Border Thickness. To have a visible border type in 1 or
higher, to have no border type in 0.
– Cell Padding adds room inside of a cell. Enter 0 for no space
or a number to Increase the space.
– Cell Spacing adds space between cells. Enter 0 for no space
or a number to Increase the space.
– Click Ok.
INSERTING AND USING TABLES
INSERTING AND USING TABLES
PROPERTIES OF TABLES
PROPERTIES OF CELLS INSIDE TABLE
PREVIEWING IN BROWSER
– Choose File > Preview in Browser.
– Hit F12.
– Click on the world icon located on the toolbar at
the top of your page
CREATING HYPERLINKS
– Select the text or image you would like to make a
hyperlink.
– Click on the small folder next to the Link field in
the Properties Inspector.
– Browse through the files, and select the page you
would like to link.
– Click Choose.
For More go to …
• https://www.youtube.com/channel/UCpcZm0
dA1leAK9dkxV0qvSw

Mais conteúdo relacionado

Mais procurados

Mais procurados (20)

Jsp
JspJsp
Jsp
 
Bootstrap 5 whats new
Bootstrap 5   whats newBootstrap 5   whats new
Bootstrap 5 whats new
 
Web design basics
Web design basicsWeb design basics
Web design basics
 
Introduction to angular with a simple but complete project
Introduction to angular with a simple but complete projectIntroduction to angular with a simple but complete project
Introduction to angular with a simple but complete project
 
HTML e CSS
HTML e CSSHTML e CSS
HTML e CSS
 
Node js introduction
Node js introductionNode js introduction
Node js introduction
 
Love at first Vue
Love at first VueLove at first Vue
Love at first Vue
 
Basic Concept of Node.js & NPM
Basic Concept of Node.js & NPMBasic Concept of Node.js & NPM
Basic Concept of Node.js & NPM
 
Android Widget
Android WidgetAndroid Widget
Android Widget
 
Html images syntax
Html images syntaxHtml images syntax
Html images syntax
 
Introduction to Node.js
Introduction to Node.jsIntroduction to Node.js
Introduction to Node.js
 
Front-end development introduction (HTML, CSS). Part 1
Front-end development introduction (HTML, CSS). Part 1Front-end development introduction (HTML, CSS). Part 1
Front-end development introduction (HTML, CSS). Part 1
 
NodeJS - Server Side JS
NodeJS - Server Side JS NodeJS - Server Side JS
NodeJS - Server Side JS
 
An introduction to Vue.js
An introduction to Vue.jsAn introduction to Vue.js
An introduction to Vue.js
 
The Point of Vue - Intro to Vue.js
The Point of Vue - Intro to Vue.jsThe Point of Vue - Intro to Vue.js
The Point of Vue - Intro to Vue.js
 
jQuery
jQueryjQuery
jQuery
 
Node.js Basics
Node.js Basics Node.js Basics
Node.js Basics
 
Introduction to React JS for beginners
Introduction to React JS for beginners Introduction to React JS for beginners
Introduction to React JS for beginners
 
Html and css
Html and cssHtml and css
Html and css
 
Node ppt
Node pptNode ppt
Node ppt
 

Destaque

Basic tutorial dreamweaver_cs5
Basic tutorial dreamweaver_cs5Basic tutorial dreamweaver_cs5
Basic tutorial dreamweaver_cs5
seanoiii
 
Tutorial 08 - Creating Effective Web Pages
Tutorial 08 - Creating Effective Web PagesTutorial 08 - Creating Effective Web Pages
Tutorial 08 - Creating Effective Web Pages
dpd
 
Tutorial 8 - Creating Effective Web Pages
Tutorial 8 - Creating Effective Web PagesTutorial 8 - Creating Effective Web Pages
Tutorial 8 - Creating Effective Web Pages
dpd
 
Tutorial PHP and Dreamweaver CS3
Tutorial PHP and Dreamweaver CS3Tutorial PHP and Dreamweaver CS3
Tutorial PHP and Dreamweaver CS3
Halizah Ahmad
 
Unit a adobe dreamweaver cs6
Unit a adobe dreamweaver cs6Unit a adobe dreamweaver cs6
Unit a adobe dreamweaver cs6
Krista Lawrence
 

Destaque (20)

How to install adobe dreamweaver step by step with pictures
How to install adobe dreamweaver step by step with picturesHow to install adobe dreamweaver step by step with pictures
How to install adobe dreamweaver step by step with pictures
 
Dreamweaver
DreamweaverDreamweaver
Dreamweaver
 
Dreamweaver cs6 step by step
Dreamweaver cs6 step by stepDreamweaver cs6 step by step
Dreamweaver cs6 step by step
 
Dreamweaver CS6, jQuery, PhoneGap, mobile design
Dreamweaver CS6, jQuery, PhoneGap, mobile designDreamweaver CS6, jQuery, PhoneGap, mobile design
Dreamweaver CS6, jQuery, PhoneGap, mobile design
 
Dreamweaver cs6 multiple browsers and devices training demo
Dreamweaver cs6 multiple browsers and devices training demoDreamweaver cs6 multiple browsers and devices training demo
Dreamweaver cs6 multiple browsers and devices training demo
 
Basic tutorial dreamweaver_cs5
Basic tutorial dreamweaver_cs5Basic tutorial dreamweaver_cs5
Basic tutorial dreamweaver_cs5
 
Modul pengenalan dreamweaver
Modul pengenalan dreamweaverModul pengenalan dreamweaver
Modul pengenalan dreamweaver
 
modul pemrograman web dengan dreamweaver, sql & php
modul pemrograman web dengan dreamweaver, sql & phpmodul pemrograman web dengan dreamweaver, sql & php
modul pemrograman web dengan dreamweaver, sql & php
 
Tutorial 08 - Creating Effective Web Pages
Tutorial 08 - Creating Effective Web PagesTutorial 08 - Creating Effective Web Pages
Tutorial 08 - Creating Effective Web Pages
 
Designing Responsively with Dreamweaver
Designing Responsively with DreamweaverDesigning Responsively with Dreamweaver
Designing Responsively with Dreamweaver
 
php tutorial - By Bally Chohan
php tutorial - By Bally Chohanphp tutorial - By Bally Chohan
php tutorial - By Bally Chohan
 
Tutorial 8 - Creating Effective Web Pages
Tutorial 8 - Creating Effective Web PagesTutorial 8 - Creating Effective Web Pages
Tutorial 8 - Creating Effective Web Pages
 
Cyclic redundancy check
Cyclic redundancy checkCyclic redundancy check
Cyclic redundancy check
 
Dreamweaver CS3
Dreamweaver CS3Dreamweaver CS3
Dreamweaver CS3
 
Tutorial PHP and Dreamweaver CS3
Tutorial PHP and Dreamweaver CS3Tutorial PHP and Dreamweaver CS3
Tutorial PHP and Dreamweaver CS3
 
Unit a adobe dreamweaver cs6
Unit a adobe dreamweaver cs6Unit a adobe dreamweaver cs6
Unit a adobe dreamweaver cs6
 
CRC Error coding technique
CRC Error coding techniqueCRC Error coding technique
CRC Error coding technique
 
Basic Web Design In Dreamweaver
Basic Web Design In DreamweaverBasic Web Design In Dreamweaver
Basic Web Design In Dreamweaver
 
Presentation on cyclic redundancy check (crc)
Presentation on cyclic redundancy check (crc)Presentation on cyclic redundancy check (crc)
Presentation on cyclic redundancy check (crc)
 
Error Detection And Correction
Error Detection And CorrectionError Detection And Correction
Error Detection And Correction
 

Semelhante a How to Use Dreamweaver cs6

1 Creating web pages in Word (Web Assignment 1) .docx
1  Creating web pages in Word  (Web Assignment 1)  .docx1  Creating web pages in Word  (Web Assignment 1)  .docx
1 Creating web pages in Word (Web Assignment 1) .docx
honey725342
 
Castro Chapter 2
Castro Chapter 2Castro Chapter 2
Castro Chapter 2
Jeff Byrnes
 
Castro Chapter 2
Castro Chapter 2Castro Chapter 2
Castro Chapter 2
Jeff Byrnes
 
BASIC HTML PROGRAMMING
BASIC HTML PROGRAMMINGBASIC HTML PROGRAMMING
BASIC HTML PROGRAMMING
Gautham Rajesh
 
Introduction To Drupal
Introduction To DrupalIntroduction To Drupal
Introduction To Drupal
Lauren Roth
 
3. tutorial html web desain
3. tutorial html web desain3. tutorial html web desain
3. tutorial html web desain
faizibra
 
Girl Develop It Cincinnati: Intro to HTML/CSS Class 1
Girl Develop It Cincinnati: Intro to HTML/CSS Class 1Girl Develop It Cincinnati: Intro to HTML/CSS Class 1
Girl Develop It Cincinnati: Intro to HTML/CSS Class 1
Erin M. Kidwell
 

Semelhante a How to Use Dreamweaver cs6 (20)

Artistic Web Applications - Week3 - Part 3
Artistic Web Applications - Week3 - Part 3Artistic Web Applications - Week3 - Part 3
Artistic Web Applications - Week3 - Part 3
 
1 Creating web pages in Word (Web Assignment 1) .docx
1  Creating web pages in Word  (Web Assignment 1)  .docx1  Creating web pages in Word  (Web Assignment 1)  .docx
1 Creating web pages in Word (Web Assignment 1) .docx
 
How to Develop Drupal Website
How to Develop Drupal WebsiteHow to Develop Drupal Website
How to Develop Drupal Website
 
Castro Chapter 2
Castro Chapter 2Castro Chapter 2
Castro Chapter 2
 
Castro Chapter 2
Castro Chapter 2Castro Chapter 2
Castro Chapter 2
 
Dw cs3-introduction
Dw cs3-introductionDw cs3-introduction
Dw cs3-introduction
 
BASIC HTML PROGRAMMING
BASIC HTML PROGRAMMINGBASIC HTML PROGRAMMING
BASIC HTML PROGRAMMING
 
Drupal7 Theming session on the occassion of Drupal7 release party in Delhi NCR
Drupal7 Theming session on the occassion of  Drupal7 release party in Delhi NCRDrupal7 Theming session on the occassion of  Drupal7 release party in Delhi NCR
Drupal7 Theming session on the occassion of Drupal7 release party in Delhi NCR
 
Artdm171 Week12 Hosting
Artdm171 Week12 HostingArtdm171 Week12 Hosting
Artdm171 Week12 Hosting
 
Dreamweaver_Abhijit
Dreamweaver_AbhijitDreamweaver_Abhijit
Dreamweaver_Abhijit
 
HTML course.ppt
HTML course.pptHTML course.ppt
HTML course.ppt
 
Web+html
Web+htmlWeb+html
Web+html
 
Dreamweaver
DreamweaverDreamweaver
Dreamweaver
 
Web development basics
Web development basicsWeb development basics
Web development basics
 
Introduction To Drupal
Introduction To DrupalIntroduction To Drupal
Introduction To Drupal
 
3. tutorial html web desain
3. tutorial html web desain3. tutorial html web desain
3. tutorial html web desain
 
Girl Develop It Cincinnati: Intro to HTML/CSS Class 1
Girl Develop It Cincinnati: Intro to HTML/CSS Class 1Girl Develop It Cincinnati: Intro to HTML/CSS Class 1
Girl Develop It Cincinnati: Intro to HTML/CSS Class 1
 
HTML.pptx
HTML.pptxHTML.pptx
HTML.pptx
 
Web Design Basics
Web Design BasicsWeb Design Basics
Web Design Basics
 
Dreamweaver8
Dreamweaver8Dreamweaver8
Dreamweaver8
 

Mais de Salman Memon

Mais de Salman Memon (20)

PHP Array very Easy Demo
PHP Array very Easy DemoPHP Array very Easy Demo
PHP Array very Easy Demo
 
Complete Lecture on Css presentation
Complete Lecture on Css presentation Complete Lecture on Css presentation
Complete Lecture on Css presentation
 
what is programming and its clear Concepts to the point
what is programming and its clear Concepts to the point what is programming and its clear Concepts to the point
what is programming and its clear Concepts to the point
 
Working with variables in PHP
Working with variables in PHPWorking with variables in PHP
Working with variables in PHP
 
Web forms and html (lect 5)
Web forms and html (lect 5)Web forms and html (lect 5)
Web forms and html (lect 5)
 
Web forms and html (lect 4)
Web forms and html (lect 4)Web forms and html (lect 4)
Web forms and html (lect 4)
 
Web forms and html (lect 3)
Web forms and html (lect 3)Web forms and html (lect 3)
Web forms and html (lect 3)
 
Web forms and html (lect 2)
Web forms and html (lect 2)Web forms and html (lect 2)
Web forms and html (lect 2)
 
Web forms and html (lect 1)
Web forms and html (lect 1)Web forms and html (lect 1)
Web forms and html (lect 1)
 
Managing in the Future Enterprise
Managing in the Future EnterpriseManaging in the Future Enterprise
Managing in the Future Enterprise
 
Overview of Technology Management
Overview of Technology ManagementOverview of Technology Management
Overview of Technology Management
 
Align Information Technology and Business Strategy
Align Information Technology and Business Strategy Align Information Technology and Business Strategy
Align Information Technology and Business Strategy
 
WHITE BOX & BLACK BOX TESTING IN DATABASE
WHITE BOX & BLACK BOXTESTING IN DATABASEWHITE BOX & BLACK BOXTESTING IN DATABASE
WHITE BOX & BLACK BOX TESTING IN DATABASE
 
Email security netwroking
Email security  netwrokingEmail security  netwroking
Email security netwroking
 
Email security - Netwroking
Email security - Netwroking Email security - Netwroking
Email security - Netwroking
 
Query decomposition in data base
Query decomposition in data baseQuery decomposition in data base
Query decomposition in data base
 
Time Management
Time Management Time Management
Time Management
 
Multimedea device and routes
Multimedea device and routesMultimedea device and routes
Multimedea device and routes
 
Hash function
Hash function Hash function
Hash function
 
Data clustring
Data clustring Data clustring
Data clustring
 

Último

Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
Krashi Coaching
 
Activity 01 - Artificial Culture (1).pdf
Activity 01 - Artificial Culture (1).pdfActivity 01 - Artificial Culture (1).pdf
Activity 01 - Artificial Culture (1).pdf
ciinovamais
 
Russian Escort Service in Delhi 11k Hotel Foreigner Russian Call Girls in Delhi
Russian Escort Service in Delhi 11k Hotel Foreigner Russian Call Girls in DelhiRussian Escort Service in Delhi 11k Hotel Foreigner Russian Call Girls in Delhi
Russian Escort Service in Delhi 11k Hotel Foreigner Russian Call Girls in Delhi
kauryashika82
 
Ecosystem Interactions Class Discussion Presentation in Blue Green Lined Styl...
Ecosystem Interactions Class Discussion Presentation in Blue Green Lined Styl...Ecosystem Interactions Class Discussion Presentation in Blue Green Lined Styl...
Ecosystem Interactions Class Discussion Presentation in Blue Green Lined Styl...
fonyou31
 

Último (20)

Call Girls in Dwarka Mor Delhi Contact Us 9654467111
Call Girls in Dwarka Mor Delhi Contact Us 9654467111Call Girls in Dwarka Mor Delhi Contact Us 9654467111
Call Girls in Dwarka Mor Delhi Contact Us 9654467111
 
Software Engineering Methodologies (overview)
Software Engineering Methodologies (overview)Software Engineering Methodologies (overview)
Software Engineering Methodologies (overview)
 
Sports & Fitness Value Added Course FY..
Sports & Fitness Value Added Course FY..Sports & Fitness Value Added Course FY..
Sports & Fitness Value Added Course FY..
 
Mattingly "AI & Prompt Design: Structured Data, Assistants, & RAG"
Mattingly "AI & Prompt Design: Structured Data, Assistants, & RAG"Mattingly "AI & Prompt Design: Structured Data, Assistants, & RAG"
Mattingly "AI & Prompt Design: Structured Data, Assistants, & RAG"
 
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
 
Accessible design: Minimum effort, maximum impact
Accessible design: Minimum effort, maximum impactAccessible design: Minimum effort, maximum impact
Accessible design: Minimum effort, maximum impact
 
Activity 01 - Artificial Culture (1).pdf
Activity 01 - Artificial Culture (1).pdfActivity 01 - Artificial Culture (1).pdf
Activity 01 - Artificial Culture (1).pdf
 
Russian Escort Service in Delhi 11k Hotel Foreigner Russian Call Girls in Delhi
Russian Escort Service in Delhi 11k Hotel Foreigner Russian Call Girls in DelhiRussian Escort Service in Delhi 11k Hotel Foreigner Russian Call Girls in Delhi
Russian Escort Service in Delhi 11k Hotel Foreigner Russian Call Girls in Delhi
 
fourth grading exam for kindergarten in writing
fourth grading exam for kindergarten in writingfourth grading exam for kindergarten in writing
fourth grading exam for kindergarten in writing
 
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...
 
Ecosystem Interactions Class Discussion Presentation in Blue Green Lined Styl...
Ecosystem Interactions Class Discussion Presentation in Blue Green Lined Styl...Ecosystem Interactions Class Discussion Presentation in Blue Green Lined Styl...
Ecosystem Interactions Class Discussion Presentation in Blue Green Lined Styl...
 
IGNOU MSCCFT and PGDCFT Exam Question Pattern: MCFT003 Counselling and Family...
IGNOU MSCCFT and PGDCFT Exam Question Pattern: MCFT003 Counselling and Family...IGNOU MSCCFT and PGDCFT Exam Question Pattern: MCFT003 Counselling and Family...
IGNOU MSCCFT and PGDCFT Exam Question Pattern: MCFT003 Counselling and Family...
 
Explore beautiful and ugly buildings. Mathematics helps us create beautiful d...
Explore beautiful and ugly buildings. Mathematics helps us create beautiful d...Explore beautiful and ugly buildings. Mathematics helps us create beautiful d...
Explore beautiful and ugly buildings. Mathematics helps us create beautiful d...
 
Advance Mobile Application Development class 07
Advance Mobile Application Development class 07Advance Mobile Application Development class 07
Advance Mobile Application Development class 07
 
9548086042 for call girls in Indira Nagar with room service
9548086042  for call girls in Indira Nagar  with room service9548086042  for call girls in Indira Nagar  with room service
9548086042 for call girls in Indira Nagar with room service
 
Student login on Anyboli platform.helpin
Student login on Anyboli platform.helpinStudent login on Anyboli platform.helpin
Student login on Anyboli platform.helpin
 
Measures of Dispersion and Variability: Range, QD, AD and SD
Measures of Dispersion and Variability: Range, QD, AD and SDMeasures of Dispersion and Variability: Range, QD, AD and SD
Measures of Dispersion and Variability: Range, QD, AD and SD
 
Arihant handbook biology for class 11 .pdf
Arihant handbook biology for class 11 .pdfArihant handbook biology for class 11 .pdf
Arihant handbook biology for class 11 .pdf
 
INDIA QUIZ 2024 RLAC DELHI UNIVERSITY.pptx
INDIA QUIZ 2024 RLAC DELHI UNIVERSITY.pptxINDIA QUIZ 2024 RLAC DELHI UNIVERSITY.pptx
INDIA QUIZ 2024 RLAC DELHI UNIVERSITY.pptx
 
Z Score,T Score, Percential Rank and Box Plot Graph
Z Score,T Score, Percential Rank and Box Plot GraphZ Score,T Score, Percential Rank and Box Plot Graph
Z Score,T Score, Percential Rank and Box Plot Graph
 

How to Use Dreamweaver cs6

  • 2.
  • 3. AGENDA – Introduction – Creating your local root folder – Creating a home page – Inserting and using tables – Previewing in browser – Creating Hyperlinks
  • 4. INTRODUCTION What is … Adobe Dreamweaver ? Why we … Use Adobe Dreamweaver ?
  • 5. INTRODUCTION – Dreamweaver is a complete website development and site management program. – It works with web technologies like HTML, XHTML, CSS, JavaScript, and PHP.
  • 6. INTRODUCTION – Web Designers – Developers – Visual interface for making and editing HTML websites and mobile apps – enabling cross-platform compatibility, to create pages http://php-editor-review.toptenreviews.com/
  • 7. INTRODUCTION <p align = “ ” > some text here </p> <input type= “ " name="fname" value=“Enter First Name" /> leftrightcenter textpasswordcheckboxradiosubmit
  • 8. CREATING YOUR LOCAL ROOT FOLDER • Create a new folder on your local root folder • Give the folder a brief, but descriptive name. Do not use capital letters, spaces, or special characters when naming folders and files for your website. All of your pages will be saved within this folder. • Open the folder, and create another new folder inside. Name this folder “images” (make sure the file name is lower case). Put all of your images, buttons, movie files, etc. inside the images folder.
  • 9. CREATING YOUR LOCAL ROOT FOLDER 1. Click Site > Manage Sites. 2. Click New > Site. 3. Select the Site tab. 4. Enter a name for the site in the Site Name text field (This name will be for your use only – it will not be published with your site.)
  • 10. CREATING YOUR LOCAL ROOT FOLDER 1. Click on the Server tab located on the left side of the toolbar. 2. To add a server, click the + symbol from the bottom left-hand corner of the window. 3. Type in Server Name text field “morning_shift”. 4. Now select from Connect using selected fields Local/Network. 5. Browse Server Folder and gave path of your local root folder 6. Finally insert url in Web URL i.e http://localhost/your_folder_name
  • 11. CREATING YOUR LOCAL ROOT FOLDER 1 2 3 4 5 6
  • 12. CREATING A HOMEPAGE • 1. To add a new page go to File > New and choose a basic HTML page. Save this page by clicking File >Save As. Name the first page index.html. This will be the first page that users encounter when they visit your site. Save this file to your local root folder as index.html. Naming the homepage index.html tells the Web browser that this is the first page it should open when someone visits your site. • 2. After your homepage index.html is created, you can use this page as a template layout for all the other pages in your site. Simply hit Save As and name the file whatever you wish, but be sure to keep the name is simple, for example history.html, resume.html, etc. Remember not to use capital letters or spaces when naming files, this will make it easier for web browsers to find your files. • 3. To save the pages of your site simply click File > Save for each page. Make sure your homepage is named index.html, and save all of your files in the folder you chose when you defined your site, i.e. in your local root folder.
  • 13. CREATING A HOMEPAGE – Document Types <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www. w3.org/TR/html4/loose.dtd“ > is called a “doctype,” and it simply identifies what flavor of HTML you used to write the page. Developers have used two doctypes for years HTML 4.01 and XHTML 1.0—and each has two styles: strict and transitional.
  • 14. CREATING A HOMEPAGE – Dreamweaver even lets you use the latest, greatest, and simplest doctype, HTML5 – <!DOCTYPE HTML>
  • 15. INSERTING AND USING TABLES – To insert a table, follow these steps: – In the main menu, click Insert > Table. – Insert the amount of Table Rows and Columns. – Set Table Width to between 600 and 800 pixels. – Set Border Thickness. To have a visible border type in 1 or higher, to have no border type in 0. – Cell Padding adds room inside of a cell. Enter 0 for no space or a number to Increase the space. – Cell Spacing adds space between cells. Enter 0 for no space or a number to Increase the space. – Click Ok.
  • 17. INSERTING AND USING TABLES PROPERTIES OF TABLES PROPERTIES OF CELLS INSIDE TABLE
  • 18. PREVIEWING IN BROWSER – Choose File > Preview in Browser. – Hit F12. – Click on the world icon located on the toolbar at the top of your page
  • 19. CREATING HYPERLINKS – Select the text or image you would like to make a hyperlink. – Click on the small folder next to the Link field in the Properties Inspector. – Browse through the files, and select the page you would like to link. – Click Choose.
  • 20. For More go to … • https://www.youtube.com/channel/UCpcZm0 dA1leAK9dkxV0qvSw