የድር ገጾችን መንደፍ እና መፍጠር ከፈለጉ ፣ አስቀድመው ካቀዱ ይህ ሂደት በጣም ቀላል ይሆናል። በእቅድ ደረጃ ፣ ዲዛይነሩ እና ደንበኛው ፍላጎታቸውን የሚስማማ ቅርጸት እና አቀማመጥ ለማግኘት አብረው ሊሠሩ ይችላሉ። የእቅድ አወጣጡ ሂደት የጣቢያውን ዘይቤ ወይም ዘይቤ ይነካል ፣ ይህ በድር ዲዛይን ውስጥ በጣም አስፈላጊው ገጽታ ነው ፣ በተለይም ለንግድ ዓላማዎች ከሆነ ማለት ይችላሉ።
ደረጃ
የ 4 ክፍል 1 - መሰረታዊ መዋቅርን መፍጠር
ደረጃ 1. የድር ጣቢያውን ተግባር ይወስኑ።
የግል ጣቢያ እየፈጠሩ ከሆነ መልሱን አስቀድመው ያውቁ ይሆናል። ሆኖም ፣ ለሌላ ድርጅት ፣ ኩባንያ ወይም ሰው ጣቢያ የሚፈጥሩ ከሆነ ፣ የሚፈልጉትን እና የጣቢያውን ተግባር ማወቅ ያስፈልግዎታል። እዚህ የገለፁት ሁሉ የድር ገጹ ሲጠናቀቅ ተግባራዊ ይሆናል።
- ድር ጣቢያው የመደብር ገጽን ይፈልጋል? የተጠቃሚ አስተያየቶች መደረግ አለባቸው? ተጠቃሚው በኋላ መለያ መፍጠር ያስፈልገዋል? የድርጣቢያው ጽሑፍ ተኮር ነው? ወይስ ምስል ተኮር? እነዚህ ሁሉ እና ሌሎች ጥያቄዎች ጣቢያውን ዲዛይን እና ዲዛይን ሲያደርጉ ይረዱዎታል።
- ይህ የእቅድ ሂደት ወደ ስዕል መሳል ይችላል ፣ በተለይም ለትልቅ ኩባንያ ከሆነ እና ይህንን ፕሮጀክት በመፍጠር ብዙ ሰዎች ከተሳተፉ።
ደረጃ 2. የጣቢያ ካርታ ንድፍ (የጣቢያ ካርታ) ይፍጠሩ።
የጣቢያ ካርታ ንድፍ ተጠቃሚዎች ከአንድ ገጽ ወደ ቀጣዩ እንዴት እንደሚንቀሳቀሱ የሚያሳይ ከወራጅ ገበታ ጋር ተመሳሳይ ነው። በዚህ ደረጃ ላይ የድር ገጽ አያስፈልግዎትም ፣ አጠቃላይ የፅንሰ -ሀሳቦች ፍሰት ብቻ። ስዕሎችን ለመፍጠር የኮምፒተር ፕሮግራምን መጠቀም ወይም በወረቀት ላይ የራስዎን መሳል ይችላሉ። በተዋረድ አደረጃጀት እና የድር ገጽ ግንኙነት ጽንሰ -ሀሳቦችን ለማሳየት ይህንን ሥዕላዊ መግለጫ ይጠቀሙ።
ደረጃ 3. የካርድ መቅረጽ ዘዴን ይሞክሩ።
የቡድን ድር ልማት አንድ ታዋቂ ዘዴ የእያንዳንዱን የሚጠብቀውን ለማወቅ ብዙ ካርዶችን መጠቀም ነው። በርካታ የማስታወሻ ካርዶችን ይውሰዱ እና በእያንዳንዱ ላይ የድረ -ገፁን መሠረታዊ ይዘት ይፃፉ። በጣም ጥሩውን ፅንሰ -ሀሳብ ለማግኘት እነዚህን ካርዶች ከቡድንዎ ጋር ያደራጁ። የድር ገጾችን በመፍጠር ላይ ከሌሎች ጋር ሲተባበሩ ይህ ዘዴ ለመጠቀም ተስማሚ ነው።
ደረጃ 4. ወረቀት እና የማስታወቂያ ሰሌዳ ፣ ወይም ነጭ ሰሌዳ ይጠቀሙ።
ይህ በትንሽ በጀት ላይ የመጀመሪያ የእቅድ ዘዴ ነው ፣ ይዘትን በፍጥነት መሰረዝ ወይም መለወጥ እና ፍሰቱን መለወጥ ይችላሉ። የድር ንድፍዎን በወረቀት ላይ ይሳሉ ፣ ከዚያ ወረቀቶቹን በክር ያገናኙ ወይም በቦርዱ ላይ መስመሮችን ይሳሉ። ይህ ዘዴ በአዕምሮ ማነቃቂያ ክፍለ -ጊዜዎች ውስጥ ለመጠቀም በጣም ተስማሚ ነው።
ደረጃ 5. የይዘት ክምችት ይፍጠሩ።
እንደ እውነቱ ከሆነ ከአዳዲስ የድር ዲዛይኖች ይልቅ ድሮችን እንደገና በማቀናጀት ለመጠቀም የበለጠ ተገቢ ይሆናል። እያንዳንዱ የተጠናቀቀውን የይዘት ወይም የድር ገጽ ወደ የተመን ሉህ ያስገቡ። ይህን ዝርዝር በመጠቀም ምን እንደሚያስወግድ እና ምን እንደሚቀመጥ ለመወሰን የእያንዳንዱን የይዘት ወይም ገጽ ዓላማ ማስታወሻ ይያዙ። የድርን አወቃቀር ማቃለል እና በኋላ ላይ እንደገና የማዘጋጀት ሂደቱን ማቃለል ይችላሉ።
የ 4 ክፍል 2 - መሠረታዊ የኤችቲኤምኤል ዝርዝርን መፍጠር
ደረጃ 1. የድረ -ገጹን ተዋረድ ለመመስረት የሽቦ ክፈፍ ይፍጠሩ።
መሠረታዊ የኤችቲኤምኤል አብነት በጣም መሠረታዊ የሆኑትን መለያዎች እና ናሙና (ብሎኮች/አብነቶች) ይዘትን ብቻ በመጠቀም የሚገነቡት ጣቢያ ንድፍ ነው። ይህ ማዕቀፍ “በድር ላይ የሚታየው እና የት ነው?” ለሚለው ጥያቄ መልስ ይሰጣል። በዚህ ረቂቅ አፈጣጠር ውስጥ ቅርጸት እና ዘይቤ አያስፈልግም።
- የቅጥ ቅንብር ከመምረጥዎ በፊት የይዘቱን አወቃቀር እና ፍሰት ገበታ ከመሠረታዊ ዝርዝር ጋር ማየት ይችላሉ።
- መሠረታዊ የኤችቲኤምኤል አብነቶች እንደ ፒዲኤፎች ወይም ምስሎች የማይቆሙ አይደሉም ፣ አዲስ መዋቅሮችን ለመፍጠር በናሙና ይዘት በፍጥነት ማንሸራተት ይችላሉ።
- የመሠረቱ ማዕቀፍ ለሁለቱም ለድር ገንቢዎች እና ለደንበኞች የሚጠቅም በይነተገናኝ ነው። ይህ መሠረታዊ ማዕቀፍ በቀላል የኤችቲኤምኤል ኮድ የተፃፈ ስለሆነ አሁንም እሱን ማሰስ እና የድር ገጽ መቀያየር እንዴት እንደሚሰራ ማወቅ ይችላሉ። ይህ በፒዲኤፍ ሊከናወን አይችልም።
ደረጃ 2. የ Grey Box ዘዴን ይሞክሩ።
በግራጫ ሣጥን ውስጥ የድረ -ገጽዎን ይዘት ያግዱ ወይም ያደምቁ ፣ በጣም አስፈላጊ ይዘት ከላይ ነው። ይዘቱን በአንድ አምድ ውስጥ ደርድር። ለምሳሌ ፣ ገጹ “ስለ ኩባንያው” ከሆነ ስለ ኩባንያው ዝርዝር መረጃ ከላይ ይገኛል ፣ ከዚያ የሰራተኞች ዝርዝር ፣ ከዚያ የእውቂያ መረጃ ፣ ወዘተ.
ይህ ራስጌዎችን እና ግርጌዎችን አያካትትም። ግራጫ ሣጥን በድር ላይ የሚታየውን የይዘት ምስላዊ ውክልና ነው።
ደረጃ 3. መሠረታዊ የውስጠ -ግንባታ ገንቢ ፕሮግራም ይሞክሩ።
መሰረታዊ የድር ማዕቀፍ በመፍጠር ሂደት ውስጥ ሊጠቀሙባቸው የሚችሏቸው የተለያዩ ፕሮግራሞች አሉ። ሊያውቁት የሚገባው የድር ፕሮግራም ኮድ (ቋንቋ) ለእያንዳንዱ ፕሮግራም የተለየ ነው። በጣም ተወዳጅ ከሆኑት ፕሮግራሞች መካከል አንዳንዶቹ የሚከተሉትን ያካትታሉ:
- ስርዓተ -ጥለት ቤተ -ሙከራ። ይህ ጣቢያ ለ “አቶሚክ ዲዛይን” ተወስኗል ፣ እያንዳንዱ ይዘት ትልቅ የድር ገጽን የሚያዘጋጅ “ሞለኪውል” ተደርጎ ይወሰዳል።
- መዝለሎች። ይህ ድረ-ገጽ በድር ላይ የተመሠረተ የእቅድ እና የፍሬም አገልግሎቶችን ይሰጣል። እነዚህ ጣቢያዎች የሚከፈሉ እና የደንበኝነት ምዝገባን የሚጠይቁ ናቸው ፣ ግን ብዙ የድር ፕሮግራምን ኮድ መቆጣጠር ሳያስፈልግዎት የድር ማዕቀፎችን በፍጥነት መገንባት ይችላሉ።
- Wirefy. Wirefy “የአቶሚክ ዲዛይን” የሚያቀርብ ሌላ ጣቢያ ነው። የድር ገንቢዎች መሣሪያውን በነፃ ማግኘት ይችላሉ።
ደረጃ 4. ቀላል የኤችቲኤምኤል ምልክት ማድረጊያ ይጠቀሙ።
ጥሩ መሠረታዊ አብነት በቀላሉ ወደ መጀመሪያው ጣቢያ ይለወጣል። ይህን አብነት በመፍጠር ሂደት ላይ ስለ ድር ቅጦች ብዙም አያስቡ። በቀላሉ ሊረዳ እና ሊለወጥ የሚችል ምልክት ማድረጊያ ይጠቀሙ።
ቀለል ያለ መሠረታዊ ማዕቀፍ በጣም የተሻለ ነው። ምልክት ማድረጊያ ዓላማው መዋቅርን መገንባት ነው። የእይታ ገጽታ በ CSS እና የላቀ ምልክት ማድረጊያ በኋላ ሊስተካከል ይችላል።
ደረጃ 5. ለእያንዳንዱ ድረ -ገጽ መሠረታዊ ዝርዝር ይፍጠሩ።
እያንዳንዱን ድረ -ገጽ ከአንድ መሠረታዊ ረቂቅ ጋር ለማመሳሰል ትፈተን ይሆናል። በእውነቱ ፣ ይህ ጣቢያዎን ግልፅ እና አሰልቺ ብቻ ያደርገዋል። ለእያንዳንዱ ገጽ የተለየ ንድፍ ይፍጠሩ ፣ እያንዳንዱ ገጽ የራሱ ንድፍ እንደሚያስፈልገው ይገነዘባሉ።
ክፍል 3 ከ 4 - ይዘት መፍጠር
ደረጃ 1. ድረ -ገጽ ከመፍጠርዎ በፊት ይዘቱን ያዘጋጁ።
ናሙናዎችን ወይም ቦታ ያዥዎችን ከመጠቀም ይልቅ ቀድሞውኑ ትክክለኛ ይዘት ካለዎት የድር እይታዎን ቅድመ ዕይታ ለማየት በጣም ቀላል ይሆንልዎታል። በጣም ብዙ ይዘት እንዲኖርዎት አያስፈልግዎትም ፣ ግን የመጀመሪያውን ምስል ቅጂ ከተጠቀሙ መሳለቂያዎ በጣም የተሻለ ይመስላል።
ሁሉም የጽሑፉ ቁሳቁስ ሊኖርዎት አይገባም ፣ ግን ቢያንስ ትክክለኛ አርዕስት ሊኖረው ይገባል።
ደረጃ 2. ታላቅ ይዘት ጽሑፍ ብቻ አለመሆኑን ያስታውሱ።
በይነመረብ ከቀላል የጽሑፍ ድር ይልቅ በጣም የተወሳሰበ ነው። ጎብ visitorsዎችን ለመሳብ እና ለመጋበዝ ታላቅ ድር ጣቢያ ለመፍጠር የተለያዩ የተለያዩ ይዘቶች ያስፈልግዎታል። ለምሳሌ:
- ስዕል።
- ድምጽ።
- ቪዲዮዎች።
- የድር ማስተላለፍ ወይም የድር ዥረት (ትዊተር)
- የፌስቡክ ውህደት
- RSS
- የድር ምግብ
ደረጃ 3. ለእርዳታ ባለሙያ ፎቶግራፍ አንሺን ይጠይቁ።
በጣቢያዎ ላይ ፎቶዎችን ማካተት ከፈለጉ ፣ ከድር ጣቢያዎ የሚያገኙት የመጀመሪያ ግንዛቤ በሙያዊ ፎቶግራፍ ከተሞላ በጣም የተሻለ ይሆናል። አንድ ጥሩ ፎቶ ከሃያ ዝቅተኛ ጥራት ያላቸው ፎቶዎች ዋጋ አለው።
ለረጅም ጊዜ በንግድ ሥራ ላይ ከነበረው ባለሙያ ፎቶግራፍ አንሺ እንደ የፎቶግራፍ ጥበብ አዲስ ተመራቂ እንደ ርካሽ መፍትሄ ይፈልጉ።
ደረጃ 4. የጥራት መጣጥፎችን ይፃፉ።
በድር ገጽ ላይ የተፃፈው ይዘት የድር ትራፊክዎን መጠን ይወስናል። በዚህ የንድፍ ሂደት ውስጥ ስለ ይዘት ፈጠራ ብዙ መጨነቅ ባይኖርብዎትም ፣ ጣቢያዎ ከተነሳ እና ሥራ ከጀመረ በኋላ በመደበኛነት ይዘት ስለሚያስፈልግዎ ስለእሱ ማሰብ አይጎዳውም።
ከጽሑፉ ይዘት በተጨማሪ የድር ገጽን በማጠናቀር ሂደት ውስጥ ሊኖርዎት የሚገባ የጽሑፍ ጽሑፍ አለ። ለምሳሌ የእውቂያ መረጃ ፣ የኩባንያ ስም ፣ ወይም በጣቢያው ላይ ብዙ ጊዜ ጥቅም ላይ የሚውል ሌላ ማንኛውም ነገር።
ክፍል 4 ከ 4 - ፅንሰ -ሀሳቦችን ወደ ድር ጣቢያዎች ማዞር
ደረጃ 1. መሠረታዊዎቹን ክፍሎች ያዘጋጁ።
ይህ የንጥረ ነገሮች ዝግጅት እንደ ራስጌዎች ፣ የግርጌ ማስታወሻዎች እና የአሰሳ ምናሌዎች ባሉ በጣቢያዎ ላይ ላሉት እያንዳንዱ ገጽ ይሠራል። ሁሉም ገጾች እንዴት እንደሚታዩ ማረጋገጥ እንዲችሉ በጣም ቀላል በሆነ ዘይቤ ያዋቅሩት። ወደ ድር አቀማመጥ ሂደት ሲገቡ ይህ በተለይ ጠቃሚ ነው።
ስለዝርዝሮች በጣም አይጨነቁ ፣ ራስጌው እንዴት እንደሚመስል አስቀድመው ለማየት (ቅድመ -እይታ) ይሞክሩ።
ደረጃ 2. ቀለል ያለ አቀማመጥ ይፍጠሩ።
የሰዓት አቀማመጥን ከመሠረቱ ዝርዝር አምድ ወደ ገጹ ትክክለኛ ቦታ በማዛወር ይጀምሩ። ለምሳሌ ፣ የናሙና ዳሰሳ ምናሌውን ከገጹ ግራ እና የርዕሶች ዝርዝርን ወደ ቀኝ ማንቀሳቀስ ይፈልጉ ይሆናል።
ወደሚቀጥለው ደረጃ ከመቀጠልዎ በፊት ለብዙ ገጾች በድር አቀማመጦች ሙከራዎን ይቀጥሉ። እርስዎ የፈጠሩት አቀማመጥ ሕያው ሆኖ ይሰማ እንደሆነ ለማየት ሌሎች እንዲመለከቱት ይፍቀዱ።
ደረጃ 3. መሳለቂያ ይፍጠሩ።
የድር ጣቢያዎን ማሾፍ ወይም የናሙና ገጾችን ለመፍጠር እንደ Photoshop ያለ ፕሮግራም ይጠቀሙ። ያሰባሰቡትን አቀማመጥ እንደ መመሪያ ይጠቀሙ። በምስል ማቀናበሪያ ፕሮግራም አማካኝነት መሳለቂያዎችን በፍጥነት ማድረግ እና የሚፈልጉትን ውጤት ማግኘት ይችላሉ። የእነዚህ ምስሎች ውጤቶች በኋላ ላይ የድር ፕሮግራምን ኮድ በመፃፍ ሂደት ውስጥ እንደ ማጣቀሻ ሊያገለግሉ ይችላሉ።
ጥሩ መስሎ እንዲታይ ትክክለኛውን ይዘት በፌዝ ውስጥ ያስገቡ።
ደረጃ 4. የናሙና ጽንሰ -ሐሳቡን ከዋናው ይዘት ጋር ይተኩ።
በድረ -ገጾች ላይ ይዘትን እና አካላትን ያክሉ። ለአሁን የድር ዘይቤ ቅንብሮችን አይስጡ ፣ ሁሉንም ነገር በትክክለኛው ቦታ ላይ ያከማቹ። ይህ በኋላ የሚያደርጓቸውን የድር ቅጥ ለውጦች እንዲገመግሙ ይረዳዎታል።
ደረጃ 5. የድር ቅጥ መመሪያን ይፍጠሩ።
በተለይም ለትላልቅ ጣቢያዎች የቅጦች ድብልቅን መጠበቅ በጣም አስፈላጊ ነው። ጣቢያው ለንግድ ዓላማ የታሰበ ከሆነ እና ቀድሞውኑ የራሱ የምርት ስም ወይም ዘይቤ ካለው ፣ ይህ ከጣቢያው ዲዛይን ጋር መዋሃድ አለበት። የድረ -ገጽ ቅጥ መመሪያ ሲፈጥሩ ሊታሰብባቸው የሚገቡ ነገሮች-
- አሰሳ
- ዋና ማስታወሻ
- አንቀጽ
- ሰያፍ ፊደል
- ደፋር ባህሪ
- አገናኞች (ገባሪ ፣ እንቅስቃሴ -አልባ ፣ ማንዣበብ)
- የምስል አጠቃቀም
- አዶ
- አንኳኳ
- ዝርዝር
ደረጃ 6. የድር ዘይቤን ይተግብሩ።
ትክክለኛውን ዘይቤ እና ዲዛይን ካገኙ በኋላ ይተግብሩት። በድረ -ገጽ ላይ ወይም በጣቢያው ላይ ቅጦችን ለመተግበር CSS በጣም ቀላሉ መንገዶች አንዱ ነው። CSS ን የመጠቀም ዝርዝሮችን በተሻለ ለመረዳት የሚከተሉትን መመሪያዎች ይመልከቱ።