LOADING...

OUTLINE

概要

マークアップエンジニアです
ホームページのコーディングは
お任せください

  • HTML、CSS、JavaScriptを用いて、提供いただいたデザイン通りにWebページをコーディングいたします。様々な画面サイズに適応させるレスポンシブタイプです。
  • 入稿データは、Figma、Adobe XD、Illustrator、Photoshop、いずれにも対応いたします。
  • コーディングしたページデータからWordPressのオリジナルテーマの作成もいたします。
  • このページはアニメーションのデモンストレーションを兼ねていますので、ちゃかちゃかと良く動きますが、何でもかんでも動かせばいいとは考えていません。必要に応じて効果的に用いたいと考えています。これまでの制作実績としては、会社案内、採用情報、学校案内など一般的なサイトが多いです。
  • また、このページのHTMLソースを見ていただければ判りますが、アニメーション目的で不用意に要素を増やしたりしていません。論理的に正しいコーディングを心がけています。

お手伝い程度でよければ
デザインも

  • ご覧の通りセンスもイマジネーションも持ち合わせていませんので、デザインはやっておりません。ですが、デザイナーさんの意図を理解するのは得意なようです。
  • よって、デザイナーさんが忙しくて手が回らないとき、下層ページのレイアウト作業をトーン&マナーを守りつつ肩代わりしたり…、
  • あるいは、PC版のみのデザインデータから、タブレット・スマホ版へのデザイン展開をコーディングしつつ行うことも普通にあります。
  • したがって、Webがご専門ではない印刷係グラッフィクデザイナーさんとの協業も承ります。DTPの経験もありますので、ご相談いただければ幸いです。

CASCADING STYLE SHEET

CSSについて

Sassも使っています

  • ファイルの構成やクラスなどの命名規則は、御社のルールに従って制作いたします。何も指定が無い場合は、FLOCSSに倣ったものになります。
  • 私のローカル環境ではSassも使いますが、納品するデータは普通のCSSファイルになります。
  • このページではSassは使わず、CSSの新しい機能のネストや変数などを実験的に利用しています。したがって、古いブラザーでは正しく表示されません。対応ブラウーは、Chrome 120、Edge 120、Safari 17.2、Firefox 117、Chrome for Android 121、Safari on iOS 121、これらより新しいものとなります。何か表示が変だな?と感じたら、お手元の環境をご確認下さい。
  • Sass不要論も耳にしますが、私はまだ利便性を感じて利用しています。

JAVASCRIPT

JavaScriptについて

ホームページで求められる程度の
だいたいのことは可能です

  • Reactなどのフレームワークを用いたWebアプリケーションの開発は残念ながら対応できませんが、ホームページで求められるようなことは概ね対応可能です。例えばですが、バックエンドのエンジニアと話し合ってJSONのフォーマットを決めて非同期にコンテンツの表示を切り替える、といった開発経験もあります。
  • jQuery、素のJavaScript(ES6あるいはVanilla JS)、ご指定の方式で記述します。
  • オワコンと呼び名の高いjQueryですが、2024年2月6日にメジャーアップグレードの最新ベータが公開されました。一般的なホームページであれば、jQueryで何の問題もないと考えています。メンテナンスを担当されるかたが、どちらの実装を好むかの問題だと考えています。

アニメーションにはGSAP

  • このページでは、アニメーションに強いJavaScriptライブラリ"GSAP"を用いています。自由度が高く機能も盛り沢山ゆえまだ手探りではありますが、ダイナミックな動きを作り出すことが可能になりました。
  • ブランドサイト、ランニングページ、新卒採用ページなど、凝った演出が必要なサイトに用いれば、使い方次第で大きな効果が期待できます。
  • コーディング済みのページにアニメーションを付与するだけのご依頼も承ります。

WORDPRESS

WordPressについて

WordPressを導入すれば
ホームページとして必要な機能は
だいたい提供可能です

  • オリジナルのテーマを作成します。カスタム投稿、カスタムフィールド、カスタムタクソノミーを用いて、ご要望に応じた作り込みを行います。
  • 一般的なレンタルサーバーであれば、ドメインの設定、WordPressのインストール、各種設定、プラグインの導入と設定なども行います。
  • WordPressのテンプレートに頻出するPHPについては一応理解しておりますが、PHP+SQLを用いたバックエンド開発は残念ながら対応できません。
  • エンドユーザー様向けに、サイト更新に関するマニュアル作成やレクチャーなども承ります。

唐突ですが、縦スクロールを横方向に変換するデモです。

吾輩わがはいは猫である。名前はまだ無い。

