Basic web site
architecture
What do we mean by creating and maintaining a root folder
or directory?
Rule #1 for this
course.
Before we get started building our root folder, which will become our web
site, unless otherwise ...
and…a word about
folders and files…
When we start building our root folder on the desktop, we will refer to it as
a folder...
A root folder consists of…

index.html

An index.html file is your home page. It is the default file in the root folder
an...
A root folder consists of…

index.html
desktop.css

A CSS file (cascading style sheet) contains the styles to be used for ...
A root folder consists of…

index.html
desktop.css
images

An images folder that will contain jpegs, gifs, pngs and .ico (...
A root folder consists of…

index.html
desktop.css
images
media

A media folder, for example, and other folders as needed....
A web page consists of…
o Tables or divs to control
the layout and design of
the page elements
A web page consists of…
o Tables or divs to control
the layout and design of
the page elements
o Text
A web page consists of…
o Tables or divs to control
the layout and design of
the page elements
o Text
o Graphics
A web page consists of…
o Tables or divs to control
the layout and design of
the page elements
o Text
o Graphics
o Other e...
So…let’s get started building our
web site.
Upcoming SlideShare
Loading in …5
×

Web site architecture

1,330 views

Published on

A brief description of basic web folder contents and organization.

Published in: Technology, Design
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
1,330
On SlideShare
0
From Embeds
0
Number of Embeds
803
Actions
Shares
0
Downloads
15
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Web site architecture

  1. 1. Basic web site architecture What do we mean by creating and maintaining a root folder or directory?
  2. 2. Rule #1 for this course. Before we get started building our root folder, which will become our web site, unless otherwise noted, please use lowercase letters for all folders (directories) and files in your site. Do not put spaces in between words (you can use an underscore to separate words if you wish) and do not use nonletter or number symbols. Computers on the internet use the Unix language which is case sensitive and does not allow for spaces or certain illegal characters, e.g. /, #, ~
  3. 3. and…a word about folders and files… When we start building our root folder on the desktop, we will refer to it as a folder (no surprise there). However, when we upload folders to our web site, we may start to refer to these same folders as directories. This mysterious change of identity really comes about more as a result of how the desktop and server environments have evolved over the years, but do not let it confuse you. During this course, I may refer to folders and directories interchangeably, but will try to call folders folders when on the desktop, and folders directories when they reside on the server.
  4. 4. A root folder consists of… index.html An index.html file is your home page. It is the default file in the root folder and is the landing page when a client visits your web site. HTML files are written in hypertext markup language (HTML). You can do this manually, or Dreamweaver will write the code for you as you design your page. You must have an index.html file in your root folder, otherwise you will need to provide clients with a URL (web address) to a specific file.
  5. 5. A root folder consists of… index.html desktop.css A CSS file (cascading style sheet) contains the styles to be used for web site pages. You can call this file whatever you want, but it must end in .css and must be written in css language. In this example, we are creating a style sheet for how our page will look on a desktop computer, hence desktop.css. You can write css code manually or Dreamweaver will do it for you. You can have multiple style sheets in your site as we will see later in the course.
  6. 6. A root folder consists of… index.html desktop.css images An images folder that will contain jpegs, gifs, pngs and .ico (bmp) files to be used in our pages and throughout the web site. These are the main image file types that can be used on the web. We will discuss the different files types and when to use them in a later lesson.
  7. 7. A root folder consists of… index.html desktop.css images media A media folder, for example, and other folders as needed. The main point is that your root folder should be organized and not a long list of miscellaneous files.
  8. 8. A web page consists of… o Tables or divs to control the layout and design of the page elements
  9. 9. A web page consists of… o Tables or divs to control the layout and design of the page elements o Text
  10. 10. A web page consists of… o Tables or divs to control the layout and design of the page elements o Text o Graphics
  11. 11. A web page consists of… o Tables or divs to control the layout and design of the page elements o Text o Graphics o Other elements including o Links o Menus o Media o Forms
  12. 12. So…let’s get started building our web site.

×