初めてのベースコーディングレポート【後編】

お久しぶりです。コーダーの小島です。

今年ももうすぐ終わりますね。クリスマスが終わったと思ったら次の日にはお正月ムードでいっぱいになる現象には毎年驚きます笑

弊社では先日忘年会もあり、美味しい焼き鳥を食べました!年末は美味しいものが多いので日々誘惑と戦っております。

さて、今回は3カ月にわたってお伝えしてきたベースコーディングレポートの最終回となります。

6.サンプルページを作る③

①ボタン

ボタンはサイト内の別のページや外部サイト、PDFなどの画像を開く際に一番使いやすい部品です。これをクリックすると何かを開くことができるという認識をユーザーが自然にもつことができます。

ボタンを作成するときに注意したことは構造とアニメーションです。ボタンをマウスでホバーした際に起きる動きがわかりやすくサイトのイメージに合ったものとなるよう、コーディングする必要があります。狙い位通りのアニメーションにするためには正しい構造作りが重要になってくるということを強く感じました。サイズの変化に上手く対応し、何度も細かい指示をする必要がないようなシンプルかつ丁寧なコーディングができるよう精進していきたいです!

 

②カード型リスト

インデックスページと呼ばれる下層ページ内の目次に値するページにはカード型リストを表示します。カード型リストはさまざまな場合に配慮してどんな時もレイアウトが崩れないよう作る必要があるため、カード型リストの作成はサンプルページを作る際に特に苦戦しました。

カード型リストには画像を挿入できるようにするため、どんなサイズを入れても不自然にならないよう工夫する必要があります。また、ページタイトルも短いものから長いものまであるので横に並べたときに一つだけカードが伸びてしまったりしないようコーディングしました。さらに、リンク先によって表示されるアイコンが変わったり、いくつ並べるかも表示するサイズ(PC・タブレット・スマートフォン)選択できるようにしなくてはいけないのでとても難しかったです。

ワードプレス化する場合は私たちだけではなくお客様もカード型リストを作成することが多いため、どんな場合にも対応できる満足度の高いカードリストを作っていきたいです。

 

③アコーディオン

よくある質問ページなどに登場することが多いのがこのアコーディオンです。矢印アイコンやプラスアイコンをクリックすると質問の答えが表示されるようになっています。

アコーディオンはコーダーがUIを考えて直接デザイン・コーディングする部分が多い部品の一つです。マウスでホバーしたときの挙動、クリックした時の挙動、質問を閉じる時の挙動など場面によって動きをつけていきます。ユーザーがストレスを感じない「使いやすい」UIになるよう日々研究し、どんなサイトにも対応できるよう準備して参ります。

 

7.トップページを作成する

サンプルページを作成したら、次はトップページを作成します。トップページの作成は別の人が担当することもありますが、弊社ではベースコーディングを担当した人がそのままトップページを作るという場合も多いです。

トップページでは主にメインビジュアル、ナビゲーション、お知らせ欄、おすすめコンテンツ欄などを作成します。サイトによってはワードプレスを部分的に入れることも多いです。

私が初めて担当したサイトはCMS(ワードプレスなど)を入れずhtmlのみで構築するようなサイトだったのですが、画像をフォルダに格納しテキストファイルにファイル名を記入するとメインビジュアルの画像の一枚目にそこに記入したファイルのどれかがランダムで表示されるようなシステムを作って欲しいという依頼がありました。JavaScriptで新しいシステムを作ることは初めてだったのですが、なんとか形になり実装することができたときはとても嬉しかったです。お客様のニーズに応えられるようなコーディングができるよう、これからも精進していきたいです。

また、地図を入れる箇所もあったのですが地域をホバーする仕組みを作るため、クリッカブルマップの作成に挑戦しました。普段使っているエディターとは違うソフトで作成することができると知り、色々なエディターに慣れておく必要があると感じました。

 

8.ワードプレス化する

今回はワードプレス化する必要はなかったのですが、Web知識のない方でも簡単に更新できるよう、サンプルページの共通パーツやトップページをワードプレス化します。

私自身、部分的にワードプレス化をしたことはあるのですが、1からワードプレスを導入したことはないので機会があれば挑戦してみたいです。

 

9.Googleアナリティクスを導入する

Googleアナリティクスはそのページがどんな人にどれくらいみられているかを解析するためのツールです。複雑な手順を踏む必要があるため、初めは手探りでしたが、一つ一つ丁寧に進めていくことで実装することができました。

