HOME

システム開発の株式会社システックス

システックス公式ブログ

2009年12月29日

システックス公式ブログ年末のご挨拶

一年間ありがとうございました

今年も残すところ僅かとなりました。これが2009年最後のエントリーになります。

今年の2月にシステックス公式ブログを開設し、公式サイトでは伝えきれない当社の情報やお役立ち情報を発信してきました。不慣れなところもあり、思うように更新できませんでしたが、購読していただいた皆様には、この場を借りて御礼申し上げます。

システックスの大きなニュース　2009

思い返せば2009年のシステックスもいろいろありました。

大きなニュースでは、Salesforce CRMの提供をはじめとするクラウドコンピューティングへの参入がありました。長野県で初となるセールスフォース・ドットコム認定コンサルタントも2名の社員が取得しました。

もう一つの大きなニュースが最近ありました。

先日行われたスケルトン全日本選手権でシステックススケルトンクラブ所属の田山選手が優勝しました。越選手は３位で表彰されました。バンクーバーオリンピック出場に大きく弾みをつけた二人は、年明け早々のワールドカップに参戦いたします。

今年に引き続き、来年も応援よろしくお願いいたします。

来年もよろしくお願いいたします

2010 年は 2009 年以上に良い情報を発信できるように、スタッフ一同頑張りますのでどうぞよろしくお願いいたします。

一年間ありがとうございました。良いお年をお迎えください!

2009年12月22日

Ajax入門（jQueryとThickbox）

何はともあれ

百聞は一見に如かず、です。

まずは、下記に続くサンプルを試して頂きながら、
「Ajax対応のJapascriptライブラリ」の“便利さ”を感じて頂ければ、と思います。

jQuery

【公式サイト】
・「jQuery」（英語）

【特徴】
Javascriptライブラリ（Javascriptの塊）の一つ。
Webページ内の要素（文字とか段落とか画像とか）に対して、比較的簡単なJavascriptのコードを記述するだけで、様々な効果を与えることができます。

【ダウンロード】
上記公式サイトにて、「Download（jQuery）;」ボタンをクリックすると、最新版をダウンロードする画面に遷移するので、下記のファイルをダウンロードして下さい。
　・jQuery-X.X.X.min.js

【コード例】
≪sample.html≫

<html>
<head>
    <title>jQueryサンプル</title>
    <script type="text/javascript" src="jquery-1.3.2.min.js"></script>
    <link href="sample.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript">
    <!--
    $(function() {  
        $('#Area1').mouseover(function(){
            $(this).css("background-color","#ff0000")
        });
        $('#Area1').mouseout(function(){
            $(this).css("background-color","#ffffff")
        });
        $('#Area2').click(function(){
            $('div#Area2 span').fadeIn("slow")
        });
    });
    //-->
    </script>
</head>
<body>
    <div id="Area1">
        ココのエリアに、マウスカーソルを重ねたり外したりすると、色が変わります。
    </div>
    <div id="Area2">
        ココのエリアをクリックすると・・・<br />
        <br />
        <span>文字がフェードインされます。</span>
    </div>
</body>
</html>

≪sample.css≫

div
{
    border-right: #000000 1px solid;
    border-top: #000000 1px solid;
    border-left: #000000 1px solid;
    border-bottom: #000000 1px solid;
}
div#Area1
{
    width: 400px;
    height: 100px;
    left: 100px;
    top: 100px;
}
div#Area2
{
    width: 400px;
    height: 100px;
    left: 100px;
    top: 400px;
}
div#Area2 span
{
    display: none;
}

【参照URL】
・「jQuery: jQuery実践サンプル」
　豊富なサンプル量を公開しています。
・「はじめてのjQuery」
　jQueryを使って何かやってみたい方は、一度、これを見ておいてもいいかもしれません。

ThickBox

【公式サイト】
・「ThickBox 3.1」（英語）

【特徴】
jQuery対応のJavascriptライブラリで、ブラウザ上の特定のエリア（テキストや画像）を、ポップアップのように表示することができます。特に、画像の拡大表示やスライドショーとして応用されることが多いです。
「PartyWeb」では、Webアルバム機能に ThickBox を応用しています。

【ダウンロード】
上記公式サイトにて、「Overview」のところにある「Download」にリンクされている下記のファイルをダウンロードして下さい。
　・thickbox.js、もしくは、thickbox-compressed.js
　・ThickBox.css
　・loadingAnimation.gif
　　（※loadingAnimation.gif　は、thickbox.js を基点に「images/loadingAnimation.gif」となるように配置して下さい。）

