こんにちは！ウェブエンジニアの河野です！

私の住む日向市も、梅雨に入り、雨が続いて肌寒かったり蒸し暑かったり…
私はどこにも出かけず家にこもりっぱなしで食べてばかりです。

最近休みの日は、愛犬のルウと一緒にお昼寝するのが日課になっています。
運動しないとまずいな～と思いつつ。笑

 

さて、本日はホームページ制作をお考えの方や、この業界に興味のある方へ、ウェブエンジニアが行うコーディングについてお話ししようと思います。
私の主な仕事でもあるコーディング。実は一番好き！な仕事です。

ホームページ制作会社でウェブエンジニアとして働く私ですが、家族や友人に一体どういうことをしているのかよく聞かれます。
そこで皆さまにも、ウェブエンジニアが行うコーディングの一部をご紹介したいと思います。

 

コーディングとは？

コーディングとは、「プログラミング言語を使用して、ソースコードを書く作業」のことです。
このソースコードは、ブラウザやサーバーに、「こうやって表示して！」と指示を出す命令文のことを言います。
ホームページをブラウザ上に表示させるには、ソースコードを作成しなければどんなホームページも表示されません。

～コーディングで使用する主な言語～
HTML：ブラウザに「見出し」「リスト」「文章」などの文章構造を伝えるためのマークアップ言語
CSS：HTMLにサイズや色、レイアウトなどのスタイルを設定するためのスタイルシート言語
JavaScript：ホームページに様々な機能や動きをつけることができるプログラミング言語

 

コーディングでできること

HTML、CSS…難しい言葉が並びましたが、実際にお見せしたいと思います！

まずは簡単にお問い合わせボタンをコーディングしてみます。

See the Pen Untitled by かわのなつみ (@natsumi201) on CodePen.

HTMLで、この要素がボタンであることをブラウザに伝えています。
HTMLは、「ホームページの要素や構造はこうして！」ということをブラウザに伝えるためのマークアップ言語です。
ここでは、ボタンをリンクにする、テキストを挿入する指示を行っています。

 

See the Pen Untitled by かわのなつみ (@natsumi201) on CodePen.

CSSでスタイルを追加しました！
CSSは、HTMLにフォントのサイズや色、レイアウトなどのスタイルを付けるスタイルシート言語です。
見た目を指定することで、一気にボタンらしくなったと思います。
他にも、背景の色やフォントの種類を指定したり、パソコンとスマートフォンでレイアウトを変えたりと、様々なことが可能です。

 

See the Pen Untitled by かわのなつみ (@natsumi201) on CodePen.

JavaScriptにはいろんなことができますが、そのうちの「アニメーション」のサンプルを作ってみました。
JavaScriptは、ホームページ制作だけではなく、アプリケーション・ゲーム開発やサーバーサイドでも幅広く利用されているプログラム言語です。
ホームページ制作では、より見た目にインパクトを出したり、自由なレイアウト、アニメーションの様な動きをつけるために利用されることが多いです。

 

CMねっとのコーディング

そんなCMねっとでは、「とことん本気！」を経営理念に掲げています。
ホームページ上でソースコードを普段目にすることがないからと言って、手を抜かず、だれが見ても美しく分かりやすいコーディングを追求しています。

そして、正しいコーディングはサイト表示時のパフォーマンスの向上や、メンテナンス性確保によるコスト削減にもつながります。
また、ホームページが伝えたいことを検索エンジンに適切に伝えることができ、検索順位の向上にも少なからず影響することからも、コーディング工程では単純な表示だけでなく様々な効果を考えながら取り組みます。

こうして私たちは目に見えないところまでこだわり、クライアント様の目的達成ができるホームページ制作を日々行っています。

社内では、ウェブエンジニアで共有しているコーディングガイドラインがあります。
コーディングをする上で、みんなが守るルール。それを守ることで、違うウェブエンジニアが作業する場合にもスムーズに作業に取り掛かることができ、「保守性」「品質」を確保しています。

 

 

まとめ

いかがでしたでしょうか？
ホームページ制作には、多くの工程があります。その中でも私は、コーディングを行うことが好きですが、またやりがいも感じます。
その理由は、デザイナーさんが一生懸命作成したデザインが、自分の技術によって形になり、目的を持ったツールとして世界に公開できたときに、大きな達成感があるからです。
それだけではなく、お問い合わせや採用エントリーの増加など、クライアント様の目的達成に結びついたとき、また別の達成感を感じることができるところも、やりがいを感じる部分です。

また、CMねっとではホームページのリニューアルも数多くご依頼頂いています。
「現在のホームページの機能をよくしたい」
「デザインを一新したい」
などのご要望を頂きますが、私たちはただ作り直すだけでなく、その先にある集客・販路拡大・採用強化などの目的を共有し、最善のご提案を追求しています。

ご質問でもご相談でも構いません！ぜひ、お気軽にお問い合わせください。