JINSI YA KUTENGENEZA BLOGS

 Ufuatao ni mwanzo wa mada ya uundaji wa website
Ni somo refu ila tutajitahidi kila tupatapo nafasi kulizungumzia ili kila moja wetu aelewe
Malengo ya hii mada
1. Watu waweze kuzijua website zinavyo undwa
2. Watu waweze kuunda website wenyewe
3. Group tutakaa na tuunde social website moja
Naamin tutaweza cha msingi kuwa makini

Lugha zitakazo fundishwa
1. Html
2.php
3. Javascript

Note...
Umoja ni nguvu
So lazime tuushangaze ulimwengu

Natamani tuje kuwa kama wakina markzagati

Naomba mwenyezi mungu atufungulie milango na atupe nguvu umoja na amani

Note...
Mada ni ndefu
So leo tunafungua ukurasa wa 1 kama ifuatavyooooo...
[5/14, 12:21] ‪+255 692 296 735‬: Je... blog ndio website...

Maelfu ya watu ni  mablogger na hata wewe pia waweza miliki blog yako kwa muda usiozidi robo saa ...

Mfano wa  blog ni uswahilini.blogspot.com
Au uswahilini.wordpress.com

Hiyo ni mifano kazaaa tu ya blog... na kazii hii imerahisishwa zaidi na google pamoja na wordpress...
Ukitakaaa kujua zaidi pakua app ya  logger au wordpress ujifunze zaidi...

Sifa kuu ya blog ni uwezo wa kupost current issue na kupost frequently sekunde yeyote ile ukitaka kupost kwa sababu tumeundiwa app za kujidai na wala si lazima uwe unaujuzi wa computer ndo  uwe na blog
Chamsingi ni uweunajua kusoma na kuandika tu na  uwe na simu inayosupport
Lakini kuna some case lazima
Uwe unajua html ipasavyo ili blog iwe n muonekano u anao vutia

...................

Website si sawa na blog
Kwa sababu zitakuhitaji uandike code ndo upost so everything involve code kwa sababu hiyo uwezi ukawa unapost kila sekunde
Kama blog
Mfano wa website ni
 www.necta.go.tz
www.nacte.go.tz
Na nyingine nyingi mfano facebook

Najua wengi mtappigwa na bbutwaaaa facebook nayo ni website...???

Swali utalipatia majibu ya usahihi pale tutakapo shikana bega kwa bega

Kuna website ambazo ni za kijamiii
[5/14, 12:21] ‪+255 692 296 735‬: World wide webu(WWW)
Is the giant collection of documents or pages, stored on computers around the globe (called web).

#webpages zinatunzwa ktk servers
Ambayo ni computer iliyoundwa kwa kutunza na kusambaza taarifa.

#ukiplace document ktk server ...
Server itaionyesha kwa watumiaji wengine watakaohitaji kuiona.

URLS & LINKS
#kila page ktk web ina anuani tofauti.

#URL - UNIFORM RESOURCE LOCATOR

#unaweza view page kwa links (hyperlinks).

#kitendo cha kuview webpages kinaitwa web surfing.

#Browsers - ni program maalumu zinazo retrieve web pages from servers na kuzidisplay ktk computer za watumiaji.
Mfano# microsoft internet explorer
Netscape navigator
Apple's safari
Mozila firefox na opera

Note...
Unapoandika html code
Kumbuka sio users wote wana most recent version of a particular browser.
[5/14, 12:21] ‪+255 692 296 735‬: HTML CODING
inahusisha tags


#tags ni individual instructions ktk browser na zimezungukwa na brackets <> kubwa kuliko na ndogo kuliko.

Unapoandika tags unaweza andika kwa herufi kubwa au ndogo.

Kuweka coding easy to read
Most users wanaandika kwa herufi kubwa kutofautisha coding na maneno mengine ktk page.

Tags ... zinahusisha pia attributes
......... unaweza define vitu kama vipimo vya page, color values.

HTML STANDARDS
WWW ina set HTML standards.

HTML VERSION
Version inayotumika sana niHTML version 4
Kwa sababu
Inaruhusu separate formating instruction
Zinazoitwa
#cascading style sheets (CSS) na other presentation control.
[5/14, 12:21] ‪+255 692 296 735‬: UTANGULIZI WA HTML
webpages zinatengenezwa kwa HTML (hypertext markup language).