【コード例】
≪sample2.html≫

<html>
<head>
    <title>Thickboxサンプル</title>
    <script type="text/javascript" src="jquery-1.3.2.min.js"></script>
    <script type="text/javascript" src="thickbox.js"></script>
    <link href="thickbox.css" rel="stylesheet" type="text/css" />
</head>
<body>
    <a class="thickbox" title="1" rel="group1" href="images/1.jpg"><img alt="1" src="images/1_t.jpg" /></a>
    <a class="thickbox" title="2" rel="group1" href="images/2.jpg"><img alt="2" src="images/2_t.jpg" /></a>
    <a class="thickbox" title="3" rel="group1" href="images/3.jpg"><img alt="3" src="images/3_t.jpg" /></a>
</body>
</html>

【参照URL】
・「Thickbox・Examples」
　ThickBox の公式サイトの「Example」にて、いくつかのサンプルが公開されています。
・「class=”thickbox” に rel をつけると画像が表示されない」
　Thickbox 3.1 + jQuery 1.3.2 で、上記のコード例のようなスライドショーを作ろうとするとハマると思います。
　対処としては、Thickbox.js の79行目の「@」を削除して保存するだけです。

【ちなみに】
2009年9月30日、ThickBox の作者・Paul Irish氏は、
「しばらく Thickbox のメンテは行わない。」という告知をしており、
Thickbox と同じような動きをする下記のようなJavascriptライブラリを紹介しています。

・「colorbox」
・「jQueryUI Dialog」
・「fancybox」
・「DOM window」
・「shadowbox.js」

それぞれ、表示の種類やHTML/CSSの書き方や異なりますので、自分の好みと状況によって使い分けるとよいでしょう。

次回予告

いかがでしょうか？
多少のコツは必要ですが、Javascriptライブラリを使えば、
比較的短いコードで、いろんな動き・効果・演出を付けることができそうではありませんか？

次回は、当社の「PartyWeb」の「スライドショー」機能を題材に、
より実用に向けたカスタマイズ方法についてご紹介できれば、と思います。

2009年12月21日

Googleカスタム検索の導入とサイト内検索レポート

Goolgeカスタム検索の導入

2ヶ月ほど前になりますが、当社の公式サイトにGoogleカスタム検索を導入しました。サイトリニューアル当初はサイト内検索を付けていませんでしたが、コンテンツが増えてきたので検索機能を入れて欲しいという要望があったためです。サイト内検索を実現する方法はいろいろありますが、検討の結果、Googleカスタム検索を導入することになりました。

Googleカスタムサーチ

カスタム検索エンジンの作成

Googleカスタム検索は簡単に導入することができます。

まずはGoogleカスタム検索のページにアクセスし、カスタム検索エンジンを作成します。必要な情報を入力してプレビュー画面で確認したら完了です。

Googleカスタム検索設定

検索ボックス コード・検索結果コードを貼る

カスタム検索エンジンを作成したら、検索ボックスと検索結果を表示させるコードを取得して、htmlに貼ります。

Googleカスタム検索 コードを取得

検索結果をサイト内に表示させる場合は、「iframe を使用して、自分のウェブサイト上で検索結果をホストする」を選択してください。当社の公式サイトはMovableType（MT）で構築されていますが、MTでサイト内に検索結果を表示する場合は、インデックステンプレートを作成するのが良いでしょう。ただし、検索結果ページは600px未満にすることができないので、当社の場合は本来3カラムであるところを無理やり2カラムにして対応しました。

Googleカスタム検索 検索結果

使い勝手を考えると、やはりサイト内に検索結果を表示する方が良いと思います。

サイト内検索レポートの設定

Googleカスタム検索が優れているところは、検索されたキーワードをGoogleAnalyticsで解析することができるところです。

GoogleAnayticsの設定で、サイト内検索レポートを有効にして、クエリパラメターを入力してください。

GoogleAnalytics サイト内検索の設定

設定をしてしばらくすると、データが反映されるようになります。

GoogleAnalytics サイト内検索キーワード

サイト内検索を設置されていないウェブマスターの方は、是非Googleカスタム検索を使ってみてください。

2009年12月18日

【学生の皆さんへ】信濃毎日新聞社主催 合同企業ガイダンスに参加いたします

システックス参加ガイダンス

