ヤマシタトモコの同名漫画を新垣結衣と新人俳優・早瀬憩のW主演で映画化した『違国日記』から、槙生と朝、2人の同居生活が垣間見える本ビジュアルと本予告が解禁となった。本ビジュアルの舞台は、両親を亡くした朝(早瀬さん)が住むことになる叔母・槙生(新垣さん)の部屋。小説家の槙生の部屋には所狭しと本が並び、パソコンにも多くのメモが貼られている。そんな家に住むことになった、15歳の朝と不器用な槙生のぎこちない雰囲気が醸し出されている。「わかり合えなくても、寄り添えることを知った――」というコピーが印象的な本作は、別の人間同士だからこそ分かり合えないながらも、対照的な2人が同居生活の中でどのような日々を紡いでいくのか、行方が気になるポスターになっている。また本予告では、槙生と朝が戸惑いながらも心を寄せ合っていく姿が映し出されている。大嫌いだった姉を亡くし、その娘である朝を引き取ることになり戸惑い、迷う槙生を親友の醍醐(夏帆)と元彼の笠町(瀬戸康史)が支えていく。朝の「なんで嫌いなの、お母さんのこと」という率直な質問に対し、「あなたの感情も私の感情も自分だけのものだから。分かち合うことはできない。あなたと私は別の人間だから」と真摯に答える槙生の言葉が、“人はわかり合えなくても寄り添うことができる”という力強いメッセージを感じさせる。さらに本予告で流れるのは、『未来のミライ』『バケモノの子』などの細田守作品や、NHK連続テレビ小説「おかえりモネ」などの劇伴も担当し、CM音楽や執筆も手掛けるなど幅広く活動する高木正勝の劇伴。繊細な心情が表れた音楽が作品に寄り添っている。また、インスパイアソング「夜明けのあなたへ」を担当するのは、TikTokでの投稿が新海誠監督、「RADWIMPS」の野田洋次郎に見出され、『すずめの戸締まり』の主題歌「すずめ feat. 十明」で一躍、最注目の次世代アーティストとなったシンガーソングライター、十明が本作を鑑賞して書き下ろした。十明「元々原作の漫画も大好きで、何度も何度も読み返しました」という十明さんのデモ音源が製作陣の耳に留まり、インスパイアソングが実現。デモ音源を聞いた本作の音楽プロデューサーも「儚げな中に凛とした強さを感じさせる十明のインスパイアソング。広い音色で観る人や聴く人を、また主人公たちを抱きしめる様に寄り添い、言葉を紡ぎ、人生の背中を押してくれる様な優しい名曲を生み出してくれました」とコメント。朝が過去をふり返るような、どこか懐かしくもあたたかい歌が、槙生と朝の物語を優しく包み込んでいる。十明さんは「この作品の中の強く柔く美しい人々が映像として動き出した時、心揺さぶられました。『夜明けのあなたへ』という楽曲は、彼女たちに向けて手紙を書くような気持ちを歌っています。そして、私自身の素直な気持ちを歪めることなく描くことが出来たように思います」と手応えをのぞかせる。不安と混沌の中で出会った2人が「じゃ、いってきまーす」「はい、いってらっしゃい」と自然な家族の会話を繰り広げるようになるまでを見届けてほしい。『違国日記』は6月7日(金)より全国にて公開。(シネマカフェ編集部)■関連作品:違国日記 2024年6月7日より全国にて公開Ⓒ2024 ヤマシタトモコ・祥伝社/「違国日記」製作委員会
2024年04月04日新垣結衣と新人・早瀬憩がW主演、累計販売数180万部を突破し「心が救われる」「人生の本棚にはいった」など多くの共感を得た同名コミックを映画化した『違国日記』の公開日が6月7日(金)に決定。劇中歌は元「チャットモンチー」の橋本絵莉子が手掛ける。人見知りな小説家の高代槙生と、その姪・田汲朝の対照的なふたりの同居譚。なかなか理解し合えない寂しさを抱えながらも、丁寧に日々を重ね生活を育むうちに家族とも異なった、かけがえのない関係になっていく、優しさの形を提示するヒューマンドラマ。ヤマシタトモコによる原作漫画は2023年6月に最終回を迎え、惜しまれながら6年という連載期間を経て終止符を打ったが、連載終了後も人気の高さが話題となっている。高校生になった朝が、所属する軽音部のバンドで演奏する劇中歌「あさのうた」の作詞・作曲を務めるのは、「チャットモンチー」でギター&ボーカルを担当し、2018年にその活動を“完結”後、ソロ活動を開始。先日新アルバムの発売が発表された橋本絵莉子。槙生との共同生活を経て、自分の人生を手探りしながら日々成長していく朝の気持ちに寄り添う瑞々しい楽曲を提供。劇中では朝役の早瀬さんが橋本さんの歌う姿を彷彿とさせる熱唱を見せている。「あさのうた」作詞・作曲橋本絵莉子コメントドキュメンタリーなんじゃないかと思うほど朝と槙生の暮らしが近くに感じられて、生き生きとしていて、生々しくて、綺麗だなあと思う瞬間がいっぱいありました。観た後餃子が食べたくなったので、翌日作って食べました。この映画を彩る一員になれたことが、とても嬉しいです。ありがとうございました。さらに、前売り特典は原作者・ヤマシタさんによる槙生と朝の描き下ろしイラストが施されたオリジナルしおりに決定。2人が映画館に来たようなイラストとなっている。前売り券(ムビチケカード)は3月15日(金)より全国の上映劇場(一部劇場を除く)にて発売される。原作・ヤマシタトモコ先生描き下ろしクリアしおり付『違国日記』は6月7日(金)より全国にて公開。(シネマカフェ編集部)■関連作品:違国日記 2024年6月7日より全国にて公開©2024『違国日記』製作委員会
2024年03月11日女優の新垣結衣と早瀬憩がW主演を務める映画『違国日記』(6月公開)の第3弾キャストが1日、公開された。○■映画『違国日記』第3弾キャスト&場面写真今回公開されたのは、主人公・槙生(新垣)とその姪・朝(早瀬)を取り巻く個性あふれるキャラクターを演じるキャスト陣。槙生の母・高代京子役を銀粉蝶、槙生の姉で朝の母親である高代実里役を中村優子が演じるほか、朝のクラスメイトで秀才の森本千世役で伊礼姫奈、朝と同じく軽音部に所属する三森役で滝澤エリカが出演する。そして、後見監督人として槙生と朝の生活を見守る弁護士・塔野和成役は『PARKS パークス』ほか瀬田監督作品の常連でもある染谷将太が務める。また、あわせて槙生と朝以外のメインキャラクターたちの姿が初解禁となる場面写真も公開。微妙な距離を保ちながらバスに揺れる槙生と朝、元恋人同士の槙生と笠町(瀬戸康史)の2ショット、高校の入学式に参加する朝と親友のえみり(小宮山莉渚)、小説を執筆中の槙生、槙生に温かい視線をむける親友の醍醐(夏帆)の姿が切り取られている。【編集部MEMO】映画『違国日記』は、ヤマシタトモコ氏による同名コミックの実写化作。人見知りな小説家の高代槙生(新垣結衣)は、姉夫婦の葬式で無神経な言葉を吐く親族たちと盥回しにされる姪・朝の様子を見て、勢い余って私が引き取ると啖呵を切ってしまう。なかなか理解し合えない寂しさを抱え、一緒に居ることでお互いの癒えない傷口に自然と触れてしまう2人だが、丁寧に日々を重ね生活を育むうちに傷と向き合うようになっていく。監督は、『PARKS パークス』『ジオラマボーイ・パノラマガール』の瀬田なつき氏が務める。(C)2024 ヤマシタトモコ・祥伝社/「違国日記」製作委員会
2024年02月01日新垣結衣とオーディションから選ばれた新人・早瀬憩の主演で贈る映画『違国日記』に、銀粉蝶や中村優子、染谷将太らの出演が解禁。新たな場面写真も到着した。原作は、ヤマシタトモコの同名漫画。人見知りな30代女性と人懐っこい素直な15歳の少女の交流を軸に、他人との関わり合いや大人が抱える正直な悩みを鋭くも優しい視点で炙り出し、「マンガ大賞2019」など連載開始後から多数の漫画賞を受賞。2023年6月に最終回を迎え、惜しまれながら6年という連載期間を経て終止符を打った。雑誌「ダ・ヴィンチ」読者が選ぶ「BOOK OF THE YEAR 2023」コミック部門第1位を獲得、また宝島社「このマンガがすごい!2024」オンナ編第5位も記録し、連載終了後も人気の高さが話題となっている。この度新たに発表となるのは、新垣さん演じる槙生と早瀬さん演じる朝を取り巻く、個性溢れるキャラクターを演じるキャストたち。槙生の母・高代京子役を、舞台を中心に幅広く活躍し唯一無二の存在感を放つ銀粉蝶、槙生の姉で朝の母親である高代実里役を『エゴイスト』や『ユンヒへ』の中村優子。朝のクラスメイトで秀才の森本千世役を『マイ・ブロークン・マリコ』の伊礼姫奈、朝と同じく軽音部に所属する三森役を『ジオラマボーイ・パノラマガール』の滝澤エリカ。そして後見監督人として槙生と朝の生活を見守る弁護士の塔野和成役を『PARKS パークス』ほか瀬田なつき監督作品常連の染谷将太が務める。さらに併せて解禁となる場面写真では、槙生と朝以外のメインキャラクターたちの姿がお披露目。微妙な距離を保ちながらバスに揺れる槙生と朝、元恋人同士の槙生と笠町の2ショット。高校の入学式に参加する朝と親友のえみり、小説を執筆中の槙生、槙生に温かい視線をむける親友の醍醐の姿が切り取られている。朝の両親が亡くなったことをきっかけに、本来交わることのなかった槙生と朝の奇妙な生活がスタートしていくが、ぎこちない2人の間を取り持つように彩りを添えていく様々な登場人物たちとの豊かな関わりに期待が高まる写真となっている。『違国日記』は6月、全国にて公開。(シネマカフェ編集部)■関連作品:違国日記 2024年6月、全国にて公開予定©2024『違国日記』製作委員会
2024年02月01日新垣結衣とオーディションから選ばれた新人・早瀬憩のW主演で贈る映画『違国日記』の公開が2024年6月に決定。対照的な2人の絶妙な距離感をとらえた特報映像とティザービジュアルが解禁となった。ヤマシタトモコの同名漫画を原作にした本作は、人見知りな小説家の高代槙生と、その姪・田汲朝の対照的な2人の同居譚。なかなか理解し合えない寂しさを抱えながらも、日々を重ね生活を育むうちに家族とも異なった、かけがえのない関係になっていくヒューマンドラマ。この度、初公開となった映像には「朝、私はあなたの母親が心底嫌いだった。でも私は決してあなたを踏みにじらない。もし帰るところがないなら、うちに来たらいい」と、新垣さん演じる小説家・槙生が不器用ながらも両親を失った朝に対して素直な気持ちを伝える、印象的なシーンから始まる。この冒頭のシーンは原作でも重要な場面となっており、漫画に忠実な世界観が伝わる内容に。公開中の『正欲』でこれまでにない役を演じ、俳優として新たな境地を切り開いた新垣さんが本作でもその演技力を発揮、“極度の人見知りで不器用な”主人公・槙生を演じる姿に注目。また、併せて解禁となったティザービジュアルには、海辺の階段で遠くを眺めながら歩く槙生と、微笑みながら槙生の姿を見つめる朝の姿が切り取られている。本来交わるはずのなかった2人は、朝の両親が亡くなったことをきっかけに同居することになり、年齢や互いの性格が全く異なるまるで“違国”から来たような人間と認識しながらも、親子でも友達でもないかけがえのない関係を築いていく。2人の関係性が映像でどのように表現されるのか、期待が高まる映像とティザービジュアルとなっている。『違国日記』は2024年6月、全国にて公開。(シネマカフェ編集部)■関連作品:違国日記 2024年6月、全国にて公開予定©2024『違国日記』製作委員会
2023年12月19日『レースクイーン・オブ・ザ・イヤー14-15』を受賞し「史上最高のレースクイーン」と称される早瀬あやが23日、都内で写真集『PERFECT』(発売中 3,240円税込 光文社刊)の発売記念イベントを行った。同書は、早瀬にとって初の写真集で、4月に沖縄と千葉で撮影。タイトル通りまさに「PERFECT」な身長170センチ・Fカップボディを限界まで露出し、フェティシズムとナチュラルさ、そしてセクシーさがふんだんに詰まった、最初にして最高の1冊に仕上がった。そんな同書を手にした感想を聞かれると「カッコいい感じが好きなんですけど、そんなところもあって、可愛いところもあって、全体的にオシャレだなと思いました」と満足気な表情を浮かべ、100点満点で自己採点をお願いされると「500点!去年1月から芸能界でお仕事をさせていただいて、早い段階で写真集を出させていただいて、頑張ったもん!だから500点です」と胸を張った。変形のワンピース水着を着てプールサイドで撮ったカットがお気に入りだそうで、「すごく寒くて、この撮影のあとにプールに入って撮影したんですけど、死ぬかと思いました」と打ち明けて報道陣を沸かせ、「私はレースクイーンをやっているんですけど、ハイレグで自分の体型もすごくキレイに出ていて、脚が長く見えるところがお気に入りです。グラビアの女の子は胸が大きい子などさまざまいますが、私は身長も高いし、脚も長いし、顔も小さいし、可愛いってあまりいないと思うんですよ。そんな私のいいところが出ているページだなと思います」と声を弾ませた。今後の夢を聞かれると「おのののかを超すことですね。いい売れ方をしている」と打ち明け、おのののかに負けていないところについては「おっぱいと、脚が長いところと、負けず嫌いなところです」とニヤリ。逆に欠点を聞かれると「パーフェクトなんで欠点なんてないですね」とコメントして報道陣を沸かせた。また、山形県出身で、遊佐町親善大使と酒田市観光大使を務める早瀬は「イベントで地元に帰ってお仕事をさせていただいているので、地元のローカル番組や『秘密のケンミンSHOW』に出たいですね」と目を輝かせ、「地元に恩返しという意味でも、親孝行という意味でも地元を使ったものに出たいですね」と地元愛にあふれた一面を覗かせた。
2016年08月23日ニコニコ生放送で隔週木曜日放送されている「アニメぴあちゃんねる」。本日8月27日(木)のゲストに声優の早瀬莉花と、アイドルグループLinQのメンバーで、声優としても活動する姫崎愛未が登場する。今回はゲストふたりと、番組レギュラーの秦佐和子が出演している『VENUS PROJECT』の特集として放送。TVアニメ『VENUS PROJECT -CLIMAX-』のワンシーンを秦と早瀬がその場でアフレコする。またVENUS PROJECTのスマートフォン向けゲーム「DREAM BEAT」にゲーム内で声をあてている姫崎が挑戦。ゲームの腕前はいかに。番組後半の「アニメぴあちゃんねる」会員放送では、姫崎がコスプレ写真を公開。さらに早瀬が学生時代の制服写真を初披露する。さらにお馴染みのファッションチェックに加え、番組レギュラー、タカオユキのキャラ弁「タカ弁」を早瀬、姫崎が試食。タカ弁は見た目もさることながら、味のインパクトも強烈で、いつも出演者を苦しめている。ゲストのふたり、前田玲奈、秦佐和子が悶絶する姿は必見だ。恒例となっている番組スタートと同時に展開する前田玲奈のカラオケコーナーは、今回、前田と秦が共通で好きな声優・歌手の曲をメドレーで披露する。また、YouTube「アニメぴあちゃんねる」では、現在、オリジナル動画を配信中。前田玲奈と、怪しいゆるキャラ“がまぴぃ”が、気になる話題について語る「もうすぐアレでる」。第5回のテーマは「男が思わずキュンとしてしまう女子のモテしぐさ」。前田玲奈が色んなモテしぐさを披露している。「もうすぐアレでる」は、女性向けWEBサイト、「オネガマ」とも連動中。■アニメぴあちゃんねる日時: 8月27日(木)午後8時30分~午後10時00分出演: 前田玲奈 / 秦佐和子 / タカオユキ / 美濃部達宏ゲスト: 早瀬莉花 / 姫崎愛未
2015年08月27日第6話でSEOを意識したサイト制作について学んだりん。あとはサイトを公開するだけ! ラストスパート! という気持ちで出社し、上司のはやせさんに最後の教えを乞うのでした。♪まぶた~とじ~れ~……はやせさん、おはようございます!うぅ……あ、おはよう。いやーよい歌だなー、感動して涙流しちゃったよ。(失恋でもしたのかな…笑)あのー、前回の続きで、アクセス解析の話なんですけどぉ~。セイセイセイー。トラッキングの話だね、フォーー!!!(急にどうした!? 笑)そうです。アクセス解析やトラッキングの話です。うーんとまずは、昨日も言ったけれど、アクセス解析のコードを入れ忘れるな!というところだね。今回は、Googleアナリティクスを使うことを前提としようか。Googleアナリティクスは、基本的に無料で高機能なので、僕はほとんどの案件で使ってるよ。Googleアナリティクス、たしかによく聞きますね。あとは、2014年に正式版となったGoogleタグマネージャというツールも使うことがあるかな。Googleタグマネージャでは、Webサイトには決まったコードだけを貼っておいて、実際にそこで利用するコードはタグマネージャ上で管理するということができるんだ。例えば、メディアサイトなどは、頻繁にトラッキングコードの差し替えや変更を行うよね。その場合は、Webサイトのテンプレートなどを直接変更するといったことをその都度行わなくてはならないんだ。だけど、タグマネージャを使えば、Webサイト側は一度だけ貼り付けて、どのページでどのコードをだすかや、コードを変更するなどの作業はすべてタグマネージャ側でできるんだ。なんか、話を聞いていると、めちゃくちゃ利便性の高いツールですね!たしかにとても便利だけど、使い方も独特だし、正式版公開から1年くらいしか経っていないから、情報もそれほど多くないのが現状かな。いずれにせよ、難しい部分もあるので、貼り付けたコードをそれほど変更する必要がない場合は、普通にGoogleアナリティクスのコードを貼り付けてもいいと思うよ。なるほど。サイトの運営方針によって選んでもいいんですね。今回のサイトは、Googleアナリティクスを利用したいと思います。他にはなにか、やっておくべきことはありますか?そうだね。あとは、「Googleウェブマスターツール」への登録かな。特に、サイトマップの登録が重要だよ。CMSなどのテンプレートで、Googleが指定するフォーマットを選択し、sitemap.xmlなどのページ情報が含まれたXMLファイルを生成しておいて、それをウェブマスターツールに設定しておくと確実にGoogleの検索の対象にできるんだ。各ページの存在をきちんとGoogleに伝える、といった感じですね。うん。ウェブマスターツールでは他にも、サイトの解析においてどんな検索ワードで検索されたかということを詳しく見ることもできるよ。検索ワードを分析することで、「こういうワードで検索されてるみたいだから、こういうコンテンツをもっと増やそう」といった運用改善の参考になるよね。どういうキーワードでユーザーがくるかなどは、たしかに重要ですね。他にも、HTMLの改善項目を教えてくれたり、Googleからのアラートを確認できたり、見られたくないコンテンツを検索結果から除外したり…いろいろなことができるよ。Googleアナリティクスも機能が盛りだくさんだけど、ウェブマスターツールでもいろいろできるんですねー。バッチリ準備を行ってから、クライアントのWebサイトを公開したいと思います!……――数日後。はやせさーん! クライアントのWebサイトを公開したんですが、すっごく喜んでもらえましたー…って、あれ? そんな大荷物でどこか行くんですか?おーーよかったねーー。Webサイトはオープンしてからが本番だからね! 野球は9回裏2アウトからと言うしね。引き続きサポートしていってね。僕は今日から、このトランシーバー片手に、しばらく自分探しの旅にでようと思ってね。ドラゲナイ。こうして、クライアントのWebサイトを無事公開し、さらに、めんどくさい上司も旅にでてほっとしたような寂しいような気持ちの入り混じった、3分の1の純情な感情なりん。今後もいろいろ勉強して、立派なWebディレクターになるぞ!と心に誓ったのでありました。~Fin~○おわりにWebサイト制作のTipsを、これまでの制作会社での経験を基に「はやせ」と新人社員「りん」の掛け合い式で書いてみました。Webの世界はスピードが速いので、閲覧環境もサイト制作のテクニックもどんどん進化しています。ですが、根本的な「誰かにとって役立つ情報を伝える」ことの重要性は変わりません。今回の連載でご紹介したポイントがお役に立てれば幸いです。いやー、Webサイト制作って本当にいいもんですね。○執筆者紹介早瀬将一シックス・アパートにて、主にWebサービス型CMS「MovableType.net」の製品企画を担当しています。個人活動として、大学時代から音を中心としたインタラクティブ作品を制作。音に限らない作品やソフトウェアも作ってます。詳しくはWebで!
2015年03月17日クライアントのWebサイトがだいぶ完成に近づいてきて、そろそろSEOについてもチェックしなきゃなーと考えながら出社するりんであった―――。はやせさん、おはようございます!おかげさまで、クライアントのサイト制作もバージョン管理しながら行えていて、問題なく進んでいます。今日は、昨日聞けなかったSEOのことをいろいろ教えて下さい!うむ。良いであろう。わしはSEOの生まれ変わりといっても過言ではないのじゃ。あ、そうなんですねー。それでは、SEOで一番大事なことは何ですか?またざっくりとした質問じゃのぅ。まず最初に言っておくが、SEOに特効薬はないのじゃ。一番効く方法は、みんなの役に立つコンテンツをソーシャルなどのフローではなく、ストック型で残しておくことが重要なんじゃ。ここ数年の情報発信は、FacebookページやTwitterで行うケースが多かったのじゃが、情報が流れていってしまって一時的な効果しか生まないのじゃ。そこで最近は、ソーシャルにて発信した情報を、自社サイト内でまとめてパーマリンクとしてストックしておくという方法が採用されていていたりするのじゃ。でも、わしは、自社サイト内にて情報を更新し、それをソーシャルで拡散するという使い方がオススメじゃな。なるほどー。検索エンジンの仕様もちょくちょく変わるし、人がちゃんと見たいと思うような情報をきちんと積み重ねていくことが大事なんですね。その通りじゃ。検索で必ず1位になんて…云々かんぬん(略)。…というかまあ、あれだね。オリジナルドメインも重要なんだよ。Webサイトはこのサービスでー、ブログはこっちのサービスでー、みたいに運営しているのも見かけるけど、本当は自社ドメインを契約してそれを使い、同じドメイン内にコンテンツを集約したほうが当然検索に強いよね。(仙人キャラが途中でめんどくさくなったんだろうな…)自社ドメインって今なら、例えば年間1000円以内でとれるものなどありますしね。そうそう。それに、自社ドメインにしておけば、もし他のサービスに移行することになってもドメインを変えずに済むよね。MovableType.netのようなWebサービス型CMSでも、独自ドメイン機能があるし、それを設定した上にその配下でブログを運営するということもできるんだ。1箇所にまとめたほうが、管理も煩雑にならないしSEO的にもいい! なんて、いいことずくめですねっ♪そのほかだと、公開前には確実に確認しておいたほうがいい項目はこの6つだよ。1. 各ページタイトルの確認よくありがちなんだけど、公開したら全てのページがサイトのタイトルになっちゃってる!みたいなこともあるんだ。title要素に入る部分はとても重要なので各ページのタイトルになる部分が入っているか確認が必要だね。2. 適切なmeta情報の設定meta情報に関しては、キーワードやディスクリプションを設定するんだけど、ディスクリプションなんかは検索結果でも表示される部分だから必要なキーワードを入れて、そのページがどういうページかきちんと分かるようにしておかないといけないね。3. OGPの設定OGP(Open Graph Protocol)といって、Facebookなどのソーシャルでシェアされるときに重要な情報だね。最近だと「OGP=Facebookにシェアされるときに表示される情報」というイメージがあるかな。CMSでカスタムフィールドなどを使って、任意の画像を指定するなんてことも可能なので作り方を工夫するといいね。4. faviconの設定ファビコンも今はブラウザによってはタブに必ず表示されるから、独自のものを設定しておくのがおすすめだよ。5. アクセス解析用のコードを追加これは、忘れがちだよね。GoogleAnalyticsを入れるケースが多いかな。クライアントも気づいていない場合があるから、必ず提案しよう。6. canonical属性今回は、レスポンシブデザインだから必要ないけど、スマートフォン用のページが別URLの場合は、このように元のURLが入るようにしたほうが良いね。Webサイトの記事がシェアされるときのURLを統一させるためのものなので、同じ記事なのにシェア数が分散してもったいない! を防ぐためにも必ず入れておくべきだよ。例 : <link rel="canonical" href="">なるほどなるほど。表から見えないところは気付きにくいですもんね! クライアントも気付かないだろうし、自分から提案できるように気を付けます!みえねいとこ たいせつはやを(はやをって誰)そういえば、Webサイトの運営が始まったら、アクセス解析系が重要だと思うんですが、今できる下準備としては何が必要ですか?そうだねー。アクセス解析を制するものは世界を制すって言うもんね!でも、今日はジムに行って腹筋割ってこないといけないからまたこんどね~。わかりましたー! お疲れ様でしたー!「世界を制すって、そんな大事なんだなWebサイトって」と思いつつ、どんな方法でどんなことを解析するのがいいのだろうか? など妄想しながら帰宅するりんであった。○執筆者紹介早瀬将一シックス・アパートにて、主にWebサービス型CMS「MovableType.net」の製品企画を担当しています。個人活動として、大学時代から音を中心としたインタラクティブ作品を制作。音に限らない作品やソフトウェアも作ってます。詳しくはWebで!
2015年03月10日今日は早めに出社したりん。昨日のバージョン管理の話を思い出しているとき、先ほど出社した上司のはやせが音もなく近寄ってきた。ニンニンニンニン、おはよーでござる。昨日はごめんねー。牛と電車がぶつからないように、ご当地ヒーローが電車を素手で受け止める! みたいなことやってくれると良かったんだけどねー。(注 : 第四話のオチ部分参照)(……意味がわからなーーーーーい!!)いえいえ。では早速、昨日の話の続きとなる「バージョン管理の説明」をお願いします!了解ウォッチ!(……最近のネタもいけるんですね……)まず、GitHubを使って複数人でバージョン管理を行う流れとしては、「ブランチを作って、手元で確認してローカルでコミット、プッシュしてPull Requestして、確認してもらってOKならmasterにマージする」って感じだよ!? ? ? ? ? ? ? ? ? ? ?すみません。何語喋ってるいるかわかりません…!うーんと、Gitについての大雑把なイメージはこうかな。えっと……、大本(master)から派生したもの(ブランチ)を一時的に作って、それを元に手元で作業して確認。そしたらみんなに確認(Pull Request)してもらって、OKなら大本に変更部分を反映する(マージ)、ということですか?そうそう。考え方はそうだね。「大本(master)には影響を与えないで作業ができ、さらにその変更内容を他の人にもチェックしてもらう」というところが、確実で品質の高い進め方ができるポイントなんだ。ちなみに、今回利用するCMSのGitHub連携の場合、その大本のmasterやCMS上のテンプレート、ファイルを同期させることができるんだ。例えば、1つのテンプレートを修正してそれに伴う画像ファイルを追加する、それを確認してmasterにマージすると、自動的にCMS側のテンプレートファイルが更新され、画像ファイルも送り込まれる。もちろん、これらのファイル達はバージョン管理されているので、もし問題があったらすぐ戻すことも可能だよ。なるほど!!GitHubと連動したサービスは、とても簡単に使えるんですね!うん。そう。連動していないサービスを利用するなら、「手動でCMSとGithubを連携するよう設定して、チーム全体に周知する」という方法でもいいよ。あと、今回のクライアントのサイトは、Webサイトとその配下に属するブログという構造だと思うんだけど、実は、1つのレポジトリ内にWebサイトとブログのテンプレートとファイルをまとめて管理することもできるから、中規模のサイトでも効率よく一括管理することができるんだ。確かに、まとめて管理できると運用も煩雑にならないし、確実ですね。例えば、制作のベースとなるテンプレートを様々なタイプで作っておけば、それをGitHub連携で読み込んでから制作を始めることで効率もすごく良くなりそう!そうなんですっ! (ドヤ顔)あ、そうだ ! あと、GitHubを調べてみて気になったのですが、GitHubでバージョン管理をするためには黒い画面でコマンド入力しないとだめですか……?黒い画面? あー、ターミナルのことね。確かに、デザイナーとか非エンジニアの人にはとっつきにくいよねー。でも、その辺は大丈夫! そんなときは…「ソースツリぃーーーー ! 」ということで、SourceTreeというGitの無料クライアントソフトが、AtlassianからMac版もWindows版も提供されているんだ。あーーーーよかった! どうしてもあの画面とお友達にはなれなくて。これなら非エンジニアも安心ですね。だね! 僕もターミナルとはお友達にはなってないから、これ使っているよんっ。お友達になるには四六時中一緒にいないといけないけど、たとえば、サッカーボールを蹴りながら小学校に登校したら今は怒られちゃうからねー、世知辛い世の中だね。(翼くんの時代でも、サッカーしながらの登校は、危険だと思うけどね)ありがとうございました! 安心して制作を進められそうです!ところで、クライアントがすごい気にしている点として「SEO」についても聞きたいんですが。ん? 誰? 瀬尾さんって?? ……あーー、えすいーおーのことね。はいはい、あるよね、そういうやつね。ぼくはさ、Search Engine Optimist(検索エンジン楽天家) だからね。はっはっは。……ところで、その話は明日でいいかい?明日で大丈夫ですー!バージョン管理を具体的にやっていく方法や、その利点についても詳しくなったりん。WebといえばSEOってよく聞くので、どう対策したりするのかなぁ。など気になりつつ帰宅するのであった。○執筆者紹介早瀬将一シックス・アパートにて、主にWebサービス型CMS「MovableType.net」の製品企画を担当しています。個人活動として、大学時代から音を中心としたインタラクティブ作品を制作。音に限らない作品やソフトウェアも作ってます。詳しくはWebで!
2015年03月03日目的にあわせたサイト設計が決まり、実際の制作にとりかかりはじめたWeb制作会社新人社員の「りん」。早速、制作を始めるときに気をつけなければいけないことを、わかる人にしかわからない小ネタをはさんでくる上司「はやせ」に聞いてみることにしたのでした。はやせさーん、今いいですかー?ごめん! 今ランニングマンの練習してるんでちょっと待ってて!(ランニングマン?! 手足が長くて胸毛が生えてる芸人の?!)お、おまたせー…。やっぱがんちゃんのようにはいかないか……それで、どしたの?クライアントのWebサイトを、実際に制作し始めているんですが、このままザクザク作っていっていいのでしょうか?何か注意しなきゃいけないこととかありますか?そうだねー。最悪の事態を回避できるように、最初に仕込んでおくべきことがあるんだよね。制作していて一番最悪なことってなんだと思う?えーと……上司がわかりにくいギャグを言いまくっていて、からみにくくて仕事が進まないことですかね?うんっ(はーと)冗談です(半分本気だけどな! )ワープロソフト(表現古っ)や表計算ソフトとかでもそうなんですけど、何か作っている時に「あれ? パソコン立ち上がらない? しかもハードディスクのところから超イヤな音してるんですけど?」とか「あ、やばい。いろいろ変えて上書き保存したら見事に壊れたし、元に戻せなくなったし!!」みたいなことが起きると最悪ですね。そうだね。もし仮に納期まであと少しのときに、開発サーバーで9割型完成しているにもかかわらず「サーバーのデータふっとんだー!! ぎゃあーーーーー」みたいなことになったら、クライアントにも大迷惑かけるし、自分たちも寝ずの作業になっちゃうよね。そうですね……想像しただけでぞっとしますね……。そうならないようには、どういう方法をとるのがよいですか?そうだね。そういうときは……「バージョン管理システムぅーーー(ドラ◯もん風)」だよ、の◯太くんっ。(……は?)バージョン管理システムってなんですか?いろいろ作業していく上で、「誰が」「いつ」「なにを変更したか」を管理できるシステムなんだ。作業した履歴を残していきながら進めるから、「この時の状態に戻したい」とか「この状態のものを分岐して新しいものを作る」など安全にできるんだ。あとは、別サーバーなど作業環境とは異なるところに情報を残していくから、万が一作業環境のデータが壊れたとしてもすぐ復旧できる。それに「誰が」の部分では、複数人で一つのものを管理することに適しているような仕組みがあったりするよ。そういう仕組があれば、万が一のときも「オッス! オラ、データ復旧のために7つのボールを集めにいってくるぜ! 」みたいなことにならなくて済みそうですね。有名なバージョン管理システムとしては、Subversionや最近だとGitなんかがよく使われるね。あとは、Gitの仕組みを利用した、誰でもプログラムコードやデザインデータなどを保存・公開することができる「GitHub(ギットハブ)」というWebサービスもあって、Webサービス開発やWeb制作にもよく使われているね。もちろん、公開するといっても有料で非公開のプロジェクトも作れるから安心。ほかにも、同じようにGitを使ったサービスとして、「Bitbucket」というのも有名かな。(せっかくボケてみたのに、スルーされたよ……)なるほどー。サーバーにインストールして使うだけじゃなく、バージョン管理システムにもWebサービス型があるんですね。世の中クラウドクラウドいうわけですね。それじゃ、実際にCMSを使ったWebサイト制作に使うには、どういったものをバージョン管理していけばいいと思う?うーんと、CMSのテンプレートやJavaScriptなどのライブラリファイル、画像ファイル、可能なら加工した元ファイルとかも管理したいなぁ……。そうだね。CMSのテンプレートなんかはプログラム的なところがあるから、確実にバージョン管理したいね。画像の管理に関して言うと、元ファイルなんかは容量も大きいし、実際にサイト上で使う画像だけを管理したほうがいいかな。それじゃ、実際にMovableType.netにあるGitHub連携機能を例に、説明してみようか。はい、お願いします!「プルルー、プルルー(電話の音)」あ、ごめん。電話かかってきたみたい。「はい。え? 牛と電車が追突して電車が動かない? 分かった!迎えにいくわ」あー、今日は用事できちゃったから、続きはまた今度ね。ごめんねー。わかりました。また明日よろしくお願いしますー。牛が轢かれた? どこの田舎? など、仕事とは関係ない疑問が残りつつも、バージョン管理の大切さを知ったりん。実際はどうやるのかなーと妄想しながら帰宅するのであった。次回は、実際にGitHub連携で管理する具体的な方法の例をご紹介します。○執筆者紹介早瀬将一シックス・アパートにて、主にWebサービス型CMS「MovableType.net」の製品企画を担当しています。個人活動として、大学時代から音を中心としたインタラクティブ作品を制作。音に限らない作品やソフトウェアも作ってます。詳しくはWebで!
2015年02月24日前回までに、更新方法とその頻度でサイトの構造を考えることを学んだりん。でも、今回の案件で必須となっている要件「スマートフォン対応」は、サイト構造にどう影響を与えるんだろう?それに、Webの制作はこちらでやるけれど、制作後の更新をするクライアント側の担当者は何人かいるし、ほかにも関わる人が何人か思いつく。役割ごとに触れる場所・触れない場所をちゃんと分離しておかないと、あとでめんどくさいことになりそう。その辺も、サイト制作経験が豊富なはやせ先輩に聞いてみることにしたのでした。彼の言う意味の分からない小ネタは豪快にスルーしつつ、今回もがんばります!おはようございます! 早速ですが、今日もいろいろと質問したいことがあります!OK牧場!○2種類あるスマホ対応の方法、それぞれのメリット・デメリットは何だろう?(また来たよ……けど、めげずにスルーする!)今回の案件って、スマートフォン対応が必須なんです。スマホ対応する場合、前回作ったサイト構造にどんな影響があるんでしょうか?そうだね。スマホ対応する場合のやり方は、大きく分けると2つかな。それぞれメリット・デメリットがあるよ。1. レスポンシブレイアウトで、同じHTMLを表示1つは、PCと同じHTMLをブラウザの表示横幅にあわせて最適なレイアウトで見せる方法だね。【メリット】1ソースなので、大規模サイトでもメンテナンスしやすいモバイルからの閲覧性を重視し始めた検索エンジンからも、推奨されているどの端末からもURLが同じなので、ソーシャルでシェアされるURLが散逸しないシンプルなサイトであればベースとなるテンプレート等を用意しておけば素早く構築できる将来、PC・タブレット・スマホとは大きく異なるサイズのネット閲覧デバイス(TVなど)が増えても、そのまま対応できる【デメリット】同じHTMLを表示するため、デザインやサイト内要素の配置をPCとスマホを考慮して作る必要がある上記の考慮をした結果、デザイン上の制限が生まれるスマホでは画面上非表示にしても、コンテンツ自体は読み込むため、無駄に容量が大きくなり表示が遅くなる場合がある画面幅による自動レイアウトなので、スマホからPCサイトのスタイルに切り替えることができない2. スマホ専用のページを生成して表示2つ目は、閲覧デバイスに合わせて動的に表示サイトを分ける、または静的に/sp/などと別階層構造を作り、スマホ専用の表示ページを出力させるようにする方法かな。【メリット】それぞれのデバイスに合わせ、デザインやレイアウトの制約がなく自由なレイアウトができるスマホでの利用シーン・用途に特化したコンテンツのみをコンパクトに表示させることができる(特に大規模サイトで有効)上記と関連して、スマホに最適化された画像や必要な情報のみを提供できるので表示速度が速い【デメリット】URLが異なる場合は、検索エンジンから重複と見なされない設定にするなど運用が複雑になる同じくURLが異なる場合は、ソーシャルでシェアされるリンクとシェア数が分散するPC・スマホ・タブレットなどデバイスごとにサイトを開発し、分岐の仕組みを用意する必要があるため、デザイン・構築コストがかかる新しい種類のデバイスがでた時に、新規で対応が必要なるほどー。Googleがレスポンシブレイアウトを推奨しているからといって、「レスポンシブレイアウト、サイコー!」とはならないのですね。そうだね。個人的な経験からすると、小中規模なWebサイトの場合はレスポンシブレイアウトで、大規模Webサイトになると別にしたほうが良いという場合が多かったかなー。例えば、遊園地や展示施設などの場合、ユーザーが、家でじっくり下調べするときにPC版を使って、スマホ版では現地でリアルタイムなイベント情報を確認する、などWebサイトの役割や運用方針によっても選択が変わるよね。昨今は、極端な話だけど「スマホでの閲覧を優先してPCはとりあえず見られればいいや」という方針もありえるので、そのWebサイトがどういうユーザーをターゲットにしているか?なども考慮する必要があるね。ふむふむ。ターゲットユーザーや優先度、役割などを考慮するのですね。わかりました!! 今回のクライアントの場合は、中規模なのでレスポンシブレイアウトを提案してみようと思います!○役割ごとに、できること・できないことを分離するための権限設定って?ではでは、続いてWebサイト運営をするための権限の話にもどろうか。はい! お願いします!まず、Webサイト運営に関わる人ってどういう人がいると思う?規模によると思いますが、こんな感じですかね……。Webマスターニュースなどを書くライター書かれたニュースなどをチェックする編集長Webサイトを構築する人確かに規模にもよると思うけど、そんな感じだね。さて、この人たちが全員同様に、「すべてが管理できる権限」を持って運営したら何が起こる可能性があるだろう?おそらく、記事を書くだけの人の場合あまりWebに詳しくない人もいるだろうから、間違って重要な設定変更しちゃった……みたいなことが発生する可能性があります。うんうん、そうだね。「船の先端でポーズとってただけのつもりが、うっかり面舵一杯~!! 」みたいなとこ触っちゃって、氷山にぶつかって船が沈むーみたいな感じになるよね。(そんなことあるのか? ……ともあれ、話を進めるためにそういうことにしておこう)……はい、なりますね。そういうことが起きないように、必要な人に必要な権限を与えてWebサイトを運用することが大事だよね。例えば、今回利用するCMS「MovableType.net」の権限と照らし合わせて見てみようか。【Webマスター】まず、Webマスターとなる人は、Webサイトの全体を管理する必要があるので、サイト管理者(オーナー)の設定になるね。この人は、Webサイトの全場所を触れるよ。【ライター / 編集長】次に、例えば、ニュースは複数人のマーケティング担当者が書いて、公開前のチェックをマーケティングチームの上司が編集長として行うと仮定しよう。各マーケティング担当者は、ニュースブログのライター権限をもらう。また、広報担当者は自分が書く記事のみを編集できる。ただし、記事の公開はできない。上司は、ニュースブログの編集長権限を持っているので、全員が書いた全記事を閲覧・編集でき、また、記事を公開することができる。これにより、ライター権限を持つマーケティング担当者が書いた記事を編集長権限を持った上司が確認し公開する、という流れにできるんだよね。【プロダクトページの管理者】製品ページや事例ページは、プロダクト担当者が原稿を書いて、公開権限も持つとする。この場合、プロダクト担当者が担当製品のブログ管理者としての権限をもらう。【Webサイト構築をする人】Webサイト構築中は全権限をもらい、すべての部分をいじれるようにするけれど、実際にサイトの運用がはじまったら権限を抑えて必要に応じて権限を再度付与する。といった、きめ細やかな運用ができるよ。なるほどなるほど。必要な人に必要な権限だけを与えて運用できれば、間違いのない確実な運用が可能になりますね!今回のWebサイトの運用方法も、だんだんイメージできるようになってきました。早速、これをもとに制作を進めてみます!! また分からない部分が見つかったら教えてくださいー。OKぼくじょー(シャドーボクシング)(またやってる……。そーっと去ろう)スマートフォンに対応したサイトの構造、そして担当者の役割に合わせた権限付与などがなんとなく分かってきたりん。「Webサイト制作を進めていくのに、注意することとかあるのかなぁ」など疑問に思いつつ、帰宅するのでありました。次回は、バージョン管理システムで制作履歴を保持しながらの安心・安全なサイト制作についてご紹介します。○執筆者紹介早瀬将一シックス・アパートにて、主にWebサービス型CMS「MovableType.net」の製品企画を担当しています。個人活動として、大学時代から音を中心としたインタラクティブ作品を制作。音に限らない作品やソフトウェアも作ってます。詳しくはWebで!
2015年02月17日前回の記事で「Webサイト制作におけるCMSの重要性と選定ポイント」を学んだ、Web制作会社新人社員の「りん」。今回も、分かる人にしか分からない小ネタをはさんでくる上司「はやせ」とともに、クライアントの要求を満たすWebサイトの設計を学んでいきましょう。○クライアントがWebサイトで達成したいゴールはなに?はやせさーん! この前はありがとうございました!おかげさまで、最適なCMSをクライアントに選んでもらうことができました!……ん? (イヤホンを外しつつ)あー、はいはい。あーそうよかったねー! (音楽聞いていて、何を言われたかイマイチ分かってないけど、なんとなく合わせた)CMSが決まってクライアントも盛り上がってくれて、実際にWebサイトを作りはじめたい!ということで進めていくことになったのですが、どう進めていけばいいでしょうか?今回もまたざっくりとした質問だねー、もう投げっぱなしジャーマンだね。まあ、Webサイト制作について一番大事なのは、クライアントがWebサイトで何を達成したいかを考えて、それにあわせたゴールを導き出して設計・制作するところ、って感じかな。その辺は、いろいろやり方があるんだけど……具体的に話しながら設計していってみようか。クライアントは、最終的にWebサイトにどういう効果を期待しているの?(……投げっぱなしジャーマン? ドイツ人? ……この話は、一旦置いておいて……)はい、クライアントニーズは以下のようです。4つある製品ごとに情報発信やアップデートを、短時間で手軽に行いたい製品の導入事例もたくさんあるので、それを有効に使いたいニュースリリースなどのお知らせも、タイムリーに掲載したいスタッフなどの顔が見える運営をして、親近感や安心感を顧客に持ってもらいたい最終的には製品の内容的に電話でのお問い合わせを増やして、売上につなげたいなるほど。かなり具体的なヒアリングは終わっているんだね。これをもとに構成を考えていこうか。さて、どういうページが必要になると思う?えーと……要素としては、こんなかんじでしょうか?トップページニュース(お知らせ)製品ページ事例ページお問い合わせ会社概要だいたいそうだねー。「スタッフの顔が見える~」は、どうやって実現する?うーんと……。「顔が見える」ということは、スタッフの写真やその人の言葉が分かると親近感湧きやすいかなーって。そうなると……、スタッフブログを運営するとかどうですか?そうそう、中の人がどういう人か、どういった思いを込めて製品を作っているかなど分かると、製品に対して信頼感を持ちやすくなるよね。製品サイトとしてきっちり説明する場所があった上で、さらにユーザー視点のカジュアルで読みやすいコンテンツを用意するとかね。なるほどなるほど、では構成をまとめるとこんな感じですね。うん。バッチリだね!それじゃあ、この構成をCMSで実現していくことを考えてみようか。まずその前に、CMSにすることの利点ってなんだっけ?Webサイト制作者と、実際にコンテンツを更新していく担当者の役割分担がきっちりできて運営しやすい、って感じですよね。まとめると、こんなところですか。コンテンツ更新とデザイン管理を分離できるHTMLを知らない人でもページを更新できる記事を更新すると、トップページやアーカイブページなど、導線となるリンクが自動で生成される制作も運営も楽になり運営コストや制作コストを削減できるコンテンツとページ構造とが分離されているので、レイアウト崩れの防止やSEO対応もやりやすいうん。Web上での情報発信は、素早く定期的にしていくことが重要だから、クライアントはコンテンツを用意することだけに集中できるのがいいよね。じゃあ、今回クライアントが選んでくれたWebサービス型のCMS「MovableType.net」を例に、サイト設計をしていってみようか。はい!○更新頻度・方法に合わせてページを構成していこうまず、さっきリストアップした構成だけど、この中で時系列に情報を更新していくもの、固定的だけどたまに情報を更新するものに分けてみようか。クライアントからヒアリングしたことを踏まえて、整理するとこうなりました。トップページページのほとんどはあまり更新しないけど、ニュースの枠だけは最新の記事数件を自動で表示して欲しいニュース(お知らせ)お知らせがある度に頻繁に更新したい。最新のお知らせから順番に時系列に表示したい製品ページ各製品ごとのニュースも頻繁に更新したい。時系列に情報を表示したい事例ページ事例が増えるたび、時系列に増えていくお問い合わせ基本は変わらないけれど、たまに連絡先を変更する場合がある会社概要更新頻度は半年に一回あるかないかスタッフブログ頻繁に更新したい結構更新する箇所が多いサイトになりそうだね。そういう内容であればこんな構造になるかな。トップページウェブサイト>テンプレート通常はいじらず、最新情報などが自動的に更新される。ニュース(お知らせ)ウェブサイト>ニュースブログブログ1つで独立。時系列に記事が更新される。製品ページウェブサイト>製品ブログブログ1つで独立。時系列に更新される記事と製品情報のWebページを組み合わせる。事例ページウェブサイト>事例ブログブログ1つで独立。時系列に記事が更新される。お問い合わせウェブサイト>ウェブページ会社概要ウェブサイト>ウェブページスタッフブログウェブサイト>スタッフブログブログ1つで独立。時系列に記事が更新される。なるほど。トップページのようにページの一部だけが自動更新されるのか、ブログのように自分で記事を追加して頻繁に更新していくのか、それとも、Webページとして1つのページを自分で随時更新していくのか、など運用にあわせて設計していけばいいのですね。そうそう。こうやって運用方法にあわせて分けることによって、このあと説明する「役割ごとに適切な権限を付与しての運営」もできるんだよ。あ、そうだ! 権限について話す前に、スマートフォンに対応する場合は構造にどんな影響がでるんでしょうか?構造、こうぞう、コウゾウ、kouzou……これは、長くなるから次回ね。更新頻度の低いページと、随時記事を追加していくブログ形式のページなどWebサイトの更新頻度に合わせて、サイト構造を考えていくポイントがなんとなく分かったりん。スマホ対応については次回ということで、帰宅することにしたのでありました。次回は、「スマートフォン対応の方法と、サイト運営者の役割ごとの権限設定について」ご紹介します。○執筆者紹介早瀬将一シックス・アパートにて、主にWebサービス型CMS「MovableType.net」の製品企画を担当しています。個人活動として、大学時代から音を中心としたインタラクティブ作品を制作。音に限らない作品やソフトウェアも作ってます。詳しくはWebで!
2015年02月10日本連載では、新人Webディレクターの「りん」が、上司の「はやせ」からCMSによる企業サイト制作手法を学んでいく過程を物語仕立てで紹介します。ひとくちにCMSといっても、サービス形態によってメリット・特性は異なるもの。クライアントの要望を汲み取りつつ、ベストなサイトをつくるにはどうすればいいのか、いっしょに学んでいきましょう。ここは、とある制作会社。新人WebディレクターのりんはクライアントからWebサイト制作を依頼されたのだけど、初めての経験で分からないことばかり。そこで、上司のはやせに相談してみました。はやせさーん!付き合いのあるクライアントからWebサイト制作を依頼されたんですが、どう進めていけばいいでしょうか?ずいぶんざっくりした相談だけど、クライアントの要望はどんな感じなの?えーと、以下のような要望でした。Webサイトは持っているんだけど、以前業者に作ってもらったままでHTMLも書けないし、情報も更新できなくて困っているニュースなど自分たちで更新できる仕組みが欲しいセキュリティ問題とかネットのニュースでよく聞くけど、自分たちで管理できないスマートフォンにも対応したWebサイトを作りたいなるほどねー。まず確実に必要なものとしては、CMSだね。CMSってなんですか?!CMSというのは、「チョコレート(Chocolate)マジで(Majide)好き(Suki)」の略だよ。(……?)……じゃなくて、「Contents Management System」といって、コンテンツを管理する仕組みのことなんだ。Webサイトといったら、昔は「HTMLを手書きで書くので、更新したい場合にはここにこういう内容で書いてね」と制作会社に依頼して、結構時間がかかってようやく更新という流れだったんだよ。けど、今はコンテンツを管理する仕組みを用意することによって、HTMLなどの知識がない人でも情報を更新・公開ができるんだ。なるほど!そのCMSを使ってWebサイトを作れば、クライアントでも簡単に情報を更新できるようになるんですね! さらに、制作する人と情報を発信する人をきちんと分けられると。その通り。Webサイトは鮮度のある情報を素早く掲載することも大事なので、こういった仕組みがあると、生きたWebサイトを作ることが可能なんだ。ちなみに、CMSはどういった種類のものがあるんですか?CMSの種類は、大きなくくりで言うと、ソフトウェア型とWebサービス型があるかな。ソフトウェア型は、CGI(Common Gateway Interface)などが動かせるサーバーを借りて、そこに自分でインストールするタイプ。一方、Webサービス型は、ユーザー登録するだけですぐ使えるタイプのものになるね。Webサイト作成サービスなんかも含めて、図にするとこんな感じかな。おぉー、なんとなくわかりやすいですね。それらを選ぶポイントはどのへんになりますか?セキュリティにも関係してくるかなと思っているのですが。そうだね、セキュリティが大事といっても、Webの場合ではレスリング選手にお願いしてもだめだからね。では、まずWebサイトをどういう場所に置いて運営するかを考えてみようか。(レスリングのくだり、よくわかんない。スルーしよう)うーん……と、例えばレンタルサーバーとかですか?うん、そういう場合もあるね。ただ、レンタルサーバーなどの場合は、CMSのソフトウェアを自分で導入して管理していく必要があるよね。そういう場合、例えば使っているソフトウェアに脆弱性が見つかったり、古くなってサポート対象外になった場合にどうなると思う?慌てます……。じゃなくて、すぐアップデートするとか対応しないといけないですね。脆弱性とかついて乗っ取られる事案も結構みかけますしね。そうだよね。そうなるとクライアントは、自分でやることは難しいケースが多いから、制作会社に頼むのだけど。場合によっては「見積もりをとってから」みたいに時間がかかることもあるよね。こういうとき、すぐ対応してくれるようにサポート契約を結んでおければいいけど、ランニングコストも大きくなるからそうできないケースも考えられる。こういう場合はどうしたらいいだろう?うーん……。だとすると、最初からCMSが入っていて、その辺の管理もやってくれるようなサービスなら心配ないですかねぇ。イエス!例えば、CMSのソフトウェアでもサーバー管理側で常に最新版にしてくれるようなサービスであったり、CMS機能のあるWebサービスを利用するという方法もあるよ。なるほどです。そういうものを利用すれば、安心して運用することができますね!あとは、クライアントのやりたいことにあわせて、自由度を選定することも大きなポイントになるかな。自由度……、それってどういうことですか??例えば、やりたいこと別での選定はこんな感じだね。Webサイト作成サービス : 日々更新する箇所は無し。会社情報や連絡先など固定した情報を発信できればいい。Webサービス型CMS : ニュースなどを日々更新したい。デザインカスタマイズ性の高いサイトにしたい。クラウドインストール済みCMS : デザインのみならず、プラグインなどで機能を追加したサイトを作りたい。ソフトウェア型CMS : 自社で運用しているサーバ内で、Webサイトとシステムを連携させるなど、自由に拡張・管理したい。なるほど、クライアントのやりたいことによって管理や運営コストとのバランスを考えて選ぶ、ということが重要ということですね!That’s the answer! その通り!(なんでいきなり英語? しかも同じようなこと2回言ってるし、普通ならexactly!とかじゃない? ま、どうでもいいか。)あと、クライアントは「スマートフォンの普及も気になるので対応したい」とおっしゃっているんですが、どう対応すればいいのでしょうか?Webサイトのスマートフォン対応については、ちょっと長くなるかもしれないので、詳細はまた別の機会で説明するけど…スマートフォンに対応したデザインと投稿用アプリなどが必要になるかな。なるほどなるほど、ではまた詳しく教えてください。はやせさん、続けてで恐縮ですが、実際にCMSを使ってどうやってWebサイトを作っていけばいいですか?あ、ごめん。今からラーメン食べに行かないといけないんだった。続きはまたの機会に! バイバイキ~ン自分のクライアントに、どういったものをお勧めすればいいかなんとなく分かってきた「りん」。りんは、CMSを使って、どうやってWebサイトを作っていけばいいかというモヤモヤを残しつつ、「アンパンマンかよ! 」と心のなかでツッコミながら、本日は帰宅することにしたのでありました。次回は、「企業サイトのサイト構造と権限について」ご紹介します。○執筆者紹介早瀬将一シックス・アパートにて、主にWebサービス型CMS「MovableType.net」の製品企画を担当しています。個人活動として、大学時代から音を中心としたインタラクティブ作品を制作。音に限らない作品やソフトウェアも作ってます。詳しくはWebで!
2015年02月03日