CMSにワードプレスを使うのは好きではない2014年9月17日 | 未分類
ホームページとはHTMLファイルの集合です。
私の私的な考えですが、ホームページはCMSなど何も入れない、昔ながらのプレーンな状態が一番良いという哲学がございます。
運用を考えCMSを入れるのはやむを得ないのですがWordpressをCMS として利用するのは好きではありません。
サーバーやデータベースをチューニングしないままだと表示がやたら重たくなる。
細部が分からないシステムは使わない。 壊れた時に直せない。 Wordpressはよく画面が真っ白になったりする。
高機能なウェブサービスなどを作るというなら分かります。
しかし中小企業のそれも大した更新個所も無いのにサイト丸ごとWordpressで実装とか馬鹿げてる。
個別ページへ >>
【CSS】運用に適したコーディングと作って終わりのコーディング2014年9月17日 | 未分類
仕事で出会ったある方のcssを見て、コーディングのやり方が良くないと思ったのでメモ。
その方は”サイトを作るだけ”の仕事をしてはいるが、運用やメンテナンスを考慮していないようだ。
おそらくきちんとホームページを運用したことは無いのかもしれないと思った。
もちろんコーディングの方法は、どれが正しくこれが間違いとういのは無く個人の自由ですが
やり方によって機能性と効率の面で大きな差が出ます。 良いコーディグの条件は、私的には
①デザインの変更や追加があった場合、柔軟に対応できること
②素早くコーディングできること
これが満たされれば良いと考えています。
その人のCSSの記述法があまりよろしくないと思ったのでメモ。
どのような記述をしていたかというと、クラス名やID名にサイト特有の固有名詞を使うのが構わないのだが
固有名詞のクラス名やID名を辿ってスタイルを指定していた。
例えば会社情報、スタッフのコメント、メッセージというボックスがあった場合に、以下のように全ての固有のdivに対してスタイルを適用していた。
div#companyinfo ,
div#staffcomment ,
div#message {
width: 300px;
border: 1px solid #ccc;
}
この作り、誰がどう見ても良くありません。
サイトの規模が大きくなれば膨大な行数になりますし、何より変更が非常に大変です。
おそらくこのスタイルを書いた方は、比較的小規模のサイトを”作るだけ”の仕事をしてきたのだと思います。
ウェブサイトは一度作成して終わりではなく、レイアウトを変更やコンテンツの追加が発生するものです。
またそのようにして運用していないウェブサイトは生きているウェブサイトとは言えないでしょう。
上記のようにクラス名やID名のサイト特有の固有名詞を辿ってスタイルを指定する方法だと
ウェブサイトの仕様変更に耐えられなくなりどこかで破綻します。
私はCSSは基本的にオブジェクト指向で作るのが基本だと考えいます。
id=”company” とすることは後々jsで要素を操作したりスクレイピングする際に便利なので構いませんが
個別ページへ >>wordpressをさくらのvpsからxserverに引っ越した2014年6月13日 | ホームページ関連
さくらインターネットのvpsで運用していたこのブログを、この度 エックスサーバーに引っ越しました。
x10というプランにしました。 速度はサクサク快適ですね。
さてwordpressの引っ越し、これはちょっとだけ手間がかかりました。 間違った手順で行うとプラグインの一部が動作しなかったり問題が起きたためです。 最終的に行った手順を自分用にまとめておきます。
ちなみに今回の、wordpressの引っ越しはサーバーだけです。 同じドメインでの運用を前提にしていますのでご注意下さい。
別サーバー別ドメインにwordpressを引っ越す場合さらに手間がかかるようですが今回は説明致しませんのでご了承下さい
//===============================================================
// 引っ越し前サーバーのwordpressのデータをダウンロードしておきましょう
//===============================================================
① phpMyAdmin等で wordpressのテーブルをまとめてエクスポートしておきます。
※.sql というように一つのsqlファイルとして書き出せるます。
② 利用していたテーマをダウンロードしておく
wp-content > themes の中の利用していたテーマのディレクトリをダウンロードしておきます
③ 画像ファイルをダウンロードしておく
記事にアップロードした画像ファイルは、デフォルトでは
wp-content > upload
に入っています。ディレクトリを丸ごとダウンロードしておきましょう。
④ プラグインをダウンロードしておく
利用していたプラグインは
wp-content > plugins
にありますので全部ダウンロードしておきます。
ちなみに wp-super-cache など wp-configを書き換える系のプラグインは引っ越し先サーバで新たにインストールした方が良いです。
⑤ wp-config.php をダウンロードしておく
以上でwordpressの必要なデータは手元に落としました。
//===============================================================
// 引っ越し先サーバーに 新品のwordpressファイル一式をアップロード。
//===============================================================
① 引っ越し先のサーバーに 新品のwordpressファイル一式をアップロードします。
アップロードするだけブラウザでアクセスして通常通りインストールしないで下さい。
ここで前のサーバーのファイル一式を移動させようとすると、上手く行ったかに見えるのですがフルパスの部分が違っていたりします。
私の場合、一度目にさくらvpsからxserverに丸ごと移動させてしまったのですが、その時はログインなどは上手くいきましたが、wp-super-cacheがインストール出来なくなっていました。
探して一つ一つ修正するのは大変で抜けが出る危険があります。
よって引っ越し前サーバーのファイルを丸まる引っ越し先ファイルに移動させるのはお奨め出来ません。
多少手間でも最初から作った方が安全です。
② 画像ファイル一式をアップロードする
wp-content に 先ほどダウンロードしておいたuploadディレクトリをアップロードします。
③ プラグインをアップロードする。
wp-content に plugins ディレクトリをアップロードします。
④ テーマをアップロードする
wp-content の themes に 利用していたテーマのディレクトリをアップロードします。
⑤ wp-config.php をアップロードする。
//===============================================================
// 引っ越し先サーバーにデータベースを準備。
//===============================================================
引っ越し先サーバーに データベースを準備し、先にエクスポートしたsqlファイルをインポートしましょう
引っ越し先サーバーの
・データベース名
・データベースユーザ名
・データベースパスワード
・データベースホスト
をメモっておきましょう。
引っ越し前サーバーの wp-config.php を書き換えていきます。
ここでwp-config.php ファイルを引っ越し前サーバのものを使うのは
↓こういった記述部分を同じ設定で使いたいからに他なりません。
define(‘AUTH_KEY’, ‘xxxxxxxxxxxxxxxxxx;
define(‘SECURE_AUTH_KEY’, ‘xxxxxxxxxxxxxxxxxx’);
define(‘LOGGED_IN_KEY’, ‘xxxxxxxxxxxxxxxxxx’);
define(‘NONCE_KEY’, ‘xxxxxxxxxxxxxxxxxx’);
define(‘AUTH_SALT’, ‘xxxxxxxxxxxxxxxxxx’);
define(‘SECURE_AUTH_SALT’, ‘xxxxxxxxxxxxxxxxxx’);
define(‘LOGGED_IN_SALT’, ‘xxxxxxxxxxxxxxxxxx’);
define(‘NONCE_SALT’, ‘xxxxxxxxxxxxxxxxxx’);
//===============================================================
// DNSレコードのipを引っ越し先サーバのものに変える。
//===============================================================
これでしばらく待つと ドメインが引っ越し先サーバに向くのでしばらくすると
ドメインにアクセスして、同じブログが表示出来ているはず。
管理画面は使えるか、プラグインは追加出来るか、画像はアップロード出来るか、
などを確認して終わり。
個別ページへ >>
こらからWebデザイナーを目指す人がAdobeイラストレーターを学ぶ方法2014年5月3日 | 未分類
こらからWebデザイナーを目指す人がAdobeイラストレーターを学ぶ方法
様々な用途目的に利用できるイラストレーター。
機能の多さや，ベジェ曲線の扱いに苦労された方は多いのではないでしょうか？
Adobeイラストレーターの習得に挫折した人はベジェ曲線で挫折したという方が多いようです。
しかしあなたがもしこれからWebデザイナーを目指して勉強しているならば、ベジェ曲線を駆使してイラストを描いたり、グラデーションメッシュでリアルオブジェクトを描くような事はほとんどありません。
ほぼ使わないベジェ曲線で挫折してやめてしまうのはあまりに勿体ないです。
それよりもボタンやバナーなどホームページの素材となるパーツを作れるようになれば事足ります。
そのためにセンスは必要ありません。センスよりも正確に作れる事が大事です。
Illustratorには様々な機能がありますが全てを覚える必要はありません。
少しの機能しか知らなくても工夫次第でかなりの形を作れます。
どんな技術を学ぶにしてもその根幹となるスキルが何であるかを見極めることです。
基礎があれば応用が効きます。
今回はWebデザイナーに必要なIllustratorのスキルの基礎を手っ取り早く学ぶちょっと変わったアプローチを紹介します。
数学の作図問題でIllustratorの基礎を学べる！？
今回紹介するのはボタンの作り方などよりもさらに基礎、基礎中の基礎です。
例えばあなたが角丸短形を作っているとしましょう。
ふと、外側に1ピクセルの枠を付けたくなったらどうしますか？
あるいは大きさをもとのちょうど3分の1にしたい時は？
今回使う機能は、スマートガイドと直線ツール、円ツールなど最小限の機能を使い、数学の作図を思い出しながら様々な形を作ってみましょう。
垂直二等分線。
線分の三等分。
内接円。
外接円。
五角形を描く
いががだったしょうか。
これでどんな形も正確に描く自身がついたのではないでしょうか？
iPad miniでプログラム言語を勉強する2014年5月2日 | 未分類
先日、iPad miniを購入しました。
映画をみるわけではなく電子書籍も読みません。
やることはただ一つ、プログラミングの勉強のためです。
僕は1度つかった関数や気づいたことをメモ帳に入れて保存しています。
それを電車の中や暇な時間に読み復習するのです。
あとは色々なサイトのコードを読んだり、不明点が出てくればネットで調べものもできて良いかな、と思ったのが購入した主な理由です。
あとは電車の中でブログが書ける。
ノートパソコンも持ち歩いているのですが、ブログを書きたいタイミングでパソコンを開ける環境にいるとは限りません。 というかパソコン開けない場所にいる時ほど調べものしたくなる！
まだどうなるかわかりませんが、勉強やブログの更新がはかどればいいなあ
個別ページへ >>僕が僕であるためにブログ書かなければならない 文章を書くチカラとSEO2014年5月2日 | 未分類
ホームページはアクセスを稼いでナンボです。
アクセスを集めるための対策としてSEOというものがあります。
検索エンジンに狙い対策とキーワードを認識させるためのホームページ内のコンテンツの最適化であったり、外部対策と被リンク対策などがなされてきました。
しかしそうした対策は検索エンジンのアルゴリズムをもとに行われたため、人間がみた時にとても不自然で、場合によってはスバムまがいのことがまかり通ってきました。
傾向を危惧したGoogleは近年、そうしたスパム的なSEO対策を行ったホームページに対して警告したりペナルティを課すようになったのです。
今まで上位表示を維持していたサイトが圏外に落ちたり、大幅に順位が落ちるといった状況が頻繁に発生しました。
こうなって困ったのがSEO業者です。スパムまがいのSEO対策でお客様のホームページを上位表示を約束していたの当然です
多くの業者は、信頼を失いペナルティー解除に追われ中には夜逃げをする業者もありました。
SEOをとりまく状況はここにきて一変したのです。
これからのアクセス対策は真に魅力あるコンテンツをコツコツと作り、訪問者に価値を与える事、そのためには文章を書くこと。
これが今とても求められています。
ノウハウを持った会社のホームページならばお役立ちコラムなどを定期的に執筆する。 などを訪問者の事を考えたホームページが高く評価されるようになったのです。
訪問者に役立つコンテンツには色々あるでしょうが、まずは文章を書くことが良いでしょう。
魅了的な文章を書くことは今後のホームページ制作の一つの重要な方向性でしょう
ホームページ業界では今、文章が書ける人が求められています。
私も作文はとても苦手ですが練習のため何か書くようにしています。
小さい会社こそ人の心を捉えるホームページのデザインを2014年4月29日 | デザイン
こんにちは KYコンサルティングの増田です。
もうかれこれ１０年ほどウェブ業界に関わっています。
今日はホームページのデザインの重要性について思うところを書きます
ここでいうデザインというのは情報設計とかUI（ユーザーインターフェース）とかユーザビリティー（使いやすさ）といった意味のデザインではなく、
なんて言うかな、見た目のデザイン。 このサイトのデザインめっちゃイケてるね♪ のデザインの事を指すことにします。
もちろんホームページは使いやすさがとても大事だと思います。 でも見た目のデザインがもの凄く大事とそういう話をしたいと思います。
ホームページのデザイン事情
ホームページのデザインって紙媒体やその他様々なデザイン業界と比べ、歴史が浅い上に技術トレンドやウェブをとりまく環境がめまぐるしく変わります。
例えば、昔はウェブはパソコンで見るものでしたが現在スマホやタブレットから見る人は７割とか８割とかになってきてるわけです
そんなこんなで、なかなか業界としても成熟しづらい背景があるのかもしれません。
また大手ポータルサイトや月間何億PVなんていうアクセス数を稼ぐブログが見た目のデザインにそこまで力を入れていないように見えます。
見た目のデザインに力を入れるべきホームページとは？
しかし今回、そういった大手ではありません。
広告費も無く、自社コンテンツを作る資金もないあなたやわたしの会社のような場合です。
ぶっちゃけ僕もホームページって情報を見に来てるわけだから見た目のデザインはそこまで大事じゃないと勘違いしていた時期もあったのですが。
そうした思いが吹き飛んだ出来事があり今はデザインをとても重要視するようになりました。
ホームページのデザインは訪問者の心を思う以上に動かす
まず昨年こちらのホームページを制作（デザインのリニューアル）させて頂きました。
http://www.direct-commu.com/
セミナー系の会社さんなのですが、経営者の方からはセミナー系の雰囲気を一切出さず暖かい雰囲気のデザインにして欲しいと要望を頂きました。
そこで色使いや各パーツの形、手書き風のフォント、ちぎった紙にテープで貼ったような写真などなど。
経営者の方と何度もああでもないこうでもないと話し合いを続けながら最終的に、手作り感のあるホームページをデザインに仕上がりました。
デザインを変えたら色々変わった
デザイン修正後、まず直帰率が目に見えて下がりました。
つまり今まで訪問してすぐ帰ってしまっていたお客さんが、内容を少し読んでみようかなという気持ちになってもらえたのではないかと思います。 経営者の方は応募も増えたと喜んでいらっしゃいました。
（余談ですがここのホームページの経営者のKさんは学者肌でどちらかというと控えめな方だと思います。 ですので自社の講座内容にとても自信をもっているものの、是非うちの講座を受講してください！と攻めるタイプではありません。 そうしたKさんの雰囲気もデザインに落とし込めたかなと思っています）
もうひとつ面白い出来事がありました。なんとこのホームページを見た方から制作者を教えて欲しいと連絡があり仕事の依頼があったのです。 話を聞いた時はとても嬉しかったことを憶えています。
結論
そろそろ結論を書きます。
今回取り上げたホームページ、色々書きましたがクオリティーとしてはまだ６０〜７０％くらいだと思います。
まだまだブラッシュアップできる余地が沢山あります。
しかし７０％のデザインでも書いたような効果があったのです。それってすごいと思いませんか。
広告費も自社コンテンツ開発の資金力もない小さな会社さんへ。
まず御社のホームページのデザインに力を入れてみることをおススメします。
弊社では要望に合わせてどんなテイストのデザインにも対応することができます。
また御社の問題を解決すべく様々なアイデアを提案させて頂きます
なんか宣伝ぽくなっちゃいましたね・・
あと、この自社のホームページとブログのデザイン直さなくちゃですね。読みにくいったらありゃしない。
デザインについて偉そうに語ってこのざまです。 申し訳ございません。
写真家ヒロタケンジさんのウェブサイトを制作致しました2014年3月2日 | 制作実績
現在、世界放浪中の旅人で写真家のヒロタケンジさんのウェブサイトを制作させて頂きました。
写真ギャラリーには、PHPとMySQLによるオリジナルCMSを組みサイト管理者様がご自身で投稿、編集、管理できる仕組みとなっております。
その他様々な技術を駆使することにより、管理者様が負荷なくサイトを運営できる工夫をしております。
●写真ギャラリーCMSについて
要望によりあまり多くのカテゴリーを設けず、３つカテゴリー（自然・風景、人物、物・その他）に分類できるように設定しました。
またそれぞれの写真にタグを設定出来るようにしました。
編集や削除ももちろん可能です。
そして今回工夫したのはトップページに流れる写真ギャラリーへと自動で反映されるという仕様です
新しいものと古いものからそれぞれランダムで１０件づつ抽出しています。
こうした細かな思い通りの設定が構築可能であることは自作CMSは利点だと考えています。
またページ単位でキャッシュをしているため動作が非常に軽いです。
●お知らせ管理CMS
ウェブページのお知らせを管理人様が更新出来るシステムを構築しました。
更新したい箇所にピンポイントでCMSを組めるのも自作CMSならではですね。
アジアの遠い国で写真やブログが日々更新されているのをチェックする度にワクワクします。
旅先の様子が知りたいからこのホームページを作って良かったなと感じます。
ヒロタケンジさんが良い旅をできるよう心よりお祈りしております。
個別ページへ >>コミュニケーション能力診断システム2014年2月2日 | 制作実績
この度コミュニケーション能力診断システムを制作させて頂きました。
エゴグラム、ストレス診断、SAD診断といった心理系の診断を行う事ができます。
今回、ログイン機能を実装し登録制と致しました。 診断結果はユーザーに記録に保存され後からいつでも確認することができます。
またエゴグラム診断を行うと相性診断URLというものが発行されます。
相性診断URLを使うとエゴグラム診断を行った二人の相性を診断することが出来ます。
ちなみにわたくしの相性診断URLはこちらです。
是非、相性診断してみてください（笑）
http://xn--zckzah9129bsdgbusdye.jp/code/Eg46272652aae1bc342c993e3ef8639146.html
個別ページへ >>プチ記事投稿システム2013年12月21日 | ホームページ関連
やきとり八幡様のホームページに写真付き記事投稿システムを設置させて頂きました。
スマホからも更新出来、画像をクリックすると拡大されます♪
PHP,MySQLをベースに、PearのPager,CacheLiteを利用致しました。
投稿画面はお見せする事は出来ませんがWISWIGエディターを実装しています。
KYコンサルティングはウェブ/モバイルのデザイン、企画、プログラミング、コンサルティング、
制作後のアフターフォローを一括して行うホームページ制作会社です。
Copyright 2012 kyconsul.org all right reserved