Googleアナリティクスの解析はサイトを運用・更新していく上で最も大切な指標になっていくので実装にも力が入ります。より良いサイトづくりの一助になっていることを実感できるとても重要なステップだと感じました!

10.納品リストをチェックする

サイトの量産は完了したら納品リストをチェックしていきます。画像にaltは指定されているか、favicon・Meta・OGPは設定されているか、リンク切れしていないか、速度に問題はないかなど多岐にわたる項目をチェックしていきます。納品リストのチェックは必ず複数人で行い、漏れが起こらないよう徹底しております。

問題がないか緊張しつつも納品チェックをしていると同時に達成感も感じました。世に一つのサイトを送り出したのだということを改めて実感し、とても感動しました。

 

初めてのベースコーディングレポート後編まとめ

初めてベースコーディングに挑戦していく中でたくさんの気づきと学びがありました。実際に1からサイトの開発に携わる中で数多くのサイトを作ってきた弊社が培ってきた「ノウハウ」があるからわかりやすく使いやすいサイトが制作できるのだということを実感しました。入社してまだ半年とまだまだ未熟ですがいち早く貢献できるよう、私も努力して参ります!

弊社ではwebサイト制作のほかにもチラシの作成や、動画制作なども行っていますのでぜひお気軽にご相談ください!

▼webサイト

https://www.medical-design.co.jp/works/web.html

▼グラフィック

https://www.medical-design.co.jp/works/graphic.html

▼写真撮影・動画

https://www.medical-design.co.jp/works/photo.html

初めてのベースコーディングレポート【中編】

こんにちは!コーダーの小島です。

あっという間に冬になり、今年も終わろうとしていますね。御茶ノ水にもちらほらイルミネーションやクリスマスツリーが出現していて、休憩時間や帰り道に癒されています。

皆さん今年はどんなことがありましたか?私はメディカルデザインに入社し、様々な新しいことに挑戦したとても濃い一年だったなと思います。来年はより成長できるよう精進してまいります!

さて、先月に引き続き今月は私が初めて挑戦した「ベースコーディング」の中で行ったサンプルページのコーディングについてお伝えしていきます。

5.サンプルページを作る②

下層ページ共通で表示されるheaderとfooterが完成したら、サンプルページの中身を作っていきます。サンプルページはあまりクラスをつけすぎずにシンプルな構成かつ、柔軟に作らなくてはいけないのでとても難しいなと感じました。形になればいいというわけではなく、どんな条件でも崩れない、誰が下層ページを作成しても同じ形式になるよう工夫する必要があるということを認識しました。それでは、一つ一つのパーツを作る中で感じたことを書いていきたいと思います!

①キービジュアル

キービジュアルとは下層ページの印象を決める大きな役割を果たしています。キービジュアルがあることにより、サイト全体の統一感が出るなと常々感じております。ページタイトルやパンくずリストがキービジュアルに表示されることも多いので、そのページの顔とも言えるパーツだと思います。

今回私が作成したサイトのキービジュアルはキービジュアルと記事の内容の境目が波状になっていました。トップページも同じようにメインビジュアルが波状に切り取られていたのでとても統一感があって素敵なデザインだと感じました。

この波状の画像ですが、ただ波状のまま書き出すわけではありません。Photoshopから波状のまま書き出すことは簡単なのですが、キービジュアルを更新する際にデザインデータがないと書き出せませんし、何よりとても手間がかかってしまいます。今回も最小限の更新で抑えるためにも、波状のまま画像を書き出すのではなく、背景色に合わせた波状のマスクを作成し、擬似要素で画像に書き出すという方法を取りました。

またそのまま書き出す場合より、スマホやタブレットでの表示に合わせやすいというメリットもあります。今回のキービジュアルの作成を通して色々な立場から考えることが必要なのだと学びました。

 

②アンカーリンク

アンカーリンクはそのページの目次のような役割をしています。ページの内容の先頭に表示され、見出しの多いページの中から目的の内容を見つける道標、まさにアンカー(錨)の役割をしています。

アンカーリンクを作成する際に苦戦したことはどのように折り返すか、ということです。
見出しのテキストが長い場合やアンカーリンクの数が多い場合でもデザインを保っていなくてはいけません。私はつい、デザインの文字数に合わせてコーディングをしてしまいがちなのですが、色々な場合を想像しコーディングするようにしないとどんどんコードが複雑かつ柔軟性に欠けるものとなってしまうことを痛感しました。

