Kamis, 03 Maret 2016

Membuat Web Sekolah

Assalamu'alaikum Wr.Wb

Hari ini saya akan sharing web sekolah SMK buatan saya,

1. Tampilan Home

 <!DOCTYPE html>
<html>
    <head>
        <title>Web SMK</title>
        <style type="text/css">
            body {
                color: #666666;
                background-color: #f9f8f6;
                background-position: center;
                font-family: Georgia, Times, serif;
                line-height: 1.4em;
                margin: 0px;}
            .wrapper {
                width: 940px;
                margin: 20px auto 20px auto;
                border: 2px solid #000000;
                background-color: #ffffff;}
            header {
                height: 160px;
                width: 100%;
                background-image: url("images/headers.png");}
            h1 {
                text-indent: -9999px;
                width: 940px;
                height: 130px;
                margin: 0px;}
            nav, footer {
                clear: both;
                color: #ffffff;
                background-color: green;
                height: 30px;}
            nav ul {
                margin: 0px;
                padding: 5px 0px 5px 30px;}
            nav li {
                display: inline;
                margin-right: 40px;}
            nav li a {
                color: #ffffff;}
            nav li a:hover, nav li a.current {
                color: #000000;}
            section.courses {
                float: left;
                width: 659px;
                border-right: 1px solid #eeeeee;}
            article {
                clear: both;
                overflow: auto;
                width: 100%;}
            hgroup {
                margin-top: 40px;}
            figure {
                float: left;
                width: 290px;
                height: 220px;
                padding: 5px;
                margin: 20px;
                border: 1px solid #eeeeee;}
            figcaption {
                font-size: 90%;
                text-align: left;}
            aside {
                width: 230px;
                float: left;
                padding: 0px 0px 0px 20px;}
            aside section a {
                display: block;
                padding: 10px;
                border-bottom: 1px solid #eeeeee;}
            aside section a:hover {
                color: #985d6a;
                background-color: #efefef;}
            a {
                color: #de6581;
                text-decoration: none;}
            h1, h2, h3 {
                font-weight: normal;}
            h2 {
                margin: 10px 0px 5px 0px;
                padding: 0px;}
            h3 {
                margin: 0px 0px 10px 0px;
                color: #de6581;}
            aside h2 {
                padding: 30px 0px 10px 0px;
                color: #de6581;}
            footer {
                font-size: 80%;
                padding: 7px 0px 0px 20px;}
        </style>
        <!--[if lt IE 9]>
        <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
        <![endif]-->
    </head>
    <body>
        <div class="wrapper">
            <header>
                <h1>SMK Web</h1>
                <nav>
                    <ul>
                        <li><a href="home.html" class="current">home</a></li>
                        <li><a href="visimisi.html">Visi Misi</a></li>
                        <li><a href="sejarah.html">Sejarah</a></li>
                        <li><a href="lokasi.html">Lokasi</a></li>
                        <li><a href="kontak.html">kontak</a></li>
                        <li><a href="Galery.html">Galery</a></li>
                    </ul>
                </nav>
            </header>
            <section class="courses">
                <article>
                    <figure>
                        <img src="images/jurusanKPR.jpg" alt="Keperawatan" width="100%" height="100%" />
                        <figcaption>Keperawatan</figcaption>
                    </figure>
                    <hgroup>
                      
                        <h3></h3>
                    </hgroup>
                    <p></p>
                </article>  
                <article>
                    <figure>
                        <img src="images/jurusanTKR.jpg"alt="Teknik Kendaraan Ringan" width="100%" height="100%" />
                        <figcaption>Teknik Kendaraan Ringan</figcaption>
                    </figure>
                    <hgroup>
                      
                        <h3></h3>
                    </hgroup>
                    <p></p>
                </article>  
            </section>
            <aside>
                <section class="popular-recipes">
                    <h2>Kabar Terbaru</h2><hr>
                    <a href="">Uji Kopetensi Kejuruan (UKK) SMKN 11 Malang</a>
                    <a href="">Pelepasan Mahasiswa Magang Univ. Kanjuruan</a>
                    <a href="">Review Dan Pemantapan kisi kisi Dan Soal Lks Nasional Ke XXIV</a>
                    <a href="">Penjemputan Mahasiswa KPL Univ. Negeri Malang</a>
                    <a href="">Pengamanan dan Pemeliharaan Barang Milik Daerah Tahun 2015</a>
                    <a href="">Rapat Koordinasi Kajian dan Praktik Lapangan (KPL) LP# UM dan Sekolah Mitra</a>
                    <a href="">Full Asesmen oleh BNSP</a>
                    <a href="">Simulasi UNBK Tahap 2</a>
                    <a href="">Try Out Online dan Bimtek Proktor SMK Ujian Nasional Berbasis Komputer Tahun 2015/2016</a>
                </section>
                <section class="contact-details">
                    <h2>Kontak</h2>
                    <p><br />
                      
                </section>
            </aside>
            <footer>
                &copy;smkmuhammadiyah2.sch.org
            </footer>
        </div><!-- .wrapper -->
    </body>
</html>


2. Tampilan VisiMisi
 <!DOCTYPE html>
<html>
<head>
    <title>visimisi</title>
<style>
ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #333;
}

li {
    float: left;
}

li a {
    display: block;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}

li a:hover:not(.active) {
    background-color: #111;
}

.active {
    background-color: #4CAF50;
}
</style>
</head>
<body>
<ul>
  <li><a href="index.html">Home</a></li>
  <li><a class="active" href="visimisi.html">Visimisi</a></li>
  <li><a href="sejarah.html">Sejarah</a></li>
  <li><a href="lokasi.html">Lokasi</a></li>
  <li><a href="contact.html">Contact</a></li>
  <li><a href="Galery.html">Galery</a></li>
</ul>
<h1>VISI DAN MISI SMK Negeri 11 MALANG</h1>
</div>
    <b>A. VISI</b><br>
    1. Mewujudkan SMK PGRI 1 Kudus yang berkualitas, unggul, beriman, dan bertaqwa, berbudi luhur, memiliki lingkungan yang sehat, bersih, aman dan nyaman.<br>
    2. Serta menghasilkan tamatan yang profesional di Dunia kerja tingkat menengah bertaraf nasional dan Internasional<br> 
    <b>B. MISI</b><br>
    1. Meninkatkan keterampilan siswa pada setiap program melalui pengembangan dan analisis KTSP sesuai dengan perkembangan Dunia Usaha dan Dunia Industri.<br>
    2. Mewujudkan proses belajar mengajar melalui Competency Base Training dengan berstandar pada kompetensi keahlian yang berorientasi pada program masing – masing.<br>
    3. Mengembangkan life skill (kecakapan hidup) melalui kegiatan ekstrakurikuler, latihan berwirausaha dengan keahlian spesifik yang berstandar pada kompetensi keterampilan kerja.<br>
    4. Mengembangkan program keahlian yang merupakan tuntutan pasar kerja, menanamkan budaya kerja dan sikap profesional untuk menunjang hidup layak melalui pengembangan karier.<br>
    5. Membentuk sikap dan perilaku santun serta berbudi luhur berbasis IPTEK dan IMTAQ dengan menjunjung tinggi nilai-nilai luhur budaya bangsa.<br>
    6. Mengkondisikan lingkungan sekolah yang sehat, bersih, aman dan nyaman. 7. Melengkapi fasilitas belajar dan fasilitas kebersihan yang aman dan nyaman.<br>
</body>
</html>

3. Tampilan Sejarah
 <!DOCTYPE html>
<html>
<head>
    <title>sejarah</title>
<style>
ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #333;
}

li {
    float: left;
}

li a {
    display: block;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}

li a:hover:not(.active) {
    background-color: #111;
}

.active {
    background-color: #4CAF50;
}
</style>
</head>
<body>
<ul>
  <li><a href="index.html">Home</a></li>
  <li><a href="visimisi.html">Visimisi</a></li>
  <li><a class="active" href="sejarah.html">Sejarah</a></li>
  <li><a href="lokasi.html">Lokasi</a></li>
  <li><a href="contact.html">Contact</a></li>
  <li><a href="Galery.html">Galery</a></li>
</ul>

<center><h1><b>Sejarah SMK Negeri 11 Malang</b></h1></center>
<p>SMK Negeri 11 Malang didirikan tahun 2007 sebagai alih fungsi dari SMA Negeri 11 Malang berdasarkan Surat Keputusan Pendirian No 45 tanggal 1 Mei 2007 dan Nomor Statistik Sekolah 321056105027. SMK Negeri 11 Malang beralamat di Jalan Pelabuhan Bakahuni No 1 Kelurahan Bakalan Krajan Kecamatan Sukun Kota Malang Kode Pos 65148 Telp 0341-836330 Fax 0341-837271,   dengan luas keseluruhan 1.970 m2. Ibu Dra. Aksihari, M.Pd adalah Kepala Sekolah Pertama. Secara resmi tanggal 1 Mei ditetapkan sebagai Hari Ulang Tahun SMK Negeri 11 Malang. Program alih fungsi ini dilaksanakan oleh Pemerintah Kota Malang untuk merealisasi program kemendiknas tentang ratio perbandingan antara SMK dan SMA 70:30</p>

<p>Pada tahun pelajaran 2007-2008 komposisi siswa SMK Negeri 11 Malang hanya terdiri atas empat kelas dengan jumlah siswa sebanyak 154 siswa yang terbagi atas 3 (tiga) program keahlian yaitu Multimedia (dua kelas dengan jumlah siswa 80), RPL (satu kelas dengan jumlah siswa 27), dan Teknik Otomotif (satu kelas dengan jumlah siswa 47). Sedangkan untuk kelas XI dan XII merupakan siswa SMA Negeri 11 Malang dengan jumlah 8 (delapan kelas) yang terdiri atas 3 (tiga) jurusan yaitu IPA, IPS dan Bahasa.</p>

<p>Dalam awal pelaksanaannya, pembelajaran dan sarana praktek untuk siswa SMK Negeri 11 Malang masih sangat minim. Laboratorium program keahlian TI (Multimedia dan RPL) masing-masing hanya mempunyai 20 komputer dengan spesifikasi sedang. Sementara untuk peralatan program keahlian Mekanik Otomotif tidak ada sama sekali sehingga pihak komite mengusahakan peralatan tersebut dengan cara pengadaan sendiri dan meminta bantuan dari pemerintah. Pada pertengahan tahun pelajaran 2007-2008 sarana praktek sudah bisa dicukupi meskipun dengan spesifikasi rendah dan jumlahnya tidak sebanding dengan jumlah siswa.</p>

<p>Tahun 2008-2009 kepercayaan masyarakat akan keberadaan SMK Negeri 11 Malang mulai menampakkan hasil yaitu dengan besarnya jumlah pendaftar yang mencapai 500 siswa. Pada tahun pelajaran ini, program keahlian yang dibuka juga dikembangkan yaitu dengan dibukanya program keahlian Teknik Komputer dan Jaringan dan Animasi, sehingga rombongan belajar dan jumlah siswa meningkat dari 4 kelas menjadi 10 kelas dengan jumlah siswa 420.</p>

<p>Peningkatan mutu pendidikan di SMK Negeri 11 Malang semakin diperhitungkan oleh masyarakat setelah SMK ini ditetapkan sebagai salah satu SMK Aliansi dari SMK Model yaitu SMK Negeri 4 Malang. Hal ini membawa dampak positif bagi sekolah baik dalam peningkatan sarana maupun Sumber Daya Manusia yang ada.</p>

<p>Desember 2008, terjadi pergantian kepemimpinan karena Ibu Aksihari diangkat sebagai Kepala SMK Negeri 3 Malang, dan sebagai penggantinya adalah Bapak Drs. Hari Mulyono, MT. Dibawah kepemimpinan beliaulah “wajah” SMK Negeri 11 Malang benar-benar bernuansa SMK. Hal ini ditandai dengan adanya perombakan-perombakan dalam system manajemen dan proses pembelajaran. Upaya-upaya yang beliau lakukan untuk meningkatkan dan mengembangkan SMK Negeri 11 Malang tidak hanya berupa peningkatan sarana-prasarana, tetapi juga bangunan kelas baru, penataan lingkungan, dan peningkatan SDM baik Guru maupun karyawan.</p>

<p>Pada tahun pelajaran 2011-2012, jumlah peminat yang mendaftar di SMK Negeri 11 Malang pada saat PPDB (Pendaftaran Peserta Didik Baru) mencapai 900 siswa. Setelah diadakan proses penjaringan melalui jalur mandiri dan on line maka siswa yang diterima sebanyak 530 siswa yang terbagi atas 14 (empat belas) rombongan belajar dari 7 (tujuh ) Kompetensi keahlian yaitu Teknik Kendaraan Ringan (TKR), Teknik Sepeda Motor (TSM), Rekayasa Perangkat Lunak (RPL), Multimedia( MM), Teknik Komputer dan Jaringan (TKJ), Animasi (ANM) dan Keperawatan (KPR).</p>

<p>Pada bulan Mei 2012, terjadi pergantian kepala sekolah, dari Drs. Hari Mulyono, MT. , digantikan oleh Dra. Dwi Lestari, MM.   Selama masa jabatan     Dra. Dwi lestari, MM SMK Negeri 11 Malang semakin mengalami kemajuan, terutama pada pembangunan sarana prasarana guna mendukung kegiatan belajar mengajar. Penambahan jumlah Ruang kegiatan belajar (RKB), terus beliau geliatkan seiring bertambahnya peminat SMKN 11 Malang. Realisasi pembangunan Aula bisa terlaksana selama masa jabatan beliau. Perluasan masjid Sabilul Arzaq yang didirikan sekitar akhir 2011 oleh kepala sekolah sebelumnya, Drs. Hari Mulyono,MM , juga terlaksana dimasa kepemimipinan Dra. Dwi Lestari, MM. Sebelum pembangunan perluasan masjid selesai, di bulan Agustus 2015 SMKN 11 Malang harus berganti pimpinan.</p>

<p>Kehadiran Kepala sekolah baru dilingkungan SMKN 11 Malang, Drs. Gunawan Dwiyono, S.ST, M.Pd, memberikan nuansa yang baru pula. Kerjasama dengan dunia industri, sinkronisasi kurikulum dengan dunia industri menjadi salah satu target utama beliau. Beberapa industri, AXIOO, EVERCOSS, telah menjadi partner SMKN 11 Malang untuk mengantar siswa-siswi SMKN 11 Malang siap menghadapi tantangan di dunia kerja. Kelas AXIOO untuk program TKJ ( Teknik Komputer dan Jaringan) telah berhasil di lauching di awal tahun pelajaran 2015-2016. Teaching Factory hasil kerja sama bersama DNA Meruvian & EVERCOSS juga akan dilauncing di awal tahun 2016 ini. Selain beliau juga melaksanakan perbaikan dan peningkatan sarana dan prasarana yang telah ada. Pembangunan Laboratorim jurusan TKR dan TSM yang memenuhi standart, Perbaikan Gazebo Kantin yang bertujuan untuk kenyamanan, kebersihan dan kesehatan lingkungan, pembangunan sarana outdoor activities agar siswa lebih nyaman dan senang melaksanakan kegiatan belajar di luar kelas, juga beliau kembangkan. Perluasan masjid Sabillul Arzaq juga dilaksanakan demi mendukung kegiatan dan meningkatkan IMTAQ siswa siswi SMKN 11 Malang.</p>
</body>
</html>

4. Tampilan lokasi
<!DOCTYPE html>
<html>
<head>
<script
src="http://maps.googleapis.com/maps/api/js">
</script>

<script>
var map;
function initialize()
{
var mapOpt = {
  center:new google.maps.LatLng(51.508742,-0.120850),
  zoom:6,
  mapTypeId:google.maps.MapTypeId.ROADMAP
  };
map=new google.maps.Map(document.getElementById("googleMap"),mapOpt);
}

google.maps.event.addDomListener(window, 'load',initialize);
</script>
<style>
ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #333;
}

li {
    float: left;
}

li a {
    display: block;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}

li a:hover:not(.active) {
    background-color: #111;
}

.active {
    background-color: #4CAF50;
}
</style>
</head>
<body>
<ul>
  <li><a href="index.html">Home</a></li>
  <li><a href="visimisi.html">Visi&Misi</a></li>
  <li><a href="sejarah.html">Sejarah</a></li>
  <li><a class="active" href="lokasi.html">Lokasi</a></li>
  <li><a href="contact.html">Contact</a></li>
  <li><a href="Galery.html">Galery</a></li>
</ul>
<button onclick="alert(map.getCenter());">Get center</button>
<br><br>
<div id="googleMap"style="width:400px;height:300px;"></div>

</body>
</html>

0 komentar:

Posting Komentar

Twitter Delicious Facebook Digg Stumbleupon Favorites More