どこで生れたかとんと見当けんとうがつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。吾輩はここで始めて人間というものを見た。しかもあとで聞くとそれは書生という人間中で一番獰悪どうあくな種族であったそうだ。この書生というのは時々我々をつかまえてて食うという話である。しかしその当時は何という考もなかったから別段恐しいとも思わなかった。ただ彼のてのひらに載せられてスーと持ち上げられた時何だかフワフワした感じがあったばかりである。掌の上で少し落ちついて書生の顔を見たのがいわゆる人間というものの見始みはじめであろう。この時妙なものだと思った感じが今でも残っている。第一毛をもって装飾されべきはずの顔がつるつるしてまるで薬缶やかんだ。その猫にもだいぶったがこんな片輪かたわには一度も出会でくわした事がない。のみならず顔の真中があまりに突起している。そうしてその穴の中から時々ぷうぷうとけむりを吹く。どうもせぽくて実に弱った。これが人間の飲む煙草たばこというものである事はようやくこの頃知った。

この書生の掌のうちでしばらくはよい心持に坐っておったが、しばらくすると非常な速力で運転し始めた。書生が動くのか自分だけが動くのか分らないが無暗むやみに眼が廻る。胸が悪くなる。到底とうてい助からないと思っていると、どさりと音がして眼から火が出た。それまでは記憶しているがあとは何の事やらいくら考え出そうとしても分らない。

ふと気が付いて見ると書生はいない。たくさんおった兄弟が一ぴきも見えぬ。肝心かんじんの母親さえ姿を隠してしまった。その上いままでの所とは違って無暗むやみに明るい。眼を明いていられぬくらいだ。はてな何でも容子ようすがおかしいと、のそのそい出して見ると非常に痛い。吾輩はわらの上から急に笹原の中へ棄てられたのである。

ようやくの思いで笹原を這い出すと向うに大きな池がある。吾輩は池の前に坐ってどうしたらよかろうと考えて見た。別にこれという分別ふんべつも出ない。しばらくして泣いたら書生がまた迎に来てくれるかと考え付いた。ニャー、ニャーと試みにやって見たが誰も来ない。そのうち池の上をさらさらと風が渡って日が暮れかかる。腹が非常に減って来た。泣きたくても声が出ない。仕方がない、何でもよいから食物くいもののある所まであるこうと決心をしてそろりそろりと池をひだりに廻り始めた。どうも非常に苦しい。そこを我慢して無理やりにって行くとようやくの事で何となく人間臭い所へ出た。ここへ這入はいったら、どうにかなると思って竹垣のくずれた穴から、とある邸内にもぐり込んだ。縁は不思議なもので、もしこの竹垣が破れていなかったなら、吾輩はついに路傍ろぼう餓死がししたかも知れんのである。一樹の蔭とはよくったものだ。この垣根の穴は今日こんにちに至るまで吾輩が隣家となりの三毛を訪問する時の通路になっている。さてやしきへは忍び込んだもののこれから先どうしていか分らない。そのうちに暗くなる、腹は減る、寒さは寒し、雨が降って来るという始末でもう一刻の猶予ゆうよが出来なくなった。仕方がないからとにかく明るくて暖かそうな方へ方へとあるいて行く。今から考えるとその時はすでに家の内に這入っておったのだ。ここで吾輩はの書生以外の人間を再び見るべき機会に遭遇そうぐうしたのである。第一に逢ったのがおさんである。これは前の書生より一層乱暴な方で吾輩を見るや否やいきなり頸筋くびすじをつかんで表へほうり出した。いやこれは駄目だと思ったから眼をねぶって運を天に任せていた。しかしひもじいのと寒いのにはどうしても我慢が出来ん。吾輩は再びおさんのすきを見て台所へあがった。すると間もなくまた投げ出された。吾輩は投げ出されては這い上り、這い上っては投げ出され、何でも同じ事を四五遍繰り返したのを記憶している。その時におさんと云う者はつくづくいやになった。この間おさんの三馬さんまぬすんでこの返報をしてやってから、やっと胸のつかえが下りた。吾輩が最後につまみ出されようとしたときに、このうちの主人が騒々しい何だといいながら出て来た。下女は吾輩をぶら下げて主人の方へ向けてこの宿やどなしの小猫がいくら出しても出しても御台所おだいどころあがって来て困りますという。主人は鼻の下の黒い毛をひねりながら吾輩の顔をしばらくながめておったが、やがてそんなら内へ置いてやれといったまま奥へ這入はいってしまった。主人はあまり口を聞かぬ人と見えた。下女は口惜くやしそうに吾輩を台所へほうり出した。かくして吾輩はついにこのうちを自分の住家すみかめる事にしたのである。

猫の挿絵4
猫の挿絵1
猫の挿絵2
猫の挿絵3
猫の挿絵4

SELF PROMOTION

意思疎通しやすいタイプだと勝手ながら自認しています。マークアップエンジニアが適職とはいえ、Web制作に関するほぼ全てと言っていいほどの職務を経験していますので、関係各位の業務や気苦労も理解しているつもりです。まずはお気軽にご相談いただけば幸いです。

ちなみに、コーディング以外の主な事例は以下PDFにまとめております。
ウェブサイト制作事例

360度パノラマ写真の撮影・制作を活動のメインにしていた時期もあります。現在はニーズがなく開店休業状態なのですが、営業用作品作りで撮ったアンコールワット遺跡群は今見ても壮観です。ご用途お急ぎでない方はぜひお立ち寄りください。
アンコールワットの360度パノラマ写真

CONTACT