２００９年１２月１９日に行われる【信濃毎日新聞社主催 合同企業ガイダンス】に
システックスが出展いたします。

  • 日時：2009年12月19日（土）　13:00～17:00
  • 場所：東京ドームシティプリズムホール

東京近郊にお住まいの学生さん、どうぞいらしてください。

2009年12月17日

【学生の皆さんへ】リクナビ2011開幕★LIVE長野にお越しいただきありがとうございました

合同説明会へお越しいただいた学生の皆さんへ

採用担当の橘田です。

１２／１３、長野市内で行われた合同会社説明会に参加してきました。
うーん、すごい人出でした。

出展会社数は２９社でしたが、システックスと同業のＩＴ関連はゼロ。
そのためか、８０名以上という非常に多くの学生さんがブースに来てくださいました。

大混雑！ですみません

イベント開始３０分前からロビーに人が溢れ、
きっと収まりきらなかったのでしょうね。
開始時刻より少し前に、会場の中に入れていました。

スタート直後から、お目当ての企業になだれ込む学生で、通路が大渋滞。
立ち見の学生さんに、追加の椅子すらもらえない、というか置けない状態。
そんな状況だったので、あまり説明に時間をかけず、
それぞれができるだけたくさんの企業を回れるように、説明は簡潔にしてみました。

システックスを訪問して下さった方、ありがとうございました。
立ったまま聞いてくださった方、すみませんでした。

次回合同ガイダンスのお知らせ



  • １２月１９日　東京ドームプリズムホール

  • １２月２６日　メルパルク長野

  • １２月２８日　松本市ホテルブエナビスタ

今月は上記ガイダンスに参加いたします。
ぜひお越しください。
直接お話ししましょう！

2009年12月10日

【学生の皆さんへ】リクナビ2011開幕★LIVE長野に参加いたします

開幕★LIVE in長野

１２月１３日（日）、システックスはリクナビ主催の合同ガイダンス、【開幕★LIVE in長野】に参加いたします。

場所：JA長野県ビル　アクティホール（長野市大字南長野北石堂町１１７７番地３）
　　　　駅から歩いて10分ほど
時間：12：00～17：00（受付11：30～）

詳しくはリクナビ2011をご覧ください。

システックス採用担当者から学生の皆さんへ一言

採用担当の橘田です。
１２月１３日（日）、私としては今期はじめての「合同会社説明会」に参加します。
システックスのデビュー戦としては、
１１月８日の開幕ライブ（東京ビックサイト）があり、
他の採用担当者が参加したのですが・・・

そのときの話を聞いたら、ものすごい数の学生さんがいらしたようで。
やはり昨年来のニュースから、尋常でない危機感を感じているのですね。

皆さんの心境としては、
今のこの時期は「数多くのブースを回りたい」でしょうから、
なるべく短時間で端的に説明したいと思っています。

上手く話せるかな？？頑張ります！

１２月１３日、長野市近郊にお住まいの方は
どうぞブースに来てください。

2009年12月09日

システックス映画試写会【のだめカンタービレ最終楽章】

システックス映画試写会のお知らせです。
１２月１７日（木）　１８：３０～
長野グランドシネマズへ抽選で５０組１００名様をご招待いたします。
のだめカンタービレ
12月19日（土）全国東宝系にて公開です。

応募はハガキ・インターネットをご利用ください。
応募の際、CM内の「応募キーワード」を入力が必要となります。
今回のキーワードは、８文字！
詳細・応募方法はCMでご確認ください。

2009年12月08日

システックス互助会主催「2009忘年会」が行われました

システックス2009忘年会行われる

先日、年末恒例のシステックス本社の忘年会が行われました。
役員・社員ともに少し早いのですが、２００９年の労をねぎらいました。
systex_party1

忘年会でも新入社員は大活躍。
サンタクロースに扮して、社員全員にシステックスのロゴマーク入りガムをプレゼントしてくれました。
システックスロゴ入りガム

今年の商品は・・・カニ！！

いつも豪華賞品が当たる忘年会ビンゴ大会。
今年の一位の商品は
タラバガニ・ズワイガニ・毛ガニの【豪華カニ三点セット】
カニをかけたビンゴ大会、とても盛り上がりました。
systex_party2

カニ、おめでとうございます！

systex_party3

社長も豪華賞品を当てました。

新着情報

カテゴリ

月別アーカイブ



このページのトップへ

〒380-0936 長野市岡田町78-11
TEL 026（226）7277　／　FAX 026（224）2424

Copyright (C) 2016 SYSTEX Co.,LTD All rights reserved