create a website with google sites lan vu. overview review on web designing create a website with...
TRANSCRIPT
Create a website with Google Sites
Lan Vu
Overview•Review on Web Designing•Create a website with Google Sites
Review on Web Designing1. Select content for your website2. Some concepts of web design3. Select tools for web design4. Design Techniques5. Publish your website on UCD’s
server
Select content for your website1. Transcript 2. Resume 3. Letters of Recommendation4. Internship Information5. Course Work6. Certifications 7. Academic Recognition/Awards 8. Leadership Positions9. Volunteer Work 10. Student Government 11. Hobbies, extracurricular info
Ex: http://www.florian.verhein.com/
Some concepts of web design1. Website2. Webpage3. HTML language4. Page layout5. Theme
What is Website ?•It is a collection of ▫Web pages▫Images▫Videos▫Other digital assets
Databases
Music
Game
*.ppt, *.pptx
*.doc, *.docx
Web page•Website is a collection of Web pages
•A Web page is a document on World Wide Web
•Web page is usually in HTML or XHTML format
•Every Web page is identified by a unique URL (link)
•It can be accessed through a web browser (Internet Explorer , Fire fox)
HTML language•Hypertext Markup Language (HTML) is an language used
to present content of a web page
•HTML web page is a file with extension *.html or *.htm▫Ex: mypage.html, bio.htm
index.html , index.htm (default page)
•Viewed by using web browsers ▫Internet Explorer, Fire Fox, Opera, Safari
Layout of Web page
Themehttp://www.cs.colorado.edu/~hughesal/
Index.html
research.htmlpublications.html
contact.html
Select tools for web design•Self design your ePortfolio website by
using web development tools
•Create ePortfolio website by using existing online services
Design Techniques1. Layout of web pages should be easy navigation
and visually appealing
2. Use one theme for all pages of website to create a consistent look throughout your website
3. Use CSS to predefine set of rules of presenting web page easy on apply one theme for many pages
4. Use existing templates to save designing time
Publish your website on UCD’s server
1. Connecting to host using WinSCP Host: ouray.cudenver.edu Username: your username used to log in to UCD’s email Password: your password used to log in to UCD’s email
2. Create html_public folder in UCD’s host3. Copy all web pages from your local computer to
html_public folder 4. Browse your website at link
http://ouray .cudenver.edu/~yourusername
Create your websitewith Google Sites
Create website using online services
•Use online services for auto creating website and web pages▫Google Sites (http://sites.google.com )
▫Wikipedia ( www.wekipedia.org )
▫Blogger (www.blogger.com)
▫And so much more
Create website using online services
•Benefits:▫No HTML knowledge is required▫Fast▫Most are Free▫Easy to do▫Usually provide some templates for your choice
Create website using online services
•Drawback: NOT flexible ▫Not provide all needs for a website▫Available web layouts and templates may not fit
your desire▫Web content may be limited by services
provided by provider
Create a website with Google Sites
•Why choose Google Sites?▫Free▫Easy to use▫Support many types of content Image, Movies, Calendar, Google Map …
▫Good choice for a personal websitehttp://www.youtube.com/watch?v=X_KnC2EIS5w
What do we do ?
1. Set up a Google Account
2. Create a new Website
3. Create a Web Page
4. Edit a Web Page
5. Manage website
6. Change site layout
7. Change site theme
Setting up a Google account
1. Visit the link http://sites.google.com
or select menu More Sites at the Google homepage
Setting up a Google account
2. If you have a Google Account, sign in to your account and doneNote: Your Gmail account will work.
Otherwise, click on “Sign up for site” to register a new one.
Setting up a Google account
3. If you have to “Sign up for site”▫Fill in the Create an Account Form
You can use any email address to create Google Account
▫Google will send you an email for Account Activation,
▫Click on the link in the email
▫Sign in your account after Account Activation is completed
Setting up a Google account
Account activation
Fill in the form Sign in
What do we do ?
1. Set up a Google Account
2. Create a new Website
3. Create a Web Page
4. Edit a Web Page
5. Manage website
6. Change site layout
7. Change site theme
Creating a new website1. Sign in your Google account (done from
previous steps)
2. Click on “Sites” on the my products section
3. Then click on “Create Site”
Creating a new website
4. Setting up website information▫Choose a temple
Ex: Blank template
▫Enter your Site Name: Ex: Lan Vu’s Website
▫ Enter URL for your site Ex: “lanvu” and your website link is
http://sites.google.com/site/lanvu▫Choose a Theme
Ex: Iceberg
▫Enter the code and click Create button
Creating a new website
• Note: You can test your new website after this step by logout your account and enter your website link in web browserEx: enter http://sites.google.com/site/lanvu in your IE browser , it will show
What do we do ?
1. Set up a Google Account
2. Create a new Website
3. Create a Web Page
4. Edit a Web Page
5. Manage website
6. Change site layout
7. Change site theme
Creating a web page
1. Sign in to your Google account 2. Select Sites from menu More3. Select the website you want to edit
Note: skip step 1 – 3 if you are still signed in after creating your website.
Creating a web page
4. Click the button Create page in the web design from
Create a web page1. Select template for your web page
Ex: Web Page, Announcements …
2. Enter the page name Ex: Home , Project, Course …
3. Select page level Top level: same level with Home
page Under Page X : sub page of Page X4. Press Create Page button
Editor Toolbar
Page title
Page Content
1. Edit Page title & Page content by using Editor Toolbar
2. If page have download file, attach the file in Attachment section
3. Click on Save when completed
What do we do ?
1. Set up a Google Account
2. Create a new Website
3. Create a Web Page
4. Edit a Web Page
5. Manage website
6. Change site layout
7. Change site theme
Editing a web page
1. Select the web page in sidebar section2. Click the button Edit page3. Edit the page content like what you
did when create an webpage
Editing a web page
Editing a web page
Editor Toolbar
Editing a web page
•Allow inserting many types of content▫Text ▫Image▫Link▫Calendar▫YouTube clip▫Google map ,
Menu Insert
Editing a web page
•Allow formatting the content easily by using editor toolbar and menu Format
Menu Format
Editing a web page
•Add & edit tables by using menu Table
Menu Table
Editing a web page
•Allow setting page layout in just one click by using menu Layout
Menu Layout
Some other page actions
What do we do ?
1. Set up a Google Account
2. Create a new Website
3. Create a Web Page
4. Edit a Web Page
5. Manage website
6. Change site layout
7. Change site theme
Managing your website
•Site contents▫Pages, Attachments, Page templates•Site settings▫Site name, Domain name, Monetize …•Site appearance▫Site layout, Colors, Fonts, Themes
Managing your website
•Open Site Manager page
Managing your website
•Select an option & edit option values
Site manager
What do we do ?
1. Set up a Google Account
2. Create a new Website
3. Create a Web Page
4. Edit a Web Page
5. Manage website
6. Change site layout
7. Change site theme
Changing Site Layout
1. Open Site Manager
2. Select Site layout in Site appearance section
3. Press the button Change site layout
4. Select options in Change site layout box OK
Changing Site Layout
Changing Site Layout
What do we do ?
1. Set up a Google Account
2. Create a new Website
3. Create a Web Page
4. Edit a Web Page
5. Manage website
6. Change site layout
7. Change site theme
Changing Theme of Website1. Open Site Manager
2. Select Themes in Site appearance section
3. Select one Theme you like
4. Click on Preview to see the website with new themes
5. Click Save Change if selected theme is OK
Changing Theme of Website