矢印のアイコンの位置はテキストが折り返しても不自然な位置になっていないか、文字が途中で折り返されていないかなどたくさん検証することが重要だと感じました。

 

③見出し

弊社では大体、h2、h3、h4、h5、h6と6つの種類の見出しを用意します。

内容に合わせて多様な見出しがあると量産の表現の幅も広がり、ワンパターンではないより充実したサイトになります。このように特別なタグの場合はよりシンプルな作りにすることが重要なのだと感じました。見出しのタグを打ち込んだだけでクラスがなくても同じスタイルが表示されるようなコーディングが必要です。

また、見出しと見出しの間余白を作る際も、より柔軟なコードにしておく必要があります。つい、目の前に表示されているサンプルページのデザインにとらわれてしまい、より正確なデザインになるようピクセル単位を多用してしまうのですが、よりレスポンシブなサイトになるよう適した単位を選べるようになるということが今の課題です。

 

④本文テキスト

本文で使用するテキストのパーツは簡単なようでとても奥が深いと感じました。同じ段落のテキスト同士の行間、違う段落同士の行間、1pxでも違うと見やすさが全く違うことにとても驚きました。実際に量産した際に最も感じた違和感の一つが本文テキストの行間でした。サイトを見た人がストレスなくページを読み進められるよう、簡単に終わらせずここにもこだわることが大切だと認識できました。

また本文テキスト内のリンクのスタイルもつけていきます。どの位置にリンクが表示されても違和感がないようコーディングするのはアンカーリンクと同様にとても難しかったです。ホバーする際のアニメーションの速度など、細かいところにまで気を配ることが洗練されたサイト作りにつながっていくのだと感じました。

⑤テーブル

内容に合わせて適したグラフを表示することができるよう、今回は3つのテーブルのスタイルを用意しました。

一つ目は表がそのまま小さくなるスタイルです。表に入るテキストが少なく表の見出しの数も少ない場合はこのテーブルを使います。とてもシンプルではありますが、このテーブルのスタイルが基準になるのでクラスをつけずに表示したときはこのテーブルが表示されるようにコーディングしました。今までテーブルにスタイルをつけるときはたくさんクラスをつけてしまっていたので最低限のhtmlだけを使ってデザインを再現するのに苦労しました。

2つ目は横の表見出しのないテーブルです。この場合はスマホサイズになったときに縦の表見出しと内容が縦に表示されるようにスタイルをつけました。

3つ目はレスポンシブテーブルです。このテーブルはスマホサイズで表示した時に横にスワイプすると内容が確認できるようにコーディングします。スマホサイズになるとフィルターが表示され、スワイプできることを示す指マークが表示されるようになっています。htmlとcssだけではなくJavaScriptも必要になってくるので他のテーブルのコーディングより少し難易度が高かったです。表現の幅を広げるためにも、もっと勉強してスキルを身につけたいと思います。

 

⑥リスト

弊社では3種類のリストを作ります。通常使用するulリスト、順番のあるリストに使用するolリスト、リンクがある時に使用するリンクリストです。本文テキスト同様にリストは行間によって読みやすさが大きく変わるパーツになっています。また、リストの先頭に表示するアイコンの位置も適切になるようにする工夫が必要なのでたくさん修正をしました。

初めてのベースコーディングレポート中編まとめ

今回はベースコーディングの中でも特に重要なサンプルページの作成についてお伝えさせていただきました!思った以上に書くことが多く、それだけベースコーディングをする中で得た知見の多さを実感しました。たくさんの実績を持つ弊社だからこそ様々なシチュエーションに対応できる柔軟なサイト制作をできているのだなと改めて実感しました。

次回はベースコーディングレポート最終回をお届けしたいと思います!

弊社ではコーディングだけでなく、取材やデザインなども幅広く行っております。
興味をお持ちの方は是非一度ご相談ください。

ご相談はこちらから↓
https://www.medical-design.co.jp/contact/

初めてのベースコーディングレポート【前編】

こんにちは!コーダーの小島です。
10月に入ってどんどん涼しくなってきましたね。特に朝と帰りの通勤時間はちょっと寒いなと常々感じております。このくらいちょうど良い気候はなかなかないのでできるだけ長く続いて欲しいです。

さて、今回初めてベースコーディングに挑戦したので、その様子を感想ベースで共有させていただければと思います。