HTML
#ni document zinazo husisha text na coding zinazoijenga web browser jinsi gani y kudisplay hizo taarifa.

#html documents ktk file extension zinatambulika kwa
.html    au    .htm

#NOTE
#web browser zinasoma HTML document, hauhitaji platform maalumu kama windows , unix au mac kuzitazama hizo information.
[5/14, 12:21] ‪+255 692 296 735‬: Explore web browsers


Web browsers
Zimeundwa kusoma HTML instruction na kudisplay content ktk screen yako.

Kudisplay html files ulizosaves ktk computer yako zinaitwa local pages.

Lakini pia inatuma HTML

NA inatumika kutest html pages zako.
Web browser hiyoooo
[5/14, 12:22] ‪+255 692 296 735‬: Browser discrepancies

Kila browser ina interprets html code kivyake
Means
Webpages hazionekani sawa kutoka browser 1 na nyingine.

Html standardization inasaidia kuondoa utofauti lakini si kwa asilimia zote.

Note...
Kwa sababu hiyo unahitaji kuandika clean well formed html codes
Na uwe umezitest browser mbalimbali kuona varying results.

Test to...
Opera...
Microsoft internet
Www.netscape.com
Www.w3.org/Amaya



Kwa leo naomaba niishie apa

Uliza maswali kutoka  na nilichosema apa usichokonoe sana coz ndo introoooooo

By chipa...
[5/14, 12:22] ‪+255 692 296 735‬: Download blogger au wordpress
[5/14, 12:22] ‪+255 692 296 735‬: Ndugu website inaitaji uvumilivu coz INA lugha kubwa 3 na ndio leo tumeanza na moja ya HTML tena introduction
[5/14, 12:22] ‪+255 692 296 735‬: Explore HTML Editors
Siku hizi kuna program nyingi kwa ajili ya kuandikia HTML  code.

Simple text editors (plan-text editors)
-Nirahisi kupatikana na computer nyingi huwa zinakuja na moja
Kama vile windows Notepad.

Lakini pia wawezatafuta sharewere and freewere version ktkk internet kama vile
Textpad
Edit pad lite
UtraEdit
Au   notepad++

#word processing programs.
---lakini pia waweza tumia word processing kama vile
Microsoft word kuandikia HTML.


UNDERSTANDING HTML SYNTAX AND RULE
HTML-Nilugha rahisi kwa ajili ya  kuelezea web page content.


Html... rules zinaitwa syntax
Govern the way in which  code is written.

Avoid syntax error...
Kuzuia btml errors unatakiwa kuzipitia code zako mara kwa mara na uhakikishe brackets ktk tags zipo na closing tags ziwe na slash /


***** unatakiwa uzungushie values zote ulizo define ktk attributes kwa quotantion mark   "  ".
[5/14, 12:22] ‪+255 692 296 735‬: TO VIEW HTML CODE IN A BROWSER

view the source code by the following step

1. Open your browser window to the page you want to view
Mfano... ingia mozila fire fox na open facebook ( usilog in ishia apo apo)

2. Click view
3. Click source (internet explorer)
Au pagesource (navigator)

A window appers displaying the html source code for the page.
Code za facebook page zitafunguka.... na tazama kidogo...

4. Click the close button when you fineshed.
Window itajifunga...

Faida yake ...
Inakusaidia kujua madeveloper wengine wanaandikaje code na wametumia ubunifu gani...
Na zitakusaidia kuunda new ideas... for your own pages...
Lakini pia waweza zisave...

Save an html document

1. With the source code window open ... click file...