1.Gitのリポジトリを作る

まずリポジトリの名前を決めます。基本的にサイトをリニューアルするときは現行しているサイトのURLを元に決めます。同じサーバーを使用しているサイトがある場合は一工夫必要なので要注意です!被らないよう命名規則に従ってリポジトリ名を決めていきます。

次にリポジトリの設定をしていきます。このとき”add gitignore”にチェックを入れておくと不要なファイルがGitにアップされずに済みます!この一手間で不要なファイルを削除する手間を省略させることができます。実は今回、初めにこの一手間をスキップしてしまった影響で不要なファイルが生成されてしまい、削除する手間が発生してしましました…
もっと効率よくコーディングを進めるためにも先輩方からどんどん新しい知識を学んで、次に活かしていきたいなと思います!

そして作ったリポジトリに会社のメンバーのアカウントを招待します。開発中のアカウントはプライベートモードになっているのでチームを招待しないと自分だけしかそのリポジトリで作業したり、更新したりすることができません。

Gitはチームで円滑にコーディングするためにとっても重要なツールだなと日々感じています。更新や運営をするときにも重宝するのでその元を作っているという意識をしっかり持って慎重に作業していきたいです!

2.チャットグループを作る

まずはそのサイトを作るチームの皆さんとコミュニケーションを取るためにチャットグループを作ります!弊社ではChatworkというコミュニケーションツールを使用してチームで協力をしてサイト制作に取り組んでいます。

チャットグループにチームのメンバーを招待したら、概要を入力していきます。本アップまでのざっくりとしたスケジュール、ディレクターさんがお客様と相談しながら作成したサイトマップのリンク、テストアップサーバーのサーバー、テストアップサイトのリンク、backlog(お客様とコミュニケーションを取ったり、どのようなサイトを作るかをまとめることが簡単にできるツール)で立てた課題(それぞれのプロジェクトごとに作ることができ、プロジェクトごとに情報をまとめたり、チャット機能を利用してコミュニケーションを取ることができる)のリンクなどを入力します。これをすることにより、各々がそれぞれ担当のページをスムーズに作成することができます。

余談ですが、チャットグループを作った人はチャットのアイコンを決めることができます!(時間に余裕がある時ですが…)サイトに関係のあるかわいいアイコンを見つけて設定することが密かな楽しみにもなっています。笑
デザイナーさんが作ったかわいいアイコンを見るとこんなにシンプルでかわいいのにひと目見ただけでなんのアイコンかわかるのは流石だなといつも感動します!

3.サイトの骨組みを作る

Gitとチャットの準備ができたらサイトの骨組みを作っていきます。
そのサイトがワードプレスで簡単に更新できるようにするか、ファイル納品(弊社でサーバーを用意せずにデータのみの納品をすることも稀にあります!)にするか、何の言語でコーディングするかを参考に以前弊社で作成したサイトを元に新しいサイトを作っていきます。

この参考にするサイトを見つけるという作業が意外と難しく、より効率良くベースコーディングに取り組むためにとても経験が必要な作業だと実感しました。初めてということもあり、今回は先輩方にアドバイスをいただいて元にするサイトを決めましたが、自分で広い視野で先読みをして自分の力で判断できるよう経験を培っていければと思います。

元にするサイトを決めたらそのデータを複製して元になったサイトの気配を消す作業に入ります。不要なデータを削除し、必要最低限の情報を残します。古いバージョンのプラグインがローカルに保存されている場合は最新の物をダウンロードし直し、差し替えます。日々アップデートされるプラグインをより良い状態で使うためです。ダウンロードしたプラグインを使うことでアップデートによるバグなどを防ぐこともできます。

サイトの骨組みを作る工程における一つ一つの心がけによってお客様が安心して運営できるサイトの基礎を固めるとても重要なポイントだと今回改めて認識いたしました!

4.サンプルページを作る①

骨組みを作ったら、実際のコーディングに入っていきます。今回私がベースコーディングに挑戦したサイトはファイル納品かつhtmlのみで作成するサイトだったのでイレギュラーな部分が多かったのですが、とても良い経験ができたなと感じています!

サンプルページを作る手順は前回の記事でも軽く触れたかと思いますが、まずはデザインから画像を書き出すことから始まります。その中で今回特に苦戦したのがストライプ模様の背景の素材を書き出すことです。
規則性のある画像は一部を切り取って反復させて表示させるやり方があるのですが、その反復させる画像の書き出しに苦戦しました。いつものように画像を書き出すと画像の周りに余白ができてしまい綺麗なストライプにならないという現象が起きてしまいました。
選択範囲を利用してクリッピングマスクを作成していたことが原因で、オブジェクトを使用してクリッピングしたところ余白のない綺麗な画像を書き出すことができました。一つのやり方に固執せず、場合によって柔軟に対応できるようPhotoshopの知識の幅も広げていきたいなと思います!

画像が書き出せたらまずはheaderとfooterを作っていきます。今回はheaderが途中まで表示されて消えるというUIだったのでユーザーが使用したときに心地よいスピード感になるようJavaScriptを使用して調整しました。速すぎず遅すぎない心地よいスピード感が身につけられるよう色々なサイトを見て研究していきたいです。

また元にしたサイトがPHPで記述されていたのでheaderとfooterの記述を直接書き直し、htmlでも表示されるよう工夫しました。
headerとfooterを作ることができたらサンプルページの中身を作っていきます。

その詳細は来月のブログで書かせていただきたいと思いますので、どうぞよろしくお願いいたします!

初めてのベースコーディングレポート【前編】 まとめ

今回は私の初めてのベースコーディングについて共有させていただきました。
先輩方にご教授いただきながら挑戦する中でより良いサイトの開発をするための工夫やその先の運営への配慮を知り、とても勉強になりました。
弊社では長く運営できるだけでなく細かいUIにも配慮し、離脱率の低いサイトを作成しています。少しでもご興味をお持ちの方はお気軽にご相談ください!

ご相談はこちらから↓
https://www.medical-design.co.jp/contact/

メディカルデザインのサイトができるまで

今回はサイトができるまでの弊社メディカルデザインで病院のサイトがどのように作られているのかを新人コーダーの小島の目線からご紹介いたします!

サイトができるまでをご説明するために次の3つのステップでご紹介いたします。

  1. ディレクション
  2. デザイン
  3. コーディング

(1) ディレクション

ディレクター
どのようなサイトを作成するかどのようなイメージのデザインにするかなどをディレクターがお客様と相談してディレクションしていきます。
 
お客様と綿密にミーティングし、ヒアリングをした上で、弊社のディレクターからご提案をさせていただきます。
まず、どういったサイトにするか、どのような見積もりになるか、おおまかなスケジュール感をご提案します。
場合によっては病院まで赴き、インタビューや撮影を行うこともあります。弊社では取材・撮影・原稿の作成までワンストップで作成することが可能です。この取材の進行や原稿の作成もディレクターさんが担っています。
次にデザインをご提案いたします。弊社ではデザイナーが作成した案の中からよりお客様の理想に近いページをお選びいただき、そのイメージに沿ってより具体的なページの内容を細かく決定していきます。
 

そしてシステム的なことを決めていきます。どのサーバーを使用するか、どのようなシステムを導入するかをわかりやすくご提案し、お客様にとって最適な方法をご提案します。
その上で最終的な見積書と公開までのスケジュールを作成しご提案させていただきます。
 

また、制作スケジュールを作成し、期日までにサイトを公開できるように全体を管理するのもディレクターのお仕事です。
私もディレクターさんのおかげでサイトの制作が円滑に進み、高いクオリティのサイトを納期までに公開できているのだなと日々実感しております。
制作中も密にお客様とのミーティングを重ね、意見を取り入れつつ、全体のイメージを整える司令塔として弊社のディレクターは活躍しております!

(2) デザイン

デザイナー
サイトの視覚的な部分において大きな役割を担っているのがデザインです。
いただいた原稿を元にディレクターと話し合いながらデザイナーがデザインを作成していきます。
 
まずはお客様からいただいた写真を選定し、写真を現像(Adobe LightroomやAdobe Photoshopを使用して写真の色味やクオリティを整える作業)します。
 

次にお客様のイメージに沿ってサイトの配色を決定していきます。色はなるべく使い過ぎず、ユーザーが情報を得るために邪魔にならないよう工夫をしていきます。
弊社では主に病院のサイトを作成しているため、どんなユーザーにとっても使いやすいことや正確な情報を的確に得られるよう工夫しております! デザイナーさんとお話させていただいた際におっしゃっていたのですが、色だけでアイコンの違いを作るのは色彩判断の配慮に欠けているため、なるべく控えるようにしているそうです。
そういった細かい配慮がサイトのクオリティを作っているのだなと感じました。
 