2. Click save As (internet explorer
Au save page as (navigator

3. Navigate to the folder where you want to store the page
Name
Save...
[5/14, 12:22] ‪+255 692 296 735‬: Save an html document

When naming a web page, do not use spaces and keep your file names to letters and numbers.

If you are creating a main page for a website, it is common to name the page index.html or default.html

Steps

1. Click file
2.click save
3. Navigate to the folder or drive where you want to store the file.

Select folder or drive

4. Click save as type and select textdocument.

5. Type a name for the file, followed by .html or .htm

Eg... chipa.html

6. Click save

A dialog box may appear prompting you that all the formating will be removed.

7. Click   yes
... the file is saved.
[5/14, 12:22] ‪+255 692 296 735‬: View an html page...

Steps

1. Open your web browser

2. Click file

3. Click open

The open dialog box appears.

4. Click browse

5. Navigate to the folder or drive in which your html document is stored.

6. Click the file name.

7. Click open

Open dialog box displays the path and name of the file.

8. Click ok.

The web browser display the page

Note...1...
You can't see metadata information on the browser page.

Note...2...
Both browsers are set up to view pages offline as well as online.

So sio mpaka uwe na bando ndo ujaribu
We jaribu tu
[5/14, 12:23] ‪+255 692 296 735‬: <html>
<head>
<title>WEBSITE</title>
</head>
<body>
<h1>website language</h1>
<p>siku yangu ya kwanza kuandika html code<br>
Jamani nitatuma screen shot muangalie nimepatia au nimekosea...
</p>
</body>
</html>
[5/14, 12:23] ‪+255 692 296 735‬: Add a document declaration
The transional version of html is the most inclusive version you can use.
Na huwa tunaiandika mwazoni mabisa kabla ya chochote ktk page...
Steps...

1. Open the html document you want to edit.
2. Insert a new line before <html> tag
3. Type the doctype declaration
to specify html 4.0 transional... type
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 transitional//EN" "http://www.w3.org/TR/REC-html40loose.dtd">

You need to place enter to continue the coding to a new line.

To specify stricty na frameset nitawapa code zake siku nyingine...


Add metadata
Bila shaka metadata nilishaelezea ni nini  naenda katika step direct
Steps.....

ADD AN AUTHER NAME
1. click btn the <head> and </head> tags to start a new line

2. Type <METADATA = "auther" and a blank space

3. Type CONTENT = "My Name">
replacing my name with yours

4. Press enter


ADD A PAGE DESCRIPTION
5. Type <METANAME ="description" and a blankspace...

6. Type CONTENT="Page description">
Replace page description with your own page description.

7. Press enter

SPECIFY KEY WORDS
8. type <METANAME="keywords" and a blank space.

9. Type CONTENT="mykey words">
For multiple key words use a space and commas to separate each keyword.

10. Press enter

ADD A COPYRIGHT
11. Type <METANAME"copyright"and a blankspace...

12. Type CONTENT="2017">
Replacing 2017 with your own number or copyright information

13. Press enter


Note...
Metadata does note appear on the webpage itself.
The information you insert in the metadata tags is useful with search engines that glean information about your page.
[5/14, 12:24] ‪+255 692 296 735‬: Mfano...


<!DOCTYPE HTML PUBLIC"-//W3C//DTD HTML 4.0 frameset//EN"
"http://www.w3.orgKR/REC-html40/frameset.dtd">
<html>
<head>
<title>website</html>
<METANAME="auther"CONTENT="chipa">
<METANAME="description"CONTENT="chipa website creation">
<METANAME="keyword"CONTENT="blogs, website, apps, into the bad land">
<METANAME="copyright"CONTENT="@2017">
</head>
<body>
<h1>kuandika html document</h1>
<p>ni mtu moja tu jana alifanyikiwa kufika nilipotaka na akatuma screen shot ya mafanyikio yake ....<br>wengine sielewi kama tupo pamoja ...<br>ebu andika hizi code ktk pc yako na u tume picha ulipofikia</p>
</body>
</html>
[5/14, 12:24] ‪+255 692 296 735‬: Creating new paragraph...

Creating a paragraph tags to start new paragraphs in an html document.

1. Type <p> infront of text you want to creat as a new paragraph.

2. Type </p> at the end of the paragraph.


Change paragraph ALIGNMENT

You can use align attribute within numerous tag elements, including , headings, lists and more...

Eg...
You can center a heading or right-align a bulleted list.

1. Click inside the <p>tag in which you want to change alignment.

2. Type ALIGN="?"
replace the ? With center, left, right, or justify.



Add a LINE BREAK

you can use breaktag <br> to creat a line break to start a new line of text.
....
Also used to add extra blank lines btn paragraphs.

Steps...

1. Type <br> infront or at the end of each line of text that you want to as a new line.

Note...
You do not need a close tag for the <br> tag.


Insert a BLANK SPACE
you can insert blankspace within a line of text to create idents or add emphasiss to the text.

You can also use blank space to help position elements on a webpage such as a graphic or photo...

1. Type &nbsp;
In the line you want to add a blank space.
To add multiple spaces , type the code multiple times.