そして実際にデザインの作業に入っていきます。弊社ではAdobe Photoshopを使用してデザイナーがデザインを行っております。まずトップページとサンプルページの作成を行います。サンプルページとは下層ページを作成するために必要なパーツ(見出し、リンク、リスト、ボタン、テーブルなど)と下層ページ共通の部分(header、footer、タイトルなど)をまとめたページとなっております。
そしてその次に特別なデザインの入っているページの作成に入っていきます。フォームやスタッフ紹介など、サンプルページで作成した部品だけでは補えないデザイン性のあるページは別にデザインを作成することが多いそうです。
 

コーダーがコーディングするユーザーが使いやすいデザインを作成することも重要なポイントです。そのための工夫としてAdobe Photoshopのグリットを敷いてデザインしているそうです!コーディングはピクセルごとに行っているため、小数点が発生しないデザインになるよう、グリットを敷いているとのことです。また、画像を書き出す際にわかりやすいようレイヤーを部分ごとにグループ化するなどの工夫をしてくださっています。
デザイナーがチームワークを考えながら幅広い視野でよりサイトの基礎を作り上げることでユーザー満足度の高いサイトが出来上がっていきます!

(3) コーディング

コーダー
実際に公開されるサイトの実装をコーダーがコーディングしていきます。

まず、ベースをコーディングするコーダーはサイトの環境を構築していきます。
新しくサイトを作る際やリニューアルする際は、開発環境のサーバーとドメインで開発環境を作ります。
 

次に複数のコーダーで作業しても問題が発生しないようにGithub(オンライン上でソースコードや変更履歴を共有・管理できるサービス)のリポジトリーを作成します。Githubを使うと他の人が行ったコーディングとバッティングしてデータが巻き戻ることを防ぐことができます!コーディングはチームで行うことが多いので、とても重要なツールです。
そして、ページのコーディングに入っていきます。ベースをコーディングするコーダーははじめにデザイナーが作成したサンプルページを実装していきます。サンプルページを先に作ることで下層ページが作りやすくなるためです。

更新のあるサイトの場合は、Webに関することについてあまり詳しくないご担当者様でも簡単に更新できるよう、Wordpress(簡単にブログやWebサイトを更新できるソフトウエア)を導入することが多いのですが、サンプルページでコーダーが実装した部品はWordpressを更新する際にも大活躍します。もちろん使い方をわかりやすくご説明したマニュアルをお渡ししますのでご安心ください!
 

準備ができたら、ページのコーディングに入っていきます。必要なデータをPhotoshopから書き出して集めます。この時実際に表示される二倍のサイズで書き出すことで、スマホやタブレットでもきれいな画像を表示することができます!
また画像はWebpというGoogleの新しい形式の画像に変換して使用しております。画像サイズが軽くSEOでも有利に動くというメリットがあるためです。
 

必要な画像をそろえたらheaderやfooterなどの全体で共通の部品を実装していきます。出来上がったらサンプルページのコンテンツのコーディングに入っていきます。
先ほどWordpressを更新する際にも大活躍するとお話したように、Wordpressを導入するサイトの場合はこの部品を実際にWordpressで使用できる部品にするという工程も必要になっていきます。
サンプルページが実装できたらトップページと下層ページのコーディングに入っていきます。多くの場合、ベースを構築したコーダーがトップページを担当し、下層ページは量があるので分担して行っていきます。
 

コーディングする際、コーダーはただデザインを再現するだけでなくUIを考えながらコーディングしております。マウスをホバーした時の変化や選択範囲、アニメーション、スマホサイズの表示など自分で考えてコーディングすることもあります。ディレクターやデザイナーに確認しながらユーザーにとって使いやすいサイトになるよう、私も日々努力しております!
 

ページが作成できたらシステムチェックを行い、本番のサーバーを設定して順次公開していきます!

まとめ

今回は3つのステップに合わせてメディカルデザインのサイトができるまでをご紹介いたしました!それぞれのチームワークがあってこそ、今まで多くの高いクオリティの制作実績があるのだなと感じました。
私自身はまだまだ未熟な点が多いので経験を積みながら先輩方のように活躍できるよう努力してまいります!
弊社の制作実績はこちらからご確認していただけますので、病院のサイトの制作やリニューアルなどをお考えの方はぜひご一読ください。
こちらから